/* ==========================================================================
   AgeDefy — enhancement layer
   Loads AFTER ro-theme.css. The approved markup and copy are untouched;
   everything here is a token override, a visual upgrade, or additive.
   Remove this one file and the site reverts to the approved build exactly.
   ========================================================================== */

/* -------- 1. Type: modern neutral grotesque -------------------------------
   Archivo for display — a sturdy, wide grotesque with high legibility at every
   size. Neutral rather than characterful, which reads authoritative and medical
   instead of design-led. Manrope carries body copy.                          */
@import url('https://fonts.googleapis.com/css2?family=Archivo:ital,wght@0,400;0,500;0,600;0,700;0,800;1,600;1,700&family=Manrope:wght@400;500;600;700;800&display=swap');

:root{
  --font-head:"Archivo","Helvetica Neue",Arial,sans-serif;
  --font-body:"Manrope",-apple-system,BlinkMacSystemFont,system-ui,sans-serif;

  /* -------- 2. Colour: the approved palette, enriched -------- */
  --cream:#FCFAF6;          /* cleaner paper */
  --cream-2:#F5EEE2;
  --cream-3:#EFE5D4;
  --ink:#131F33;            /* deeper navy for contrast */
  --ink-2:#1E2E47;
  --ink-soft:#43536B;       /* was #4A5A72 — darkened for readability */
  --line:#E6DCC9;

  --accent:#B4542F;         /* terracotta, deepened so it holds on cream */
  --accent-soft:#E9A98C;
  --accent-tint:#FBEDE6;

  /* GLP-1 / weight-loss lane — a fresh clinical green, distinct from the CTA */
  --sage:#2F6F55;
  --sage-soft:#E7F0EA;
  --sage-line:#CFE0D6;

  --green:#16C25C;          /* Start Today — unchanged from approved theme */
  --green-deep:#12A94F;
  --gold:#C9A227;

  --shadow:0 24px 60px -28px rgba(19,31,51,.40);
  --shadow-sm:0 10px 28px -16px rgba(19,31,51,.34);
  --ease:cubic-bezier(.22,.61,.36,1);
}

/* -------- 3. Baseline weight — the single biggest legibility win -------- */
body{
  font-family:var(--font-body);
  font-weight:450;
  letter-spacing:-.003em;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,.display,.split-title,.card-title,.section-head h2{
  font-family:var(--font-head);
  font-weight:700;
  letter-spacing:-.028em;
  text-wrap:balance;
}
.display{font-weight:700;letter-spacing:-.032em}
.hero h1{font-weight:800;letter-spacing:-.036em;line-height:1.04}
/* A sans has no true italic — sloped grotesques read cheap at display size.
   The approved markup keeps its <em>; colour and weight carry the emphasis. */
.hero h1 em,.display em,h2 em{font-style:normal;font-weight:700}
.lede,.card-body,.r-copy,p{font-weight:450}
.eyebrow,.kicker,.card-kicker,.stat-label,.pop-head{
  font-weight:700;letter-spacing:.15em;
}

/* -------- 4. Header: solid, legible, never floating over imagery -------- */
.nav{
  background:rgba(252,250,246,.97);
  backdrop-filter:saturate(160%) blur(14px);
  -webkit-backdrop-filter:saturate(160%) blur(14px);
  border-bottom:1px solid var(--line);
}
.nav-links a{font-weight:600;letter-spacing:.02em}
.nav-links a:hover{color:var(--accent)}

/* Brand lockup.
   logo-mark.png IS the gradient mark now (the file was swapped), so no selector
   trickery is needed — an attribute selector cannot match a data: URI, which is
   why an earlier content:url() override silently did nothing.
   The approved markup hard-codes height via inline style, so !important is the
   only way to resize it without touching that markup. */
/* Spacing taken from agedefy-lockup.png measured directly:
     mark ink 271x220, wordmark ink 313x174, gap between them 2px,
     vertical centres aligned exactly.
   So wordmark height = 0.791 x mark height, and the gap is ~1% of mark height.
   The source PNGs have since been cropped to their ink, so these CSS values
   now equal the visual result — previously logo-mark.png carried 7.5%
   transparent padding on its right edge, which forced the two apart. */
.brand{gap:1px !important; align-items:center !important}
.brand img:first-of-type{height:66px !important; width:auto !important}   /* mark  */
.brand img:last-of-type{height:52px !important; width:auto !important}    /* defy  */
.nav-in{min-height:104px}
.foot-brand .brand img:first-of-type{height:58px !important}
.foot-brand .brand img:last-of-type{height:46px !important}

@media (max-width:900px){
  .brand img:first-of-type{height:54px !important}
  .brand img:last-of-type{height:43px !important}
  .nav-in{min-height:88px}
}
@media (max-width:640px){
  .brand img:first-of-type{height:46px !important}
  .brand img:last-of-type{height:36px !important}
  .nav-in{min-height:76px}
}
}

/* -------- 5. Buttons -------- */
.btn{
  font-family:var(--font-body);font-weight:700;letter-spacing:.04em;
  transition:transform .35s var(--ease),background .35s var(--ease),
             color .35s var(--ease),border-color .35s var(--ease),box-shadow .35s var(--ease);
}
.btn:hover{transform:translateY(-2px)}
.btn-start{
  background:var(--green);border-color:var(--green);color:#062E17;
  box-shadow:0 12px 26px -14px rgba(22,194,92,.75);
}
.btn-start:hover{background:var(--green-deep);border-color:var(--green-deep);color:#04220F}

/* -------- 6. Cards & tiles: lift on hover, warmer surfaces -------- */
.tile,.card{
  border-radius:var(--r-md);
  transition:transform .5s var(--ease),box-shadow .5s var(--ease),border-color .5s var(--ease);
}
.tile:hover,.card:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.tile-img{overflow:hidden}
.tile-img img{transition:transform 1s var(--ease)}
.tile:hover .tile-img img{transform:scale(1.05)}

/* -------- 7. Stats -------- */
.stat-num{font-family:var(--font-head);font-weight:600;font-variant-numeric:tabular-nums}
.stat-label{color:var(--ink-soft)}

/* ==========================================================================
   8. Elegant motion — CSS transitions driven by IntersectionObserver.
   No animation library, so it stays light on phones. Fully reduced-motion safe.
   ========================================================================== */
.rv{opacity:0;transform:translateY(18px);transition:opacity .75s var(--ease),transform .75s var(--ease)}
.rv.in{opacity:1;transform:none}
.rv-1{transition-delay:.08s} .rv-2{transition-delay:.16s} .rv-3{transition-delay:.24s}
.rv-4{transition-delay:.32s} .rv-5{transition-delay:.40s} .rv-6{transition-delay:.48s}
.no-js .rv{opacity:1;transform:none}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;animation-iteration-count:1 !important;
    transition-duration:.01ms !important;scroll-behavior:auto !important;
  }
  .rv{opacity:1 !important;transform:none !important}
  .btn:hover,.tile:hover,.card:hover{transform:none}
}

/* ==========================================================================
   9. Brand GLP-1 for Weight Loss — additive section.
   Nothing in the approved layout is altered; this is inserted after the stats.
   ========================================================================== */
.glp{background:linear-gradient(180deg,var(--sage-soft) 0%,var(--cream) 100%);
  padding:clamp(56px,7vw,104px) 0;border-block:1px solid var(--sage-line)}
.glp-head{max-width:60rem;margin:0 auto clamp(32px,4vw,56px);text-align:center}
.glp-kicker{
  display:inline-flex;align-items:center;gap:8px;
  font-family:var(--font-body);font-size:12px;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:var(--sage);
  background:#fff;border:1px solid var(--sage-line);
  padding:8px 16px;border-radius:var(--r-pill);margin-bottom:20px;
}
.glp-kicker::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--green)}
.glp-head h2{
  font-family:var(--font-head);font-weight:600;
  font-size:clamp(30px,4.4vw,52px);line-height:1.08;color:var(--ink);margin:0 0 16px;
}
.glp-head p{
  font-size:clamp(16px,1.5vw,19px);line-height:1.65;color:var(--ink-soft);
  max-width:62ch;margin:0 auto;
}

.glp-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:24px;
  max-width:var(--wrap);margin:0 auto;padding:0 24px;
}
.glp-card{
  background:#fff;border:1px solid var(--line);border-radius:var(--r-md);
  padding:32px 28px 28px;display:flex;flex-direction:column;
  transition:transform .5s var(--ease),box-shadow .5s var(--ease),border-color .5s var(--ease);
}
.glp-card:hover{transform:translateY(-6px);box-shadow:var(--shadow);border-color:var(--sage-line)}
.glp-shot{
  height:232px;display:flex;align-items:flex-end;justify-content:center;margin-bottom:24px;
}
.glp-shot img{
  max-height:200px;width:auto;object-fit:contain;
  filter:drop-shadow(0 18px 26px rgba(19,31,51,.20));
  transition:transform .7s var(--ease);
}
.glp-card:hover .glp-shot img{transform:translateY(-6px) scale(1.03)}
.glp-brand{
  font-family:var(--font-body);font-size:11px;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:var(--sage);margin-bottom:8px;
}
.glp-card h3{
  font-family:var(--font-head);font-weight:600;font-size:23px;
  line-height:1.2;color:var(--ink);margin:0 0 10px;
}
.glp-card p{font-size:15.5px;line-height:1.6;color:var(--ink-soft);margin:0 0 22px;flex:1}
.glp-card .btn{width:100%;justify-content:center}

.glp-foot{
  max-width:var(--wrap);margin:clamp(32px,4vw,52px) auto 0;padding:0 24px;
  display:flex;flex-wrap:wrap;gap:18px 44px;align-items:center;justify-content:center;
}
.glp-point{
  display:flex;align-items:center;gap:10px;
  font-size:14.5px;font-weight:600;color:var(--ink-2);
}
.glp-point svg{width:19px;height:19px;flex:none;color:var(--sage)}
.glp-legal{
  max-width:78ch;margin:28px auto 0;padding:0 24px;text-align:center;
  font-size:12.5px;line-height:1.7;color:var(--ink-soft);
}

@media (max-width:900px){ .glp-grid{grid-template-columns:1fr;max-width:480px} .glp-shot{height:196px} .glp-shot img{max-height:170px} }
@media (max-width:640px){ .glp-foot{gap:14px 24px} .glp-point{font-size:13.5px} }

/* ==========================================================================
   10. Form usability fixes (carried by the layer, approved markup untouched)
   - iOS Safari zooms the page when a focused input is under 16px. On a
     telehealth intake form that's real friction, so text fields go to 16px.
   - The consent checkbox rendered at 13x13px, well under the 44px touch
     minimum, on the one control a patient must deliberately tick.
   ========================================================================== */
.input,
input[type="text"],input[type="email"],input[type="tel"],
input[type="number"],input[type="date"],input[type="password"],
textarea,select{
  font-family:var(--font-body);
  font-size:16px;
  min-height:48px;
}
textarea{min-height:120px}

input[type="checkbox"],input[type="radio"]{
  width:22px;height:22px;
  flex:none;
  accent-color:var(--sage);
  cursor:pointer;
}
/* Give the control a full-height hit area and make its label tappable too */
.consent{display:flex;align-items:flex-start;gap:12px;min-height:44px}
.consent label,.consent span{cursor:pointer;line-height:1.5}

/* Visible keyboard focus on every field */
.input:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{
  outline:2px solid var(--sage);
  outline-offset:2px;
}

/* ==========================================================================
   11. Mobile navigation fix (pre-existing bug in the approved theme)
   ro-theme.css tries to hide the links on small screens with
       @media (max-width:640px){ .nav-links{display:none} }        (0,1,0)
   but that is outranked by
       .site-nav .nav-links{display:flex}                          (0,2,0)
   Media queries add no specificity, so the links never collapsed: on any phone
   they overflowed the viewport and squeezed the logo down to 12px wide.
   Rather than hide them (the theme ships no menu toggle, which would leave
   mobile with no navigation at all) let the bar wrap onto a second row.
   ========================================================================== */
.site-nav .brand,
.brand{flex:0 0 auto !important; min-width:0}

@media (max-width:900px){
  .site-nav .nav{flex-wrap:wrap !important; row-gap:12px; justify-content:space-between}
  .site-nav .nav-links{
    display:flex !important;
    order:3; width:100%;
    flex-wrap:wrap; justify-content:center;
    gap:10px 20px; margin:0;
  }
  .site-nav .nav-links a{white-space:nowrap}
}

@media (max-width:640px){
  .site-nav .nav{padding-block:10px}
  .site-nav .nav-links{gap:8px 16px; font-size:14.5px}
  .site-nav .btn-start{padding:10px 18px}
}

/* ==========================================================================
   12. Two more responsive gaps in the approved theme
   - .cards keeps a two-column grid at every width, so its cells pushed past
     the viewport edge on phones (About page, cells 02 / 04 / 06).
   - .btn is white-space:nowrap, so a long label ("Schedule your longevity
     consultation") rendered 368px wide inside a 375px screen.
   ========================================================================== */
@media (max-width:640px){
  .cards{grid-template-columns:1fr !important}
  .btn{white-space:normal; text-align:center; max-width:100%; line-height:1.35}
  .btn-lg{padding-inline:20px}
}


/* ==========================================================================
   13. Footer mark: drop the inverting filter.
   The approved markup carries filter:brightness(0) invert(1) on the footer
   mark — correct when logo-mark.png was a flat dark glyph that had to knock
   out white on the navy footer. It is now the gradient "A", and the filter
   flattens that gradient to a solid white silhouette. The gradient reads
   cleanly on the footer's navy, so the filter is simply removed.
   ========================================================================== */
.footer .brand img:first-of-type,
.foot-brand .brand img:first-of-type,
.site-footer .brand img:first-of-type{filter:none !important}

/* ==========================================================================
   14. "No Insurance Required / Rx required" seal on the Zepbound Pens card.
   Violet picks up the Zepbound pen cap rather than introducing an unrelated
   colour. White on #5B3E9B measures 7.6:1, comfortably past AA.
   ========================================================================== */
.glp-shot{position:relative}
.glp-seal{
  position:absolute; top:-6px; right:-4px; z-index:2;
  width:124px; height:124px; border-radius:50%;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:6px; padding:10px;
  background:#5B3E9B; color:#fff; text-align:center;
  box-shadow:0 12px 26px -12px rgba(91,62,155,.75);
  font-family:var(--font-body);
}
.glp-seal-lead{
  font-size:12.5px; font-weight:800; line-height:1.18;
  letter-spacing:.04em; text-transform:uppercase;
}
.glp-seal-rule{width:26px; height:1px; background:rgba(255,255,255,.55)}
.glp-seal-sub{
  font-size:11px; font-weight:600; line-height:1.2;
  letter-spacing:.06em; color:rgba(255,255,255,.94);
}

@media (max-width:900px){
  .glp-seal{width:108px; height:108px; top:-4px; right:0}
  .glp-seal-lead{font-size:11.5px}
  .glp-seal-sub{font-size:10.5px}
}
@media (max-width:640px){
  .glp-seal{width:96px; height:96px}
  .glp-seal-lead{font-size:10.5px; letter-spacing:.03em}
  .glp-seal-rule{width:20px}
  .glp-seal-sub{font-size:9.5px}
}

/* The KwikPen is a single slim pen, far narrower than the paired single-dose
   shot it replaced. Let it run taller so it holds comparable visual weight
   beside the Wegovy pen and the vials. .glp-shot is sized to match these
   heights — images are bottom-aligned, so a shot box shorter than the pen
   pushes the pen up through the card's top border. */
.glp-shot .glp-pen{max-height:232px}
@media (max-width:900px){ .glp-shot .glp-pen{max-height:196px} }
@media (max-width:640px){ .glp-shot .glp-pen{max-height:168px} }

/* ==========================================================================
   15. Sexual health box — sits beside "Popular" in the tiles grid.
   Photo-backed with a scrim strong enough to hold white text at AA.
   ========================================================================== */
.sh-tile{
  position:relative; overflow:hidden; min-width:0;
  border-color:var(--ink); background:var(--ink);
  display:flex; align-items:stretch;
}
.sh-bg{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; z-index:0;
}
.sh-tile::after{
  content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg,rgba(10,17,28,.72) 0%,rgba(10,17,28,.62) 46%,rgba(10,17,28,.76) 100%);
}
.sh-body{position:relative; z-index:2; padding:26px 24px 24px; color:#fff; display:flex; flex-direction:column;
  text-shadow:0 1px 12px rgba(8,14,24,.55)}
.sh-body h3{
  font-family:var(--font-head); font-weight:700; letter-spacing:-.028em;
  font-size:clamp(21px,2.1vw,26px); line-height:1.12; color:#fff; margin:0;
}
.sh-body>p{
  margin:12px 0 0; font-size:14.5px; line-height:1.58;
  color:rgba(255,255,255,.92);
}
.sh-chips{
  list-style:none; margin:16px 0 0; padding:0;
  display:flex; flex-wrap:wrap; gap:7px;
}
.sh-chips li{
  font-size:12.5px; font-weight:600; letter-spacing:.01em;
  padding:7px 13px; border-radius:999px;
  background:rgba(255,255,255,.17); border:1px solid rgba(255,255,255,.28);
  color:#fff; backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px);
}
.sh-cta{margin-top:18px; align-self:flex-start}
.sh-legal{
  margin:14px 0 0; font-size:10.5px; line-height:1.5;
  color:rgba(255,255,255,.72);
}
@media (max-width:640px){
  .sh-body{padding:22px 20px}
  .sh-chips li{font-size:11.5px; padding:6px 11px}
}

/* ==========================================================================
   16. Weight Management — medication grid, qualification, BMI calculator
   ========================================================================== */
.wl-h2{text-align:center;margin:0 0 34px;font-size:clamp(26px,3.4vw,40px)}
.wl-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
@media (max-width:1000px){ .wl-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:640px){ .wl-grid{grid-template-columns:1fr} }

.wl-card{
  display:flex;flex-direction:column;background:var(--white);
  border:1px solid var(--line);border-radius:var(--r-lg);
  padding:26px 24px 24px;min-width:0;
  transition:transform .5s var(--ease),box-shadow .5s var(--ease);
}
.wl-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.wl-card h3{text-align:center;font-size:24px;margin:0 0 12px}
.wl-card>p{margin:0;color:var(--ink-soft);font-size:15px;line-height:1.62}
.wl-badge{
  align-self:flex-start;margin-top:16px;padding:8px 15px;border-radius:var(--r-pill);
  background:var(--sage-soft);color:var(--sage);
  font-size:13px;font-weight:700;line-height:1.3;
}
.wl-badge--warn{background:#FBEDE6;color:#9C4527}
.wl-shot{margin-top:18px;height:190px;display:flex;align-items:center;justify-content:center}
.wl-shot img{max-height:190px;max-width:100%;width:auto;object-fit:contain}
.wl-shot--none{height:56px}
.wl-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:auto;padding-top:20px}
.wl-btn{
  flex:1 1 0;min-width:130px;min-height:52px;
  display:inline-flex;align-items:center;justify-content:center;text-align:center;
  padding:12px 18px;border-radius:var(--r-pill);
  font-family:var(--font-body);font-weight:700;font-size:15px;
  transition:transform .3s var(--ease),background .3s var(--ease);
}
.wl-btn:hover{transform:translateY(-2px)}
.wl-btn--a{background:var(--green);color:#062E17}
.wl-btn--a:hover{background:var(--green-deep);color:#04220F}
.wl-btn--b{background:var(--ink);color:#fff}
.wl-btn--b:hover{background:var(--ink-2)}
.wl-legal{margin:28px 0 0;max-width:none;text-align:left;font-size:11.5px;line-height:1.6;color:var(--ink-soft)}

.wl-why{background:var(--cream-2)}
.wl-why .wrap{max-width:820px;text-align:center}
.wl-why p{margin:0 0 26px;font-size:clamp(17px,2vw,21px);line-height:1.62;color:var(--ink-2);font-weight:500}

.wl-qualify-in{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
@media (max-width:960px){ .wl-qualify-in{grid-template-columns:1fr;gap:32px} }
.wl-criteria h2{font-size:clamp(24px,3vw,34px);margin:0 0 10px}
.wl-sub{margin:0 0 22px;color:var(--ink-soft);font-size:16px}
.wl-list{list-style:none;margin:0;padding:0;display:grid;gap:16px}
.wl-list li{display:flex;gap:13px;align-items:flex-start;font-size:15.5px;line-height:1.55}
.wl-tick{
  flex:none;width:26px;height:26px;border-radius:50%;
  background:var(--sage-soft);color:var(--sage);
  display:inline-flex;align-items:center;justify-content:center;margin-top:1px;
}
.wl-tick svg{width:15px;height:15px}
.wl-note{margin:22px 0 0;font-size:12.5px;color:var(--ink-soft);line-height:1.55}

/* ---- BMI calculator ---- */
.bmi{background:#14495A;border-radius:var(--r-lg);padding:30px 28px;color:#fff}
.bmi-h{text-align:center;color:#fff;margin:0 0 6px;font-size:clamp(24px,3vw,32px)}
.bmi-gauge{position:relative}
.bmi-gauge svg{width:100%;height:auto;display:block}
.bmi-cap{fill:rgba(255,255,255,.82);font-family:var(--font-body);font-size:13px;font-weight:600}
.bmi-val{fill:#7DD3F0;font-family:var(--font-head);font-size:44px;font-weight:700}
#bmiArc{transition:stroke-dashoffset .7s var(--ease),stroke .4s var(--ease)}
.bmi-scale{display:flex;justify-content:space-between;margin-top:-6px;padding:0 4px;
  font-size:11.5px;color:rgba(255,255,255,.6);font-weight:600}
.bmi-key{margin:18px 0 0;display:grid;gap:9px}
.bmi-key>div{display:flex;justify-content:space-between;gap:16px;font-size:14px}
.bmi-key dt{color:rgba(255,255,255,.78);font-weight:600;margin:0}
.bmi-key dd{margin:0;font-weight:700;color:#fff;font-variant-numeric:tabular-nums}
.bmi-form{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:20px}
@media (max-width:420px){ .bmi-form{grid-template-columns:1fr} }
.bmi-field{display:flex;flex-direction:column;gap:6px;min-width:0}
.bmi-field label{font-size:11.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.82)}
.bmi-field input{
  width:100%;min-height:50px;padding:12px 14px;
  border-radius:var(--r-sm);border:1.5px solid rgba(255,255,255,.26);
  background:rgba(255,255,255,.10);color:#fff;
  font-family:var(--font-body);font-size:16px;font-weight:600;
}
.bmi-field input::placeholder{color:rgba(255,255,255,.45);font-weight:400}
.bmi-field input:focus{outline:2px solid #7DD3F0;outline-offset:2px;border-color:transparent}
.bmi-result{margin:18px 0 0;font-size:15.5px;font-weight:600;line-height:1.5;color:#fff;min-height:1.5em}
.bmi-result strong{color:#7DD3F0}
.bmi-note{margin:12px 0 0;font-size:11.5px;line-height:1.55;color:rgba(255,255,255,.72)}
.bmi-cta{margin-top:18px;width:100%;justify-content:center}

/* ==========================================================================
   17. Sexual Health page
   ========================================================================== */
.sx-hero{background:var(--cream-2);text-align:center}
.sx-hero .wrap{max-width:800px}
.sx-hero .display{margin:10px 0 16px}
.sx-hero .lede{margin:0 auto 26px;max-width:56ch}
.sx-hero .hero-actions{justify-content:center}

.sx-plan{padding-bottom:0}
.sx-plan .wrap{max-width:760px;text-align:center}
.sx-plan h2{margin:0 0 12px}

.sx-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
@media (max-width:1000px){ .sx-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:560px){ .sx-grid{grid-template-columns:1fr} }
.sx-head2{margin-top:56px}

.sx-card{
  display:flex;flex-direction:column;min-width:0;
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);
  padding:22px 20px 20px;
  transition:transform .5s var(--ease),box-shadow .5s var(--ease);
}
.sx-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.sx-tag{
  align-self:flex-start;font-size:10.5px;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;color:var(--sage);
  background:var(--sage-soft);border-radius:var(--r-pill);padding:5px 11px;
}
.sx-card h3{margin:14px 0 8px;font-size:20px;line-height:1.2}
.sx-card p{margin:0;color:var(--ink-soft);font-size:14.5px;line-height:1.6;flex:1}
.sx-link{
  margin-top:16px;font-weight:700;font-size:14.5px;color:var(--accent);
  display:inline-flex;align-items:center;gap:6px;min-height:44px;
}
.sx-card:hover .sx-link{color:var(--ink)}

.sx-meds{background:var(--ink);color:#fff;text-align:center}
.sx-meds .wrap{max-width:800px}
.sx-meds h2{color:#fff}
.sx-meds .lede{color:rgba(255,255,255,.9);margin:12px auto 22px;max-width:62ch}
.sx-chips{list-style:none;margin:0 0 26px;padding:0;display:flex;flex-wrap:wrap;gap:9px;justify-content:center}
.sx-chips li{
  font-size:13.5px;font-weight:600;padding:9px 16px;border-radius:var(--r-pill);
  background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.28);color:#fff;
}

.sx-protocols .wrap{max-width:900px;text-align:center}
.sx-proto{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:26px;text-align:left}
@media (max-width:640px){ .sx-proto{grid-template-columns:1fr} }
.sx-proto-card{
  display:block;background:var(--sage-soft);border:1px solid var(--sage-line);
  border-radius:var(--r-md);padding:24px;
  transition:transform .5s var(--ease),box-shadow .5s var(--ease);
}
.sx-proto-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.sx-proto-card h3{margin:0 0 8px;font-size:22px;color:var(--sage)}
.sx-proto-card p{margin:0;color:var(--ink-soft);font-size:14.5px;line-height:1.6}

.sx-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
@media (max-width:800px){ .sx-steps{grid-template-columns:1fr;gap:20px} }
.sx-step{display:flex;gap:14px;align-items:flex-start}
.sx-num{
  flex:none;width:36px;height:36px;border-radius:50%;background:var(--ink);color:#fff;
  display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--font-head);font-weight:700;font-size:16px;
}
.sx-step h4{margin:0 0 6px;font-size:17px}
.sx-step p{margin:0;color:var(--ink-soft);font-size:14.5px;line-height:1.6}

.sx-cta{background:var(--cream-2);text-align:center}
.sx-cta .wrap{max-width:760px}
.sx-cta .hero-actions{justify-content:center}
.sx-legal{margin:26px auto 0;max-width:76ch;font-size:11.5px;line-height:1.6;color:var(--ink-soft)}

/* ==========================================================================
   18. Resources — Weight Loss 101 / Longevity 101
   ========================================================================== */
.rs-hero{background:var(--cream-2);text-align:center}
.rs-hero .wrap{max-width:780px}
.rs-hero .display{margin:10px 0 16px}
.rs-hero .lede{margin:0 auto 24px;max-width:58ch}
.rs-hero .hero-actions{justify-content:center}
.rs-alt{background:var(--cream-2)}
.rs-sub{
  margin:36px 0 18px;font-family:var(--font-body);
  font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);
}
.rs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
@media (max-width:1000px){ .rs-grid{grid-template-columns:repeat(2,1fr)} }
@media (max-width:640px){ .rs-grid{grid-template-columns:1fr} }
.rs-term{
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);
  padding:22px 20px;min-width:0;
  transition:transform .5s var(--ease),box-shadow .5s var(--ease);
}
.rs-alt .rs-term{background:var(--white)}
.rs-term:hover{transform:translateY(-4px);box-shadow:var(--shadow-sm)}
.rs-term h3{margin:0 0 9px;font-size:19px;line-height:1.22}
.rs-term p{margin:0;color:var(--ink-soft);font-size:14.5px;line-height:1.62}

.rs-papers{list-style:none;margin:0;padding:0;display:grid;gap:16px}
.rs-paper{
  background:var(--white);border:1px solid var(--line);border-left:3px solid var(--accent);
  border-radius:var(--r-sm);padding:20px 22px;
}
.rs-meta{
  margin:0 0 6px;font-size:11.5px;font-weight:600;letter-spacing:.06em;
  text-transform:uppercase;color:var(--ink-soft);
}
.rs-paper h4{margin:0 0 8px;font-family:var(--font-head);font-size:18px;font-weight:700;line-height:1.28}
.rs-paper p:last-child{margin:0;color:var(--ink-soft);font-size:14.5px;line-height:1.62}

.rs-cta{background:var(--ink);color:#fff;text-align:center}
.rs-cta .wrap{max-width:720px}
.rs-cta h2{color:#fff}
.rs-cta .lede{color:rgba(255,255,255,.9);margin:12px auto 24px;max-width:56ch}
.rs-legal{margin:26px auto 0;max-width:74ch;font-size:11.5px;line-height:1.6;color:rgba(255,255,255,.72)}

/* ==========================================================================
   19. Nav now carries 12 destinations — it cannot stay a single row.
   Allow a tidy two-line wrap on desktop and tighten the type.
   ========================================================================== */
.nav-links{flex-wrap:wrap;row-gap:2px;column-gap:18px;justify-content:flex-end}
.nav-links a{font-size:.78rem;letter-spacing:.01em}
@media (max-width:1400px){ .nav-links{column-gap:14px} .nav-links a{font-size:.75rem} }

/* ---- Our Doctors ---- */
.dr-intro{max-width:74ch;margin:0 0 16px;color:var(--ink-soft);font-size:16px;line-height:1.68}
.dr-pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:34px}
@media (max-width:1000px){ .dr-pillars{grid-template-columns:repeat(2,1fr)} }
@media (max-width:560px){ .dr-pillars{grid-template-columns:1fr} }
.dr-pillar{background:var(--cream-2);border-radius:var(--r-md);padding:22px 20px}
.dr-pillar h3{margin:0 0 8px;font-size:17px}
.dr-pillar p{margin:0;color:var(--ink-soft);font-size:14px;line-height:1.6}

.dr-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
@media (max-width:900px){ .dr-grid{grid-template-columns:1fr} }
.dr-card{background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);padding:24px;min-width:0}
.dr-head{display:flex;gap:14px;align-items:center}
.dr-mono{
  flex:none;width:52px;height:52px;border-radius:50%;
  background:var(--ink);color:#fff;display:inline-flex;align-items:center;justify-content:center;
  font-family:var(--font-head);font-weight:700;font-size:18px;letter-spacing:.02em;
}
.dr-head h3{margin:0;font-size:19px;line-height:1.24}
.dr-spec{margin:3px 0 0;font-size:11.5px;font-weight:700;letter-spacing:.12em;
  text-transform:uppercase;color:var(--accent)}
.dr-tags{list-style:none;display:flex;flex-wrap:wrap;gap:7px;margin:14px 0 0;padding:0}
.dr-tags li{font-size:11.5px;font-weight:600;padding:5px 11px;border-radius:var(--r-pill);
  background:var(--sage-soft);color:var(--sage)}
.dr-bio{margin:14px 0 0;color:var(--ink-soft);font-size:14.5px;line-height:1.65}
.dr-creds{list-style:none;margin:14px 0 0;padding:14px 0 0;border-top:1px solid var(--line);display:grid;gap:6px}
.dr-creds li{font-size:13px;color:var(--ink-2);padding-left:16px;position:relative}
.dr-creds li::before{content:"";position:absolute;left:0;top:8px;width:6px;height:6px;
  border-radius:50%;background:var(--accent)}

/* ---- State Services ---- */
.st-grid{list-style:none;margin:0;padding:0;display:grid;
  grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px}
.st-grid li{background:var(--white);border:1px solid var(--line);border-radius:var(--r-sm);
  padding:12px 14px;font-size:14.5px;font-weight:600;color:var(--ink-2)}
.st-note{margin:22px 0 0;color:var(--ink-soft);font-size:14px;line-height:1.6;max-width:70ch}
.st-cats{display:grid;grid-template-columns:repeat(5,1fr);gap:20px}
@media (max-width:1200px){ .st-cats{grid-template-columns:repeat(3,1fr)} }
@media (max-width:1000px){ .st-cats{grid-template-columns:repeat(2,1fr)} }
@media (max-width:560px){ .st-cats{grid-template-columns:1fr} }
.st-cat h3{margin:0 0 12px;font-size:16px;font-family:var(--font-body);font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;color:var(--accent)}
.st-cat ul{list-style:none;margin:0;padding:0;display:grid;gap:7px}
.st-cat li{font-size:14.5px;color:var(--ink-soft)}

/* ==========================================================================
   20. Compliance — required disclaimer, product-list note, results disclaimer
   ========================================================================== */
.pop-note{
  margin:12px 0 0;font-size:11.5px;line-height:1.6;
  color:rgba(255,255,255,.78);
}
/* Results disclaimer must sit in the same visual block as the claim it qualifies */
.results-disc{
  margin:12px 0 0;font-size:12px;line-height:1.6;
  color:var(--ink-soft);
  border-left:2px solid var(--line);padding-left:12px;
}
.hero .results-disc,.split-copy .results-disc,[class*="dark"] .results-disc{
  color:rgba(255,255,255,.8);border-left-color:rgba(255,255,255,.3);
}
.press-note{
  max-width:72ch;margin:0 auto;text-align:center;
  font-size:14.5px;line-height:1.65;color:var(--ink-soft);
}

/* Placeholder standing in for imagery the compliance review requires be replaced.
   Body-focused photography frames prescription medication as cosmetic; the review
   asks for clinical or lifestyle images instead (a video visit, a meal, activity,
   a provider reviewing labs). Deliberately obvious so it cannot ship unnoticed. */
.img-pending{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:8px;text-align:center;padding:34px 24px;min-height:220px;height:100%;
  background:repeating-linear-gradient(45deg,var(--cream-2),var(--cream-2) 12px,var(--cream-3) 12px,var(--cream-3) 24px);
  border:1.5px dashed var(--line);border-radius:var(--r-md);color:var(--ink-soft);
}
.img-pending span{font-family:var(--font-body);font-weight:700;font-size:13px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}
.img-pending small{font-size:12.5px;line-height:1.5;max-width:34ch}

/* ==========================================================================
   21. Services mega-menu + working mobile nav
   The approved theme simply hid .nav-links below 1140px, so there was no
   mobile navigation at all. This adds a real one.
   ========================================================================== */
.nav-in{position:relative}
.nav-links{display:flex !important;align-items:center;gap:4px;flex-wrap:nowrap;margin-left:auto}
.nv-item{position:relative}
.nv-top{
  appearance:none;background:transparent;border:0;cursor:pointer;
  display:inline-flex;align-items:center;gap:6px;
  font-family:var(--font-body);font-size:.9rem;font-weight:600;letter-spacing:.01em;
  color:var(--ink-soft);padding:10px 14px;border-radius:var(--r-pill);min-height:44px;
  transition:color .25s var(--ease),background .25s var(--ease);
}
.nv-top:hover,.nv-top[aria-expanded="true"]{color:var(--ink);background:rgba(19,31,51,.06)}
.nv-top--link{text-decoration:none}
.nv-chev{width:15px;height:15px;transition:transform .3s var(--ease)}
.nv-top[aria-expanded="true"] .nv-chev{transform:rotate(180deg)}
.nv-top:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

.nv-panel{
  position:absolute;top:calc(100% + 10px);left:0;z-index:200;
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);
  box-shadow:0 30px 70px -30px rgba(19,31,51,.45);
  padding:12px;min-width:250px;display:grid;gap:2px;
}
.nv-panel[hidden]{display:none}
.nv-panel a{
  display:block;padding:10px 14px;border-radius:var(--r-sm);
  font-size:.92rem;font-weight:500;color:var(--ink-soft);min-height:44px;
  display:flex;align-items:center;transition:background .2s,color .2s;
}
.nv-panel a:hover{background:var(--cream-2);color:var(--ink)}

/* Mega panel — anchored to the bar, not the item */
.nv-panel--mega{
  left:auto;right:0;width:min(1080px,calc(100vw - 48px));padding:26px;
}
.nv-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:22px}
.nv-col{display:grid;gap:2px;align-content:start;min-width:0}
.nv-col-head{
  display:block !important;padding:0 0 10px !important;margin-bottom:6px;
  border-bottom:1px solid var(--line);border-radius:0 !important;min-height:0 !important;
}
.nv-col-head:hover{background:transparent !important}
.nv-col-head strong{
  display:block;font-family:var(--font-head);font-size:15px;font-weight:700;
  color:var(--ink);letter-spacing:-.01em;line-height:1.25;
}
.nv-col-head span{display:block;margin-top:3px;font-size:11.5px;color:var(--ink-soft);line-height:1.4}
.nv-col a:not(.nv-col-head){font-size:13.5px;padding:8px 10px;min-height:40px}

/* Burger — hidden on desktop */
.nv-burger{
  display:none;appearance:none;background:transparent;border:1px solid var(--line);
  width:46px;height:46px;border-radius:var(--r-sm);cursor:pointer;
  flex-direction:column;align-items:center;justify-content:center;gap:5px;margin-left:8px;
}
.nv-burger span{display:block;width:20px;height:2px;background:var(--ink);border-radius:2px;transition:transform .3s,opacity .3s}
.nv-burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nv-burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.nv-burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

@media (max-width:1180px){
  .nv-burger{display:flex}
  .nav-links{
    display:none !important;position:absolute;top:100%;left:0;right:0;z-index:200;
    flex-direction:column;align-items:stretch;gap:2px;
    /* justify-content:flex-end is inherited from the desktop bar, where it
       pushes the links right. Once this is a scrolling column it pushes the
       overflow off the TOP of the box instead, and a scroll container cannot
       reach content above its start edge — so an expanded submenu (Weight
       Management first) became unreachable. Start alignment keeps the overflow
       below, where overflow-y:auto can scroll to it. */
    justify-content:flex-start;
    background:var(--white);border-top:1px solid var(--line);
    box-shadow:0 30px 60px -30px rgba(19,31,51,.4);
    padding:12px;overflow-y:auto;
    /* The drawer hangs from the bottom of the header, which sits 168px down
       while the topbar is still on screen — subtracting a flat 120px left it
       overhanging the fold by ~47px on a short phone. dvh also discounts the
       mobile browser's own toolbar; the vh line above it is the fallback. */
    max-height:calc(100vh - 176px);
    max-height:calc(100dvh - 176px);
    -webkit-overflow-scrolling:touch;overscroll-behavior:contain;
  }
  .nav-links.nv-open{display:flex !important}
  .nv-item{position:static}
  .nv-top{width:100%;justify-content:space-between;font-size:1rem;padding:14px 16px;border-radius:var(--r-sm)}
  .nv-panel,.nv-panel--mega{
    position:static;width:auto;min-width:0;box-shadow:none;border:0;border-radius:0;
    padding:0 0 8px 12px;background:transparent;
  }
  .nv-grid{grid-template-columns:1fr;gap:14px}
  .nv-col-head{padding-top:8px !important}
}

/* Touch targets inside the open mobile menu must clear 44px */
@media (max-width:1180px){
  .nav-links a,
  .nav-links .nv-panel a,
  .nav-links .nv-col a:not(.nv-col-head){
    min-height:46px !important;
    padding:12px 14px !important;
    font-size:.95rem;
  }
  .nv-col-head{min-height:0 !important;padding:10px 0 10px !important}
}

/* The mega panel is far wider than its trigger, so on desktop it anchors to the
   nav bar rather than to the item — otherwise right:0 measures from the item
   and pushes a 1080px panel off-screen. */
@media (min-width:1181px){
  .nv-item--mega{position:static}
  .nv-panel--mega{right:0;left:auto}
}

/* ==========================================================================
   22. Continuous Glucose Monitoring
   ========================================================================== */
.cgm{background:var(--sage-soft)}
.cgm-in{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,.85fr);gap:40px;align-items:start}
@media (max-width:900px){ .cgm-in{grid-template-columns:1fr;gap:28px} }
.cgm-copy h2{margin:10px 0 14px;font-size:clamp(26px,3.2vw,38px)}
.cgm-copy .lede{margin:0 0 22px;max-width:60ch}
.cgm-points{list-style:none;margin:0 0 26px;padding:0;display:grid;gap:13px}
.cgm-points li{display:flex;gap:12px;align-items:flex-start;font-size:15.5px;line-height:1.55}
.cgm-tick{
  flex:none;width:24px;height:24px;border-radius:50%;background:var(--sage);color:#fff;
  display:inline-flex;align-items:center;justify-content:center;margin-top:1px;
}
.cgm-tick svg{width:14px;height:14px}
.cgm-note{margin:18px 0 0;font-size:11.5px;line-height:1.6;color:var(--ink-soft);max-width:62ch}

.cgm-panel{background:var(--white);border:1px solid var(--sage-line);border-radius:var(--r-lg);padding:26px}
.cgm-panel-h{
  margin:0 0 16px;font-family:var(--font-body);font-size:11.5px;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:var(--sage);
}
.cgm-rows{margin:0;display:grid;gap:0}
.cgm-rows>div{display:flex;justify-content:space-between;gap:16px;padding:13px 0;border-bottom:1px solid var(--line)}
.cgm-rows>div:last-child{border-bottom:0}
.cgm-rows dt{margin:0;font-size:14px;color:var(--ink-soft)}
.cgm-rows dd{margin:0;font-size:14.5px;font-weight:700;color:var(--ink)}
.cgm-panel-note{margin:16px 0 0;font-size:13px;line-height:1.6;color:var(--ink-soft)}

/* CGM tile — text-forward, since there is no product photograph for it */
.tile--cgm{
  background:var(--ink);border-color:var(--ink);color:#fff;
  display:flex;align-items:center;min-width:0;
}
.tile--cgm .tile-body{padding:26px 24px}
.tile--cgm h3{color:#fff;margin:10px 0 8px}
.tile--cgm p{color:rgba(255,255,255,.86)}
.tile--cgm .tile-link{color:#8FD9B6}
.tile--cgm:hover .tile-link{color:#fff}
.cgm-badge{
  display:inline-block;font-family:var(--font-body);font-size:10.5px;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;padding:5px 11px;border-radius:var(--r-pill);
  background:var(--sage);color:#fff;
}

/* Home tab — first in the bar, and marked when you are on it */
.nv-top--home[aria-current="page"]{color:var(--ink);background:rgba(19,31,51,.07)}

/* Footer disclaimer spans the full width of the footer.
   The approved theme caps it at max-width:100ch, which renders it about
   two-thirds of the way across; legal text reads better edge to edge here. */
.foot-legal{max-width:none !important}

/* Specialty preparations tile — sits in the grid where the CGM card was */
.tile--spec{
  background:var(--ink);border-color:var(--ink);color:#fff;
  display:flex;align-items:flex-start;min-width:0;padding:0;
}
.tile--spec .tile-body{padding:24px}
.tile--spec .pop-head{color:#fff}
/* "Learn more" link inside the dark product panel */
.pop-more{
  display:inline-block;margin-top:12px;
  font-family:var(--font-body);font-size:13.5px;font-weight:700;
  color:#8FD9B6;
}
.pop-more:hover{color:#fff}

/* The theme sets .tile-body p{flex:1}, which makes the Specialty preparations
   heading stretch to fill the card and pushes its list far below the text.
   The heading should size to its own content. */
.tile--spec .pop-head{flex:none}
.tile--spec .tile-body{justify-content:flex-start}

/* ==========================================================================
   23. Embedded scheduling modal
   Opens the Heally scheduler in an on-page iframe instead of navigating away,
   following the pattern used on trulysteady.com. Falls back to opening in a
   new tab on small/touch screens, and to a plain link if the frame is blocked.
   ========================================================================== */
.sched-modal{
  position:fixed;inset:0;z-index:9999;display:none;
  align-items:center;justify-content:center;padding:24px;
  background:rgba(11,20,32,.72);
  backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);
}
.sched-modal.is-open{display:flex}
body.sched-open{overflow:hidden}
.sched-dialog{
  position:relative;width:min(920px,100%);height:min(760px,calc(100vh - 48px));
  background:var(--white);border-radius:var(--r-lg);overflow:hidden;
  box-shadow:0 40px 100px -30px rgba(0,0,0,.6);display:flex;flex-direction:column;
}
.sched-dialog:focus{outline:none}
.sched-bar{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:14px 18px;border-bottom:1px solid var(--line);background:var(--cream);flex:none;
}
.sched-title{
  margin:0;font-family:var(--font-body);font-size:12px;font-weight:700;
  letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);
}
.sched-close{
  appearance:none;border:1px solid var(--line);background:var(--white);cursor:pointer;
  width:40px;height:40px;border-radius:50%;font-size:20px;line-height:1;color:var(--ink);
  display:inline-flex;align-items:center;justify-content:center;
}
.sched-close:hover{background:var(--cream-2)}
.sched-close:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.sched-body{position:relative;flex:1;min-height:0;background:var(--white)}
.sched-frame{width:100%;height:100%;border:0;display:block}
.sched-load{
  position:absolute;inset:0;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:10px;text-align:center;padding:24px;
  background:var(--white);transition:opacity .3s ease;
}
.sched-body.is-loaded .sched-load{opacity:0;pointer-events:none}
.sched-load[hidden]{display:none !important}
.sched-load strong{font-size:15px;color:var(--ink)}
.sched-load span{font-size:13.5px;color:var(--ink-soft)}
.sched-spin{
  width:30px;height:30px;border-radius:50%;
  border:3px solid var(--line);border-top-color:var(--green);
  animation:sched-spin .9s linear infinite;
}
@keyframes sched-spin{to{transform:rotate(360deg)}}
.sched-fallback{
  margin-top:6px;font-size:13.5px;font-weight:700;color:var(--accent);text-decoration:underline;
}
@media (prefers-reduced-motion:reduce){ .sched-spin{animation:none} }
@media (max-width:680px){
  .sched-modal{padding:0}
  .sched-dialog{width:100%;height:100%;border-radius:0}
}

/* AgeDefy lockup in the scheduling modal header */
.sched-bar{gap:14px}
.sched-brand{display:inline-flex;align-items:center;gap:2px;flex:none}
.sched-brand img{display:block;width:auto}
.sched-brand img:first-child{height:34px}
.sched-brand img:last-child{height:26px}
.sched-title{margin-left:auto;margin-right:auto}
@media (max-width:680px){
  .sched-brand img:first-child{height:28px}
  .sched-brand img:last-child{height:22px}
  .sched-title{display:none}
}

/* The theme caps .disclaimer at 70ch, which leaves it short of the page edge.
   This variant runs the full content width, matching the section above it. */
.disclaimer--wide{max-width:none}

/* ==========================================================================
   24. Vitamin B-12 injections page
   ========================================================================== */
.b12-card{
  background:#5B3E9B;color:#fff;border-radius:var(--r-lg);
  padding:46px 46px 42px;box-shadow:var(--shadow);
}
.b12-eyebrow{
  margin:0 0 14px;font-family:var(--font-body);
  font-size:12px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
  color:var(--accent-soft);
}
.b12-card h2{margin:0 0 16px;color:#fff;font-size:clamp(28px,3.4vw,40px);line-height:1.14}
.b12-card>p{margin:0;max-width:62ch;color:rgba(255,255,255,.87);font-size:17px;line-height:1.62}
.b12-points{list-style:none;margin:28px 0 0;padding:0;display:grid;gap:14px}
.b12-points li{
  position:relative;padding-left:30px;max-width:62ch;
  color:rgba(255,255,255,.9);font-size:15.5px;line-height:1.6;
}
.b12-points li::before{
  content:"";position:absolute;left:0;top:.4em;
  width:13px;height:13px;border-radius:50%;background:var(--accent-soft);
}
.b12-points strong{color:#fff;font-weight:700}
@media (max-width:640px){
  .b12-card{padding:30px 24px 28px;border-radius:var(--r-md)}
}

/* "Who can benefit" — two even columns of long-form copy */
.b12-benefit{display:grid;grid-template-columns:1fr 1fr;gap:40px}
@media (max-width:800px){ .b12-benefit{grid-template-columns:1fr;gap:28px} }
.b12-benefit h3{margin:0 0 10px;font-size:22px;line-height:1.25}
.b12-benefit p{margin:0;color:var(--ink-soft);font-size:15.5px;line-height:1.68}

/* Provider-caution callout — a light card set off from the columns above it */
.b12-note{
  margin-top:44px;background:var(--white);border:1px solid var(--line);
  border-radius:var(--r-lg);padding:34px 38px;box-shadow:var(--shadow-sm);
}
.b12-note h3{margin:0 0 12px;font-size:22px;line-height:1.25}
.b12-note p{margin:0;max-width:86ch;color:var(--ink-soft);font-size:15.5px;line-height:1.68}
.b12-note-cta{display:flex;justify-content:center;margin-top:34px}
@media (max-width:640px){
  .b12-note{padding:26px 22px;border-radius:var(--r-md)}
  .b12-note-cta .btn{width:100%;text-align:center}
}

/* ==========================================================================
   25. Medication panel headings on the homepage
   "Specialty preparations" renders at 15px only because it sits inside a
   .tile-body, where .tile-body p outranks .pop-head. This panel has no
   .tile-body, so its headings stayed at 12px. Set the size here so the two
   adjacent tiles read as the same level of heading by intent, not accident.
   ========================================================================== */
.tile--rx .pop-head{font-size:15px}

/* Green is the "Start Today" green, and it means FDA-approved here — so it
   marks that heading only. The compounded heading below stays neutral;
   compounded preparations are explicitly not FDA-approved products.
   #16C25C on the navy panel measures 7.0:1. */
.tile--rx .pop-head--fda{color:var(--green)}

/* Requested: the GLP-1 section heading in the Start Today green. Note this
   green was picked for white-on-green buttons and for the navy panel, where
   it measures 7:1 — on this pale sage/cream gradient it drops to about 2:1.
   Swap to a deeper green here if that reads too light on screen. */
.glp-head h2{color:var(--green)}

/* B-12 page hero heading in the Start Today green, matching the GLP-1
   heading on the homepage. Same caveat: on the cream ground this measures
   about 2.3:1, so it reads light. */
.b12-title{color:var(--green)}

/* Women's Health legal note runs the full content width instead of sitting in
   the 760px centred column with the CTA above it. It lives in its own .wrap,
   so it also has to opt out of the centring .sx-cta applies to the section. */
.sx-cta .wrap--legal{max-width:var(--wrap)}
.sx-legal--wide{max-width:none;margin-left:0;margin-right:0;text-align:left}

/* "Licensed in all 50 states" in the Start Today green, matching the GLP-1
   and B-12 headings. Same caveat as those: on the cream ground this green
   measures about 2.3:1, so it reads light. */
.st-title{color:var(--green)}

/* ==========================================================================
   26. Disclaimers run the full content width, site-wide
   Every legal note was capped or centre-blocked by its own rule, leaving it
   floating in the middle of a wide page. Each now spans the same measure as
   the content it qualifies. Notes that sit INSIDE a card or panel
   (.sh-legal, .pop-note, .results-disc) are excluded on purpose — their
   width is their container's, and that is correct.
   ========================================================================== */
.disclaimer{max-width:none}            /* approved theme caps this at 70ch */
.st-note{max-width:none}               /* was 70ch */
.glp-legal{max-width:var(--wrap);text-align:left}  /* was 78ch, centred */

/* Resources CTA: same lift as the .sx-cta pages — the note leaves the narrow
   centred column and takes the page's content width. */
.rs-cta .wrap--legal{max-width:var(--wrap)}
.rs-legal--wide{max-width:none;margin-left:0;margin-right:0;text-align:left}

/* "Weight Management Brands:" in the Start Today green, matching the other
   green headings. Same caveat: about 2.3:1 on the cream ground. */
.wl-h2{color:var(--green)}

/* Weight Management hero heading in the violet of the "No Insurance Required"
   seal on the homepage (#5B3E9B, itself picked up from the Zepbound pen cap).
   Unlike the green headings, this one is dark enough for the cream ground —
   it measures 7.7:1, past AAA. */
.wl-title{color:#5B3E9B}

/* CGM heading and its "Learn more" link take the same bright green as the
   FDA-approved heading above them. Green now marks the two FDA-cleared
   offerings in this panel; "Compounded preparations" stays neutral, since
   those are explicitly not FDA-approved products. 7.0:1 on the navy panel. */
.tile--rx .pop-head--cgm{color:var(--green)}
.tile--rx .pop-more{color:var(--green)}
.tile--rx .pop-more:hover{color:#fff}

/* Our Doctors: hero in the seal violet, section heading in the Start Today
   green — matching the treatment used on the Weight Management and B-12 pages. */
.dr-title{color:#5B3E9B}
.dr-h2{color:var(--green)}

/* Resources hero heading in the Start Today green. */
.rs-title{color:var(--green)}

/* BHRT hero heading in the seal violet. */
.bhrt-title{color:#5B3E9B}

/* Reusable colour utilities. The class is doubled so its specificity (0,2,0)
   clears element-scoped theme rules like .split-copy p (0,1,1) — otherwise the
   utility silently loses on body copy. Cheaper than !important, and still
   beaten by anything genuinely more specific. */
.h-green.h-green{color:var(--green)}

/* Companion to .h-green: the seal violet. Both work on body copy as well as
   headings. */
.h-purple.h-purple{color:#5B3E9B}

/* ==========================================================================
   27. GLP-1 program pricing — homepage
   Green (the Start Today green) marks the medication switch and the CTA;
   violet — the "No Insurance Required" seal colour — marks the selected
   billing term and the savings it carries. Two colours, two distinct jobs.
   ========================================================================== */
.pr{padding-top:0}
.pr-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:32px;align-items:start}
@media (max-width:900px){ .pr-grid{grid-template-columns:1fr;gap:24px} }

/* --- medication switch: a real sliding toggle --- */
.pr-progs{
  position:relative;display:flex;padding:5px;
  background:var(--cream-2);border:1px solid var(--line);border-radius:var(--r-pill);
}
.pr-thumb{
  position:absolute;top:5px;bottom:5px;left:5px;width:calc(50% - 5px);
  border-radius:var(--r-pill);background:var(--green);
  transition:transform .34s var(--ease);
}
.pr-progs[data-active="semaglutide"] .pr-thumb{transform:translateX(100%)}
.pr-prog{
  position:relative;z-index:1;flex:1 1 0;min-width:0;
  appearance:none;border:0;background:transparent;cursor:pointer;
  padding:12px 18px;border-radius:var(--r-pill);
  color:var(--ink-soft);
  font-family:var(--font-body);font-size:15px;font-weight:700;line-height:1.2;
  transition:color .34s var(--ease);
}
.pr-prog:hover{color:var(--ink)}
.pr-prog.is-on{color:#062E17}
.pr-prog:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
@media (prefers-reduced-motion:reduce){ .pr-thumb{transition:none} }
@media (max-width:460px){ .pr-prog{padding:12px 8px;font-size:14px} }

/* --- billing term: each card shows its own monthly price --- */
.pr-terms{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:20px}
@media (max-width:560px){ .pr-terms{grid-template-columns:1fr} }
.pr-term{
  appearance:none;cursor:pointer;text-align:center;min-width:0;
  padding:16px 10px 14px;border-radius:14px;
  background:var(--white);border:1.5px solid var(--line);
  font-family:var(--font-body);
  transition:border-color .25s var(--ease),background .25s var(--ease),transform .25s var(--ease);
}
.pr-term:hover{transform:translateY(-2px);border-color:#C9B8E4}
.pr-term strong{
  display:block;font-size:12px;font-weight:800;letter-spacing:.08em;
  text-transform:uppercase;color:var(--ink-soft);line-height:1.2;
}
.pr-term .pr-tprice{
  display:block;margin-top:8px;font-family:var(--font-head);
  font-size:27px;font-weight:800;letter-spacing:-.02em;line-height:1;
  color:var(--ink);font-variant-numeric:tabular-nums;font-style:normal;
}
.pr-term i{
  display:block;margin-top:3px;font-style:normal;
  font-size:11.5px;font-weight:600;color:var(--ink-soft);
}
.pr-term span{display:block;margin-top:8px;font-size:12px;font-weight:600;color:var(--accent)}
.pr-term.is-on{background:#F1EBFA;border-color:#5B3E9B}
.pr-term.is-on strong,.pr-term.is-on .pr-tprice{color:#4A2F84}
.pr-term:focus-visible{outline:2px solid #5B3E9B;outline-offset:2px}

.pr-note{margin:18px 0 0;max-width:60ch;font-size:13.5px;line-height:1.6;color:var(--ink-soft)}

/* --- price card --- */
.pr-card{
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:34px 34px 30px;box-shadow:var(--shadow);
}
@media (max-width:520px){ .pr-card{padding:26px 22px 24px} }
.pr-eyebrow{
  margin:0 0 14px;font-family:var(--font-body);
  font-size:11.5px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);
}
.pr-amount{margin:0;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.pr-amount>span:first-child{
  font-family:var(--font-head);font-size:clamp(46px,6vw,68px);font-weight:800;
  letter-spacing:-.03em;line-height:1;color:var(--ink);font-variant-numeric:tabular-nums;
}
.pr-per{font-family:var(--font-body);font-size:16px;font-weight:700;color:var(--ink-soft)}
.pr-total{margin:12px 0 0;font-size:15.5px;color:var(--ink-soft);font-variant-numeric:tabular-nums}
.pr-save{
  display:inline-block;margin:16px 0 0;padding:8px 15px;border-radius:var(--r-pill);
  background:#F1EBFA;color:#4A2F84;font-size:13.5px;font-weight:700;
  font-variant-numeric:tabular-nums;
}
.pr-save[hidden]{display:none}
.pr-feat{list-style:none;margin:24px 0 0;padding:0;display:grid;gap:12px}
.pr-feat li{position:relative;padding-left:28px;font-size:15.5px;line-height:1.5;color:var(--ink)}
.pr-feat li::before{
  content:"";position:absolute;left:0;top:.28em;width:16px;height:16px;
  background:no-repeat center/16px 16px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235B3E9B' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
}
.pr-cta{
  display:flex;justify-content:center;width:100%;margin-top:26px;
  background:var(--green);border-color:var(--green);color:#062E17;font-weight:700;
}
.pr-cta:hover{background:var(--green-deep);border-color:var(--green-deep);color:#04220F}
.pr-fine{margin:18px 0 0;font-size:12px;line-height:1.6;color:var(--ink-soft)}

/* Services mega-menu: the five column titles in the Start Today green.
   Panel ground is white, where this green measures 2.4:1 — legible at this
   weight but well under the 4.5:1 that small text normally wants. */
.nv-col-head strong{color:var(--green)}

/* ==========================================================================
   28. Advanced Diagnostics — lab panels and the three-step process
   ========================================================================== */
.lab-from{
  margin:16px 0 0;font-family:var(--font-body);font-size:14.5px;font-weight:600;
  color:#5B3E9B;
}
.lab-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
@media (max-width:820px){ .lab-grid{grid-template-columns:1fr} }

.lab-card{
  position:relative;display:flex;flex-direction:column;
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-lg);
  padding:34px 32px 30px;
}
.lab-card--dark{background:#5B3E9B;border-color:#5B3E9B;color:#fff}
.lab-flag{
  position:absolute;top:22px;right:22px;
  padding:6px 13px;border-radius:var(--r-pill);
  background:var(--green);color:#062E17;
  font-family:var(--font-body);font-size:11px;font-weight:800;
  letter-spacing:.1em;text-transform:uppercase;
}
.lab-tier{
  margin:0 0 10px;font-family:var(--font-body);font-size:11.5px;font-weight:800;
  letter-spacing:.14em;text-transform:uppercase;color:var(--accent);
}
.lab-card--dark .lab-tier{color:#D9CBF2}
.lab-card h3{
  margin:0;font-family:var(--font-head);font-size:clamp(24px,2.6vw,30px);
  font-weight:700;letter-spacing:-.02em;line-height:1.15;color:var(--ink);
}
.lab-card--dark h3{color:#fff}
.lab-sub{margin:10px 0 0;font-size:15.5px;line-height:1.6;color:var(--ink-soft)}
.lab-card--dark .lab-sub{color:rgba(255,255,255,.82)}

.lab-list{list-style:none;margin:22px 0 0;padding:0;display:grid;gap:11px;flex:1}
.lab-list li{position:relative;padding-left:28px;font-size:15px;line-height:1.5;color:var(--ink)}
.lab-card--dark .lab-list li{color:rgba(255,255,255,.92)}
.lab-list li::before{
  content:"";position:absolute;left:0;top:.24em;width:17px;height:17px;
  border-radius:50%;border:1.5px solid var(--green);
  background:no-repeat center/9px 9px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2316C25C' stroke-width='4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
}
.lab-price{
  margin:26px 0 0;font-family:var(--font-head);
  font-size:clamp(34px,4vw,44px);font-weight:800;letter-spacing:-.03em;line-height:1;
  color:var(--ink);font-variant-numeric:tabular-nums;
}
.lab-card--dark .lab-price{color:#fff}
.lab-cta{margin-top:22px;width:100%;justify-content:center}
@media (max-width:520px){ .lab-card{padding:26px 22px 24px} .lab-flag{position:static;display:inline-block;margin-bottom:14px} }

/* three-step process */
.lab-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-top:8px;text-align:center}
@media (max-width:820px){ .lab-steps{grid-template-columns:1fr;gap:28px} }
.lab-n{
  display:grid;place-items:center;width:56px;height:56px;margin:0 auto 16px;
  border-radius:50%;border:1px solid var(--line);background:var(--white);
  font-family:var(--font-body);font-size:14px;font-weight:800;
  letter-spacing:.06em;color:var(--ink-soft);font-variant-numeric:tabular-nums;
}
.lab-step h3{
  margin:0 0 10px;font-family:var(--font-head);font-size:22px;font-weight:700;
  letter-spacing:-.015em;line-height:1.2;
}
.lab-step p{margin:0;font-size:15.5px;line-height:1.65;color:var(--ink-soft);max-width:36ch;margin-inline:auto}

/* Essential panel: violet title and a filled violet CTA. The dark violet card
   beside it still carries the emphasis, so these two cards read as a pair
   rather than competing. #5B3E9B is 7.7:1 on white; white on it is 7.1:1. */
.lab-card:not(.lab-card--dark) h3{color:#5B3E9B}
.lab-cta--purple{background:#5B3E9B;border-color:#5B3E9B;color:#fff}
.lab-cta--purple:hover{background:#4A2F84;border-color:#4A2F84;color:#fff}

/* Longevity toolkit list — the eight therapy titles in the Start Today green.
   Scoped to this list: .r-title is shared with five other pages. */
.rows--green .r-title{color:var(--green)}

/* Ingredient grid titles in the Start Today green. Scoped: .cell is shared
   with the About, Peptide Therapy and Skincare pages. */
.cards--green .cell h3{color:var(--green)}

/* State grid: names in the Start Today green. They are links now, so give the
   whole tile a hover state rather than underlining the text. */
.st-grid li{color:var(--green)}
.st-grid li a{
  display:block;color:inherit;text-decoration:none;
  margin:-12px -14px;padding:12px 14px;border-radius:var(--r-sm);
}
.st-grid li:hover{border-color:var(--green)}
.st-grid li a:focus-visible{outline:2px solid var(--green);outline-offset:2px}

/* Our Doctors: names in the seal violet, specialty chips in a brighter light
   green than the muted sage they used. Deep green on the light tint measures
   4.8:1, so the chips stay readable at 11.5px. */
.dr-head h3{color:#5B3E9B}
.dr-tags li{background:#DFF7E8;color:#0B7A38}

/* Long-form copy on a state page — same measure as the site's other body text. */
.st-copy{margin:0 0 18px;font-size:16.5px;line-height:1.7;color:var(--ink-soft);max-width:72ch}
.st-copy:last-child{margin-bottom:0}

/* State page: copy beside a panel of trust cards. */
.st-split{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:start}
@media (max-width:900px){ .st-split{grid-template-columns:1fr;gap:32px} }
.st-split-copy h2{margin:10px 0 20px}
.st-feats{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
@media (max-width:520px){ .st-feats{grid-template-columns:1fr} }
.st-feat{
  background:var(--white);border:1px solid var(--line);border-radius:var(--r-md);
  padding:24px 22px;
}
.st-feat svg{width:26px;height:26px;color:var(--green);display:block;margin-bottom:14px}
.st-feat h3{
  margin:0 0 8px;font-family:var(--font-body);font-size:16px;font-weight:700;
  letter-spacing:-.01em;line-height:1.25;color:var(--ink);
}
.st-feat p{margin:0;font-size:14.5px;line-height:1.55;color:var(--ink-soft)}

/* ==========================================================================
   29. Legal pages — long-form policy text
   ========================================================================== */
.legal{max-width:78ch}
.legal-date{
  margin:18px 0 0;font-family:var(--font-body);font-size:13.5px;font-weight:600;
  color:var(--ink-soft);
}
.legal h2{
  margin:44px 0 14px;font-size:clamp(21px,2.2vw,26px);line-height:1.25;
  scroll-margin-top:90px;
}
.legal h2:first-child{margin-top:0}
.legal-n{font-variant-numeric:tabular-nums;opacity:.55;margin-right:6px}
.legal p{margin:0 0 14px;font-size:16px;line-height:1.72;color:var(--ink-soft)}
.legal p:last-child{margin-bottom:0}
.legal a{color:var(--ink);text-decoration:underline;text-underline-offset:2px}
.legal a:hover{color:#5B3E9B}
.legal-list{list-style:none;margin:0 0 16px;padding:0;display:grid;gap:9px}
.legal-list li{
  position:relative;padding-left:22px;font-size:16px;line-height:1.66;color:var(--ink-soft);
}
.legal-list li::before{
  content:"";position:absolute;left:2px;top:.62em;width:6px;height:6px;
  border-radius:50%;background:var(--green);
}
.legal strong{color:var(--ink);font-weight:700}

/* Legal links above the copyright line in the footer. */
.foot-legal-links{
  display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:26px;
  padding-top:22px;border-top:1px solid rgba(255,255,255,.12);
}
.foot-legal-links a{
  font-size:13.5px;color:rgba(255,255,255,.72);text-decoration:none;
}
.foot-legal-links a:hover{color:#fff}
.foot-legal-links+.foot-bar{margin-top:18px;padding-top:18px}

/* A programme category that is not offered in this state. */
.st-cat--off h3{color:var(--ink-soft)}
.st-unavailable{
  margin:0;font-size:14px;line-height:1.6;color:var(--ink-soft);
  padding:12px 14px;border-radius:var(--r-sm);
  background:var(--cream-2);border:1px dashed var(--line);
}
.st-unavailable strong{color:var(--ink);font-weight:700;display:block;margin-bottom:4px}

/* A short tagline sitting directly under a hero heading. */
.hero-tagline{
  margin:14px 0 0;font-family:var(--font-head);
  font-size:clamp(20px,2.4vw,28px);font-weight:700;letter-spacing:-.02em;line-height:1.2;
}
.hero-tagline+.lede{margin-top:16px}

/* A .split whose figure has been removed: one column, copy at a readable measure
   rather than stretched across the full width. */
.split--solo{grid-template-columns:1fr}
.split--solo .split-copy{max-width:72ch}

/* ==========================================================================
   30. NAD+ benefits card — replaces the removed IV photo in the split's
   right-hand slot. Built in markup rather than as an image so it stays sharp
   at any size and the copy remains searchable and selectable.
   ========================================================================== */
.nadb{
  align-self:start;
  background:linear-gradient(180deg,var(--sage-soft) 0%,var(--white) 100%);
  border:1px solid var(--sage-line);border-radius:var(--r-lg);
  padding:32px 30px 26px;text-align:center;
}
.nadb h3{
  margin:0;font-family:var(--font-head);font-size:clamp(22px,2.4vw,28px);
  font-weight:700;letter-spacing:-.02em;line-height:1.15;color:var(--ink);
  text-wrap:balance;
}
.nadb-sub{
  margin:10px auto 0;max-width:34ch;font-size:15px;line-height:1.55;color:var(--ink-soft);
}
.nadb-grid{
  list-style:none;margin:26px 0 0;padding:0;
  display:grid;grid-template-columns:repeat(3,1fr);gap:22px 16px;
}
.nadb-grid li{display:flex;flex-direction:column;align-items:center;min-width:0}
.nadb-grid li:nth-child(4){grid-column:1/2;justify-self:end;width:100%;max-width:170px}
.nadb-grid li:nth-child(5){grid-column:2/4;justify-self:start;width:100%;max-width:170px}
.nadb-ic{
  display:grid;place-items:center;width:52px;height:52px;margin-bottom:12px;
  border-radius:50%;background:var(--white);border:1px solid var(--sage-line);
  color:var(--green);
}
.nadb-ic svg{width:23px;height:23px}
.nadb-grid strong{
  display:block;font-family:var(--font-body);font-size:14.5px;font-weight:800;
  line-height:1.25;color:var(--ink);
}
.nadb-grid li>span:last-child{
  display:block;margin-top:5px;font-size:13px;line-height:1.5;color:var(--ink-soft);
}
.nadb-note{
  margin:24px 0 0;padding-top:16px;border-top:1px solid var(--sage-line);
  font-size:11.5px;line-height:1.6;color:var(--ink-soft);text-align:left;
}
@media (max-width:520px){
  .nadb{padding:26px 20px 22px}
  .nadb-grid{grid-template-columns:repeat(2,1fr)}
  .nadb-grid li:nth-child(4),.nadb-grid li:nth-child(5){grid-column:auto;justify-self:center}
}

/* Footer now carries an extra link column. The theme's 1.6fr 1fr 1fr 1fr fits
   four children; let the grid size itself so both the 3-column and 2-column
   footer variants stay balanced without a fixed track count. */
.foot-grid{grid-template-columns:1.35fr repeat(4,1fr);gap:32px}
@media (max-width:1100px){ .foot-grid{grid-template-columns:repeat(3,1fr);gap:30px} }
@media (max-width:820px){ .foot-grid{grid-template-columns:1fr 1fr} }
@media (max-width:520px){ .foot-grid{grid-template-columns:1fr} }

/* Provider-network pillar cards — titles in the Start Today green.
   .dr-pillar appears only on our-doctors.html, so this needs no extra scoping. */
.dr-pillar h3{color:var(--green)}

/* Resources: the twelve topic-card titles in the Start Today green.
   .rs-term appears only on resources.html. The "Current research" study
   headings are <h4> and stay navy, so citations remain visually distinct. */
.rs-term h3{color:var(--green)}

/* About: the anti-aging treatment list in the seal violet. Scoped, since
   .list is shared with the BHRT, home, non-surgical and peptide pages. */
.list--purple li{color:#5B3E9B}

/* Weight Management programme steps — titles in the Start Today green.
   Scoped: .step is shared with the BHRT, home, longevity and peptide pages. */
.steps--green .step h4{color:var(--green)}

/* Homepage "How it works" step titles in the seal violet. Scoped, since
   .step is shared with several other pages. */
.steps--purple .step h3,
.steps--purple .step h4{color:#5B3E9B}

/* Peptide Therapy: benefit lists in the Start Today green. Scoped — .list is
   shared with four other pages and .marklist with the BHRT page. */
.list--green li{color:var(--green)}
.marklist--green li{color:var(--green)}

/* Vitamin B-12: candidacy sub-headings in the Start Today green. */
.b12-benefit--green h3{color:var(--green)}

/* NAD+ page: the benefits diagram sits in the right slot of the "energy battery"
   split. onerror in the markup drops the figure if the file is absent, so a
   missing asset leaves a clean one-column split rather than a broken image. */
.nad-figure{margin:0;align-self:start}
.nad-figure img{display:block;width:100%;height:auto;border-radius:var(--r-lg)}