/* ============================================================================
   flow.css - the homepage and post-payment flow.

   Loaded by / and /next-live, AFTER styles.css, which it extends. Every rule
   here came from the assignment-001 iteration-10 prototype's prototype.css.
   Only the review-only rules were left behind: the DRAFT strip and the
   prototype cross-link, which must never reach a customer.

   ALSO LEFT BEHIND, and this one is worth knowing: the prototype's first line
   overrode --display and --body to "Segoe UI" and redefined --text-faint. That
   was isolation scaffolding - the prototype loaded no webfonts and its own
   Content-Security-Policy blocked font-src - not a typography decision. Drop-
   ping it is what keeps these two pages in Archivo / IBM Plex Sans like the
   rest of the site. To go the other way, put that one line back at the top.
   ========================================================================= */

body{overflow-x:hidden}
.compact-pitch{padding-block:clamp(3.5rem,9vw,6.5rem)}.hero-copy{position:relative}.hero-copy h1{max-width:720px}.hero-copy .lede{max-width:620px}.hero-copy .btn{margin-top:12px}
.section-heading{max-width:620px;margin-bottom:24px}.section-heading h2{font-size:clamp(30px,4vw,44px);margin-bottom:8px}.purchase-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.duration-card{display:flex;flex-direction:column;padding:24px}.duration-card:focus{outline:3px solid var(--accent);outline-offset:4px}.duration-card.recommended{border:2px solid var(--accent-dim)}.duration{font-family:var(--display);font-weight:700;color:var(--accent);font-size:clamp(28px,2.8vw,34px);line-height:1.15;letter-spacing:-.025em;margin-bottom:12px}.duration-card h3{font-size:28px;margin-bottom:18px}.approved-copy{font-size:15px;line-height:1.65;max-width:none;margin-bottom:24px}.duration-card .btn{margin-top:auto}.recommendation-tag{display:block;width:max-content;margin-top:6px;padding:4px 7px;border:1px solid var(--accent-dim);border-radius:999px;color:var(--text);font:500 10px/1.2 var(--body);letter-spacing:.04em;text-transform:uppercase}.checkout-note{max-width:none;margin-top:18px;font-size:14px;color:var(--text-dim)}
.helper-invite{display:flex;justify-content:space-between;align-items:center;gap:24px;margin-top:30px;padding:24px;border:1px solid var(--line);border-radius:var(--radius);background:var(--bg-sunk)}.helper-invite h3{font-size:21px;margin-bottom:4px}.helper-invite p{margin:0}.questions-section{border-top:1px solid var(--line-soft);text-align:center}.questions-section h2{font-size:26px}.questions-section p{margin-inline:auto}.text-link{font-family:var(--display);font-weight:600;color:var(--accent)}
.modal-open{overflow:hidden}.modal-backdrop{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:20px;background:rgba(8,11,15,.68);backdrop-filter:blur(3px)}.modal-backdrop[hidden]{display:none}.helper-modal{position:relative;width:min(100%,560px);max-height:calc(100vh - 40px);overflow:auto;padding:clamp(24px,5vw,42px);background:var(--bg-raise);border:1px solid var(--line);border-radius:18px;box-shadow:0 30px 90px rgba(0,0,0,.55)}.modal-close{position:absolute;top:14px;right:16px;width:44px;height:44px;border:0;background:transparent;color:var(--text-dim);font-size:30px;line-height:1;cursor:pointer}.modal-close:hover{color:var(--text)}.helper-progress{height:2px;margin:0 48px 26px 0;background:var(--line);border-radius:2px;overflow:hidden}.helper-progress span{display:block;height:100%;width:33.333%;background:var(--accent);transition:width .18s ease}.helper-modal>h2{font-size:30px;margin-bottom:8px}.helper-question{margin-top:28px}.helper-question h3{font-size:22px;margin-bottom:18px}.helper-choices{display:grid;gap:10px}.helper-choice{width:100%;min-height:54px;padding:14px 16px;text-align:left;color:var(--text);background:var(--bg-sunk);border:1px solid var(--line);border-radius:8px;font:600 15px/1.35 var(--display);cursor:pointer}.helper-choice:hover,.helper-choice:focus-visible{border-color:var(--accent);background:rgba(224,164,92,.08)}.helper-choice:focus-visible,.modal-close:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.helper-result{margin-top:28px;padding:24px;background:var(--bg-sunk);border:1px solid var(--line);border-radius:10px}.helper-result h3{font-size:32px;margin-bottom:10px}.helper-result .btn{margin-top:12px}.helper-nav{display:flex;gap:12px;margin-top:18px}
.flow-page main{min-height:65vh}.handoff-hero{padding-block:clamp(2.5rem,7vw,5rem)}.handoff-hero h1{font-size:clamp(34px,5vw,56px);max-width:760px}.handoff-hero .lede{max-width:690px}.handoff-card{margin-top:34px;padding:clamp(22px,5vw,36px);background:var(--bg-raise);border:1px solid var(--line);border-radius:12px}.handoff-card h2{font-size:25px}.handoff-card .btn{margin-top:10px}.schedule-steps{margin-top:30px}.schedule-steps li h4{font-size:17px}.booking-state{margin-top:26px;padding:18px 20px;border-left:2px solid var(--accent);background:var(--bg-sunk)}.booking-state strong{color:var(--text)}.fallback{margin-top:28px}
@media(max-width:800px){.purchase-grid{grid-template-columns:1fr}.duration-card{padding:20px}.helper-invite{align-items:flex-start;flex-direction:column}.helper-invite .btn{width:100%}.site-head__inner{display:flex;flex-wrap:wrap;gap:12px}.wrap{padding-inline:18px}}
@media(prefers-reduced-motion:reduce){.helper-progress span{transition:none}}

/* Iteration 5 — PROVISIONAL (Development Partner): existing amber/slate atmosphere. */
.helper-back{display:inline-flex;align-items:center;gap:9px;min-height:44px;padding:10px 15px;border:1px solid var(--line);border-radius:8px;background:transparent;color:var(--text-dim);font:600 14px/1.3 var(--body);cursor:pointer}
.helper-back[hidden]{display:none}.helper-back:hover{color:var(--text);background:var(--bg-sunk);border-color:var(--text-faint)}
.helper-back:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.modal-close{display:grid;place-items:center;border:1px solid var(--line);border-radius:10px;background:var(--bg-sunk);color:var(--text);padding:0}
.modal-close:hover{border-color:var(--accent-dim);background:var(--bg)}
@media(max-width:800px){.site-head__inner .social{width:100%;justify-content:center}.duration{font-size:30px}}

/* Iteration 6 — PROVISIONAL (Development Partner).
   One lighting field spans hero AND offer, fading before the questions section.
   Card, badge, helper, brand marks, base typography and prices remain untouched. */
.offer-environment{position:relative;isolation:isolate;background:var(--bg)}
.offer-environment::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse 70% 58% at 87% 30%,rgba(224,164,92,.095),transparent 78%),radial-gradient(ellipse 80% 65% at 8% 45%,rgba(83,111,143,.13),transparent 85%)}
.offer-environment .compact-pitch{background:transparent;box-shadow:none;padding-top:clamp(3rem,6vw,5rem);padding-bottom:clamp(2.5rem,5vw,4rem)}
.hero-layout{display:grid;grid-template-columns:minmax(0,1fr) 200px;gap:clamp(32px,5vw,64px);align-items:center}
.hero-copy h1{font-size:clamp(38px,4.5vw,56px);max-width:680px;line-height:1.08;letter-spacing:-.04em}
.hero-copy .lede{max-width:610px;margin-top:22px}
.aggregate-credibility{padding:24px 0 24px 28px;border-left:1px solid rgba(224,164,92,.24)}
.aggregate-figures{margin:0;display:grid;gap:28px}
.aggregate-figures>div{display:flex;flex-direction:column}
.aggregate-figures dd{order:-1;margin:0;color:var(--text);font-size:30px;line-height:1.2;font-weight:650;letter-spacing:-.035em;font-variant-numeric:tabular-nums}
.aggregate-figures dt{color:var(--text-dim);font-size:13px;margin-top:4px}
.discord-channel{white-space:nowrap;color:var(--text);font-weight:600}
.btn--discord{border-color:rgba(88,101,242,.3);background:linear-gradient(45deg,rgba(64,78,237,.07) 0%,rgba(88,101,242,.12) 60%,rgba(122,132,247,.13) 100%),var(--bg-sunk);color:var(--text)}
.btn--discord:hover{border-color:rgba(88,101,242,.65);background:linear-gradient(45deg,rgba(64,78,237,.14) 0%,rgba(88,101,242,.22) 60%,rgba(122,132,247,.24) 100%),var(--bg-sunk);color:var(--text)}
.handoff-wrap{max-width:860px}
.handoff-hero{padding-top:clamp(32px,4vw,56px)}
.handoff-hero h1{font-size:clamp(34px,4.5vw,54px);letter-spacing:-.035em;max-width:none;line-height:1.12}
.schedule-steps{margin-top:36px}
.schedule-steps li{max-width:none;padding-left:52px;padding-bottom:30px}
.schedule-steps li h2{font-size:20px;line-height:1.35;letter-spacing:-.015em;margin-bottom:12px}
.schedule-steps li::before{background:var(--bg-sunk);border-color:var(--accent-dim)}
.schedule-steps li:not(:last-child)::after{background:var(--line)}
.copy-gap{font-size:11px;margin:10px 0 0;color:var(--text-faint)}
.booking-state p{max-width:none;margin:0}.booking-state .copy-gap{margin-top:8px}
@media(min-width:801px){.handoff-hero h1{white-space:nowrap}}
@media(max-width:800px){
 .hero-layout{grid-template-columns:1fr;gap:30px}
 .aggregate-credibility{border-left:0;padding:0}
 .aggregate-figures{display:flex;gap:36px}
 .aggregate-figures dd{font-size:26px}
}
@media(max-width:520px){
 .schedule-steps li{padding-left:44px}
}
