/* ============================================================================
   BLUME v3 — verbatim launch template (2026-09-03)
   Used by the treatment + concern pages rebuilt from the AHPRA-approved live-site
   copy (see automate/scripts/blume_verbatim/). Tokens + rules follow blume-v2.css:
   Outfit, 16px body, cream/ink/sand/gold, hairlines, no radius, no shadows,
   near-zero motion. Mobile first (93% of paid traffic). Loads after blume-nav.css.
   ============================================================================ */
:root {
  --cream: #FDFBF7; --ink: #1D1D1D; --sand: #EDE7E0; --taupe: #676056; --bark: #4A453D; --gold: #C4A87C;
  --line: rgba(29, 29, 29, 0.14); --line-on-dark: rgba(253, 251, 247, 0.18);
  --wrap: 1240px; --col: 68ch;
}
html { scroll-behavior: auto; }
body { margin: 0; background: var(--cream); color: var(--ink); font-family: 'Outfit', 'Helvetica Neue', Arial, sans-serif; font-size: 16px; line-height: 1.6; font-weight: 400; -webkit-font-smoothing: antialiased; }
body.v3 main { display: block; }
.v3 h1, .v3 h2, .v3 h3, .v3 h4 { font-weight: 300; letter-spacing: 0.01em; line-height: 1.15; margin: 0; }
.v3 p { margin: 0 0 1em; }
.v3 p:last-child { margin-bottom: 0; }
.v3 a { color: inherit; }
.v3 img { display: block; max-width: 100%; height: auto; }
.v3-wrap { width: min(100% - 2.5rem, var(--wrap)); margin: 0 auto; }
.v3-eyebrow { font-size: 0.75rem; font-weight: 500; letter-spacing: 0.18em; text-transform: uppercase; color: var(--gold); margin: 0 0 1rem; }
.v3-btn { display: inline-flex; align-items: center; gap: 0.75rem; padding: 0.95rem 1.5rem; background: var(--ink); color: var(--cream); text-decoration: none; font-size: 0.8rem; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; border: 1px solid var(--ink); transition: background 200ms ease, color 200ms ease; }
.v3-btn:hover { background: var(--cream); color: var(--ink); }
.v3-btn--light { background: var(--cream); color: var(--ink); border-color: var(--cream); }
.v3-btn--light:hover { background: transparent; color: var(--cream); }
.v3-btn--ghost { background: transparent; color: var(--ink); }
.v3-btn--ghost:hover { background: var(--ink); color: var(--cream); }

/* ---- Hero: text on a solid panel, never on the photo (legibility) ---------- */
.v3-hero { display: grid; grid-template-columns: 1fr; background: var(--ink); color: var(--cream); }
.v3-hero__media { position: relative; aspect-ratio: 4 / 5; max-height: 62vh; overflow: hidden; background: var(--bark); }
.v3-hero__media img { width: 100%; height: 100%; object-fit: cover; object-position: center 20%; }
.v3-hero__panel { padding: 2.5rem 1.25rem 2.75rem; }
.v3-hero__panel .v3-eyebrow { color: var(--gold); }
.v3-hero h1 { font-size: clamp(2rem, 8vw, 3.4rem); margin: 0 0 1rem; }
.v3-hero__lede { font-size: 1.05rem; line-height: 1.6; color: rgba(253, 251, 247, 0.82); max-width: 40ch; margin: 0 0 1.75rem; }
.v3-hero--noimg { min-height: 0; }
.v3-hero--noimg .v3-hero__panel { padding-top: 7.5rem; }
.v3-crumbs { font-size: 0.75rem; letter-spacing: 0.06em; color: var(--taupe); padding: 1rem 0 0; }
.v3-crumbs a { text-decoration: none; }
.v3-crumbs a:hover { text-decoration: underline; }
.v3-crumbs span { margin: 0 0.5rem; opacity: 0.5; }

/* ---- Sections ------------------------------------------------------------- */
.v3-section { padding: 3.5rem 0; }
.v3-section--sand { background: var(--sand); }
.v3-section--ink { background: var(--ink); color: var(--cream); }
.v3-section h2 { font-size: clamp(1.6rem, 5vw, 2.25rem); margin: 0 0 1.25rem; }
.v3-section h3 { font-size: 1.25rem; font-weight: 400; margin: 0 0 0.5rem; }
.v3-section h4 { font-size: 1.05rem; font-weight: 500; margin: 1.25rem 0 0.4rem; }
.v3-section ul, .v3-section ol { padding-left: 1.2em; margin: 0 0 1em; }
.v3-section li { margin: 0.35em 0; }
.v3-prose { max-width: var(--col); font-size: 1.0625rem; line-height: 1.7; }
.v3-prose--lg { font-size: 1.125rem; }
.v3-rule { width: 40px; height: 1px; background: var(--gold); margin: 0 0 1.5rem; }

/* editorial: heading column + prose column (kills desktop dead space) */
.v3-editorial { display: grid; gap: 1.5rem; }
/* split: portrait photo beside the copy, natural aspect, never a letterbox */
.v3-split { display: grid; gap: 2rem; align-items: start; }
.v3-split__media { aspect-ratio: 4 / 5; overflow: hidden; background: var(--sand); }
.v3-split__media img { width: 100%; height: 100%; object-fit: cover; object-position: center 18%; }
.v3-split__body .v3-cards { margin-top: 1.5rem; }

/* cards */
.v3-cards { display: grid; gap: 1px; }
.v3-card { outline: 1px solid var(--line); }
.v3-card { background: var(--cream); padding: 1.35rem 1.25rem; }
.v3-section--sand .v3-card { background: var(--cream); }
.v3-card h3 { font-size: 1.05rem; font-weight: 500; margin: 0 0 0.45rem; }
.v3-card p { font-size: 0.97rem; line-height: 1.6; color: var(--bark); }
.v3-card ul { margin: 0.4rem 0 0; padding-left: 1.1em; font-size: 0.97rem; color: var(--bark); }
.v3-cards--steps .v3-card { position: relative; padding-top: 1.5rem; }
.v3-cards--steps .v3-card::before { content: counter(step, decimal-leading-zero); counter-increment: step; display: block; font-size: 0.7rem; letter-spacing: 0.16em; color: var(--gold); margin-bottom: 0.6rem; }
.v3-cards--steps { counter-reset: step; }

/* spacing after a card grid, and readable line-broken paragraphs from the old editor */
.v3-cards + .v3-prose, .v3-cards + h3, .v3-prose + .v3-cards, h3 + .v3-cards { margin-top: 1.5rem; }
.v3-prose br { display: block; content: ''; margin-top: 0.55em; }
.v3-section h3 + .v3-prose { margin-top: 0.25rem; }
/* solid header on v3 pages: the hero photo can be light, so the nav never goes transparent */
body.v3 .nav { background: rgba(29, 29, 29, 0.92); }
/* hub tiles (treatments / concerns) */
.v3-tiles { display: grid; gap: 1px; }
.v3-tile { outline: 1px solid var(--line); }
.v3-tile { display: block; background: var(--cream); padding: 1.5rem 1.35rem; text-decoration: none; color: inherit; }
a.v3-tile:hover { background: var(--sand); }
.v3-tile h3 { font-size: 1.15rem; font-weight: 400; margin: 0 0 0.5rem; }
.v3-tile p { font-size: 0.97rem; color: var(--bark); margin: 0; }
.v3-tile__more { display: inline-block; margin-top: 0.9rem; font-size: 0.72rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--ink); border-bottom: 1px solid var(--gold); padding-bottom: 2px; }
.v3-group { margin: 0 0 2.5rem; }
.v3-group:last-child { margin-bottom: 0; }
.v3-group__head { display: grid; gap: 1rem; margin: 0 0 1.25rem; }

/* FAQ */
.v3-faq { max-width: 820px; }
.v3-faq details { border-top: 1px solid var(--line); }
.v3-faq details:last-of-type { border-bottom: 1px solid var(--line); }
.v3-faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; gap: 1rem; align-items: baseline; padding: 1.1rem 0; font-size: 1.05rem; font-weight: 400; }
.v3-faq summary::-webkit-details-marker { display: none; }
.v3-faq summary::after { content: '+'; color: var(--gold); font-size: 1.25rem; flex: 0 0 auto; }
.v3-faq details[open] summary::after { content: '\2212'; }
.v3-faq .v3-faq__a { padding: 0 0 1.25rem; color: var(--bark); max-width: 68ch; }
/* fine print, not a callout: small, quiet, ruled off with one hairline. No side bar, no indent (design-rules.md) */
.v3-disclaimer { max-width: none; font-size: 0.85rem; line-height: 1.65; color: var(--taupe); border-top: 1px solid var(--line); padding-top: 1.25rem; margin-top: 3rem; }

/* CTA band */
.v3-cta { text-align: left; }
.v3-cta h2 { max-width: 20ch; }
.v3-cta p { max-width: 48ch; color: rgba(253, 251, 247, 0.8); margin-bottom: 1.75rem; }
.v3-cta .v3-btns { display: flex; flex-wrap: wrap; gap: 0.75rem; }

/* related */
.v3-related { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.v3-related a { font-size: 0.78rem; letter-spacing: 0.1em; text-transform: uppercase; text-decoration: none; padding: 0.6rem 0.9rem; border: 1px solid var(--line); }
.v3-related a:hover { background: var(--ink); color: var(--cream); border-color: var(--ink); }


/* ---- Footer rules lifted from the per-page inline CSS (chin-filler-perth, 2026-09-03) ---- */
.footer {background: #F5F0EB; padding: 3rem clamp(2rem, 5vw, 4.5rem) 2.5rem;}
.footer__columns {display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 3rem; margin-bottom: 3rem;}
.footer__col-heading {font-size: 13.5px; font-weight: 700; letter-spacing: 1px; margin-bottom: 1rem; color: #2b2b2b;}
.footer__col-text {font-size: 14px; font-weight: 300; line-height: 1.68; color: #2b2b2b;}
.footer__col-text a {color: #1D1D1D; text-decoration: none;}
.footer__col-cta-text {font-size: 14px; line-height: 1.68; color: #2b2b2b; margin-bottom: 1.5rem; max-width: 320px;}
.footer__book-btn {display: inline-flex; align-items: center; gap: 0.75rem; font-size: 13px; font-weight: 500; letter-spacing: 0.1em; text-transform: uppercase; color: #1D1D1D; border: 1.5px solid #1D1D1D; border-radius: 100px; padding: 0.75rem 1.75rem; text-decoration: none;}
.footer__divider {width: 100%; height: 1px; background: rgba(29,29,29,0.12); margin-bottom: 1.5rem;}
.footer__bottom {display: flex; justify-content: space-between; gap: 2rem; flex-wrap: wrap;}
.footer__bottom-links {display: flex; gap: 1.5rem; flex-wrap: wrap;}
.footer__bottom-links a {font-size: 0.6875rem; color: #1D1D1D; opacity: 0.5; text-decoration: none;}
.footer__trust {font-size: 0.6875rem; color: #1D1D1D; opacity: 0.4;}
.footer__social {display: flex; gap: 1.25rem;}
.footer__social a {font-size: 0.6875rem; color: #1D1D1D; opacity: 0.5; text-decoration: none;}
/* (2026-09-21) two mobile footer rules sat here outside their media query and collapsed the footer to one column at every width; the query below already covers mobile */
@media (max-width: 768px) { .footer__columns { grid-template-columns: 1fr; gap: 2rem; } .footer__bottom { flex-direction: column; gap: 1rem; } }

/* fix: hero light button must not inherit the panel colour */
.v3 .v3-btn--light { color: var(--ink); }
.v3 .v3-btn--light:hover { color: var(--cream); }

/* floating booking button: make sure its label is visible whatever the page-level vars */
body.v3 .booking-cta { color: #FDFBF7; background: #1D1D1D; }

/* reserve room for the fixed booking button so it never covers the last lines */
body.v3 { padding-bottom: 0; }
body.v3 main > *:last-child { padding-bottom: calc(3.5rem + 64px); }

/* ---- Tablet / desktop ------------------------------------------------------ */
@media (min-width: 760px) {
  .v3-cards { grid-template-columns: repeat(2, 1fr); }
  .v3-tiles { grid-template-columns: repeat(2, 1fr); }
  .v3-hero__panel { padding: 3rem 2.5rem; }
}
@media (min-width: 1024px) {
  .v3-section { padding: 5.5rem 0; }
  .v3-hero { grid-template-columns: 5fr 6fr; min-height: 78vh; }
  .v3-hero__media { aspect-ratio: auto; max-height: none; height: 100%; order: 2; }
  .v3-hero__panel { order: 1; display: flex; flex-direction: column; justify-content: center; padding: 8rem 4rem 4rem clamp(2rem, 5vw, 5rem); }
  .v3-hero h1 { font-size: clamp(2.75rem, 3.8vw, 3.75rem); }
  .v3-hero--noimg .v3-hero__panel { padding: 9rem clamp(2rem, 5vw, 5rem) 5rem; min-height: 0; }
  .v3-editorial { grid-template-columns: 5fr 7fr; gap: 4rem; }
  .v3-editorial > h2 { position: sticky; top: 6rem; }
  .v3-split { grid-template-columns: 5fr 7fr; gap: 4rem; }
  .v3-split--flip .v3-split__media { order: 2; }
  .v3-split__media { position: sticky; top: 6rem; }
  .v3-cards { grid-template-columns: repeat(2, 1fr); }
  .v3-cards--3 { grid-template-columns: repeat(3, 1fr); }
  .v3-split__body .v3-cards { grid-template-columns: repeat(2, 1fr); }
  .v3-tiles { grid-template-columns: repeat(3, 1fr); }
  .v3-group__head { grid-template-columns: 5fr 7fr; gap: 4rem; align-items: end; }
  .v3-cta { display: grid; grid-template-columns: 7fr 5fr; gap: 4rem; align-items: center; }
  .v3-cta .v3-btns { justify-content: flex-end; }
}
@media (min-width: 1440px) {
  .v3-hero { grid-template-columns: 1fr 1fr; }
}

/* ---- Hero, overlay variant (John 2026-09-21, treatments hub): full image, title on a scrim, no text panel ---- */
.v3-hero.v3-hero--overlay { display: block; position: relative; min-height: 0; }
.v3-hero--overlay .v3-hero__media { width: 100%; height: auto; aspect-ratio: 4 / 5; max-height: 78vh; }
.v3-hero--overlay .v3-hero__media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(rgba(29, 29, 29, 0.5), rgba(29, 29, 29, 0.38) 45%, rgba(29, 29, 29, 0.62)); }
.v3-hero__overlay { position: absolute; inset: 0; z-index: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; padding: 5.5rem 1.25rem 1.5rem; }
.v3-hero--overlay h1 { margin: 0; }
.v3-hero__overlay .v3-eyebrow { color: var(--cream); margin: 0 0 1rem; }
.v3-hero__overlay h1 + .v3-eyebrow { margin: 1rem 0 0; }
@media (min-width: 1024px) {
  .v3-hero.v3-hero--overlay .v3-hero__media { aspect-ratio: auto; height: 72vh; min-height: 480px; max-height: none; }
  .v3-hero--overlay .v3-hero__media img { object-position: var(--hero-pos, center 58%); }   /* wide crop: keep the wall sign out from under the title */
}

/* ---- Hub buttons + card actions (John 2026-09-21: hubs carry the old site's own buttons) ---- */
.v3-btns { display: flex; flex-wrap: wrap; gap: 0.75rem; margin-top: 1.75rem; }
/* same trap as the light button above: `.v3 a { color: inherit }` outranks .v3-btn, leaving dark text on the dark button */
.v3 .v3-btns > .v3-btn:not(.v3-btn--light):not(.v3-btn--ghost) { color: var(--cream); }
.v3 .v3-btns > .v3-btn:not(.v3-btn--light):not(.v3-btn--ghost):hover { color: var(--ink); }
.v3 .v3-btns > .v3-btn--ghost { color: var(--ink); }
.v3 .v3-btns > .v3-btn--ghost:hover { color: var(--cream); }
.v3-tiles + .v3-btns { margin-top: 2rem; }
.v3-tile h3 a { color: inherit; text-decoration: none; }
.v3-tile h3 a:hover { text-decoration: underline; text-underline-offset: 4px; }
.v3-tile__actions { display: flex; flex-wrap: wrap; gap: 0.4rem 1.5rem; }
a.v3-tile__more { text-decoration: none; }
a.v3-tile__more:hover { border-bottom-color: var(--ink); }
.v3-disclaimer h2 { font-size: 1rem; font-weight: 500; letter-spacing: 0.04em; margin: 0 0 0.4rem; color: var(--bark); }

/* ---- Hub mosaic: image cells inside the card grid (John 2026-09-21). Rows are sized by the cards; the image only fills its cell. ---- */
.v3-tiles--mosaic { grid-auto-flow: row dense; }
.v3-tile--img { position: relative; margin: 0; padding: 0; overflow: hidden; background: var(--bark); aspect-ratio: 4 / 5; }   /* portrait: these are photos of people, keep faces in frame */
.v3-tile--img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 28%; display: block; }
@media (min-width: 760px) {
  .v3-tile--img { aspect-ratio: auto; min-height: 17rem; }
  .v3-tile--m1 { grid-row: span 2; }   /* tablet: 11 cards + 2 + 1 = 14 cells, an even 2-column grid */
  .v3-tile--m2 { min-height: 30rem; }
}
@media (min-width: 1024px) {   /* John's desktop placement: left column rows 2-3, right column rows 4-5 */
  .v3-tile--m1 { grid-column: 1; grid-row: 2 / span 2; }
  .v3-tile--m2 { grid-column: 3; grid-row: 4 / span 2; min-height: 17rem; }
}

/* ---- v4 treatment-page template (John 2026-09-21): overlay hero + desktop scale. Scoped to <body class='v3 v4'>. ---- */
.v4 .v3-hero__overlay .v3-eyebrow { max-width: 52ch; line-height: 1.7; }
.v4 .v3-hero__overlay h1 { max-width: 20ch; }
.v4 .v3-hero__overlay .v3-btns { justify-content: center; margin-top: 2rem; }
.v4 .v3-cards > .v3-card:only-child { grid-column: 1 / -1; background: var(--sand); padding: 2rem 1.5rem; }
.v4 .v3-section--sand .v3-cards > .v3-card:only-child { background: var(--cream); }
.v4 .v3-editorial h3 { margin-top: 1.75rem; padding-top: 1.5rem; border-top: 1px solid var(--line); }
.v4 .v3-editorial h3:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
.v4 .v3-disclaimer h2 { font-size: 1rem; }
@media (min-width: 1024px) {
  .v4 .v3-section { padding: 6.5rem 0; }
  .v4 .v3-section h2 { font-size: clamp(2.1rem, 2.7vw, 2.85rem); line-height: 1.12; }
  .v4 .v3-prose { font-size: 1.15rem; line-height: 1.75; }
  .v4 .v3-card { padding: 2rem 1.85rem; }
  .v4 .v3-card h3 { font-size: 1.3rem; font-weight: 400; margin-bottom: 0.7rem; }
  .v4 .v3-card p { font-size: 1.04rem; line-height: 1.7; }
  .v4 .v3-cards > .v3-card:only-child { padding: 2.75rem 3rem; }
  .v4 .v3-cards > .v3-card:only-child h3 { font-size: 1.6rem; }
  .v4 .v3-faq { max-width: none; }
  .v4 .v3-faq summary { font-size: 1.2rem; padding: 1.5rem 0; }
  .v4 .v3-faq .v3-faq__a { font-size: 1.08rem; line-height: 1.75; }
  .v4 .v3-split { grid-template-columns: 5fr 7fr; gap: 5rem; align-items: center; }
  .v4 .v3-split__media { position: static; aspect-ratio: 4 / 5; }
  .v4 .v3-btns { margin-top: 2.5rem; }
}

/* ---- v4 refinements (pass 2): topic rows, the lone 'who is it for' panel, disclaimer heading ---- */
.v4 .v3-section .v3-disclaimer h2 { font-size: 1rem; font-weight: 500; letter-spacing: 0.04em; line-height: 1.3; margin: 0 0 0.4rem; color: var(--bark); }
.v4 .v3-prose h4 { font-size: 1.2rem; font-weight: 400; margin: 0 0 0.45rem; }
.v4 .v3-editorial .v3-prose + .v3-prose { margin-top: 1.6rem; padding-top: 1.6rem; border-top: 1px solid var(--line); }
.v4 .v3-card h5 { font-size: 0.78rem; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; color: var(--taupe); margin: 0 0 0.9rem; }
.v4 .v3-cards + .v3-prose { margin-top: 2rem; }
@media (min-width: 1024px) {
  .v4 .v3-prose h4 { font-size: 1.45rem; margin-bottom: 0.6rem; }
  .v4 .v3-editorial .v3-prose + .v3-prose { margin-top: 2.25rem; padding-top: 2.25rem; }
  .v4 .v3-cards > .v3-card:only-child { display: grid; grid-template-columns: 5fr 7fr; column-gap: 4rem; align-items: start; }
  .v4 .v3-cards > .v3-card:only-child h3 { grid-column: 1; grid-row: 1 / span 3; margin: 0; }
  .v4 .v3-cards > .v3-card:only-child > :not(h3) { grid-column: 2; }
  .v4 .v3-cards > .v3-card:only-child p { font-size: 1.12rem; }
  .v4 .v3-hero--overlay .v3-hero__media { height: 76vh; }
}

/* ---- v4 pass 3 (John 2026-09-21): one shared desktop grid, phone hero = headline only ---- */
@media (max-width: 759px) {
  .v4 .v3-hero__overlay .v3-eyebrow { display: none; }   /* phone: too many words over the image; the H1 carries it */
}
@media (min-width: 1024px) {
  .v4 { --v4-col: calc((100% - 4rem) * 5 / 12 + 4rem); }   /* left edge of the right-hand (7fr) column */
  .v4 .v3-split { gap: 4rem; align-items: start; }          /* was 5rem: put the split on the same line as the editorial grid */
  .v4 .v3-wrap > .v3-btns { margin-left: var(--v4-col); }   /* buttons sit under the content, not under the heading */
  .v4 .v3-cards + .v3-prose { margin-left: var(--v4-col); }
  /* the lone 'who is it for' card: no box, same two columns as the rows above it */
  .v4 .v3-cards > .v3-card:only-child, .v4 .v3-section--sand .v3-cards > .v3-card:only-child { background: transparent; outline: 0; padding: 2.25rem 0 0; border-top: 1px solid var(--line); grid-template-columns: 5fr 7fr; column-gap: 4rem; }
  .v4 .v3-cards > .v3-card:only-child h3 { font-size: clamp(1.6rem, 2vw, 2rem); font-weight: 300; line-height: 1.2; }
  .v4 .v3-faq details:first-of-type { border-top: 0; }
  .v4 .v3-faq details:first-of-type summary { padding-top: 0.35rem; }   /* first question lines up with the section heading */
}

/* ---- v4 pass 4: design-rules.md applied. Structure from type, space and hairlines; no boxes, bars, tints or labels. ---- */
.v4-subline { font-size: 1.05rem; font-weight: 300; line-height: 1.55; letter-spacing: 0.01em; max-width: 46ch; margin: 1.1rem auto 0; color: rgba(253, 251, 247, 0.92); }
@media (max-width: 759px) { .v4-subline { display: none; } }   /* phone hero = headline + button */
/* sections: one cream page, whitespace + a wrap-width hairline between sections (no alternating tint) */
.v4 .v3-section, .v4 .v3-section--sand { background: transparent; padding-top: 0; padding-bottom: 0; }
.v4 .v3-section > .v3-wrap { padding: 3.75rem 0; }
.v4 .v3-section + .v3-section > .v3-wrap { border-top: 1px solid var(--line); }
/* lists of items are a ledger on the grid, not a wall of boxes */
.v4 .v3-cards { gap: 0 3rem; }
.v4 .v3-cards > .v3-card, .v4 .v3-cards > .v3-card:only-child, .v4 .v3-section--sand .v3-cards > .v3-card, .v4 .v3-section--sand .v3-cards > .v3-card:only-child { background: transparent; outline: 0; padding: 1.5rem 0 1.6rem; border-top: 1px solid var(--line); }
.v4 .v3-split__body .v3-cards { margin-top: 2rem; }
.v4 .v3-card h5 { font-size: 1rem; font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--ink); margin: 0 0 0.6rem; }
/* short FAQ as plain running Q&A */
.v4-qa__item { padding: 1.5rem 0 1.6rem; border-top: 1px solid var(--line); }
.v4-qa__item:first-child { border-top: 0; padding-top: 0; }
.v4 .v4-qa__item h3 { font-size: 1.15rem; font-weight: 400; margin: 0 0 0.5rem; padding: 0; border: 0; }
.v4-qa__a { color: var(--bark); max-width: 68ch; font-size: 1.02rem; line-height: 1.7; }
.v4 .v3-section .v3-disclaimer h2 { font-size: 0.85rem; font-weight: 500; letter-spacing: 0; color: var(--taupe); margin: 0 0 0.35rem; }
@media (min-width: 1024px) {
  .v4 .v3-section, .v4 .v3-section--sand { padding-top: 0; padding-bottom: 0; }
  .v4 .v3-section > .v3-wrap { padding: 6.5rem 0; }
  .v4 .v3-cards { gap: 0 4rem; }
  .v4 .v3-cards > .v3-card, .v4 .v3-section--sand .v3-cards > .v3-card { padding: 1.9rem 0 2rem; }
  .v4 .v3-cards > .v3-card:only-child, .v4 .v3-section--sand .v3-cards > .v3-card:only-child { padding: 2.25rem 0 0; }
  .v4 .v4-qa__item h3 { font-size: 1.3rem; }
  .v4-qa__a { font-size: 1.1rem; line-height: 1.75; }
  .v4-subline { font-size: 1.2rem; }
}

/* ---- v4 pass 5: polish ---- */
.v4 .v3-cards > .v3-card:only-child h3 { font-size: 1.4rem; font-weight: 300; line-height: 1.2; margin: 0 0 0.9rem; }   /* a lone item is a sub-section, its heading reads as one */
.v4 .v3-hero__overlay .v4-subline { margin: 1.25rem auto 0; }   /* `.v3 p` outranks a bare .v4-subline margin */
@media (min-width: 1024px) { .v4 .v3-hero__overlay .v4-subline { max-width: 64ch; margin-top: 1.6rem; text-wrap: balance; } }

/* ---- v4 pass 6 (rollout review): flipped image rows keep a readable text column; stacked content stays on the grid ---- */
@media (min-width: 1024px) {
  .v4 .v3-split--flip { grid-template-columns: 7fr 5fr; }                       /* text keeps the wide column, image takes the narrow one */
  .v4 .v3-wrap:has(> .v3-split--flip) > .v3-btns { margin-left: 0; }            /* button follows its text to the left line */
  .v4 .v3-editorial > div > div[style] { margin-top: 0; }
}
.v4 .v3-hero--overlay .v3-hero__media::after { background: linear-gradient(rgba(29, 29, 29, 0.42), rgba(29, 29, 29, 0.3) 45%, rgba(29, 29, 29, 0.5)); }   /* lighter scrim: the photo must still read as a photo */

/* ---- v4 pass 7: every card ledger lives in the content column, so the full-width special cases are retired ---- */
@media (min-width: 1024px) {
  .v4 .v3-cards + .v3-prose { margin-left: 0; }
  .v4 .v3-cards > .v3-card:only-child, .v4 .v3-section--sand .v3-cards > .v3-card:only-child { display: block; padding: 2rem 0 0; }
  .v4 .v3-cards > .v3-card:only-child h3 { margin: 0 0 0.9rem; font-size: 1.6rem; }
  .v4 .v3-editorial .v3-cards { margin-top: 0.5rem; }
  .v4 .v3-editorial .v3-prose + .v3-cards, .v4 .v3-editorial h3 + .v3-cards { margin-top: 2rem; }
}

/* ---- v4 pass 8 (John's review): uniform index list, accordion FAQ in the v4 voice ---- */
.v4 .v3-section ul.v4-index { list-style: none; padding: 0; margin: 1.75rem 0 0; display: grid; grid-template-columns: 1fr; column-gap: 3rem; border-top: 1px solid var(--line); }
.v4 .v3-section ul.v4-index li { margin: 0; padding: 0.95rem 0; border-bottom: 1px solid var(--line); font-size: 1.05rem; font-weight: 400; line-height: 1.35; color: var(--ink); }
.v4 ul.v4-index a { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; color: inherit; text-decoration: none; }
.v4 ul.v4-index a::after { content: '\2192'; color: var(--taupe); font-size: 0.95em; }
.v4 ul.v4-index a:hover { text-decoration: underline; text-underline-offset: 4px; }
@media (min-width: 600px) { .v4 .v3-section ul.v4-index { grid-template-columns: 1fr 1fr; } }
.v4 .v3-faq summary::after { color: var(--ink); font-weight: 300; }
.v4 .v3-faq details:first-of-type { border-top: 1px solid var(--line); }
@media (min-width: 1024px) {
  .v4 .v3-section ul.v4-index li { font-size: 1.12rem; padding: 1.05rem 0; }
  .v4 .v3-faq details:first-of-type { border-top: 1px solid var(--line); }
  .v4 .v3-faq details:first-of-type summary { padding-top: 1.5rem; }
}

/* ==== v4 pass 9 (design review round 1, 2026-09-21). One type scale with real steps, one spine, readable measures. ==== */
/* -- type scale: phone first. Roles: h2 section / h3 sub-head / item title / body / secondary / fine print -- */
.v4 .v3-section h2 { font-size: 1.7rem; line-height: 1.18; margin: 0 0 1.5rem; text-wrap: balance; }
.v4 .v3-section h3 { font-size: 1.25rem; font-weight: 500; line-height: 1.3; margin: 0 0 0.75rem; }
.v4 .v3-prose, .v4 .v3-prose--lg { font-size: 1.0625rem; line-height: 1.7; }
.v4 .v3-prose h4 { font-size: 1.25rem; font-weight: 500; line-height: 1.3; margin: 0 0 0.6rem; }
.v4 .v3-card h3 { font-size: 1.1875rem; font-weight: 500; line-height: 1.3; margin: 0 0 0.75rem; }
.v4 .v3-card p, .v4 .v3-card ul, .v4 .v3-card li, .v4 .v3-section li { font-size: 1.03rem; line-height: 1.7; color: var(--bark); }
.v4 .v3-faq summary { font-size: 1.125rem; font-weight: 500; line-height: 1.35; }
.v4 .v3-faq .v3-faq__a { font-size: 1.03rem; line-height: 1.7; max-width: 62ch; }
.v4 .v3-section .v3-disclaimer { max-width: 62ch; font-size: 0.875rem; }
.v4 .v3-hero--overlay h1 { text-wrap: balance; }
.v3-hero--overlay h1 { text-wrap: balance; }
/* -- no decorative step numbers (gold 11px on cream, and most groups were not sequences) -- */
.v4 .v3-cards--steps .v3-card::before { content: none; }
.v4 .v3-cards--steps .v3-card { padding-top: 1.5rem; }
/* -- ledger: one item per row at a readable measure; never two 38-character columns -- */
.v4 .v3-cards, .v4 .v3-split__body .v3-cards { grid-template-columns: 1fr; gap: 0; }
/* -- FAQ: one hairline between the last question and the fine print, not two -- */
.v4 .v3-faq details:last-of-type { border-bottom: 0; }
/* -- index list: rows without a page read as intentional, not broken -- */
.v4 .v3-section ul.v4-index li { color: var(--taupe); }
.v4 .v3-section ul.v4-index li a { color: var(--ink); }
/* -- hero: title sits low so faces stay clear above it; scrim is strongest where the words are -- */
.v4 .v3-hero__overlay { justify-content: flex-end; padding: 5.5rem 1.25rem 2.5rem; }
.v4 .v3-hero--overlay .v3-hero__media::after { background: linear-gradient(rgba(29, 29, 29, 0.18), rgba(29, 29, 29, 0.22) 40%, rgba(29, 29, 29, 0.72)); }
/* -- split: heading + image share the left column; phone order = heading, image, content -- */
.v4 .v3-split__aside h2 { margin-bottom: 1.5rem; }
.v4 .v3-editorial { gap: 0; }
/* -- hubs: the hero sub-line is a sentence, not an uppercase eyebrow (same voice as the treatment pages) -- */
.v3-hero__overlay .v3-eyebrow { font-size: 1.05rem; font-weight: 300; letter-spacing: 0.01em; text-transform: none; line-height: 1.55; max-width: 46ch; }
@media (min-width: 1024px) {
  .v4 .v3-section h2 { font-size: 2.5rem; line-height: 1.12; margin: 0; }
  .v4 .v3-split__aside h2, .v4 .v3-split--flip .v3-split__body h2 { margin-bottom: 2.25rem; }
  .v4 .v3-section h3 { font-size: 1.625rem; font-weight: 400; margin: 0 0 0.9rem; }
  .v4 .v3-prose, .v4 .v3-prose--lg { font-size: 1.125rem; line-height: 1.75; }
  .v4 .v3-prose h4 { font-size: 1.625rem; font-weight: 400; margin: 0 0 0.7rem; }
  .v4 .v3-editorial { gap: 4rem; }
  /* ledger row = item title left, its text right: structured, scannable, ~55 characters a line */
  .v4 .v3-cards > .v3-card, .v4 .v3-cards > .v3-card:only-child, .v4 .v3-section--sand .v3-cards > .v3-card:only-child { display: grid; grid-template-columns: 4fr 8fr; column-gap: 2.5rem; align-items: start; padding: 1.9rem 0 2rem; }
  .v4 .v3-cards > .v3-card > h3, .v4 .v3-cards > .v3-card:only-child h3 { grid-column: 1; grid-row: 1 / span 12; font-size: 1.3125rem; font-weight: 400; line-height: 1.3; margin: 0; }
  .v4 .v3-cards > .v3-card > :not(h3) { grid-column: 2; }
  .v4 .v3-card p, .v4 .v3-card ul, .v4 .v3-card li, .v4 .v3-section li { font-size: 1.0625rem; }
  .v4 .v3-faq summary { font-size: 1.3125rem; font-weight: 400; }
  .v4 .v3-faq .v3-faq__a { font-size: 1.0625rem; }
  .v4 .v3-hero__overlay { padding: 7rem 2rem 4.5rem; }
  .v4 .v3-hero--overlay .v3-hero__media { height: 78vh; }
  .v3-hero.v3-hero--overlay .v3-hero__media { height: 76vh; }
  .v3-hero__overlay .v3-eyebrow { font-size: 1.2rem; max-width: 64ch; }
}

/* ==== v4 pass 10 (John 2026-09-21: the desktop hero 'shows two heads of two women, doesn't make any sense').
   Cause: every clinic photo is PORTRAIT. A full-width desktop band shows ~1/3 of a portrait photo at a scale where a face is
   250px tall, so any crop is two heads. No landscape nurse-with-patient photos exist in the client's assets (checked).
   Fix: from 1024px the hero is two halves: title / sub-line / button on cream, on the page's left line; the photo fills the
   right half at a near-square crop that shows the whole scene. No dark title box. Below 1024px the overlay hero is unchanged. ==== */
@media (min-width: 1024px) {
  .v4 .v3-hero.v3-hero--overlay { display: grid; grid-template-columns: 1fr 1fr; align-items: stretch; background: var(--cream); color: var(--ink); padding-top: 92px; min-height: 0; }
  .v4 .v3-hero--overlay .v3-hero__media { order: 2; position: relative; width: 100%; height: min(78vh, 760px); min-height: 560px; aspect-ratio: auto; max-height: none; }
  .v4 .v3-hero--overlay .v3-hero__media::after { content: none; }
  .v4 .v3-hero--overlay .v3-hero__media img { object-position: var(--hero-split-pos, center 30%); }
  .v4 .v3-hero__overlay { order: 1; position: static; inset: auto; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; text-align: left;
    padding: 4rem 4rem 4rem max(1.25rem, calc((100vw - var(--wrap)) / 2)); }
  .v4 .v3-hero--overlay h1, .v4 .v3-hero__overlay h1 { color: var(--ink); font-size: clamp(2.75rem, 4vw, 4rem); line-height: 1.08; max-width: 14ch; margin: 0; text-wrap: balance; }
  .v4 .v3-hero__overlay .v4-subline { color: var(--bark); margin: 1.75rem 0 0; max-width: 34ch; font-size: 1.25rem; line-height: 1.5; text-wrap: pretty; }
  .v4 .v3-hero__overlay .v3-btns { justify-content: flex-start; margin-top: 2.5rem; }
  .v4 .v3-hero__overlay .v3-btn--light, .v4 .v3-hero__overlay .v3-btns > .v3-btn--light { background: var(--ink); color: var(--cream); border-color: var(--ink); }
  .v4 .v3-hero__overlay .v3-btn--light:hover, .v4 .v3-hero__overlay .v3-btns > .v3-btn--light:hover { background: transparent; color: var(--ink); }
  .v4 main > .v3-section:first-of-type > .v3-wrap { border-top: 0; }
}

/* ==== v4 pass 11 (review round 2 + every verbatim page and both hubs on v4) ==== */
.v4 .v3-faq .v3-faq__a, .v4 .v3-faq .v3-faq__a p { max-width: 62ch; }
.v4 .v3-cards > .v3-card:only-child p, .v4 .v3-card p { font-size: 1.03rem; }
.v4 .v3-card h5 { font-size: 1.03rem; font-weight: 500; }
.v4 .v3-section ul.v4-index li a { color: var(--ink) !important; }   /* the generator's inline link style would otherwise win */
/* standalone sub-heads introduce the list under them: no rule above, bonded to what follows, lighter + larger than item titles */
.v4 .v3-editorial h3, .v4 .v3-split__body > h3 { border-top: 0; padding-top: 0; margin: 2.75rem 0 1rem; font-size: 1.5rem; font-weight: 300; line-height: 1.25; }
.v4 .v3-editorial > div > h3:first-child, .v4 .v3-split__body > h3:first-child { margin-top: 0; }
.v4 .v3-cards > .v3-card > h3 { font-size: 1.1875rem; font-weight: 500; margin: 0 0 0.75rem; }
/* phone/tablet: a flipped image row still opens with its heading, not a headless photo */
@media (max-width: 1023px) { .v4 .v3-split--flip .v3-split__media { order: 2; } .v4 .v3-split--flip { display: grid; } }
/* hubs */
.v4-hub .v3-wrap > .v3-btns { margin-left: 0; }
.v4-hub .v3-tile p { font-size: 1.03rem; line-height: 1.65; }
.v4-hub .v3-tile h3 { font-size: 1.25rem; }
.v4-hub .v3-tile__more { font-size: 0.8rem; padding: 0.6rem 0 0.2rem; }
.v4-hub .v3-group__head h2 { margin: 0; }
@media (min-width: 1024px) {
  .v4 .v3-cards > .v3-card:only-child p, .v4 .v3-card p { font-size: 1.0625rem; }
  .v4 .v3-card h5 { font-size: 1.0625rem; }
  .v4 .v3-editorial > h2 { align-self: start; position: sticky; top: 7.5rem; }   /* the heading travels beside a long ledger instead of leaving the column empty */
  .v4 .v3-editorial h3, .v4 .v3-split__body > h3 { font-size: 1.625rem; font-weight: 300; margin: 3.25rem 0 1.1rem; }
  .v4 .v3-cards > .v3-card > h3, .v4 .v3-cards > .v3-card:only-child h3 { font-size: 1.3125rem; font-weight: 400; margin: 0; }
  .v4-hub .v3-tile p { font-size: 1.0625rem; }
}

/* ==== v4 pass 12 (image review 2026-09-22) ==== */
/* a photo that completes a hub card grid: one cell, tall enough that the scene (two people + tablet) reads */
.v3-tile--cell img { object-position: center 38%; }
@media (min-width: 640px) { .v3-tile--cell { min-height: 24rem; } }
/* phones: the grid photos keep the practitioner's whole head, and a hub title over a bright counter gets a firmer foot to the scrim */
@media (max-width: 639px) { .v3-tile--m1 img { object-position: center 8%; } }
@media (max-width: 1023px) { .v4-hub .v3-hero--overlay .v3-hero__media::after { background: linear-gradient(rgba(29, 29, 29, 0.2), rgba(29, 29, 29, 0.3) 40%, rgba(29, 29, 29, 0.82)); } }
@media (max-width: 1023px) { .v4 .v3-hero--overlay .v3-hero__media img { object-position: var(--hero-m-pos, center 20%); } }

/* ---- Square tiles (John 2026-09-22): every hub tile is a square from tablet up, matching the image cells; a tile with
   more text than fits grows taller (aspect-ratio is a floor, not a cap). Phones keep natural height. ---- */
@media (min-width: 760px) {
  .v3-tiles .v3-tile { aspect-ratio: 1 / 1; box-sizing: border-box; display: flex; flex-direction: column; }
  .v3-tiles .v3-tile > p { flex: 0 0 auto; }
  .v3-tiles .v3-tile .v3-tile__actions { margin-top: auto; padding-top: 1rem; }
  .v3-tiles .v3-tile--img { aspect-ratio: 1 / 1; min-height: 0; display: block; }
  .v3-tiles .v3-tile--m1, .v3-tiles .v3-tile--m2 { aspect-ratio: auto; align-self: stretch; min-height: 0; }   /* the two tall mosaic cells on the treatments hub keep their 2-row span (specificity must beat the square rule above) */
}