/* ====================================================================
   Recover-You — More Than Managed (page layer)
   --------------------------------------------------------------------
   One page-specific piece. Everything else reuses the shared layer
   (.ry-prose, .ry-note, .ry-pullquote, .ry-callout, .ry-cta,
   .ry-diptych-section, .ry-band-title).

   Requires ry-article.css for the :root tokens. Nothing here reuses a
   class name that ry-article.css already owns — see check_collisions.py.

   NAMING: .ry-plank, not .ry-card. The legacy page defines a .ry-card
   in an inline <style> block for these very items; reusing that name in
   the v2 layer would make it impossible to tell at a glance whether a
   rule belonged to the old page or the new one.
   ==================================================================== */

/* ====================================================================
   1. THE TWELVE PLANKS
   --------------------------------------------------------------------
   The whole page is a numbered list of what care would have to include
   before it earned the word healing. Twelve is a lot to read, so the
   design has two jobs: make the count visible, and make any single
   plank findable without reading the eleven around it.

   Hence a two-column grid rather than one long column — twelve items
   stacked single-file reads as an ordeal — and a numeral set large
   enough to scan by. The number is lifted out of the heading text,
   where the legacy had it as "1. Universal Trauma Screening"; it is
   the same number, just typeset as one instead of buried in a string.

   The list is <ol> and the numerals are written into the markup rather
   than generated by a CSS counter. These are the author's numbering,
   referred to by number in conversation and elsewhere on the site; a
   counter would silently renumber if a plank were ever reordered.
   ==================================================================== */
.ry-planks {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin: 40px 0 0;
  padding: 0;
  list-style: none;
}
@media (max-width: 991.98px) { .ry-planks { grid-template-columns: 1fr; } }

.ry-plank {
  position: relative;
  margin: 0;
  padding: 30px 32px 28px;
  border-radius: 16px;
  border: 1px solid var(--ry-hairline);
  background: var(--ry-glass-bg);
  box-shadow: var(--ry-glass-shadow);
  overflow: hidden;
}
@media (max-width: 575.98px) { .ry-plank { padding: 24px 22px 22px; } }

/* the accent rail the legacy drew across the top of each card */
.ry-plank::before {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 2px;
  background: linear-gradient(90deg, var(--ry-red) 0%, rgba(255, 47, 110, 0.15) 100%);
}

.ry-plank__n {
  display: block;
  font-family: 'Bebas Neue', sans-serif;
  font-size: 30px;
  line-height: 1;
  letter-spacing: 0.06em;
  color: var(--ry-red);
  margin-bottom: 10px;
}
.ry-plank__title {
  font-family: 'Poppins', sans-serif;
  font-size: 17px;
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: -0.01em;
  color: #fff;
  margin: 0 0 16px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--ry-hairline);
}
/* one plank titles a page of its own, so the heading itself is a link */
.ry-plank__title a {
  color: #fff;
  text-decoration: none;
  border-bottom: 1px solid rgba(255, 47, 110, 0.5);
}
.ry-plank__title a:hover { color: var(--ry-red); border-bottom-color: var(--ry-red); }

.ry-plank__body {
  margin: 0;
  font-size: 14.5px;
  line-height: 1.75;
  font-weight: 300;
  color: var(--ry-ink-dim);
}
.ry-plank__body strong { color: #fff; font-weight: 600; }
.ry-plank__body em { color: rgba(255, 255, 255, 0.86); }
.ry-plank__body a {
  color: var(--ry-red);
  text-decoration: none;
  border-bottom: 1px solid rgba(255, 47, 110, 0.35);
}
.ry-plank__body a:hover { color: #fff; border-bottom-color: rgba(255, 255, 255, 0.6); }