/* ============================================================
   CRITERION ONE — Industrial Precision System
   Shared stylesheet for every page. Do not alter the brand
   tokens below without sign-off (locked visual system).
   ============================================================ */

:root{
  --graphite:#16191C;
  --graphite-2:#1B1F23;
  --graphite-3:#20252A;
  --bone:#F2EEE5;
  --bone-dim:#C7C2B6;
  --slate:#4F5862;
  --slate-2:#767F89;
  --orange:#C9531E;
  --line:#2A3036;
  /* Motion system (emilkowalski/skills animation standards) */
  --ease-out:cubic-bezier(.23,1,.32,1);
  --ease-in-out:cubic-bezier(.77,0,.175,1);
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{background:var(--graphite);color:var(--bone);font-family:'Inter',system-ui,sans-serif;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden;}
.wrap{max-width:1180px;margin:0 auto;padding:0 32px;}
.mono{font-family:'JetBrains Mono',monospace;}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}

/* NAV */
nav{position:sticky;top:0;z-index:50;background:rgba(22,25,28,.86);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);}
section[id]{scroll-margin-top:90px;}
#signup-panel,#intake-panel{scroll-margin-top:90px;}
.nav-in{display:flex;align-items:center;justify-content:space-between;height:70px;position:relative;}
.nav-underline{position:absolute;bottom:0;left:0;height:2px;width:0;opacity:0;background:var(--orange);border-radius:2px 2px 0 0;transition:transform .3s var(--ease-out),width .3s var(--ease-out),opacity .2s ease;pointer-events:none;}
.brand{display:flex;align-items:center;gap:12px;}
.brand .mark{font-family:'JetBrains Mono',monospace;font-weight:700;font-size:12px;color:var(--graphite);background:var(--orange);padding:5px 7px;border-radius:3px;letter-spacing:.05em;}
.brand .name{font-weight:800;letter-spacing:.14em;font-size:15px;text-transform:uppercase;}
/* LOGO — official assets, used unaltered */
.brand img{display:block;}
.brand-icon{height:36px;width:auto;}
.brand-word{height:20px;width:auto;}
.foot-logo{height:20px;width:auto;}
@media(max-width:600px){ .brand-icon{height:30px;} .brand-word{height:17px;} }
.nav-links{display:flex;gap:34px;align-items:center;}
.nav-links a{font-size:13px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--bone-dim);transition:color .2s;}
.nav-links a:hover,.nav-links a.active{color:var(--bone);}

/* NAV — "Training" dropdown. Hover/focus reveal, matches .disc-card's panel
   convention (radius 6px, --graphite-2 fill, --line border) rather than
   inventing a new surface treatment. */
/* align-self:stretch + its own flex centering makes .nav-drop's hoverable area span the
   FULL nav height (not just the "Training" text's own line-height), so there's no dead
   zone between the trigger and the panel below it -- moving the cursor straight down from
   "Training" stays inside .nav-drop the whole way to the nav's bottom edge, where the
   panel sits flush (margin-top:0). Without this, :hover drops the instant the cursor
   leaves the text's own small box, and the panel vanishes before the cursor reaches it. */
.nav-drop{position:relative;align-self:stretch;display:flex;align-items:center;}
.nav-drop-chev{display:inline-block;font-size:9px;margin-left:4px;transform:translateY(-1px);opacity:.65;}
.nav-drop-panel{position:absolute;top:100%;left:50%;transform:translateX(-50%) translateY(4px);min-width:230px;background:var(--graphite-2);border:1px solid var(--line);border-radius:6px;padding:8px;margin-top:0;opacity:0;visibility:hidden;transition:opacity .18s ease,transform .18s ease;box-shadow:0 14px 30px rgba(0,0,0,.4);}
.nav-drop:hover .nav-drop-panel,.nav-drop:focus-within .nav-drop-panel{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);}
.nav-drop-panel a{display:block;padding:10px 12px;font-size:13px;font-weight:500;letter-spacing:normal;text-transform:none;border-radius:4px;color:var(--bone-dim);white-space:nowrap;}
.nav-drop-panel a:hover{background:var(--graphite-3);color:var(--bone);}
.btn{display:inline-block;font-family:'JetBrains Mono',monospace;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:12px 20px;border-radius:4px;transition:background-color .2s ease,border-color .2s ease,transform 160ms var(--ease-out);cursor:pointer;border:1px solid transparent;}
.btn-orange{background:var(--orange);color:var(--graphite);}
.btn-orange:hover{background:#e0672f;}
.btn-ghost{border:1px solid var(--slate);color:var(--bone);background:transparent;}
.btn-ghost:hover{border-color:var(--bone);}
.btn:active{transform:scale(.97);}
.nav-toggle{display:none;background:none;border:none;color:var(--bone);font-size:22px;cursor:pointer;}

/* HERO (home) */
.hero{position:relative;min-height:88vh;display:flex;align-items:center;border-bottom:1px solid var(--line);overflow:hidden;}
.hero-bg{position:absolute;inset:0;background:
   radial-gradient(1200px 600px at 70% -10%, rgba(201,83,30,.14), transparent 60%),
   linear-gradient(180deg, #14171A 0%, #101316 100%);}
/* Hero video (2026-09-18). The video sits at the back; .hero-bg becomes the shade over it so the
   bone headline stays readable on bright daylight footage: darkest on the left where the text is,
   lighter on the right so the shooting still shows, and a fade into the page at the bottom. */
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 35%;z-index:0;background:#101316;}
.hero:has(.hero-video) .hero-bg{z-index:1;background:
   linear-gradient(90deg, rgba(16,19,22,.94) 0%, rgba(16,19,22,.86) 46%, rgba(16,19,22,.45) 78%, rgba(16,19,22,.20) 100%),
   linear-gradient(180deg, rgba(16,19,22,.35) 0%, rgba(16,19,22,0) 30%, rgba(16,19,22,0) 70%, #101316 100%);}
@media(max-width:900px){
  /* on a phone the text spans the full width, so shade evenly instead of left-to-right */
  .hero:has(.hero-video) .hero-bg{background:linear-gradient(180deg, rgba(16,19,22,.55) 0%, rgba(16,19,22,.72) 55%, #101316 100%);}
}
@media(prefers-reduced-motion:reduce){ .hero-video{display:none;} .hero:has(.hero-video){background:#101316 url(/assets/video/hero-b-poster.jpg) center 35%/cover no-repeat;} }
.hero-content{position:relative;z-index:2;padding:60px 0;}
.kicker{font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--orange);margin-bottom:26px;display:flex;align-items:center;gap:12px;}
.kicker::before{content:"";width:34px;height:1px;background:var(--orange);}
h1{font-size:clamp(40px,7vw,84px);font-weight:900;line-height:.98;letter-spacing:-.02em;text-transform:uppercase;max-width:14ch;}
h1 .o{color:var(--orange);}
.hero h1{max-width:18ch;font-size:clamp(40px,7.4vw,92px);}   /* motto reads larger than the mission line under it (founders call 2026-09-22) */
/* Two clauses, one per line. Left to wrap naturally the orange half splits
   mid-phrase ("...PROVE / THE PERFORMANCE"), which reads as a mistake. */
.hero h1 .o{display:block;}
.hero p{max-width:52ch;color:var(--bone-dim);font-size:18px;margin-top:26px;}
.hero-cta{display:flex;gap:14px;margin-top:36px;flex-wrap:wrap;}
.ph-note{position:absolute;bottom:16px;right:20px;z-index:3;font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.1em;color:var(--slate-2);border:1px dashed var(--slate);padding:5px 9px;border-radius:3px;}

/* SUB-PAGE HERO (interior pages) */
.subhero{position:relative;border-bottom:1px solid var(--line);overflow:hidden;background:linear-gradient(180deg,#14171A 0%,#101316 100%);}
.subhero .wrap{position:relative;z-index:2;padding-top:72px;padding-bottom:64px;}
.subhero h1{font-size:clamp(34px,5.4vw,66px);max-width:20ch;}
.subhero .lead{margin-top:22px;}

/* BREADCRUMB */
.crumb{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--slate-2);margin-bottom:22px;}
.crumb a{color:var(--slate-2);transition:color .2s;}
.crumb a:hover{color:var(--orange);}
.crumb span{color:var(--slate);}

/* METRIC STRIP */
.metrics{background:var(--graphite-2);border-bottom:1px solid var(--line);}
.metrics-in{display:grid;grid-template-columns:repeat(4,1fr);}
.metric{padding:34px 28px;border-right:1px solid var(--line);}
.metric:last-child{border-right:none;}
.metric .num{font-family:'JetBrains Mono',monospace;font-size:38px;font-weight:700;color:var(--bone);letter-spacing:-.02em;}
.metric .num small{color:var(--orange);}
.metric .lbl{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--slate-2);margin-top:8px;}

/* SECTION SCAFFOLD */
section .wrap{padding-top:96px;padding-bottom:96px;}
.eyebrow{font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--orange);margin-bottom:20px;display:flex;gap:12px;align-items:center;}
.eyebrow .n{color:var(--slate-2);}
h2{font-size:clamp(28px,4vw,46px);font-weight:800;line-height:1.05;letter-spacing:-.015em;text-transform:uppercase;max-width:20ch;}
h3{letter-spacing:-.01em;}
.lead{color:var(--bone-dim);font-size:17px;max-width:60ch;margin-top:22px;}
.prose p{color:var(--bone-dim);font-size:16px;max-width:68ch;}
.prose p+p{margin-top:18px;}
.prose h2{font-size:22px;font-weight:800;text-transform:uppercase;margin:38px 0 14px;letter-spacing:-.01em;line-height:normal;max-width:none;}

/* MISSION */
.mission{border-bottom:1px solid var(--line);}
.mission blockquote{font-size:clamp(22px,3vw,32px);font-weight:600;line-height:1.35;letter-spacing:-.01em;max-width:26ch;margin-top:10px;}
.mission blockquote b{color:var(--orange);font-weight:600;}

/* DISCIPLINES */
.disc{border-bottom:1px solid var(--line);background:var(--graphite);}
.disc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:52px;}
.disc-card{border:1px solid var(--line);border-radius:6px;background:var(--graphite-2);padding:30px 28px 34px;position:relative;transition:border-color .2s ease,transform .25s var(--ease-out);}
.disc-card:hover{border-color:var(--slate);transform:translateY(-3px);}
.disc-card .idx{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--orange);letter-spacing:.1em;}
.disc-card h3{font-size:22px;font-weight:800;text-transform:uppercase;margin:18px 0 12px;letter-spacing:-.01em;}
.disc-card p{font-size:14.5px;color:var(--bone-dim);}
.disc-card .rule{height:2px;width:38px;background:var(--orange);margin-top:22px;}

/* METHOD */
.method{border-bottom:1px solid var(--line);background:var(--graphite-2);}
.method-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;}
.method .tag{display:inline-block;font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--orange);border:1px solid var(--orange);border-radius:3px;padding:4px 9px;margin-bottom:8px;}
.method-visual{border:1px solid var(--line);border-radius:6px;background:var(--graphite-3);aspect-ratio:4/3;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;}
.method-visual .ph{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--slate-2);letter-spacing:.1em;text-align:center;}
.steps{margin-top:26px;display:flex;flex-direction:column;gap:0;}
.step{display:flex;gap:18px;padding:16px 0;border-top:1px solid var(--line);}
.step:last-child{border-bottom:1px solid var(--line);}
.step .sn{font-family:'JetBrains Mono',monospace;color:var(--orange);font-size:13px;font-weight:700;}
.step .st{font-size:15px;color:var(--bone-dim);}
.step .st b{color:var(--bone);font-weight:600;}

/* VALUES */
.values{border-bottom:1px solid var(--line);}
.values-row{display:grid;grid-template-columns:repeat(5,1fr);margin-top:44px;border:1px solid var(--line);border-radius:6px;overflow:hidden;}
.value{padding:28px 22px;border-right:1px solid var(--line);text-align:center;}
.value:last-child{border-right:none;}
.value .vn{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--slate-2);}
.value h3{font-size:16px;font-weight:800;text-transform:uppercase;letter-spacing:.03em;margin-top:12px;}

/* CLASSES / COURSES */
.classes{border-bottom:1px solid var(--line);background:var(--graphite);}
.cls-head{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:20px;}
.cls-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:48px;}
@media(max-width:1140px) and (min-width:901px){ .cls-grid{grid-template-columns:repeat(2,1fr);} }
.cls-card{border:1px solid var(--line);border-radius:6px;overflow:hidden;background:var(--graphite-2);transition:border-color .2s ease,transform .25s var(--ease-out);display:flex;flex-direction:column;}
.cls-card:hover{border-color:var(--slate);transform:translateY(-3px);}
.cls-img{aspect-ratio:16/10;background:var(--graphite-3);display:flex;align-items:center;justify-content:center;border-bottom:1px solid var(--line);}
.cls-img .ph{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--slate-2);letter-spacing:.1em;}
.cls-img img:not(.ph-mark){width:100%;height:100%;object-fit:cover;display:block;}
.cls-body{padding:22px 24px 26px;display:flex;flex-direction:column;flex:1;}
.cls-meta{display:flex;gap:12px;font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--orange);letter-spacing:.08em;text-transform:uppercase;}
.cls-body h3{font-size:19px;font-weight:800;margin:14px 0 10px;text-transform:uppercase;letter-spacing:-.01em;}
.cls-body p{font-size:14px;color:var(--bone-dim);}
.cls-foot{display:flex;justify-content:space-between;align-items:center;margin-top:auto;padding-top:20px;}
.cls-foot-inner{margin-top:20px;padding-top:16px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;width:100%;}
.cls-foot .price{font-family:'JetBrains Mono',monospace;font-weight:700;font-size:15px;}
.cls-foot .go{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--orange);}
.edit-note{margin-top:38px;border:1px dashed var(--slate);border-radius:5px;padding:16px 20px;font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--slate-2);line-height:1.7;}
.edit-note b{color:var(--orange);}

/* COURSE DETAIL */
.course-detail{border-bottom:1px solid var(--line);}
.course-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:56px;align-items:start;}
.course-facts{border:1px solid var(--line);border-radius:6px;background:var(--graphite-2);padding:28px;position:sticky;top:96px;}
.course-facts .frow{display:flex;justify-content:space-between;gap:16px;padding:13px 0;border-top:1px solid var(--line);font-size:14px;}
.course-facts .frow:first-of-type{border-top:none;}
.course-facts .fk{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--slate-2);}
.course-facts .fv{font-family:'JetBrains Mono',monospace;font-weight:700;text-align:right;}
.course-facts .btn{width:100%;text-align:center;margin-top:22px;}
.tag-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px;}
.pill{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--orange);border:1px solid var(--line);border-radius:3px;padding:5px 10px;}

/* GEAR LIST — "What to Bring" section on course detail pages */
.gear-list{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:10px;}
.gear-list li{display:flex;align-items:flex-start;gap:10px;color:var(--bone-dim);font-size:16px;}
.gear-list li::before{content:"—";color:var(--orange);flex-shrink:0;}

/* CADRE */
.cadre{border-bottom:1px solid var(--line);background:var(--graphite-2);}
.cadre-grid{display:grid;grid-template-columns:340px 1fr;gap:56px;align-items:start;margin-top:20px;}
.cadre-grid+.cadre-grid{margin-top:72px;padding-top:72px;border-top:1px solid var(--line);}
.cadre-photo{border:1px solid var(--line);border-radius:6px;background:var(--graphite-3);aspect-ratio:4/5;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.cadre-photo .ph{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--slate-2);letter-spacing:.1em;text-align:center;}
.cadre-photo img{width:100%;height:100%;object-fit:cover;object-position:center top;}
/* Brand mark standing in for artwork not shot yet. Reads as deliberate furniture
   rather than an unfinished slot -- replace the <img> src with the real photo and
   drop the .ph-mark class when the media from the shoot lands. */
.ph-mark{width:88px;height:auto;opacity:.13;}
.cadre h3{font-size:26px;font-weight:800;text-transform:uppercase;letter-spacing:-.01em;}
.cadre .role{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--orange);letter-spacing:.1em;text-transform:uppercase;margin:8px 0 22px;}
.cadre p{color:var(--bone-dim);font-size:15.5px;max-width:64ch;}
.cadre p+p{margin-top:16px;}

/* CADRE — collective statement + founders grid */
.cadre-statement{max-width:76ch;border-left:2px solid var(--orange);padding-left:28px;margin-top:56px;}
.cadre-statement p{font-size:18px;color:var(--bone);line-height:1.65;}
.founders-grid{display:grid;grid-template-columns:1fr 1fr;gap:44px;margin-top:44px;}
.founder .cadre-photo{aspect-ratio:4/5;max-height:460px;}
.founder h3{font-size:24px;font-weight:800;text-transform:uppercase;letter-spacing:-.01em;margin-top:22px;}
.founder .role{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--orange);letter-spacing:.1em;text-transform:uppercase;margin-top:8px;}
.founder-email{display:inline-block;font-family:'JetBrains Mono',monospace;font-size:12.5px;color:var(--bone-dim);letter-spacing:.03em;margin-top:10px;border-bottom:1px solid var(--line);padding-bottom:2px;transition:color .2s,border-color .2s;}
.founder-email:hover{color:var(--orange);border-color:var(--orange);}
.cadre-grid .founder-email{margin-bottom:22px;}
.founder-bio{margin-top:22px;}
@media(max-width:900px){ .founders-grid{grid-template-columns:1fr;} }

/* TRAINING page — two-up coaching grid + app tiers note */
.two-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:52px;}
.tiers-note{font-family:'JetBrains Mono',monospace;font-size:13px;color:var(--slate-2);max-width:72ch;line-height:1.75;margin-top:34px;}
.tiers-note b{color:var(--orange);font-weight:700;}
@media(max-width:900px){ .two-grid{grid-template-columns:1fr;} }

/* LOCATIONS */
.loc-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:52px;}
.loc-card{border:1px solid var(--line);border-radius:6px;background:var(--graphite-2);padding:30px 28px 34px;}
.loc-card .idx{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--orange);letter-spacing:.1em;}
.loc-card h3{font-size:20px;font-weight:800;text-transform:uppercase;margin:16px 0 6px;}
.loc-card .geo{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--slate-2);letter-spacing:.06em;margin-bottom:14px;}
.loc-card p{font-size:14.5px;color:var(--bone-dim);}
.loc-card .addr{font-size:12px;color:var(--slate-2);letter-spacing:.02em;margin-top:10px;}
.loc-card .rule{height:2px;width:38px;background:var(--orange);margin-top:22px;}

/* CTA BAND */
.cta{position:relative;overflow:hidden;border-bottom:1px solid var(--line);}
.cta .wrap{text-align:center;position:relative;z-index:1;} /* above .cta-bg, which is positioned and opaque -- without this the closing headline and buttons were painted over (bug since v1, found 2026-09-16) */
.cta-bg{position:absolute;inset:0;background:radial-gradient(700px 300px at 50% 120%,rgba(201,83,30,.18),transparent 70%),var(--graphite);}
.cta h2{margin:0 auto;}
.cta .lead{margin:22px auto 34px;}
.cta-btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}

/* FOOTER */
footer{background:var(--graphite);padding:64px 0 40px;}
.foot-grid{display:grid;grid-template-columns:1.7fr 1.5fr 1fr 1fr;gap:40px;padding-bottom:44px;border-bottom:1px solid var(--line);}
.foot-brand .name{font-weight:800;letter-spacing:.14em;text-transform:uppercase;font-size:16px;}
.foot-brand .tl{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--slate-2);margin-top:12px;letter-spacing:.05em;}
.foot-col .foot-h{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--slate-2);margin-bottom:16px;line-height:normal;max-width:none;}
.foot-col a{display:block;font-size:14px;color:var(--bone-dim);margin-bottom:10px;transition:color .2s;}
.foot-col a:hover{color:var(--orange);}
/* FREE-MONTH OFFER — floating widget (8 Sep 2026)
   Zac's call after seeing the inline version: he wants it floating, with the plan
   chosen right in the widget. It stays out of the way on arrival (appears only after
   the reader has scrolled or lingered), closes for good once dismissed, and on a phone
   sits as a compact bar at the bottom rather than a card covering the content. */
.fm-widget{
  position:fixed;right:20px;bottom:20px;z-index:60;width:330px;max-width:calc(100vw - 32px);
  background:var(--graphite-2);border:1px solid var(--line);border-radius:8px;
  padding:20px 20px 18px;box-shadow:0 18px 44px rgba(0,0,0,.5);
  opacity:0;transform:translateY(14px);
  transition:opacity .32s var(--ease-out),transform .32s var(--ease-out);
}
/* Once it has arrived, a slow 4px drift so the eye catches it in peripheral vision
   without it ever competing with the page. The 0.5s delay lets the entrance transition
   finish before the animation takes the transform over. It pauses the moment a cursor or
   keyboard focus lands on it -- nothing should be moving while someone is trying to click
   a button inside it. */
.fm-widget.in{opacity:1;transform:none;animation:fm-float 5.5s ease-in-out .5s infinite;}
.fm-widget.in:hover,.fm-widget.in:focus-within{animation-play-state:paused;}
@keyframes fm-float{
  0%,100%{transform:translateY(0);}
  50%{transform:translateY(-4px);}
}
.fm-close{
  position:absolute;top:8px;right:10px;background:none;border:none;cursor:pointer;
  color:var(--slate-2);font-size:20px;line-height:1;padding:4px 6px;transition:color .2s;
}
.fm-close:hover{color:var(--bone);}
.fm-title{font-size:17px;font-weight:800;text-transform:uppercase;letter-spacing:-.01em;padding-right:20px;}
.fm-sub{font-size:13px;color:var(--bone-dim);margin-top:6px;line-height:1.5;}
@media(max-width:600px){ .fm-long{display:none;} }   /* phones get the short line: the full one ran three lines and the box covered ~a third of the screen */
.fm-tiers{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:14px 0 12px;}
.fm-tier{
  background:var(--graphite-3);border:1px solid var(--line);border-radius:4px;cursor:pointer;
  padding:9px 8px;text-align:left;color:var(--bone-dim);font-family:inherit;
  transition:border-color .2s var(--ease-out),color .2s var(--ease-out);
}
.fm-tier:hover{border-color:var(--slate);}
.fm-tier.on{border-color:var(--orange);color:var(--bone);}
.fm-tier-n{display:block;font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;}
.fm-tier-p{display:block;font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--slate-2);margin-top:3px;}
.fm-tier.on .fm-tier-p{color:var(--orange);}
.fm-form{display:flex;gap:8px;flex-wrap:wrap;}
.fm-form input[type=email]{
  flex:1 1 100%;background:var(--graphite);border:1px solid var(--slate);border-radius:3px;
  color:var(--bone);font-family:inherit;font-size:14px;padding:10px 12px;
  transition:border-color .2s var(--ease-out);
}
.fm-form input[type=email]::placeholder{color:var(--slate-2);}
.fm-form input[type=email]:focus{outline:none;border-color:var(--orange);}
.fm-form .btn{flex:1 1 100%;text-align:center;}
/* Honeypot: off-screen rather than display:none, so bots that skip hidden fields still fill it. */
.signup-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;}
.fm-msg{font-size:13px;color:var(--bone-dim);line-height:1.5;}
.fm-msg:not(:empty){margin-top:12px;}
.fm-msg.ok{color:var(--bone);}
.fm-msg.err{color:var(--orange);}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}
@media(max-width:640px){
  .fm-widget{left:10px;right:10px;bottom:10px;width:auto;max-width:none;padding:16px 16px 14px;}
  .fm-tiers{margin:12px 0 10px;}
}
@media(prefers-reduced-motion:reduce){
  .fm-widget{transition:none;}
  .fm-widget.in{animation:none;}
}

.foot-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;padding-top:26px;font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--slate-2);letter-spacing:.05em;}
.foot-ai{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:18px;padding-top:18px;border-top:1px solid var(--line);}
.foot-ai-label{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--slate-2);}
.foot-ai-links{display:flex;flex-wrap:wrap;gap:8px;}
.foot-ai-links a{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--bone-dim);border:1px solid var(--line);border-radius:3px;padding:6px 11px;transition:color .2s,border-color .2s;}
.foot-ai-links a:hover{color:var(--orange);border-color:var(--orange);}

/* ============================================================
   CONTENT NEEDED — build-checklist placeholder block.
   Loud on purpose. Must never survive to a live launch.
   The launch checklist greps for "content-needed"; if any
   remain, do not remove noindex.
   ============================================================ */
.content-needed{
  border:2px dashed var(--orange);
  border-radius:6px;
  background:repeating-linear-gradient(135deg,rgba(201,83,30,.08) 0,rgba(201,83,30,.08) 12px,rgba(201,83,30,.03) 12px,rgba(201,83,30,.03) 24px);
  padding:22px 24px;
  margin:26px 0;
}
.content-needed .cn-tag{
  display:inline-flex;align-items:center;gap:8px;
  font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:700;
  letter-spacing:.16em;text-transform:uppercase;color:var(--graphite);
  background:var(--orange);padding:5px 10px;border-radius:3px;margin-bottom:14px;
}
.content-needed .cn-what{font-size:14.5px;color:var(--bone);line-height:1.65;}
.content-needed .cn-need{
  font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--bone-dim);
  line-height:1.8;margin-top:14px;padding-top:14px;border-top:1px solid rgba(201,83,30,.35);
}
.content-needed .cn-need b{color:var(--orange);}
.content-needed.sample{border-style:solid;border-color:var(--line);background:var(--graphite-2);}
.content-needed.sample .cn-tag{background:var(--slate);}

/* PASSWORD GATE */
#c1-gate{position:fixed;inset:0;z-index:9999;background:var(--graphite);display:flex;align-items:center;justify-content:center;padding:24px;}
#c1-gate .gate-card{width:100%;max-width:380px;text-align:center;}
#c1-gate .mark{font-family:'JetBrains Mono',monospace;font-weight:700;font-size:13px;color:var(--graphite);background:var(--orange);padding:6px 9px;border-radius:3px;letter-spacing:.05em;display:inline-block;}
#c1-gate h2{font-size:22px;margin:24px 0 6px;text-transform:uppercase;max-width:none;}
#c1-gate .gate-logo{width:210px;height:auto;margin:0 auto 18px;}
#c1-gate p{color:var(--slate-2);font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:.08em;text-transform:uppercase;margin-bottom:26px;}
#c1-gate input{width:100%;background:var(--graphite-2);border:1px solid var(--line);border-radius:4px;color:var(--bone);font-family:'JetBrains Mono',monospace;font-size:15px;padding:14px 16px;text-align:center;letter-spacing:.1em;}
#c1-gate input:focus{outline:none;border-color:var(--orange);}
#c1-gate button{width:100%;margin-top:12px;}
#c1-gate .err{color:var(--orange);font-size:11px;min-height:16px;margin-top:14px;letter-spacing:.1em;}
html.c1-locked{overflow:hidden;height:100%;}
html.c1-locked body>*:not(#c1-gate){display:none !important;}

/* MOTION — scroll/entrance reveal, applied via assets/js/motion.js.
   No HTML edits needed: motion.js targets existing card/section
   classes and adds .reveal, then .is-visible once in view. */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .6s var(--ease-out),transform .6s var(--ease-out);transition-delay:var(--reveal-delay,0ms);will-change:opacity,transform;}
.reveal.is-visible{opacity:1;transform:translateY(0);}

/* Cross-document view transitions -- native cross-fade between pages on
   same-origin navigation. One rule, no JS, and browsers that don't
   support it just navigate normally (no downside). Both source and
   destination page need this rule present, which they do since every
   page shares this stylesheet. */
@view-transition{
  navigation:auto;
}
::view-transition-old(root),
::view-transition-new(root){
  animation-duration:.32s;
  animation-timing-function:var(--ease-out);
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  .reveal{opacity:1;transform:none;transition:none;}
  .disc-card,.cls-card,.btn{transition:border-color .2s ease,background-color .2s ease;}
  .disc-card:hover,.cls-card:hover,.btn:active{transform:none;}
  .nav-underline{display:none;}
  ::view-transition-group(*),
  ::view-transition-old(*),
  ::view-transition-new(*){
    animation:none !important;
  }
}

@media(max-width:900px){
  .nav-links{display:none;}
  .nav-toggle{display:block;}
  .metrics-in{grid-template-columns:repeat(2,1fr);}
  .metric:nth-child(2){border-right:none;}
  .disc-grid,.cls-grid,.loc-grid{grid-template-columns:1fr;}
  .method-grid,.cadre-grid,.course-grid{grid-template-columns:1fr;gap:32px;}
  .course-facts{position:static;}
  .values-row{grid-template-columns:repeat(2,1fr);}
  .foot-grid{grid-template-columns:1fr 1fr;}
}

/* ============================================================
   THE STANDARD — Draft B (2026-09-16): homepage + Method page
   ============================================================ */
h2 .o{color:var(--orange);}
.mission h2 + blockquote{margin-top:26px;}
.std-crit{margin-top:26px;border-left:2px solid var(--orange);padding:4px 0 4px 16px;font-size:17px;color:var(--bone);max-width:56ch;}
.loop-env{margin-top:22px;font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--slate-2);max-width:48ch;line-height:1.7;}
.cta h2.cta-lines{max-width:24ch;}
.cta .lead.cta-second{color:var(--bone);font-size:19px;font-weight:600;}
.ladder{display:grid;grid-template-columns:repeat(4,1fr);margin-top:30px;border:1px solid var(--line);border-radius:6px;overflow:hidden;}
.ladder > div{padding:18px 20px;border-left:1px solid var(--line);background:var(--graphite-2);}
.ladder > div:first-child{border-left:none;}
.ladder .lv{display:block;font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--slate-2);}
.ladder .tm{display:block;font-family:'JetBrains Mono',monospace;font-size:28px;font-weight:700;color:var(--bone);margin-top:6px;font-variant-numeric:tabular-nums;}
.sub-h{font-size:18px;font-weight:800;text-transform:uppercase;letter-spacing:.01em;margin:48px 0 4px;}
.ex-note{margin-top:14px;font-size:13px;color:var(--slate-2);}
.env-scroll{overflow-x:auto;margin-top:20px;border:1px solid var(--line);border-radius:6px;}
.env-table{border-collapse:collapse;width:100%;min-width:720px;font-size:14px;}
.env-table th,.env-table td{padding:14px 16px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line);}
.env-table thead th{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--orange);background:var(--graphite-2);font-weight:700;}
.env-table tbody th{font-weight:700;color:var(--bone);white-space:nowrap;background:var(--graphite-2);}
.env-table td{color:var(--bone-dim);}
.env-table tr:last-child th,.env-table tr:last-child td{border-bottom:none;}
.swipe-hint{display:none;margin-top:14px;font-size:12px;color:var(--slate-2);}
@media(max-width:700px){
  .swipe-hint{display:block;}
  .ladder{grid-template-columns:1fr 1fr;}
  .ladder > div:nth-child(3){border-left:none;}
  .ladder > div:nth-child(n+3){border-top:1px solid var(--line);}
}

/* Coaches side by side (2026-09-17): photo on top, bio underneath, equal weight. */
.coach-cols{display:grid;grid-template-columns:1fr 1fr;gap:44px;margin-top:20px;align-items:start;}
.coach{display:grid;gap:0;min-width:0;}
.coach .cadre-photo{aspect-ratio:4/5;}
.coach-body{padding-top:22px;}
.coach-body h3{font-size:22px;font-weight:800;text-transform:uppercase;letter-spacing:-.01em;}
.coach-body .role{margin-top:6px;}
.coach-body p{margin-top:14px;}
@media(max-width:900px){ .coach-cols{grid-template-columns:1fr;gap:56px;} }

/* ============================================================
   CLASS SCHEDULE — /courses/#schedule, rendered by assets/js/classes.js.
   Month-grouped rows: date block, optional photo, class, price. A weekend
   is one row. Chosen 2026-09-17 over a month grid and a timeline because it
   carries the same information on a phone as on a laptop.
   ============================================================ */
/* Class schedule layout: filter rail + list + cart (rebuilt 2026-10-01).
   The cart lives inside the rail on purpose -- a fixed bottom bar would
   collide with the free-month widget in the bottom-right corner. */
.cs-layout{display:grid;grid-template-columns:232px 1fr;gap:34px;align-items:start;}
.cs-layout.cs-norail{grid-template-columns:1fr;}
.cs-rail{position:sticky;top:96px;}
.cs-rail-in{display:grid;gap:20px;}
.cs-list{min-width:0;}
.cs-fgroup h4{font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--orange);margin:0 0 9px;}
.cs-fgroup+.cs-fgroup{margin-top:18px;}
.cs-fopt{display:flex;align-items:center;gap:9px;width:100%;background:none;border:0;padding:6px 0;cursor:pointer;color:var(--bone-dim);font:inherit;font-size:14px;text-align:left;}
.cs-fopt:hover{color:var(--bone);}
.cs-fopt.on{color:var(--bone);}
.cs-fbox{width:15px;height:15px;flex:none;border:1px solid var(--line);border-radius:3px;background:var(--graphite-2);position:relative;transition:background-color .15s,border-color .15s;}
.cs-fopt.on .cs-fbox{background:var(--orange);border-color:var(--orange);}
.cs-fopt.on .cs-fbox::after{content:"";position:absolute;left:4px;top:1px;width:4px;height:8px;border:solid var(--graphite);border-width:0 2px 2px 0;transform:rotate(45deg);}
.cs-fopt.cs-f0{opacity:.45;}
.cs-flab{flex:1 1 auto;min-width:0;}
.cs-fn{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--slate-2);font-variant-numeric:tabular-nums;}
.cs-fclear{margin-top:14px;background:none;border:0;padding:0;color:var(--orange);font:inherit;font-size:13px;cursor:pointer;text-decoration:underline;text-underline-offset:3px;}
.cs-fopt:focus-visible,.cs-fclear:focus-visible,.cs-add:focus-visible,.cs-ci-x:focus-visible{outline:2px solid var(--orange);outline-offset:2px;}

.cs-cart{border:1px solid var(--line);border-radius:6px;background:var(--graphite-2);padding:16px 15px;}
.cs-cart h4{font-family:'JetBrains Mono',monospace;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--bone);margin:0 0 11px;display:flex;align-items:center;gap:8px;}
.cs-cn{font-size:10px;background:var(--orange);color:var(--graphite);border-radius:999px;padding:1px 7px;}
.cs-cart-empty p{margin:0;font-size:13px;color:var(--slate-2);line-height:1.5;}
.cs-citems{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:9px;}
.cs-citems li{display:grid;grid-template-columns:auto 1fr auto auto;gap:8px;align-items:baseline;font-size:13px;}
.cs-ci-d{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--orange);white-space:nowrap;}
.cs-ci-t{color:var(--bone-dim);min-width:0;line-height:1.35;}
.cs-ci-p{font-family:'JetBrains Mono',monospace;color:var(--bone);font-variant-numeric:tabular-nums;}
.cs-ci-x{background:none;border:0;color:var(--slate-2);font-size:17px;line-height:1;padding:0 2px;cursor:pointer;}
.cs-ci-x:hover{color:var(--orange);}
.cs-sum{display:flex;justify-content:space-between;gap:12px;font-size:13px;color:var(--slate-2);padding:4px 0;border-top:1px solid var(--line);font-variant-numeric:tabular-nums;}
.cs-sum-off{color:var(--orange);}
.cs-sum-total{color:var(--bone);font-weight:700;font-family:'JetBrains Mono',monospace;}
.cs-nudge{margin:9px 0 0;font-size:12.5px;color:var(--slate-2);line-height:1.45;}
.cs-cacts{display:grid;gap:8px;margin-top:13px;}
.cs-cacts .btn{width:100%;text-align:center;}
.cs-clear{font-size:12.5px;padding:7px 10px;}

.cs-item{position:relative;}
.cs-item.cs-picked .cs-row{background:var(--graphite-2);box-shadow:inset 3px 0 0 var(--orange);}
.cs-add{display:block;margin:-6px 0 12px auto;background:none;border:1px solid var(--line);border-radius:999px;padding:6px 14px;font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--bone-dim);cursor:pointer;transition:border-color .2s,color .2s,background-color .2s;}
.cs-add:hover{border-color:var(--orange);color:var(--orange);}
.cs-add.on{background:var(--orange);border-color:var(--orange);color:var(--graphite);}

@media(max-width:900px){
  .cs-layout{grid-template-columns:1fr;gap:22px;}
  .cs-rail{position:static;}
  .cs-rail-in{gap:16px;}
  .cs-add{margin-left:0;}
  /* Stacked checkboxes cost a whole screen before the first class shows up.
     Same controls, laid out as chips. */
  .cs-fgroup{display:flex;flex-wrap:wrap;align-items:center;gap:8px;}
  .cs-fgroup+.cs-fgroup{margin-top:14px;}
  .cs-fgroup h4{width:100%;margin:0;}
  .cs-fopt{width:auto;border:1px solid var(--line);border-radius:999px;padding:7px 13px;gap:6px;}
  .cs-fopt.on{background:var(--orange);border-color:var(--orange);color:var(--graphite);}
  .cs-fopt.on .cs-fn{color:var(--graphite);}
  .cs-fbox{display:none;}
}

.cs-filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:22px;}
.cs-chip{background:var(--graphite-2);border:1px solid var(--line);border-radius:999px;padding:8px 15px;font-size:13px;font-weight:600;color:var(--bone-dim);cursor:pointer;transition:border-color .2s,color .2s,background-color .2s;}
.cs-chip:hover{border-color:var(--slate-2);color:var(--bone);}
.cs-chip[aria-pressed="true"]{background:var(--bone);border-color:var(--bone);color:var(--graphite);}
.cs-chip:focus-visible,.cs-row:focus-visible{outline:2px solid var(--orange);outline-offset:2px;}
.cs-month{font-family:'JetBrains Mono',monospace;font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--orange);margin:26px 0 0;padding-bottom:8px;border-bottom:1px solid var(--line);}
.cs-month:first-of-type{margin-top:0;}
.cs-row{display:grid;grid-template-columns:auto auto 1fr auto;gap:18px;align-items:center;width:100%;text-align:left;background:none;border:0;border-bottom:1px solid var(--line);padding:16px 6px;cursor:pointer;color:var(--bone);font:inherit;transition:background-color .2s,box-shadow .2s;}
.cs-row:hover{background:var(--graphite-2);box-shadow:inset 3px 0 0 var(--orange);}
.cs-row.cs-on{background:var(--graphite-2);box-shadow:inset 3px 0 0 var(--orange);border-bottom-color:transparent;}
.cs-row.cs-dim{opacity:.55;}
.cs-row.cs-dim .cs-title{text-decoration:line-through;}
.cs-date{display:grid;justify-items:center;gap:1px;width:74px;background:var(--graphite-2);border:1px solid var(--line);border-radius:6px;padding:9px 4px;}
.cs-date.cs-two{border-color:var(--orange);background:linear-gradient(180deg,rgba(201,83,30,.16),transparent);}
.cs-dow{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--orange);}
.cs-dnum{font-family:'JetBrains Mono',monospace;font-size:22px;font-weight:700;line-height:1;font-variant-numeric:tabular-nums;}
.cs-date.cs-two .cs-dnum{font-size:16px;}
.cs-mon{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--slate-2);}
.cs-thumb{width:104px;aspect-ratio:8/5;border:1px solid var(--line);border-radius:4px;overflow:hidden;background:var(--graphite-3);}
.cs-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.cs-main{display:grid;gap:3px;min-width:0;}
.cs-title{font-size:16.5px;font-weight:700;line-height:1.25;}
.cs-meta{display:flex;flex-wrap:wrap;gap:3px 14px;font-size:13px;color:var(--slate-2);}
.cs-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:5px;}
.cs-tag{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.05em;padding:2px 8px;border-radius:999px;border:1px solid var(--line);color:var(--bone-dim);}
.cs-tag.cs-open{border-color:#3FA66A;color:#3FA66A;}
.cs-tag.cs-few{border-color:#D9A441;color:#D9A441;}
.cs-tag.cs-off{border-color:var(--slate);color:var(--slate-2);}
.cs-tag.cs-weekend{border-color:var(--orange);color:var(--orange);}
.cs-side{display:grid;justify-items:end;gap:5px;}
.cs-price{font-family:'JetBrains Mono',monospace;font-size:16px;font-weight:700;}
.cs-price s{color:var(--slate-2);font-weight:400;font-size:12.5px;margin-right:7px;}
.cs-go{font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--orange);}
.cs-detail{border:1px solid var(--orange);border-top:0;border-radius:0 0 6px 6px;background:var(--graphite-2);padding:20px 22px;margin-bottom:18px;display:grid;gap:12px;}
.cs-banner{width:100%;max-height:260px;object-fit:cover;border-radius:4px;display:block;}
.cs-detail p{font-size:14.5px;color:var(--bone-dim);max-width:70ch;}
.cs-days{margin:0;padding-left:18px;font-size:14px;color:var(--bone-dim);display:grid;gap:4px;}
.cs-facts{display:flex;flex-wrap:wrap;gap:6px 22px;font-size:13px;color:var(--slate-2);}
.cs-facts b{color:var(--bone);font-family:'JetBrains Mono',monospace;}
.cs-acts{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px;}
.cs-empty{border:1px dashed var(--line);border-radius:6px;padding:30px 26px;display:grid;gap:10px;justify-items:start;}
.cs-empty h3{font-size:19px;font-weight:800;text-transform:uppercase;letter-spacing:-.01em;}
.cs-empty p{font-size:14.5px;color:var(--bone-dim);max-width:62ch;}
.cs-courses-head{font-size:20px;font-weight:800;text-transform:uppercase;letter-spacing:.02em;margin:54px 0 -8px;padding-bottom:10px;border-bottom:1px solid var(--line);}
@media(max-width:760px){
  .cs-row{grid-template-columns:62px 1fr;gap:12px;align-items:start;}
  .cs-date{width:62px;}
  .cs-thumb{display:none;}
  .cs-side{grid-column:1/-1;justify-items:start;grid-auto-flow:column;align-items:center;gap:14px;margin-top:6px;}
}

/* METHOD BAND (2026-09-18) — homepage, directly under the hero, in the spot the four-number strip
   held. Columns follow the step count from data/method.json (--mb-n), so 4 or 5 both fit. */
.method-band{background:var(--graphite-2);border-bottom:1px solid var(--line);}
.method-band .wrap{padding-top:56px;padding-bottom:56px;}
.mb-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px 24px;flex-wrap:wrap;}
.mb-head .eyebrow{margin-bottom:0;}
.mb-head h2{font-size:clamp(22px,2.8vw,32px);max-width:none;}
.mb-steps{list-style:none;margin:30px 0 0;padding:0;display:grid;grid-template-columns:repeat(var(--mb-n,4),minmax(0,1fr));border:1px solid var(--line);border-radius:6px;overflow:hidden;}
.mb-step{display:grid;align-content:start;gap:8px;padding:22px 20px;border-left:1px solid var(--line);background:var(--graphite);}
.mb-step:first-child{border-left:none;}
.mb-n{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.14em;color:var(--slate-2);}
.mb-label{font-size:20px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--orange);}
.mb-short{font-size:14px;line-height:1.55;color:var(--bone-dim);}
.mb-foot{display:flex;align-items:center;justify-content:space-between;gap:16px 24px;flex-wrap:wrap;margin-top:24px;}
.mb-foot .loop-env{margin-top:0;}
@media(max-width:900px){
  .mb-steps{grid-template-columns:1fr 1fr;}
  .mb-step:nth-child(odd){border-left:none;}
  .mb-step:nth-child(n+3){border-top:1px solid var(--line);}
}
@media(max-width:520px){
  .mb-steps{grid-template-columns:1fr;}
  .mb-step{border-left:none;}
  .mb-step:nth-child(n+2){border-top:1px solid var(--line);}
  .mb-step{grid-template-columns:34px 1fr;column-gap:8px;}
  .mb-n{grid-row:span 2;padding-top:5px;}
}

/* ============================================================
   BACKGROUND VIDEO — site-wide rule (2026-09-19, Zac)
   Every video on the site behaves the same: pinned to the viewport, playing behind
   the page as the reader scrolls, with a shade (.bg-shade, opacity driven by
   assets/js/bg-video.js) that deepens past the header so the copy stays readable.
   body.bgv is added by that script; section fills go transparent so the video shows.
   Cards keep a near-solid fill of their own, and the footer stays solid so the page
   has a floor. Add a video by giving it data-bg-video and including bg-video.js.
   ============================================================ */
html:has(body.bgv){background:#101316;}
body.bgv{background:transparent;}
body.bgv .hero-video,
body.bgv .sub-video{position:fixed;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;background:#101316;}
body.bgv .hero-video{object-position:center 35%;}
body.bgv .sub-video{object-position:center 40%;}
body.bgv .bg-shade{position:fixed;inset:0;z-index:-1;background:#101316;opacity:0;pointer-events:none;}
body.bgv .method-band,
body.bgv .mission,
body.bgv .disc,
body.bgv .classes,
body.bgv .cadre,
body.bgv .method,
body.bgv .values,
body.bgv .subhero{background:transparent;}
body.bgv .cta-bg{background:radial-gradient(700px 300px at 50% 120%,rgba(201,83,30,.18),transparent 70%);}
body.bgv .disc-card,
body.bgv .cls-card,
body.bgv .mb-step{background:rgba(27,31,35,.86);}
body.bgv .cadre-photo{background:rgba(32,37,42,.9);}
body.bgv .cs-row:hover,
body.bgv .cs-row.cs-on,
body.bgv .cs-detail{background:rgba(27,31,35,.86);}
body.bgv .cs-date,
body.bgv .cs-empty{background:rgba(27,31,35,.72);}
/* the header's own shade stops fading at its bottom edge -- otherwise it drew a dark stripe
   where the page shade takes over -- and is masked out over its last fifth for a clean handoff */
body.bgv .hero{border-bottom-color:transparent;}
body.bgv .hero:has(.hero-video) .hero-bg{background:
   linear-gradient(90deg, rgba(16,19,22,.94) 0%, rgba(16,19,22,.86) 46%, rgba(16,19,22,.45) 78%, rgba(16,19,22,.20) 100%),
   linear-gradient(180deg, rgba(16,19,22,.35) 0%, rgba(16,19,22,0) 30%);}
body.bgv .hero .hero-bg,
body.bgv .subhero-vid .sub-shade{-webkit-mask-image:linear-gradient(180deg,#000 78%,transparent 100%);mask-image:linear-gradient(180deg,#000 78%,transparent 100%);}
@media(max-width:900px){
  body.bgv .hero:has(.hero-video) .hero-bg{background:linear-gradient(180deg, rgba(16,19,22,.55) 0%, rgba(16,19,22,.70) 100%);}
}
@media(prefers-reduced-motion:reduce){ body.bgv .bg-shade{opacity:.8 !important;} }

/* TRAINING HEADER — /courses/. Sizing plus its own shade over the page-wide one; the video and
   scroll behaviour come from the shared rule above. */
.subhero-vid{min-height:clamp(420px,62vh,620px);display:flex;align-items:center;background:#101316;}
.subhero-vid .wrap{width:100%;}
.subhero-vid .sub-shade{position:absolute;inset:0;z-index:1;pointer-events:none;background:
   linear-gradient(90deg, rgba(16,19,22,.90) 0%, rgba(16,19,22,.72) 42%, rgba(16,19,22,.30) 78%, rgba(16,19,22,.22) 100%),
   linear-gradient(180deg, rgba(16,19,22,.30) 0%, rgba(16,19,22,0) 35%);}
.subhero-vid .wrap{position:relative;z-index:2;}
@media(max-width:900px){ .subhero-vid .sub-shade{background:linear-gradient(180deg, rgba(16,19,22,.62) 0%, rgba(16,19,22,.76) 100%);} }
@media(prefers-reduced-motion:reduce){ .sub-video{display:none;} .subhero-vid{background:#101316 url(/assets/video/training-a-poster.jpg) center 40%/cover no-repeat;} }

/* The Criterion One Performance Loop — drawn loop beside the five definitions (Mike's ask,
   founders call 2026-09-22). The definitions are NOT replaced by it: both render from
   data/method.json, so the wording can only ever be changed in one place. */
.loop-visual{border:0;background:transparent;aspect-ratio:auto;padding:0;}
.loop-svg{width:100%;max-width:460px;height:auto;display:block;margin:0 auto;}
@media(max-width:900px){ .loop-svg{max-width:360px;} }

/* Homepage: the loop sits between the five steps and the environments line. */
.mb-loop{margin:34px auto 6px;max-width:420px;}
.mb-loop .loop-svg{max-width:420px;}
@media(max-width:760px){ .mb-loop{max-width:330px;} }

/* ARTICLES (2026-10-07) — long-form answer pages under /articles/.
   Deliberately built on the existing .prose / .env-table / .disc-card primitives so an
   article inherits the locked visual system instead of introducing a second one. */
.prose h3{font-size:17px;font-weight:700;text-transform:none;margin:30px 0 10px;letter-spacing:0;}
.prose ul,.prose ol{margin:16px 0 0 20px;max-width:68ch;}
.prose li{color:var(--bone-dim);font-size:16px;margin-bottom:10px;}
.prose li b,.prose p b{color:var(--bone);font-weight:600;}
.prose a{color:var(--orange);border-bottom:1px solid rgba(201,83,30,.42);}
.prose a:hover{border-bottom-color:var(--orange);}
.byline{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin-top:28px;font-family:'JetBrains Mono',monospace;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--slate-2);}
.byline b{color:var(--bone);font-weight:700;}
.byline .sep{color:var(--line);}
.art-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:48px;}
.art-grid .disc-card h3{font-size:19px;text-transform:none;letter-spacing:-.005em;}
.art-grid .soon{opacity:.52;}
.art-grid .soon:hover{transform:none;border-color:var(--line);}
@media(max-width:900px){ .art-grid{grid-template-columns:1fr;} }


/* ===== Class standing (coach dashboard My Training, and the account page) =====
   Shared with /assets/js/class-standing.js. The One Signal Rule applies: orange marks
   what still needs work and fades as you climb, so the top rung is the absence of the
   signal rather than a second hue. One hue plus lightness is colourblind-safe. */
  .cs-grid{width:100%;border-collapse:separate;border-spacing:3px;font-size:12px;}
  .cs-grid th{font-family:'JetBrains Mono',monospace;font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--slate-2);font-weight:500;padding:0 0 4px;text-align:center;}
  .cs-grid th.rh{text-align:right;padding-right:9px;}
  .cs-grid td{text-align:center;padding:9px 5px;border-radius:3px;background:rgba(242,238,229,.04);color:var(--slate-2);font-family:'JetBrains Mono',monospace;font-size:11px;}
  .cs-grid td.rh{text-align:right;background:none;font-family:inherit;font-size:12.5px;color:var(--bone-dim);padding-right:9px;white-space:nowrap;}
  .cs-grid td.hit{cursor:pointer;}
  .cs-grid td.hit:hover{outline:1px solid var(--orange);}
  /* The One Signal Rule: orange marks what still needs work, and it fades as you climb.
     Reaching the top rung is the ABSENCE of the signal, not a second colour. One hue plus
     lightness is also colourblind-safe by construction. */
  .cs-lv0{background:rgba(201,83,30,.85)!important;color:#fff;font-weight:700;}
  .cs-lv1{background:rgba(201,83,30,.60)!important;color:var(--bone);font-weight:600;}
  .cs-lv2{background:rgba(201,83,30,.38)!important;color:var(--bone);}
  .cs-lv3{background:rgba(201,83,30,.22)!important;color:var(--bone);}
  .cs-lv4{background:rgba(201,83,30,.10)!important;color:var(--bone-dim);}
  .cs-lv5{background:transparent!important;color:var(--bone);border:1px solid var(--line);}
  .cs-bullet{display:grid;grid-template-columns:168px 1fr 78px;gap:13px;align-items:center;margin-bottom:11px;}
  .cs-lab{font-size:12.5px;color:var(--slate-2);text-align:right;line-height:1.22;}
  .cs-lab b{color:var(--bone);font-weight:600;display:block;}
  .cs-plot{position:relative;height:21px;}
  .cs-bands{position:absolute;inset:0;display:flex;border-radius:2px;overflow:hidden;background:rgba(242,238,229,.04);}
  .cs-bands i{display:block;height:100%;}
  .cs-bar{position:absolute;left:0;top:6px;height:9px;background:var(--orange);border-radius:0 2px 2px 0;box-shadow:0 0 0 1.5px var(--graphite-2);}
  .cs-bar.over{background:var(--bone-dim);}
  .cs-key i.cs-lv5{border:1px solid var(--line);}
  .cs-scroll{overflow-x:auto;}
  .cs-detail{background:rgba(242,238,229,.03);border:1px solid var(--line);border-left:2px solid var(--orange);border-radius:3px;padding:15px 17px;margin-top:12px;}
  .cs-detail h3{margin:0 0 6px;font-size:14px;color:var(--bone);}
  .cs-sub{color:var(--bone-dim);font-size:13px;margin:0 0 12px;}
  .cs-list{margin:0 0 12px;padding-left:18px;font-size:13.5px;color:var(--bone-dim);line-height:1.6;}
  .cs-cue{border-left:2px solid var(--line);padding-left:11px;white-space:pre-line;color:var(--bone-dim);font-size:12.5px;margin:0 0 6px;}
  .cs-src{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--slate-2);letter-spacing:.04em;margin:0;}
  .cs-h{font-size:14px;text-transform:uppercase;letter-spacing:.06em;color:var(--bone);margin:26px 0 6px;}

/* ── Ask the guide ────────────────────────────────────────────────────────────
   Shared with /assets/js/guide-ask.js, used on /coach/ and /coach/guide/.
   A search field, not a chat window: one box, answers underneath, nothing to
   scroll back through. Orange stays on the one thing that is a signal — the
   section the answer came from. */
  .ga-box{border:1px solid var(--line);border-radius:6px;background:var(--graphite-2);padding:20px 22px;margin:0 0 22px;}
  .ga-label{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--slate-2);margin:0 0 9px;}
  .ga-input{width:100%;box-sizing:border-box;background:var(--graphite-3);border:1px solid var(--line);border-radius:4px;color:var(--bone);font-family:inherit;font-size:15px;padding:11px 13px;}
  .ga-input::placeholder{color:var(--slate-2);}
  .ga-input:focus{outline:none;border-color:var(--orange);}
  .ga-hint{font-size:12.5px;color:var(--slate-2);margin:8px 0 0;}
  .ga-out:empty{display:none;}
  .ga-out{margin-top:14px;}
  .ga-list{display:flex;flex-direction:column;gap:1px;}
  .ga-hit{display:flex;flex-direction:column;align-items:flex-start;gap:2px;width:100%;text-align:left;background:rgba(242,238,229,.03);border:1px solid var(--line);border-radius:3px;padding:10px 13px;cursor:pointer;font-family:inherit;}
  .ga-hit:hover,.ga-hit:focus-visible{border-color:var(--orange);outline:none;}
  .ga-hit-t{font-size:14px;color:var(--bone);}
  .ga-hit-s{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--slate-2);}
  .ga-wait{font-size:13.5px;color:var(--slate-2);margin:0;}
  .ga-err{font-size:13.5px;color:var(--bone-dim);margin:0;}
  .ga-answer{border-left:2px solid var(--orange);padding-left:14px;}
  .ga-answer p{font-size:14.5px;line-height:1.65;color:var(--bone-dim);margin:0 0 9px;}
  .ga-answer p:last-child{margin-bottom:0;}
  .ga-answer b{color:var(--bone);font-weight:600;}
  .ga-steps{margin:0 0 9px;padding-left:20px;}
  .ga-steps li{font-size:14.5px;line-height:1.65;color:var(--bone-dim);margin-bottom:5px;}
  .ga-steps li:last-child{margin-bottom:0;}
  .ga-src{font-size:12.5px;color:var(--slate-2);margin:11px 0 0;}
  .ga-src a{color:var(--orange);}
  @media (max-width:640px){ .ga-box{padding:17px 15px;} }