/* Home / Membership — page CSS, verbatim from the approved build.
   Loaded after elixium-base.css and site.css, preserving the original cascade. */
/* ---------------------------------------------------------------------------
   SCOPED ADDITIONS — new selectors only. Nothing in elixium-base.css is
   redefined except the two hero overrides below, which are required because
   the hero moved to a two-column layout and must share the site's content
   width and margins.
   1. two-column hero          .hero-2col / .hero-grid
   2. Hollow message thread    .phone*  (no pattern for this existed)
   3. two-column checklist     .checks.two
   4. comparison column labels .cmp-note
   --------------------------------------------------------------------------- */
.hero-2col{min-height:0;padding:132px 0 82px}
.hero-2col .wrap{max-width:var(--maxw)}
.hero-2col .hero-content{transform:none;max-width:none}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:44px;align-items:center}
.hero-content,.hv{min-width:0}
.hero-content h1,.hero-content .lede,.trustbar li{overflow-wrap:break-word}
@media(min-width:960px){.hero-grid{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:56px}}
.hero-2col h1{font-size:clamp(2.3rem,4.2vw,3.45rem)}
.trust{margin-top:22px;font-family:var(--font-mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.6);line-height:1.8}
.final .trust{color:var(--ink-muted)}

.phone{max-width:390px;margin:0 auto;background:var(--green-925);border:1px solid var(--line-mint);border-radius:32px;padding:14px;box-shadow:0 60px 120px -60px rgba(0,0,0,.85)}
.bg-pale .phone{box-shadow:0 40px 90px -50px rgba(8,28,20,.55)}
.phone-top{display:flex;align-items:center;gap:12px;padding:10px 8px 16px;border-bottom:1px solid var(--line-dark)}
.phone-av{width:40px;height:40px;border-radius:50%;object-fit:cover;object-position:center top;flex-shrink:0}
.phone-id{display:flex;flex-direction:column;line-height:1.3;min-width:0}
.phone-id b{font-family:var(--font-display);font-weight:600;font-size:1rem;color:#fff}
.phone-id span{font-family:var(--font-mono);font-size:.6rem;letter-spacing:.13em;text-transform:uppercase;color:var(--mint)}
.phone-top svg{width:15px;height:15px;stroke:rgba(255,255,255,.4);fill:none;stroke-width:1.7;margin-left:auto;flex-shrink:0}
.phone-thread{display:flex;flex-direction:column;gap:12px;padding:18px 8px 8px;min-height:60px}
.bub{max-width:86%;padding:13px 16px;border-radius:18px;font-size:.95rem;line-height:1.5}
.bub.them{background:rgba(255,255,255,.07);border:1px solid var(--line-dark);color:rgba(255,255,255,.9);border-bottom-left-radius:6px;align-self:flex-start}
.bub.me{background:var(--mint);color:var(--green-950);border-bottom-right-radius:6px;align-self:flex-end}
.js .phone-thread.anim .bub[data-seq]{opacity:0;transform:translateY(12px)}
.js .phone-thread.anim .bub[data-seq].in{opacity:1;transform:none;transition:opacity .55s cubic-bezier(.16,.8,.3,1),transform .55s cubic-bezier(.16,.8,.3,1)}
.typing{display:none;gap:5px;align-items:center;padding:13px 16px;border-radius:18px;background:rgba(255,255,255,.07);border:1px solid var(--line-dark);width:fit-content;align-self:flex-start}
.typing.on{display:flex}
.typing.me{align-self:flex-end;background:rgba(149,213,179,.18);border-color:var(--line-mint)}
.typing i{width:6px;height:6px;border-radius:50%;background:var(--mint);animation:tdot 1.1s infinite}
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
@keyframes tdot{0%,65%,100%{transform:translateY(0);opacity:.4}30%{transform:translateY(-4px);opacity:1}}
.phone-foot{padding:12px 10px 4px;font-family:var(--font-mono);font-size:.56rem;letter-spacing:.09em;text-transform:uppercase;color:rgba(255,255,255,.38);text-align:center}

/* Trust bar — four understated items with dot separators */
.trustbar{list-style:none;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px 0;margin-top:30px;padding-top:26px;border-top:1px solid var(--line-dark)}
.trustbar li{display:flex;align-items:center;gap:7px;min-width:0;font-family:var(--font-mono);font-size:.7rem;letter-spacing:.11em;text-transform:uppercase;color:rgba(255,255,255,.72);padding-right:24px}
@media(max-width:559px){.trustbar{grid-template-columns:minmax(0,1fr);gap:11px}.trustbar li{padding-right:0}.trustbar li:nth-child(even){border-left:0;padding-left:0}}
.trustbar li:nth-child(even){border-left:1px solid var(--line-dark);padding-left:24px;padding-right:0}
.trustbar svg{width:12px;height:12px;fill:var(--mint);flex-shrink:0}

/* The Hollow thread — now used only by the Care That Remembers section. */
.phone{max-width:452px;margin:0 auto;background:linear-gradient(180deg,#123320 0%,#0c2418 62%);
  border:1px solid var(--line-mint);border-radius:34px;padding:15px;box-shadow:0 60px 120px -60px rgba(0,0,0,.85)}
.bg-pale .phone{box-shadow:0 40px 90px -50px rgba(8,28,20,.55)}
.phone-top{display:flex;align-items:center;gap:12px;padding:10px 8px 16px;border-bottom:1px solid var(--line-dark)}
.phone-av{width:40px;height:40px;border-radius:50%;object-fit:cover;object-position:center top;flex-shrink:0}
.phone-id{display:flex;flex-direction:column;line-height:1.3;min-width:0}
.phone-id b{font-family:var(--font-display);font-weight:600;font-size:1.02rem;color:#fff}
.phone-id span{font-family:var(--font-mono);font-size:.6rem;letter-spacing:.13em;text-transform:uppercase;color:var(--mint)}
.phone-top svg{width:15px;height:15px;stroke:rgba(255,255,255,.4);fill:none;stroke-width:1.7;margin-left:auto;flex-shrink:0}
/* Bottom-anchored, like a thread you just opened: the empty screen above is
   deliberate, and it gives the provider card somewhere to sit. */
.phone-thread{display:flex;flex-direction:column;justify-content:flex-end;gap:13px;padding:20px 8px 10px}
@media(min-width:960px){.phone-thread{gap:15px;padding:22px 10px 12px}.phone{max-width:486px}
  #proof .hero-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px}
  #proof .phone{margin-left:0}}
.bub{max-width:88%;padding:14px 17px;border-radius:19px;font-size:.97rem;line-height:1.5}
@media(min-width:960px){.bub{font-size:1.02rem;padding:15px 19px}}
.bub.them{background:rgba(255,255,255,.11);border:1px solid rgba(255,255,255,.09);color:rgba(255,255,255,.96);border-bottom-left-radius:7px;align-self:flex-start}
.bub.me{background:var(--mint);color:var(--green-950);border-bottom-right-radius:7px;align-self:flex-end}
.js .phone-thread.anim .bub[data-seq]{opacity:0;transform:translateY(12px)}
.js .phone-thread.anim .bub[data-seq].in{opacity:1;transform:none;transition:opacity .55s cubic-bezier(.16,.8,.3,1),transform .55s cubic-bezier(.16,.8,.3,1)}
.typing{display:none;gap:5px;align-items:center;padding:14px 17px;border-radius:19px;background:rgba(255,255,255,.11);border:1px solid rgba(255,255,255,.09);width:fit-content;align-self:flex-start}
.typing.on{display:flex}
.typing.me{align-self:flex-end;background:rgba(149,213,179,.2);border-color:var(--line-mint)}
.typing i{width:6px;height:6px;border-radius:50%;background:var(--mint);animation:tdot 1.1s infinite}
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
@keyframes tdot{0%,65%,100%{transform:translateY(0);opacity:.4}30%{transform:translateY(-4px);opacity:1}}
.prev{display:none;align-items:center;gap:7px;align-self:flex-start;padding:11px 15px;border-radius:19px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.07)}
.prev span{font-family:var(--font-mono);font-size:.52rem;letter-spacing:.09em;text-transform:uppercase;color:rgba(255,255,255,.62)}
.prev i{width:5px;height:5px;border-radius:50%;background:var(--mint);animation:tdot 1.1s infinite}
.prev i:nth-child(2){animation-delay:.15s}.prev i:nth-child(3){animation-delay:.3s}
.js .phone-thread.anim .prev{display:flex}
.js .phone-thread.anim.started .prev{display:none}
.phone-foot{padding:13px 10px 4px;font-family:var(--font-mono);font-size:.56rem;letter-spacing:.09em;text-transform:uppercase;color:rgba(255,255,255,.4);text-align:center}

/* ---------------------------------------------------------------------------
   HOW WE CARE — "one record, accumulating"
   A single spine runs the full height and fades past stage three rather than
   terminating: care doesn't stop. Stage 02 breaks the grid to become the
   centrepiece. The artefacts carry the same member story as the hero, so the
   page reads as one continuous case rather than three unrelated mocks.
   --------------------------------------------------------------------------- */
.journey{position:relative;padding-left:46px;margin-top:8px}
@media(min-width:900px){.journey{padding-left:70px}}
.jspine{position:absolute;left:14px;top:6px;bottom:0;width:2px;border-radius:2px;transform-origin:top;
  background:linear-gradient(to bottom,var(--mint) 0%,rgba(149,213,179,.62) 62%,rgba(149,213,179,.16) 88%,rgba(149,213,179,0) 100%)}
@media(min-width:900px){.jspine{left:19px}}
.js .jspine{transform:scaleY(0);transition:transform 1.6s cubic-bezier(.16,.8,.3,1) .1s}
.js .journey.in .jspine{transform:scaleY(1)}
html:not(.js) .jspine{transform:none}
.jstage{position:relative;display:grid;gap:24px;padding-bottom:64px}
@media(min-width:900px){
  /* start-aligned so each spine node lines up with its stage title */
  .jstage{grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:52px;align-items:start;padding-bottom:86px}
  .jstage.jwide{grid-template-columns:minmax(0,1fr);gap:30px}
}
.jstage:last-of-type{padding-bottom:26px}
.jnode{position:absolute;left:-46px;top:-2px;width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:var(--green-870);border:1px solid var(--line-mint);font-family:var(--font-mono);font-size:.56rem;letter-spacing:.06em;color:var(--mint)}
@media(min-width:900px){.jnode{left:-70px;width:40px;height:40px;font-size:.62rem}}
.jart{min-width:0}
.jtext h3{font-size:clamp(1.5rem,2.6vw,2.05rem);margin-bottom:12px}
.jtext p{color:rgba(255,255,255,.76);font-size:1rem;max-width:46ch}
.jwide .jtext p{max-width:64ch}
.jcard{background:rgba(8,28,20,.5);border:1px solid var(--line-dark);border-radius:var(--r-md);padding:20px 20px 16px;
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 30px 70px -40px rgba(0,0,0,.8)}
.jc-h{display:flex;align-items:center;justify-content:space-between;gap:14px;padding-bottom:13px;margin-bottom:13px;border-bottom:1px solid var(--line-dark)}
.jc-t{font-family:var(--font-mono);font-size:.58rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.66)}
.jc-ok{display:inline-flex;align-items:center;gap:5px;font-family:var(--font-mono);font-size:.55rem;letter-spacing:.08em;text-transform:uppercase;color:var(--mint);white-space:nowrap}
.jc-ok svg{width:10px;height:10px;fill:none;stroke:var(--mint);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.jrow{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:9px 0;font-size:.92rem;color:rgba(255,255,255,.88)}
.jrow+.jrow{border-top:1px solid rgba(255,255,255,.05)}
.jrow i{font-style:normal;font-family:var(--font-mono);font-size:.6rem;letter-spacing:.08em;text-transform:uppercase;padding:4px 9px;border-radius:6px;white-space:nowrap}
.jrow i.hi,.jrow i.lo{color:#e8b06a;background:rgba(201,138,43,.14)}
.jrow i.in{color:var(--mint);background:rgba(149,213,179,.12)}
.jc-f{margin-top:14px;padding-top:13px;border-top:1px solid var(--line-dark);font-family:var(--font-mono);font-size:.56rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.42)}
.jplan{padding:0;overflow:hidden;background:rgba(8,28,20,.62)}
.jp-h{display:flex;align-items:center;gap:13px;padding:18px 22px;border-bottom:1px solid var(--line-dark);background:rgba(149,213,179,.05)}
.jp-h img{width:40px;height:40px;border-radius:50%;object-fit:cover;object-position:center top;flex-shrink:0}
.jp-h b{display:block;font-family:var(--font-display);font-weight:600;font-size:1.06rem;color:#fff}
.jp-h span{font-family:var(--font-mono);font-size:.56rem;letter-spacing:.1em;text-transform:uppercase;color:var(--mint)}
.jp-stamp{margin-left:auto;font-family:var(--font-mono);font-size:.55rem;letter-spacing:.09em;text-transform:uppercase;color:rgba(255,255,255,.5);border:1px solid var(--line-dark);border-radius:100px;padding:5px 11px;white-space:nowrap}
.jp-body{display:grid;grid-template-columns:1fr;gap:0}
@media(min-width:760px){.jp-body{grid-template-columns:1.05fr 1fr}}
.jp-col{padding:20px 22px}
.jp-col+.jp-col{border-top:1px solid var(--line-dark)}
@media(min-width:760px){.jp-col+.jp-col{border-top:0;border-left:1px solid var(--line-dark)}}
.jp-lab{font-family:var(--font-mono);font-size:.56rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-bottom:14px}
.jp-list{list-style:none;display:grid;gap:11px}
.jp-list li{display:grid;grid-template-columns:auto 1fr;gap:11px;align-items:start;font-size:.95rem;color:rgba(255,255,255,.9)}
.jp-list svg{width:15px;height:15px;margin-top:3px;fill:none;stroke:var(--mint);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.jstack{display:grid;gap:12px}
@media(min-width:900px){.jstack{gap:0}.jstack>*{position:relative}
  .jstack>*:nth-child(2){margin:-8px 0 0 34px}
  .jstack>*:nth-child(3){margin:-8px 0 0 68px}}
.jchip{background:rgba(8,28,20,.62);border:1px solid var(--line-dark);border-radius:15px;padding:14px 17px;
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 22px 52px -34px rgba(0,0,0,.8)}
.jchip .t{font-family:var(--font-mono);font-size:.55rem;letter-spacing:.11em;text-transform:uppercase;color:var(--mint);margin-bottom:7px}
.jchip p{font-size:.9rem;color:rgba(255,255,255,.86);line-height:1.45}
.jchip .w{font-family:var(--font-display);font-weight:600;font-size:1rem;color:#fff}
.jchip .s{font-family:var(--font-mono);font-size:.55rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-top:3px}
@media(prefers-reduced-motion:reduce){.jspine{transform:none!important;transition:none}}

/* Nav: your six links plus two buttons don't fit the stock 32px gap — "What's
   Included" wrapped to a second line. Keeps every label on one line and tightens
   spacing only in the band where it would otherwise collide. */
.nav-links a{white-space:nowrap}
@media(min-width:1000px) and (max-width:1240px){
  .nav-links{gap:19px}
  .nav-links a{font-size:.88rem}
  .nav .btn{padding:10px 15px;font-size:.86rem}
}

/* ---------------------------------------------------------------------------
   HERO — one editorial photograph with the membership laid over it.
   The card overlaps the image's lower edge so the offer reads as part of the
   picture rather than a panel beside it. Three supporting cards, no more.
   --------------------------------------------------------------------------- */
.hv{position:relative}
.hv-img{position:relative;border-radius:var(--r-lg);overflow:hidden;aspect-ratio:16/11;border:1px solid var(--line-dark)}
.hv-img img{width:100%;height:100%;object-fit:cover;object-position:center 24%}
.hv-img::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(8,28,20,0) 42%,rgba(8,28,20,.62) 100%)}

.omain{z-index:3;margin:-74px 16px 0;display:flex;flex-direction:column;border-radius:var(--r-lg);
  border:1px solid var(--line-mint);padding:26px 26px 24px;
  background:linear-gradient(168deg,#153c27 0%,#0d2618 58%,#0a2016 100%);
  box-shadow:0 54px 110px -46px rgba(0,0,0,.9)}
@media(min-width:620px){.omain{margin:-84px 26px 0}}
.omain::before{content:"";position:absolute;inset:0 0 auto;height:1px;border-radius:var(--r-lg) var(--r-lg) 0 0;
  background:linear-gradient(90deg,rgba(149,213,179,0),rgba(149,213,179,.55),rgba(149,213,179,0))}
.om-top{display:flex;flex-direction:column;align-items:flex-start;gap:10px;margin-bottom:18px}
.om-logo{flex:0 0 auto;height:20px;width:auto}
.om-logo svg{height:20px;width:auto;display:block}
.om-label{flex:0 0 auto;white-space:nowrap;font-family:var(--font-mono);font-size:.59rem;letter-spacing:.19em;text-transform:uppercase;color:var(--mint)}
.om-price{font-family:var(--font-display);font-weight:800;font-size:clamp(2.7rem,4.2vw,3.4rem);letter-spacing:-.04em;line-height:1;color:#fff}
.om-price span{font-family:var(--font-body);font-size:.98rem;font-weight:500;letter-spacing:0;color:rgba(255,255,255,.6)}
.om-inc{margin:20px 0 13px;padding-top:16px;border-top:1px solid var(--line-dark);
  font-family:var(--font-mono);font-size:.57rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,255,255,.5)}
.om-list{list-style:none;display:grid;grid-template-columns:1fr;gap:10px;margin-bottom:22px}
@media(min-width:520px){.om-list{grid-template-columns:1fr 1fr;gap:10px 18px}}
.om-list li{display:grid;grid-template-columns:auto 1fr;gap:9px;align-items:start;font-size:.9rem;color:rgba(255,255,255,.92)}
.om-list svg{width:14px;height:14px;margin-top:3px;fill:none;stroke:var(--mint);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.om-cta{width:100%;margin-top:auto}

/* entrance: copy, image, card, supports, trust row last */
.js .hv[data-reveal]{opacity:1;transform:none;transition:none}
.js .hv>*{opacity:0;transform:translateY(18px)}
.js .hv.in>*{opacity:1;transform:none;transition:opacity .7s cubic-bezier(.16,.8,.3,1),transform .7s cubic-bezier(.16,.8,.3,1)}
.js .hv.in .hv-img{transition-delay:.04s}
.js .hv.in .omain{transition-delay:.26s}
.js .trustbar[data-reveal]{transition-delay:.5s}
@media(prefers-reduced-motion:reduce){
  .js .hv>*{opacity:1!important;transform:none!important;transition:none!important}
  .js .trustbar[data-reveal]{transition-delay:0s}
}

/* closing block */
.closer{max-width:720px;margin:0 auto;text-align:center}
.closer h2{font-size:clamp(2rem,4vw,3rem);margin-bottom:24px}
.closer-price{font-family:var(--font-display);font-weight:800;font-size:clamp(3.2rem,6vw,4.6rem);letter-spacing:-.04em;line-height:1;color:var(--mint)}
.closer-price span{font-family:var(--font-body);font-size:1.05rem;font-weight:500;letter-spacing:0;color:rgba(255,255,255,.62)}
.closer p{margin:20px auto 30px;font-size:1.1rem;color:rgba(255,255,255,.8);max-width:34em}
.closer-sub{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.55);margin-top:20px!important}

/* the membership card keeps a base surface even though the mini cards are gone */
.ocard{position:relative;z-index:2}

/* CARE AREAS — four broad groupings, not a treatment menu */
.ct-grid{display:grid;grid-template-columns:1fr;gap:14px}
@media(min-width:620px){.ct-grid{grid-template-columns:1fr 1fr;gap:16px}}
@media(min-width:1080px){.ct-grid{grid-template-columns:repeat(4,1fr);gap:16px}}
.ctile{display:flex;flex-direction:column;padding:30px 26px 32px;min-height:216px;border-radius:var(--r-lg);
  border:1px solid var(--line-dark);background:linear-gradient(165deg,rgba(149,213,179,.06),rgba(255,255,255,.012))}
.ctile h3{font-size:clamp(1.1rem,1.6vw,1.24rem);margin-bottom:13px;line-height:1.25}
/* supporting line stays clearly secondary to the category title */
.ctile p{font-size:.88rem;line-height:1.62;color:rgba(255,255,255,.6)}

/* WHAT'S INCLUDED — three groups */
.ig{display:grid;grid-template-columns:1fr;gap:18px}
@media(min-width:860px){.ig{grid-template-columns:repeat(3,1fr);gap:20px}}
.igroup{padding:30px 28px;border-radius:var(--r-lg);border:1px solid var(--line-dark);background:rgba(8,28,20,.42)}
.igroup .num{font-family:var(--font-mono);font-size:.56rem;letter-spacing:.15em;text-transform:uppercase;color:var(--mint);margin-bottom:14px}
.igroup h3{font-size:clamp(1.2rem,2vw,1.45rem);margin-bottom:18px}
.igroup ul{list-style:none;display:grid;gap:13px}
.igroup li{display:grid;grid-template-columns:auto 1fr;gap:11px;align-items:start;font-size:1rem;color:rgba(255,255,255,.86)}
.igroup svg{width:15px;height:15px;margin-top:4px;fill:none;stroke:var(--mint);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.proof{display:grid;grid-template-columns:1fr}
@media(min-width:620px){.proof{grid-template-columns:1fr 1fr}}
.proof>div{padding:24px 4px 24px 0;border-top:1px solid var(--line-dark)}
@media(min-width:620px){.proof>div:nth-child(even){padding-left:28px;border-left:1px solid var(--line-dark)}}
.proof b{display:block;font-family:var(--font-display);font-weight:700;font-size:clamp(1.5rem,2.6vw,2rem);color:#fff;letter-spacing:-.02em;line-height:1.1}
.proof span{display:block;margin-top:7px;font-size:.95rem;color:rgba(255,255,255,.68)}
.tsmall{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.tsmall a{display:inline-flex;align-items:center;gap:9px;padding:9px 14px;border:1px solid var(--line-dark);border-radius:100px;font-size:.86rem;color:rgba(255,255,255,.78)}
.tsmall img{width:26px;height:26px;border-radius:50%;object-fit:cover;object-position:center top}

/* REVIEWS — three substantial cards */
@media(min-width:820px){.revs{grid-template-columns:repeat(3,1fr);gap:20px}}
.rev{padding:32px 30px}
.rev p{font-size:1.02rem;line-height:1.65}

/* ---------------------------------------------------------------------------
   HOLLOW PLATFORM VISUALS — full-size panels for How We Care.
   Generalised on purpose: a health overview, a care plan and ongoing trends.
   No single flagged result is shown, so nothing reads as a finding that went
   unaddressed. The screenshots support the story; they are not the story.
   --------------------------------------------------------------------------- */
.pv{border-radius:var(--r-md);border:1px solid var(--line-dark);background:#0b2117;overflow:hidden;
  box-shadow:0 40px 90px -46px rgba(0,0,0,.9)}
.pv-top{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:15px 20px;border-bottom:1px solid var(--line-dark)}
.pv-t{font-family:var(--font-mono);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.7)}
.pv-ok{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-mono);font-size:.55rem;letter-spacing:.09em;text-transform:uppercase;color:var(--mint);font-weight:400;white-space:nowrap}
.pv-ok svg{width:10px;height:10px;fill:none;stroke:var(--mint);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.pv-body{padding:24px 22px}
.pv-score{text-align:center;margin-bottom:22px}
.pv-score .n{font-family:var(--font-display);font-weight:800;font-size:3.1rem;line-height:1;color:var(--mint);letter-spacing:-.03em}
.pv-score .r{font-family:var(--font-mono);font-size:.58rem;letter-spacing:.12em;color:rgba(255,255,255,.42);margin-top:6px}
.pv-score .chip{display:inline-block;margin-top:12px;font-family:var(--font-mono);font-size:.55rem;letter-spacing:.11em;text-transform:uppercase;
  color:var(--green-950);background:var(--mint);border-radius:100px;padding:5px 12px}
.pv-rings{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;padding-top:20px;border-top:1px solid var(--line-dark)}
.pv-ring{text-align:center}
.ring{position:relative;width:52px;height:52px;margin:0 auto 8px;border-radius:50%;
  background:conic-gradient(var(--mint) calc(var(--v)*3.6deg),rgba(255,255,255,.09) 0)}
.ring::before{content:"";position:absolute;inset:5px;border-radius:50%;background:#0b2117}
.ring span{position:absolute;inset:0;display:grid;place-items:center;font-family:var(--font-mono);font-size:.7rem;color:#fff}
.pv-ring em{font-style:normal;font-family:var(--font-mono);font-size:.5rem;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.5)}

/* Flight Plan panel */
.pv-bar{display:flex;align-items:center;gap:11px;padding:15px 20px;background:rgba(149,213,179,.13);border-bottom:1px solid var(--line-mint)}
.pv-bar .logo{height:17px}
.pv-bar b{font-family:var(--font-display);font-weight:600;font-size:1.02rem;color:#fff}
.pv-who{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.pv-who img{width:42px;height:42px;border-radius:50%;object-fit:cover;object-position:center top}
.pv-who b{display:block;font-family:var(--font-display);font-weight:600;font-size:.98rem;color:#fff}
.pv-who span{font-family:var(--font-mono);font-size:.54rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.5)}
.pv-note{font-size:.95rem;line-height:1.65;color:rgba(255,255,255,.86)}
.pv-sig{margin-top:18px;padding-top:16px;border-top:1px solid var(--line-dark)}
.pv-sig i{font-style:italic;font-size:1.35rem;color:var(--mint);font-family:var(--font-display)}
.pv-sig em{display:block;font-style:normal;font-family:var(--font-mono);font-size:.5rem;letter-spacing:.09em;text-transform:uppercase;color:rgba(255,255,255,.42);margin-top:5px}
.pv-docs{margin-top:18px;padding-top:16px;border-top:1px solid var(--line-dark)}
.pv-docs .lb{font-family:var(--font-mono);font-size:.52rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.45);margin-bottom:11px}
.pv-doc{display:flex;align-items:center;gap:11px;padding:11px 13px;border:1px solid var(--line-dark);border-radius:11px;margin-bottom:8px;font-size:.86rem;color:rgba(255,255,255,.8)}
.pv-doc svg{width:15px;height:15px;fill:none;stroke:var(--mint);stroke-width:1.7;flex-shrink:0}
.pv-doc span{margin-left:auto;color:rgba(255,255,255,.35)}

/* biomarker trends */
.pv-cat{display:flex;align-items:baseline;gap:10px;padding:0 0 12px;margin-top:4px}
.pv-cat b{font-family:var(--font-display);font-weight:600;font-size:1rem;color:#fff}
.pv-cat span{font-family:var(--font-mono);font-size:.52rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.42)}
.pv-marks{display:grid;grid-template-columns:1fr;gap:9px;margin-bottom:20px}
@media(min-width:520px){.pv-marks{grid-template-columns:1fr 1fr}}
.mk{border:1px solid var(--line-dark);border-radius:12px;padding:12px 13px;background:rgba(255,255,255,.02)}
.mk .h{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.mk .nm{font-family:var(--font-mono);font-size:.55rem;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.82)}
.mk .v{font-family:var(--font-display);font-weight:600;font-size:.95rem;color:#fff;white-space:nowrap}
.mk .st{font-family:var(--font-mono);font-size:.5rem;letter-spacing:.08em;text-transform:uppercase;color:var(--mint);margin-top:3px}
.mk .bar{position:relative;height:4px;border-radius:3px;background:rgba(255,255,255,.09);margin-top:10px}
.mk .bar i{position:absolute;top:-3px;width:10px;height:10px;border-radius:50%;background:var(--mint);left:var(--p)}
.mk .bar em{position:absolute;left:12%;right:12%;top:0;height:4px;border-radius:3px;background:rgba(149,213,179,.3)}

/* one visual per stage, at scale */
.jstage .pv{width:100%}
@media(min-width:900px){
  .jstage{grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr)}
  .jstage.jflip .jtext{order:2}
  .jstage.jflip .jart{order:1}
}

/* IMMEDIATE VALUE — image beside four short statements */
.iv{display:grid;grid-template-columns:1fr;gap:32px;align-items:center}
@media(min-width:900px){.iv{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:56px}}
.iv-img{border-radius:var(--r-lg);overflow:hidden;aspect-ratio:4/3;border:1px solid var(--line-light)}
.iv-img img{width:100%;height:100%;object-fit:cover}
.iv-list{display:grid;gap:34px}
.iv-list h3{font-size:clamp(1.24rem,2vw,1.5rem);margin-bottom:9px}
.iv-list p{font-size:1.04rem;line-height:1.62;color:var(--ink-muted);max-width:44ch}
.iv-list .n{font-family:var(--font-mono);font-size:.56rem;letter-spacing:.14em;text-transform:uppercase;color:#2f6a4c;margin-bottom:7px}

/* wide editorial band */
.band{border-radius:var(--r-lg);overflow:hidden;aspect-ratio:21/9;margin-bottom:44px;border:1px solid var(--line-dark)}
.band img{width:100%;height:100%;object-fit:cover;object-position:center 42%}

/* WHY ELIXIUM — pillars + the real care team, briefly */
.pillars{display:grid;grid-template-columns:1fr;gap:14px;max-width:560px}
@media(min-width:620px){.pillars{grid-template-columns:1fr 1fr;gap:14px 26px;max-width:none}}
.pillars li{display:grid;grid-template-columns:auto 1fr;gap:11px;align-items:start;font-size:1rem;color:rgba(255,255,255,.9);list-style:none}
.pillars svg{width:15px;height:15px;margin-top:4px;fill:none;stroke:var(--mint);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.why-split{display:grid;grid-template-columns:1fr;gap:40px}
@media(min-width:960px){.why-split{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:start}}
.team{display:grid;grid-template-columns:1fr;gap:12px}
.tmember{display:flex;align-items:center;gap:14px;padding:13px 15px;border:1px solid var(--line-dark);border-radius:var(--r-md);background:rgba(8,28,20,.5)}
.tmember img{width:52px;height:52px;border-radius:50%;object-fit:cover;object-position:center top;flex-shrink:0}
.tmember b{display:block;font-family:var(--font-display);font-weight:600;font-size:1rem;color:#fff}
.tmember span{font-family:var(--font-mono);font-size:.56rem;letter-spacing:.11em;text-transform:uppercase;color:var(--mint)}

/* patient proof */
.revs{display:grid;grid-template-columns:1fr;gap:18px}
@media(min-width:820px){.revs{grid-template-columns:repeat(3,1fr)}}
.rev{padding:24px 24px;border-radius:var(--r-md);background:#fff;border:1px solid var(--line-light)}
.rev .qm{font-family:var(--font-display);font-size:1.9rem;line-height:1;color:var(--mint);margin-bottom:10px}
.rev p{font-size:.95rem;color:var(--ink-muted);line-height:1.6}

/* closing conversion section over a restrained photograph */
.close{position:relative;isolation:isolate;overflow:hidden}
.close::before{content:"";position:absolute;inset:0;z-index:-2;background:url('images/lifestyle-room.jpg') center 55%/cover no-repeat;opacity:.3}
.close::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(8,28,20,.86),rgba(8,28,20,.94))}
.close .price-card{max-width:520px;margin:0 auto}

/* two small confirmations under the thread */
.pconf{display:flex;flex-wrap:wrap;gap:9px;justify-content:center;margin-top:14px}
.pconf span{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-mono);font-size:.56rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--mint);background:rgba(149,213,179,.1);border:1px solid var(--line-mint);border-radius:100px;padding:6px 12px}
.pconf svg{width:10px;height:10px;fill:none;stroke:var(--mint);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}

/* two-column checklist */
@media(min-width:760px){.checks.two{grid-template-columns:1fr 1fr;column-gap:38px}}
.cmp-note{margin-top:26px;font-family:var(--font-display);font-size:clamp(1.05rem,1.9vw,1.3rem);line-height:1.45;max-width:720px}
.bg-mid .cmp-note{color:#fff}
/* ===========================================================================
   ART DIRECTION PASS — visual refinement only. No structure, order or copy
   changes. Principles applied: one focal point per section; cards only where
   containment earns it; photography as anchor, not thumbnail; headlines
   dominate; measure capped; deliberate variation in section rhythm.
   =========================================================================== */

/* --- rhythm: sections no longer share one padding value ------------------- */
.sec{padding:clamp(84px,10vw,140px) 0}
#value{padding:clamp(96px,12vw,168px) 0}          /* image-led, immersive */
#care{padding:0 0 clamp(96px,11vw,150px)}          /* photography runs to the top edge */
#included{padding:clamp(92px,11vw,152px) 0}             /* portrait-led, immersive */
#reviews{padding:clamp(88px,10vw,140px) 0}
#faq{padding:clamp(64px,7vw,96px) 0}               /* deliberately compact */
#pricing{padding:clamp(100px,12vw,172px) 0}

/* --- typography: headline dominates, support recedes, measure capped ------ */
.sec-head{max-width:none}
.sec-head h2{font-size:clamp(2.1rem,4.4vw,3.35rem);letter-spacing:-.028em;max-width:19ch}
.sec-head.center h2{margin-inline:auto}
.sec-head p{font-size:1.06rem;max-width:620px;color:rgba(255,255,255,.66)}
.bg-pale .sec-head p{color:var(--ink-muted)}
.jtext p,.ctile p,.igroup li,.iv-list p{max-width:620px}

/* --- 2 · VALUE — photograph becomes the anchor and breaks the grid -------- */
@media(min-width:900px){
  #value .iv{grid-template-columns:minmax(0,1.32fr) minmax(0,1fr);gap:clamp(48px,5vw,84px);align-items:center}
  #value .iv-img{margin-left:calc(-1 * clamp(24px,5vw,90px));border-radius:0 var(--r-lg) var(--r-lg) 0;aspect-ratio:5/4}
}
.iv-list{gap:clamp(30px,3.4vw,44px)}
.iv-list h3{font-size:clamp(1.3rem,2.1vw,1.62rem);letter-spacing:-.015em}
.iv-list p{font-size:1rem;color:rgba(76,100,89,.86)}
.iv-list .n{color:#5c8a72}

/* --- 3 · HOW WE CARE — cropped fragments, no interface chrome ------------- */
.pv{border-radius:18px;background:#0a1f15;box-shadow:0 50px 110px -50px rgba(0,0,0,.95)}
.pv-body{padding:30px 28px}
@media(min-width:900px){
  .jstage{gap:clamp(40px,4.5vw,72px)}
  /* the crop runs off the grid edge — a fragment, not a screenshot */
  .jstage:not(.jflip) .jart{margin-right:calc(-1 * clamp(16px,4vw,72px))}
  /* the flipped row keeps the grid edge so the spine node stays clear of it */
  .jstage.jflip .jart{margin-left:0;margin-right:0}
  .pv-body{padding:36px 34px}
}
.pv-score .n{font-size:clamp(3.4rem,5vw,4.6rem)}
.pv-rings{gap:12px}
.ring{width:60px;height:60px}
@media(min-width:900px){.ring{width:66px;height:66px}}
.pv-note{font-size:1.05rem;line-height:1.7}
.pv-marks{gap:12px}
.mk{padding:16px 17px;border-radius:14px}
.mk .v{font-size:1.15rem}

/* --- 4 · CARE — the photograph dominates; the list stops being a menu ----- */
#care .band{aspect-ratio:auto;height:clamp(340px,46vw,620px);border-radius:0;border:0;margin:0 0 clamp(56px,6vw,88px)}
#care .band img{object-position:center 46%}
#care>.wrap{max-width:none;padding:0}
#care .wrap-in{max-width:var(--maxw);margin:0 auto;padding:0 6vw}
@media(min-width:900px){#care .wrap-in{padding:0 40px}}
/* borderless: hairline grouping instead of eight containers */
.ct-grid{gap:0;border-top:1px solid var(--line-dark)}
@media(min-width:620px){.ct-grid{grid-template-columns:1fr 1fr;gap:0}}
@media(min-width:1080px){.ct-grid{grid-template-columns:repeat(4,1fr);gap:0}}
.ctile{background:none;border:0;border-bottom:1px solid var(--line-dark);border-radius:0;
  padding:30px clamp(20px,2.4vw,34px) 34px 0;min-height:0}
@media(min-width:620px){.ctile:nth-child(even){padding-left:clamp(20px,2.4vw,34px);border-left:1px solid var(--line-dark)}}
@media(min-width:1080px){
  .ctile{padding-left:clamp(20px,2.2vw,30px);border-left:1px solid var(--line-dark)}
  .ctile:nth-child(4n+1){padding-left:0;border-left:0}
}
.ctile h3{font-size:clamp(1.12rem,1.5vw,1.28rem);margin-bottom:11px}
.ctile p{font-size:.9rem;color:rgba(255,255,255,.55);max-width:34ch}

/* --- 5 · PHONE — refine: larger, closer to the copy ---------------------- */
@media(min-width:960px){
  .phone{max-width:548px}
  #proof .hero-grid{grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:clamp(28px,3vw,48px)}
}

/* --- 6 · WHAT'S INCLUDED — grouping by space, not by boxes --------------- */
.ig{gap:0;border-top:1px solid var(--line-dark)}
@media(min-width:860px){.ig{grid-template-columns:repeat(3,1fr);gap:0}}
.igroup{background:none;border:0;border-radius:0;padding:clamp(34px,3.6vw,48px) clamp(22px,2.6vw,40px) clamp(34px,3.6vw,48px) 0}
@media(min-width:860px){
  .igroup+.igroup{border-left:1px solid var(--line-dark);padding-left:clamp(28px,3vw,44px)}
}
@media(max-width:859px){.igroup+.igroup{border-top:1px solid var(--line-dark)}}
.igroup .num{font-family:var(--font-display);font-weight:700;font-size:2.1rem;letter-spacing:-.03em;
  color:rgba(149,213,179,.28);margin-bottom:16px}
.igroup h3{font-size:clamp(1.28rem,2vw,1.6rem);margin-bottom:22px;letter-spacing:-.015em}
.igroup li{font-size:1.02rem;color:rgba(255,255,255,.8)}
.igroup ul{gap:15px}

.proof>div{padding:22px 4px 22px 0;border-top:1px solid var(--line-dark)}
@media(min-width:620px){.proof>div:nth-child(even){padding-left:26px;border-left:1px solid var(--line-dark)}}
.proof b{font-size:clamp(1.35rem,2.2vw,1.8rem);color:var(--mint)}
.proof span{font-size:.92rem;color:rgba(255,255,255,.6)}
.tsmall a{border-color:rgba(255,255,255,.09)}

/* --- 8 · REVIEWS — one proof moment, two supporting --------------------- */
.revs{grid-template-columns:1fr;gap:18px}
@media(min-width:900px){
  .revs{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);grid-template-rows:auto auto;gap:18px}
  .rev:first-child{grid-row:1 / span 2;padding:clamp(40px,4vw,58px) clamp(36px,3.6vw,52px)}
  .rev:first-child .qm{font-size:3.2rem}
  .rev:first-child p{font-size:clamp(1.18rem,1.7vw,1.42rem);line-height:1.5}
}
.rev{border-radius:var(--r-lg)}

/* --- 9 · FAQ — compact ------------------------------------------------- */
#faq .faq summary{padding:19px 44px 19px 0;font-size:1.04rem}
#faq .faq .a{padding-bottom:22px}

/* --- 11 · PRICING — one obvious decision ------------------------------- */
.closer{max-width:760px;padding:clamp(46px,4.6vw,68px) clamp(30px,4vw,64px);
  background:rgba(8,28,20,.52);border:1px solid var(--line-mint);border-radius:var(--r-lg);
  -webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);
  box-shadow:0 70px 140px -60px rgba(0,0,0,.9)}
.closer h2{font-size:clamp(1.9rem,3.4vw,2.7rem);max-width:22ch;margin-inline:auto}
.closer-price{font-size:clamp(3.6rem,7vw,5.4rem)}
.closer p{font-size:1.06rem;max-width:44ch}
#pricing .med-disclaimer{max-width:760px;font-size:.78rem;opacity:.72}

/* --- 2 · VALUE — headline added, portrait anchor, larger type, more air --- */
#value .sec-head{margin-bottom:clamp(48px,5vw,76px)}
#value .sec-head h2{max-width:16ch}
@media(min-width:900px){
  #value .iv{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(52px,6vw,96px)}
  #value .iv-img{aspect-ratio:4/5}
}
#value .iv-list{gap:clamp(38px,4.2vw,58px)}
#value .iv-list h3{font-size:clamp(1.42rem,2.4vw,1.85rem);letter-spacing:-.02em;margin-bottom:11px}
#value .iv-list p{font-size:clamp(1.02rem,1.3vw,1.12rem);line-height:1.62;max-width:38ch;color:rgba(76,100,89,.82)}

/* --- membership card: no mark, no CTA, terms line, hairline before the list -- */
.om-terms{margin-top:12px;font-family:var(--font-mono);font-size:.62rem;letter-spacing:.11em;text-transform:uppercase;color:rgba(255,255,255,.62)}
.omain .om-list{margin-top:22px;padding-top:22px;border-top:1px solid var(--line-dark);margin-bottom:0}
.omain{padding-bottom:30px}

/* --- care categories: one small mint mark per group ---------------------- */
.ct-ic{display:block;margin-bottom:15px;color:var(--mint)}
.ct-ic svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;display:block}

/* --- reviews: real quotes, one featured -------------------------------- */
.rev{display:flex;flex-direction:column;margin:0}
.rev p{flex:1 0 auto}
.rev-meta{display:flex;align-items:center;gap:11px;margin-top:22px;padding-top:18px;border-top:1px solid var(--line-light)}
.rev-stars{display:inline-flex;gap:3px;flex-shrink:0}
.rev-stars svg{width:13px;height:13px;fill:var(--mint);display:block}
.rev-meta em{font-style:normal;font-family:var(--font-mono);font-size:.56rem;letter-spacing:.11em;text-transform:uppercase;color:var(--ink-muted)}
@media(min-width:900px){
  .rev:first-child .rev-meta{margin-top:30px;padding-top:22px}
  .rev:first-child .rev-stars svg{width:15px;height:15px}
}

/* --- reviews: named attribution ---------------------------------------- */
.rev-meta{flex-wrap:wrap;row-gap:6px;column-gap:14px}
.rev-meta cite{font-style:normal;font-family:var(--font-display);font-weight:700;font-size:.92rem;color:var(--ink);letter-spacing:-.005em;white-space:nowrap}
.rev:first-child .rev-meta cite{font-size:1.06rem}

/* --- Hollow thread indicators: out of flow, anchored to the next slot -----
   Both pills sat in normal flow toggling display:none <-> flex, so each
   show/hide added or removed a ~60px row and shunted every bubble up and
   down — four times per run. Absolute positioning holds the thread's height
   still, and JS parks the pill in the exact slot the next message lands in
   (it used to sit after the last bubble, i.e. far below the live message). */
.phone-thread{position:relative}
.typing,.prev{position:absolute;top:0;left:10px;margin:0;opacity:0;visibility:hidden;transition:opacity .24s ease}
.typing{display:flex}
.typing.on{opacity:1;visibility:visible}
.js .phone-thread.anim .prev{display:flex;opacity:1;visibility:visible}
.js .phone-thread.anim.started .prev{opacity:0;visibility:hidden}
/* the dots move again — a capture-only freeze had shipped into the page */
.typing i,.prev i{animation:tdot 1.1s infinite}
.typing i:nth-child(2),.prev i:nth-child(2){animation-delay:.15s}
.typing i:nth-child(3),.prev i:nth-child(3){animation-delay:.3s}

/* the hero carries a prescription pricing claim, so it carries the disclosure
   too; the hero is dark but not .bg-deep, so borrow that variant's values. */
.hero .med-disclaimer{color:rgba(255,255,255,.55);border-color:rgba(149,213,179,.4);
  font-size:.76rem;line-height:1.65;margin-top:22px;max-width:none}

/* ===========================================================================
   7 · MEET YOUR CARE TEAM — the emotional trust section.
   Not a directory. One physician in her own words, then the team beside her.
   Borders are spent deliberately: outlines only on the credential cards and
   the specialty tags, so the photography and the quote carry the section.
   =========================================================================== */
#why .sec-head{max-width:820px}

/* --- Dr. McDowell: portrait beside her own words ------------------------- */
.cred{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(36px,4vw,56px);align-items:center}
@media(min-width:900px){
  .cred{grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(46px,4.8vw,78px)}
}
/* No candid photograph of Dr. McDowell exists, so the studio headshot is
   softened by layout rather than replaced: no frame, a taller editorial crop,
   and a scrim that knocks back the bright studio backdrop at the top and melts
   the bottom edge into the section instead of leaving a cut-out rectangle. */
.cred-img{position:relative;margin:0;overflow:hidden;border:0;border-radius:var(--r-lg);
  aspect-ratio:4/5;background:var(--green-925)}
.cred-img img{width:100%;height:100%;object-fit:cover;object-position:center 12%;
  filter:saturate(.9) contrast(1.03)}
.cred-img::after{content:"";position:absolute;inset:0;pointer-events:none;background:
  linear-gradient(to bottom,rgba(8,28,20,.44) 0%,rgba(8,28,20,.10) 32%,
                  rgba(8,28,20,.26) 72%,rgba(8,28,20,.62) 88%,rgba(8,28,20,.97) 100%),
  radial-gradient(112% 76% at 50% 30%,rgba(8,28,20,0) 46%,rgba(8,28,20,.30) 100%)}
.cred-img figcaption{display:none}

.lead-cred{min-width:0}

/* --- her words: the centrepiece, not a caption --------------------------- */
.pquote{margin:0}
.pquote::before{content:"\201C";display:block;font-family:var(--font-display);font-weight:600;
  font-size:clamp(3.1rem,5vw,4.6rem);line-height:.68;color:var(--mint);opacity:.5;
  margin-bottom:clamp(12px,1.5vw,20px)}
.pquote p{font-family:var(--font-display);font-weight:500;
  font-size:clamp(1.38rem,2.5vw,2.05rem);line-height:1.34;letter-spacing:-.022em;
  color:#fff;margin:0;max-width:22ch}
.pquote footer{margin-top:clamp(26px,2.8vw,36px);display:flex;flex-direction:column;gap:8px}
.pquote footer b{font-family:var(--font-display);font-weight:600;font-size:1.08rem;
  letter-spacing:-.015em;color:#fff}
.pquote footer span{font-family:var(--font-mono);font-size:.6rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--mint)}

/* --- credentials: they reinforce the trust, they don't create it ---------- */
.cred-list{list-style:none;display:grid;grid-template-columns:minmax(0,1fr);gap:14px;
  margin-top:clamp(36px,3.8vw,52px)}
.cred-list li{display:flex;align-items:center;min-width:0;
  padding:clamp(18px,1.9vw,22px);border:1px solid var(--line-mint);border-radius:12px;
  background:none;box-shadow:none;text-align:left;
  font-family:var(--font-display);font-weight:500;font-size:clamp(.95rem,1.1vw,1.02rem);
  color:rgba(255,255,255,.92);letter-spacing:-.01em;line-height:1.4;
  transition:border-color .3s ease,background-color .3s ease,transform .3s ease}
@media(min-width:520px){
  .cred-list{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-auto-rows:1fr;gap:16px}
}
@media(hover:hover){
  .cred-list li:hover{border-color:rgba(149,213,179,.62);background:rgba(149,213,179,.05);
    transform:translateY(-2px)}
}

/* --- the rest of the team, at equal weight ------------------------------- */
.team-head{margin-top:clamp(66px,7vw,108px);margin-bottom:clamp(26px,3vw,38px)}
.team-head h3{font-size:clamp(1.14rem,1.7vw,1.38rem);letter-spacing:-.015em;color:#fff;margin:0}
.team2{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(18px,2vw,26px);margin:0}
@media(min-width:760px){.team2{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
.team2 article{display:grid;grid-template-columns:minmax(0,1fr);gap:24px;
  padding:clamp(26px,2.9vw,38px);border-radius:var(--r-lg);border:0;
  background:linear-gradient(168deg,rgba(149,213,179,.06),rgba(255,255,255,.012))}
@media(min-width:520px){
  .team2 article{grid-template-columns:auto minmax(0,1fr);gap:clamp(22px,2.4vw,30px);
    align-items:start}
}
.team2 img{width:clamp(96px,8.4vw,124px);height:clamp(96px,8.4vw,124px);border-radius:50%;
  object-fit:cover;object-position:center top}
.team2 b{display:block;font-family:var(--font-display);font-weight:600;
  font-size:clamp(1.2rem,1.8vw,1.42rem);letter-spacing:-.018em;color:#fff;line-height:1.22;
  margin-bottom:9px}
.team2 em{display:block;font-style:normal;font-family:var(--font-mono);font-size:.62rem;
  letter-spacing:.13em;text-transform:uppercase;color:var(--mint);
  margin-bottom:clamp(20px,2.2vw,26px)}
.spec-label{display:block;font-family:var(--font-mono);font-size:.55rem;letter-spacing:.13em;
  text-transform:uppercase;color:rgba(255,255,255,.4);margin-bottom:12px}
.spec{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0}
.spec li{font-family:var(--font-mono);font-size:.56rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--mint);border:1px solid var(--line-mint);border-radius:100px;padding:7px 13px;
  background:none;line-height:1.3}

/* the substantiation flag sits last so it stays out of the composition */
.cred-note{margin-top:clamp(48px,5vw,74px)}