/* =========================================================
   HOMEPAGE — blueprint intro + hero
   ========================================================= */

/* ---------- Intro overlay ---------- */
body.intro-lock{overflow:hidden; height:100vh;}
.intro{
  position:fixed; inset:0; z-index:9999; background:#000;
  display:flex; align-items:center; justify-content:center; overflow:hidden;
  transition:opacity .9s ease, visibility .9s ease;
}
.intro.is-hidden{opacity:0; visibility:hidden; pointer-events:none;}
.intro-grid{
  position:absolute; inset:0; opacity:0; transition:opacity 2s ease;
  background-image:
    linear-gradient(rgba(123,175,212,0.10) 1px, transparent 1px),
    linear-gradient(90deg, rgba(123,175,212,0.10) 1px, transparent 1px),
    linear-gradient(rgba(123,175,212,0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(123,175,212,0.04) 1px, transparent 1px);
  background-size:96px 96px, 96px 96px, 24px 24px, 24px 24px;
}
.stage-grid .intro-grid{opacity:1;}

/* Field schematic drawn in Carolina blue */
.intro-field{position:absolute; inset:0; width:100%; height:100%;}
.intro-field *{
  fill:none; stroke:var(--blue); stroke-width:1; vector-effect:non-scaling-stroke; opacity:.5;
  stroke-dasharray:2400; stroke-dashoffset:2400; transition:stroke-dashoffset 2.4s cubic-bezier(.2,.7,.3,1);
}
.intro-field .thin{opacity:.25;}
.intro-field .dim{stroke-dasharray:4 6; stroke-dashoffset:0; opacity:0; transition:opacity 1.2s ease 1.2s;}
.stage-lines .intro-field *{stroke-dashoffset:0;}
.stage-lines .intro-field .dim{opacity:.35;}
.intro-field :nth-child(2){transition-delay:.12s;} .intro-field :nth-child(3){transition-delay:.24s;}
.intro-field :nth-child(4){transition-delay:.36s;} .intro-field :nth-child(5){transition-delay:.48s;}
.intro-field :nth-child(6){transition-delay:.6s;} .intro-field :nth-child(7){transition-delay:.72s;}
.intro-field :nth-child(8){transition-delay:.84s;}

/* Scan beam that sweeps the sheet once */
.intro-scan{
  position:absolute; left:0; right:0; top:-20%; height:18%; pointer-events:none; opacity:0;
  background:linear-gradient(180deg, transparent, rgba(123,175,212,0.10) 70%, rgba(168,208,238,0.45) 99%, transparent);
}
.stage-terminal .intro-scan{animation:scan 3.6s cubic-bezier(.5,0,.5,1) .2s 1 forwards;}
@keyframes scan{0%{top:-20%; opacity:0;}10%{opacity:1;}90%{opacity:1;}100%{top:105%; opacity:0;}}

.intro-coord{
  position:absolute; font-family:var(--font-mono); font-size:10px; letter-spacing:.1em; text-transform:uppercase;
  color:rgba(123,175,212,.6); border:1px solid rgba(123,175,212,.22); padding:5px 9px; opacity:0; transition:opacity 1s ease;
}
.stage-lines .intro-coord{opacity:1;}
.intro-coord.c1{top:28px; left:28px;} .intro-coord.c2{display:none;}
.intro-coord.c3{bottom:28px; left:28px;} .intro-coord.c4{bottom:72px; right:28px;}
.intro-coord.c5{top:50%; left:18px; transform:translateY(-50%) rotate(-90deg); transform-origin:left center;}
.intro-coord.c6{top:50%; right:18px; transform:translateY(-50%) rotate(90deg); transform-origin:right center;}

/* Drafting progress meter */
.intro-meter{
  position:absolute; left:28px; bottom:64px; width:min(240px, 50vw); opacity:0; transition:opacity .8s ease;
  font-family:var(--font-mono); font-size:10px; letter-spacing:.12em; color:rgba(123,175,212,.75); text-transform:uppercase;
}
.stage-terminal .intro-meter{opacity:1;}
.intro-meter-bar{height:3px; background:rgba(123,175,212,.15); margin-top:8px; overflow:hidden;}
.intro-meter-bar span{display:block; height:100%; width:0; background:var(--orange); box-shadow:0 0 12px var(--orange); transition:width .35s ease;}

.intro-content{position:relative; z-index:2; text-align:center; max-width:720px; padding:0 24px;}
.intro-content::before{content:''; position:absolute; inset:-60px -40px; z-index:-1; pointer-events:none; background:radial-gradient(closest-side, rgba(0,0,0,.92) 55%, transparent);}
.intro-logo{position:relative; width:170px; height:170px; margin:0 auto 6px; opacity:0; transform:scale(.92); transition:opacity 1s ease, transform 1s ease;}
.stage-logo .intro-logo{opacity:1; transform:scale(1);}
.intro-logo svg{position:absolute; inset:0; width:100%; height:100%; overflow:visible;}
.intro-logo svg circle, .intro-logo svg path{
  fill:none; stroke-width:1.4; stroke-linecap:round; stroke-dasharray:900; stroke-dashoffset:900;
  transition:stroke-dashoffset 2.2s cubic-bezier(.25,.7,.3,1);
}
.stage-logo .intro-logo svg circle, .stage-logo .intro-logo svg path{stroke-dashoffset:0;}
.intro-logo .s-white{stroke:#fff;}
.intro-logo .s-blue{stroke:var(--blue); transition-delay:.9s;}
.intro-logo .s-orange{stroke:var(--orange); transition-delay:1.5s;}
.intro-logo .ring{stroke:rgba(123,175,212,.35); stroke-dasharray:3 7 !important; stroke-dashoffset:0 !important; opacity:0; transition:opacity 1s ease 2s; transform-origin:100px 100px; animation:spin 30s linear infinite;}
.stage-logo .intro-logo .ring{opacity:1;}
@keyframes spin{to{transform:rotate(360deg);}}
.intro-logo img{position:absolute; inset:0; width:100%; height:100%; border-radius:50%; opacity:0; transition:opacity 1.1s ease 2.4s;}
.stage-logo .intro-logo img{opacity:1;}

/* APPROVED stamp when the athlete chooses to build */
.intro-stamp{
  position:absolute; left:50%; top:50%; z-index:3; pointer-events:none;
  font-family:var(--font-display); font-size:28px; letter-spacing:.12em; text-transform:uppercase; color:var(--orange);
  border:3px solid var(--orange); background:rgba(0,0,0,.35); padding:6px 14px; border-radius:4px; white-space:nowrap;
  transform:translate(-50%,-50%) rotate(-12deg) scale(2.6); opacity:0;
  text-shadow:0 0 18px rgba(226,86,27,.6); box-shadow:0 0 30px rgba(226,86,27,.35), inset 0 0 18px rgba(226,86,27,.25);
}
.is-approved .intro-stamp{animation:stamp .45s cubic-bezier(.3,1.6,.5,1) forwards;}
@keyframes stamp{to{opacity:1; transform:translate(-50%,-50%) rotate(-12deg) scale(1);}}
.is-approved .intro-logo{animation:thud .35s ease .3s;}
@keyframes thud{50%{transform:scale(.96);}}

.intro-terminal{
  min-height:170px; margin:20px auto 0; max-width:400px; text-align:left; opacity:0; transition:opacity .6s ease;
  font-family:var(--font-mono); font-size:12.5px; letter-spacing:.04em; color:rgba(255,255,255,.85);
}
.stage-terminal .intro-terminal{opacity:1;}
.intro-terminal .t-system{display:block; color:var(--text); font-weight:700; letter-spacing:.14em; margin-bottom:10px;}
.intro-terminal .t-line{display:block; min-height:18px; margin-bottom:3px; white-space:pre;}
.intro-terminal .t-line.ok{color:var(--blue-bright);}
.intro-terminal .t-line.warn{color:#e9c46a;}
.intro-terminal .t-line.fail{color:var(--orange); font-weight:700; animation:glitch .5s steps(2) 2;}
@keyframes glitch{0%{transform:translateX(0);}25%{transform:translateX(-3px);}50%{transform:translateX(3px);}75%{transform:translateX(-1px);}100%{transform:none;}}
.intro-terminal .cursor{display:inline-block; width:7px; height:12px; background:#fff; margin-left:2px; vertical-align:middle; animation:blink .9s steps(1) infinite;}
@keyframes blink{50%{opacity:0;}}

.intro-headline{
  font-family:var(--font-display); font-size:clamp(22px, 3.6vw, 36px); text-transform:uppercase; line-height:1.2;
  color:var(--text); margin:24px 0 12px; opacity:0; transform:translateY(14px); transition:opacity 1s ease, transform 1s ease;
}
.intro-headline .accent{color:var(--orange);}
.intro-support, .intro-question{opacity:0; transform:translateY(10px); transition:opacity 1s ease, transform 1s ease;}
.intro-support{font-size:14px; color:var(--text-dim); margin-bottom:18px; transition-delay:.15s;}
.intro-question{font-family:var(--font-mono); font-size:14px; letter-spacing:.08em; color:var(--text-dim); margin-bottom:32px; transition-delay:.3s;}
.intro-buttons{display:flex; justify-content:center; gap:16px; flex-wrap:wrap; opacity:0; transform:translateY(10px); transition:opacity 1s ease .5s, transform 1s ease .5s;}
.stage-headline .intro-headline, .stage-headline .intro-support, .stage-headline .intro-question, .stage-headline .intro-buttons{opacity:1; transform:none;}
.intro-btn{
  font-family:var(--font-mono); font-size:13px; letter-spacing:.12em; text-transform:uppercase; padding:16px 30px;
  cursor:pointer; background:transparent; border-radius:var(--radius); transition:all .35s ease;
}
.intro-btn.build{border:1.5px solid var(--orange); color:var(--orange); box-shadow:0 0 0 rgba(226,86,27,0);}
.intro-btn.build:hover, .intro-btn.build:focus-visible{background:var(--orange); color:#160800; box-shadow:0 0 38px rgba(226,86,27,.55);}
.intro-btn.stay{border:1.5px solid rgba(255,255,255,.15); color:var(--text-faint);}
.intro-btn.stay:hover{color:var(--text-dim);}
.intro-quip{min-height:22px; margin-top:16px; font-family:var(--font-mono); font-size:12px; letter-spacing:.08em; color:var(--orange-light);}
.intro-skip{
  position:absolute; top:22px; right:22px; z-index:5; cursor:pointer;
  display:inline-flex; align-items:center; gap:10px; min-height:52px; padding:0 26px;
  font-family:var(--font-body); font-size:18px; font-weight:800; letter-spacing:.02em; color:#070c14;
  background:#f3eee6; border:2px solid #f3eee6; border-radius:999px;
  box-shadow:0 6px 24px rgba(0,0,0,.45);
  opacity:0; pointer-events:none; transition:opacity .4s ease, background .2s ease, color .2s ease, border-color .2s ease;
}
.intro-skip .arrow{font-size:22px; line-height:1;}
.intro-skip.visible{opacity:1; pointer-events:auto;}
.intro-skip:hover, .intro-skip:focus-visible{background:var(--orange, #E2561B); border-color:var(--orange, #E2561B); color:#fff; outline:none;}
.intro-skip:focus-visible{box-shadow:0 0 0 4px rgba(123,175,212,.7);}

.is-launching .intro-logo{transition:transform 1.2s cubic-bezier(.6,0,.2,1), opacity 1.2s ease; transform:scale(9); opacity:0;}
.is-launching .intro-stamp{transition:opacity .3s ease; opacity:0 !important;}
.is-launching .intro-terminal, .is-launching .intro-headline, .is-launching .intro-support, .is-launching .intro-question,
.is-launching .intro-buttons, .is-launching .intro-skip, .is-launching .intro-meter, .is-launching .intro-quip{transition:opacity .4s ease; opacity:0;}
.is-launching .intro-grid{transition:opacity .8s ease, transform .8s ease; opacity:0; transform:scale(1.15);}
.is-launching .intro-field *{transition:stroke-dashoffset .6s ease, opacity .7s ease; stroke-dashoffset:-2400; opacity:0;}
.is-launching .intro-coord{transition:opacity .5s ease; opacity:0;}

@media (max-width:640px){
  .intro-skip{top:14px; right:14px; min-height:48px; padding:0 20px; font-size:17px;}
  .intro-coord.c5, .intro-coord.c6, .intro-coord.c2{display:none;}
  .intro-logo{width:128px; height:128px;}
  .intro-terminal{max-width:290px; min-height:150px; font-size:11.5px;}
  .intro-meter{bottom:24px; left:20px;}
  .intro-coord.c3, .intro-coord.c4{display:none;}
  .intro-btn{width:100%;}
  .intro-stamp{font-size:19px; border-width:2px;}
}

/* ---------- Hero ---------- */
.hero{
  position:relative; min-height:calc(100vh - var(--header-h)); min-height:calc(100svh - var(--header-h));
  display:flex; align-items:center; justify-content:center; text-align:center; overflow:hidden;
  padding:clamp(48px, 8vw, 96px) 0 clamp(88px, 10vw, 120px);
  background:radial-gradient(ellipse at 50% 28%, #11233a 0%, #070c14 58%, #04070c 100%);
  border-bottom:1px solid var(--line);
}
.site-header.is-transparent + main .hero{margin-top:calc(var(--header-h) * -1); padding-top:calc(var(--header-h) + clamp(48px, 8vw, 96px)); min-height:100vh; min-height:100svh;}
.hero-schematic{position:absolute; inset:0; width:100%; height:100%; pointer-events:none;}
.hero-schematic *{fill:none; stroke:var(--blue); vector-effect:non-scaling-stroke;}
.hero-schematic .l1{stroke-width:1; opacity:.16;}
.hero-schematic .l2{stroke-width:1; opacity:.10; stroke-dasharray:4 8;}
.hero-schematic .draw{stroke-dasharray:3000; stroke-dashoffset:3000; animation:draw 3.5s cubic-bezier(.2,.7,.3,1) .3s forwards;}
@keyframes draw{to{stroke-dashoffset:0;}}
.hero-glow{position:absolute; bottom:-18%; left:50%; transform:translateX(-50%); width:120%; height:60%; background:radial-gradient(ellipse at center, rgba(226,86,27,.16) 0%, transparent 70%); pointer-events:none;}
.hero-tag{position:absolute; font-family:var(--font-mono); font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--text-faint); border:1px solid var(--line); padding:5px 9px;}
.hero-tag.t1{top:calc(var(--header-h) + 20px); left:var(--gutter);} .hero-tag.t2{top:calc(var(--header-h) + 20px); right:var(--gutter);}
.hero-tag.t3{bottom:28px; left:var(--gutter);} .hero-tag.t4{bottom:28px; right:var(--gutter);}
.hero-content{position:relative; z-index:2; max-width:980px; padding:0 var(--gutter);}
.hero-logo{position:relative; width:clamp(140px, 18vw, 196px); aspect-ratio:1; margin:0 auto clamp(24px, 3vw, 36px);}
.hero-logo img{width:100%; height:100%; border-radius:50%; box-shadow:0 0 0 1px var(--line-strong), 0 0 70px rgba(226,86,27,.18); position:relative; z-index:1;}
.hero-logo::before{content:''; position:absolute; inset:-14px; border-radius:50%; border:1px dashed rgba(123,175,212,.35); animation:spin 40s linear infinite;}
.hero-logo::after{content:''; position:absolute; inset:-30px; border-radius:50%; border:1px solid rgba(123,175,212,.10);}
.hero h1{margin-bottom:22px;}
.hero h1 .line{display:block; opacity:0; transform:translateY(18px); animation:rise .9s cubic-bezier(.2,.7,.2,1) forwards;}
.hero h1 .line:nth-child(2){animation-delay:.12s;}
@keyframes rise{to{opacity:1; transform:none;}}
.hero .lead{max-width:540px; margin:0 auto 36px;}
.hero .btn-row{margin-bottom:22px;}
.hero-sub{font-family:var(--font-mono); font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--text-faint);}
.hero-sub a{color:var(--blue); border-bottom:1px solid currentColor;}
.scroll-cue{position:absolute; bottom:28px; left:50%; transform:translateX(-50%); z-index:2; display:flex; flex-direction:column; align-items:center; gap:10px; font-family:var(--font-mono); font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--text-faint);}
.scroll-cue .line{width:1px; height:34px; background:linear-gradient(var(--orange), transparent); animation:cue 2s ease-in-out infinite;}
@keyframes cue{0%,100%{transform:scaleY(.5); transform-origin:top;}50%{transform:scaleY(1);}}
@media (max-width:760px){
  .hero-tag{display:none;}
  .scroll-cue{display:none;}
}

/* ---------- Program (Blueprint Collective) ---------- */
.program{display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:clamp(32px, 5vw, 56px); align-items:start;}
.program h2{margin:18px 0 20px;}
.program .lead{margin-bottom:28px;}
.program .metrics{margin-bottom:28px;}
.cycle{padding:clamp(22px, 3vw, 30px);}
.cycle + .cycle{margin-top:20px;}
.cycle-top{display:flex; justify-content:space-between; gap:16px; align-items:flex-start; padding-bottom:20px; border-bottom:1px solid var(--line);}
.cycle-top h3{margin:8px 0 4px; font-size:24px;}
.cycle-top p{font-size:14px;}
.spots{text-align:center; border:1px solid var(--line-strong); border-radius:var(--radius); padding:10px 14px; min-width:92px;}
.spots small{display:block; font-family:var(--font-mono); font-size:9.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--text-faint);}
.spots strong{display:block; font-family:var(--font-display); font-size:30px; line-height:1.1; color:var(--orange); margin-top:4px;}
.cycle-block{padding:20px 0; border-bottom:1px solid var(--line);}
.cycle-block h4{font-family:var(--font-mono); font-size:11px; letter-spacing:.14em; color:var(--blue); margin-bottom:12px;}
.cycle .btn{margin-top:22px;}
.cycle-done{display:flex; justify-content:space-between; align-items:center; gap:16px; flex-wrap:wrap; padding:18px 22px;}
.cycle-done p{font-size:14px;}
@media (max-width:900px){
  .program{grid-template-columns:1fr;}
}

/* ---------- Blueprint Builder teaser ---------- */
.bb-teaser{display:grid; grid-template-columns:1fr 1fr; gap:clamp(32px, 5vw, 64px); align-items:center;}
.bb-teaser h2{margin:18px 0 18px;}
.bb-teaser p{margin-bottom:28px;}
.bb-sheet{padding:28px; font-family:var(--font-mono); font-size:12.5px; transform:rotate(-1.5deg); box-shadow:0 30px 80px rgba(0,0,0,.45);}
.bb-sheet-head{display:flex; justify-content:space-between; color:var(--text-faint); font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; padding-bottom:14px; border-bottom:1px dashed var(--line-strong); margin-bottom:16px;}
.bb-sheet .kv span:last-child{color:var(--blue-bright);}
.bb-sheet .stamp{display:inline-block; text-transform:uppercase; margin-top:18px; font-family:var(--font-display); color:var(--orange); border:2px solid var(--orange); padding:4px 10px; transform:rotate(-6deg); letter-spacing:.1em; font-size:14px;}
@media (max-width:860px){
  .bb-teaser{grid-template-columns:1fr;}
  .bb-sheet{transform:none;}
}

/* ---------- Quote ---------- */
.quote{max-width:900px; margin:0 auto; text-align:center;}
.quote blockquote{font-family:var(--font-display); text-transform:uppercase; font-size:clamp(24px, 3.6vw, 40px); line-height:1.2; color:var(--text);}
.quote blockquote .accent{color:var(--orange);}
.quote cite{display:block; margin-top:24px; font-style:normal; font-family:var(--font-mono); font-size:12px; letter-spacing:.18em; text-transform:uppercase; color:var(--blue);}