/* ---- Hero ---- */
.ah-hero { position: relative; background: var(--grad-hero); color: #fff; padding: 172px 0 var(--space-3xl); overflow: hidden; }
.ah-hero .wrap { position: relative; z-index: 2; }
.ah-hero-grid { display: grid; grid-template-columns: 1.05fr 1fr; gap: var(--space-2xl); align-items: center; }
.ah-hero h1 { color: #fff; letter-spacing: -.02em; margin: 0 0 var(--space-m); }
.ah-hero h1 .hl { color: var(--color-accent); }
.ah-hero .lede { font-size: var(--text-lg); color: rgba(255,255,255,.9); max-width: 33em; margin: 0 0 var(--space-s); line-height: var(--line-relaxed); }
.ah-hero .tagline { font-size: var(--text-md); font-weight: var(--weight-semibold); color: var(--color-accent); margin: 0 0 var(--space-l); }
.ah-hero .hero-note { margin: var(--space-m) 0 0; font-size: var(--text-sm); color: rgba(255,255,255,.72); }

.ah-hero-visual { position: relative; }
.ah-hero-visual img { width: 100%; height: auto; filter: drop-shadow(0 30px 60px rgba(13,38,56,.55)); border-radius: var(--radius-lg); }
.ah-badge { position: absolute; background: #fff; color: var(--color-secondary); border-radius: var(--radius-lg); box-shadow: var(--shadow-4);
  padding: var(--space-xs) var(--space-s); display: flex; align-items: center; gap: var(--space-xs); font-weight: var(--weight-bold); z-index: 3; }
.ah-badge .big { font-size: var(--text-xl); color: var(--color-primary); line-height: var(--line-none); }
.ah-badge .lbl { font-size: var(--text-xs); color: var(--color-ink-soft); font-weight: var(--weight-semibold); line-height: var(--line-snug); }
.ah-badge.b1 { top: 8%; left: -26px; }
.ah-badge.b2 { bottom: 10%; right: -20px; }
@media (prefers-reduced-motion: no-preference) {
  .ah-badge.b1 { animation: ah-float 6s ease-in-out infinite; }
  .ah-badge.b2 { animation: ah-float 6s ease-in-out infinite 1.5s; }
}
@keyframes ah-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }

/* ---- Money section background ---- */
.ah-money { background: linear-gradient(160deg, var(--brand-50), #fff); }

/* gp-free band rules now live in components.css (2026-09-13). */

/* ---- Revenue / upside estimator ---- */
.pr-upside { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-l); align-items: stretch; }
.pr-upside-copy { background: #fff; border: 1px solid var(--color-border); border-radius: var(--radius-lg); padding: var(--space-l) var(--space-l) var(--space-l); box-shadow: var(--shadow-md); display: flex; flex-direction: column; }
.pr-upside-copy h3 { color: var(--color-secondary); margin: 0 0 var(--space-xs); }
.pr-upside-copy > p { line-height: var(--line-relaxed); color: var(--color-ink-soft); margin: 0 0 var(--space-m); }
.pr-upside-copy .btn { align-self: flex-start; }
.pr-upside-note { font-size: var(--text-sm); color: var(--color-ink-soft); line-height: var(--line-normal); margin: var(--space-s) 0 0; }
.pr-upside-bars { display: flex; flex-direction: column; }

/* ---- How-it-works step badges ---- */
.pr-steps .card { position: relative; padding-top: var(--space-l); }
.pr-n { display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px; border-radius: var(--radius-lg);
  background: var(--grad-chip); color: #fff; font-weight: var(--weight-extrabold); font-size: var(--text-lg); margin-bottom: var(--space-xs);
  box-shadow: 0 8px 16px rgba(67,143,185,.3); }

/* ---- The unfortunate truth: pull-stat stack (#complexity) ----
   Two RACGP workforce figures beside the practice-framed problem copy (moved up from #mix
   2026-09-15 when that section went copy-only). Deliberately NOT tiles (owner,
   2026-09-15: "not just another series of tiles"): one vertical accent rule, big numerals hanging
   off it, a one-line label each, citation on every row. Numeral tokens match .fig-card .v so the
   page's figures share one scale. */
.pr-pull { list-style: none; margin: 0; padding: 0 0 0 var(--space-l); border-left: 4px solid var(--color-accent); display: flex; flex-direction: column; gap: var(--space-l); }
.pr-pull li { display: flex; flex-direction: column; gap: var(--space-3xs); }
.pr-pull .num { font-size: var(--step-5); font-weight: var(--weight-extrabold); color: var(--color-secondary); line-height: var(--line-none); letter-spacing: -.02em; }
.pr-pull .num .in { font-size: .5em; font-weight: var(--weight-semibold); color: var(--color-primary); vertical-align: middle; margin: 0 .1em; letter-spacing: 0; }
.pr-pull .num small { font-size: .42em; font-weight: var(--weight-semibold); color: var(--color-primary); margin-right: .2em; letter-spacing: 0; }
.pr-pull p { margin: 0; font-size: var(--text-md); line-height: var(--line-normal); color: var(--color-ink-soft); max-width: 24em; }
.pr-pull sup { line-height: 0; }
.pr-pull sup button { background: none; border: 0; padding: 0 0 0 2px; font: inherit; font-size: var(--text-xs); color: var(--color-primary); cursor: pointer; }
.pr-pull sup button:hover { text-decoration: underline; }

/* .pr-benefits moved to components.css 2026-09-16 when the landing page took the same tiles. */

/* ---- The two problem sections, tightened (owner, 2026-09-15) ----
   #complexity (patient-framed, the shared partial) and #burden (what it costs the practice) are one
   argument in two parts, so the inherited section.block 4xl top+bottom left 256px between them and
   read as two unrelated bands. 2xl each: 128px between, and less above the pair. Same trim /gp/
   took on its own #complexity. */
section.block#complexity,
section.block#burden { padding-top: var(--space-2xl); padding-bottom: var(--space-2xl); }

/* ---- Journey stops, roomier on this page (owner, 2026-09-16) ----
   The shared .jstep padding is --space-xl (a 96px box gap), which /gp/ and /specialists/ are signed
   off at. The owner read the Add your GPs → Pick regular slots join as cramped here even though it
   measures the same (96px box, 124-131px between the copy blocks), so this page gets --space-2xl.
   ⚠️ Page-scoped on purpose — don't push it back into journey.css without checking the other two. */
#journey .jstep { padding-top: var(--space-2xl); padding-bottom: var(--space-2xl); }

/* ---- Band alternation at the foot of the page (2026-09-15) ----
   #support (support-team.njk) and #compliance were both page-ground, the same join fixed on /gp/
   and /specialists/ — the compliance card is the visible boundary, but the run above it read as
   one field. Scoped here, not on the partial: on other pages #support's neighbours already
   alternate. The run through the page is:
       #complexity (page) → #burden (tint) → #solution (dark) → #benefits (page) → #twoways (tint)
       → #what-we-are (pale) → #journey (PAGE — owner's call, the flow must not sit on white)
       → #rules (tint) → #how (pale) → #money (wash) → #logistics (page) → #free (dark)
       → #support (page) → #telehealth (tint) → #compliance (page) → #docs (tint)
       → #faq (page, its own deco) → #upside (tint) → the CTA band (dark) */
/* The #money → #platform join (owner, 2026-09-15): .ah-money's wash fades to #fff at its foot and
   #platform is white, so two 4xl paddings met with nothing between them. Halved to 64 + 64. */
section.block#money { padding-bottom: var(--space-2xl); }
section.block#what-we-are { padding-top: var(--space-2xl); }
/* Same for #how → #logistics: `pale` fades to white at its foot, so that join had no boundary and
   two 4xl paddings besides. */
section.block#how { padding-bottom: var(--space-2xl); }
section.block#logistics { padding-top: var(--space-2xl); }

/* ⚠️ #faq gave its tint back (2026-09-16) — #docs now sits between it and #compliance, which is
   what the tint was solving, so #faq returns to page ground and #upside takes the tint again. */
/* ⚠️ #journey is NOT tinted (owner, 2026-09-16: white behind the flow "sucks") — it sits on the
   page ground, like the journeys on /gp/ and /specialists/. #what-we-are above it takes the tint
   instead so the two still read apart. */
/* ⚠️ #what-we-are came OUT of this rule 2026-09-16: it takes `pale` from the partial now, and an
   id-specificity background here would have beaten the class. */
section.block#rules { background: var(--color-surface); }

/* ---- Responsive ---- */
@media (max-width: 980px) {
  .ah-hero-grid { grid-template-columns: 1fr; gap: var(--space-xl); }
  .ah-hero-visual { max-width: 520px; margin: 0 auto; }
  .ah-badge.b1 { left: 0; }
  .ah-badge.b2 { right: 0; }
}
@media (max-width: 880px) {
  .pr-upside { grid-template-columns: 1fr; }
  .gp-free-grid { grid-template-columns: 1fr; max-width: 460px; }
}
@media (max-width: 760px) {
  .ah-hero { padding: 140px 0 var(--space-3xl); }
  .stat-strip .stat:nth-child(2) { border-right: 0; }
  .stat-strip .stat { border-bottom: 1px solid var(--color-border-soft); }
}
@media (max-width: 560px) {
  .pr-pull { padding-left: var(--space-m); }
}
