/* XINNIX — shared site stylesheet.
   Section 1 is the approved reference design system, extracted verbatim.
   Section 2 propagates that same system to the interior pages: no new
   colors, fonts, radii, or button styles are introduced. */
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@400;500;600&display=swap');

  :root{
    --white:#FFFFFF;
    --paper:#F6F6F7;        /* soft editorial ground */
    --ink:#0E0F11;          /* near-black text */
    --grey:#6C6F75;         /* secondary text */
    --line:#E7E8EA;
    --black:#0B0B0C;        /* cinematic ground */
    --cin-dim:#9A9DA3;      /* dim text on black */
    --cin-light:#D8DADD;
    --navy:#003466;         /* the brand — accents in the light */
    --navy-deep:#002A52;
    --warm:#FFE9CF;         /* warm stage light, inside imagery only */
    --r:20px;               /* card radius */
    --maxw:1200px;
  }
  *{box-sizing:border-box;margin:0;padding:0}
  html{scroll-behavior:smooth}
  body{font-family:'Hanken Grotesk',system-ui,sans-serif;background:var(--white);color:var(--ink);-webkit-font-smoothing:antialiased;overflow-x:hidden}
  ::selection{background:var(--navy);color:#fff}

  /* ===== NAV — light, clean, centered crest ===== */
  nav{position:fixed;top:0;left:0;right:0;z-index:60;display:flex;align-items:center;
    padding:14px clamp(20px,4vw,44px);gap:clamp(22px,3.5vw,44px);background:rgba(255,255,255,.86);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
  .nav-left{display:flex;gap:26px;align-items:center}
  .nav-right{display:flex;gap:20px;align-items:center;margin-left:auto}
  .nav-left a,.nav-right a:not(.pill){color:var(--grey);text-decoration:none;font-size:14px;font-weight:500;transition:color .2s}
  .nav-left a:hover,.nav-right a:hover{color:var(--ink)}
  .crest{display:flex;align-items:center;text-decoration:none;color:var(--ink);flex-shrink:0}
  .crest .logo-main{width:138px;height:auto;display:block}
  .pill{font-weight:600;font-size:14px;border-radius:99px;padding:10px 20px;text-decoration:none;transition:opacity .2s,background .2s,border-color .2s,color .2s;display:inline-block}
  .pill.dark{background:var(--ink);color:#fff}
  .pill.dark:hover{background:#000}
  .pill.navy{background:var(--navy);color:#fff}
  .pill.navy:hover{background:var(--navy-deep)}
  .pill.white{background:#fff;color:var(--ink)}
  .pill.white:hover{opacity:.88}
  .pill.ghost-dark{border:1px solid rgba(255,255,255,.35);color:#fff}
  .pill.ghost-dark:hover{border-color:#fff}
  @media(max-width:900px){nav{gap:16px}.nav-left{gap:16px}.nav-left a,.nav-right a:not(.pill){font-size:13px}.crest .logo-main{width:112px}}
  @media(max-width:680px){.nav-left{display:none}.nav-right a:not(.pill){display:none}}

  /* ===== HERO — the black cinematic card (Robbins pattern) ===== */
  .hero-wrap{padding:86px clamp(14px,2.5vw,28px) clamp(18px,3vw,28px)}
  .hero{position:relative;min-height:min(86vh,860px);border-radius:calc(var(--r) + 6px);overflow:hidden;
    display:flex;flex-direction:column;justify-content:flex-end;padding:clamp(26px,4vw,56px);isolation:isolate;background:var(--black)}
  /* THE ONE ASSET: assets/casey-hero.jpg — Casey on a dark stage, warm spotlight, right of center */
  .hero .photo{position:absolute;inset:0;z-index:-3;width:100%;height:100%;object-fit:cover;object-position:70% 26%;
    filter:saturate(.9) contrast(1.1) brightness(.85)}
  /* Cinematic hero motion (CSS): a slow, continuous Ken Burns push on the
     `scale` property (eased, seamless loop), plus a title-sequence fade in
     from black on load. The motion script layers parallax + a scroll-past
     zoom on `transform`, which composes with this CSS `scale` (they are
     separate properties). The ~1.10 floor keeps the image oversized so the
     parallax translate never reveals an edge. */
  .hero .photo{transform-origin:center;
    animation:heroKenBurns 27s ease-in-out infinite, heroFadeIn 1.2s ease-out both}
  @keyframes heroKenBurns{0%{scale:1.10}50%{scale:1.18}100%{scale:1.10}}
  @keyframes heroFadeIn{from{opacity:0}to{opacity:1}}
  /* descend-into-cloud veil — the motion script raises its opacity as the
     hero scrolls past, deepening the darkness under the outgoing content.
     Opacity-only (compositor-friendly); sits above the image, below text. */
  .hero-veil{position:absolute;inset:0;z-index:1;pointer-events:none;
    background:#05070B;opacity:0;will-change:opacity}
  .hero .placeholder{position:absolute;inset:0;z-index:-4;background:
    radial-gradient(34% 46% at 71% 32%, rgba(255,233,207,.18), rgba(255,233,207,.05) 48%, transparent 68%),
    linear-gradient(180deg, #101010 0%, #151311 55%, #0B0B0C 100%)}
  .hero .placeholder::before{content:"";position:absolute;left:63%;top:-8%;width:17%;height:72%;
    background:linear-gradient(180deg, rgba(255,233,207,.15), rgba(255,233,207,.03) 60%, transparent);transform:skewX(-6deg);filter:blur(16px)}
  .figure{position:absolute;left:68%;bottom:28%;z-index:-3;transform:translateX(-50%)}
  .figure svg{width:clamp(100px,13vw,180px);height:auto;filter:drop-shadow(0 12px 55px rgba(0,0,0,.85))}
  .asset-note{position:absolute;right:clamp(20px,4vw,48px);top:20px;z-index:-2;
    font-size:9.5px;letter-spacing:.1em;color:var(--cin-dim);opacity:.65;text-transform:uppercase;max-width:190px;text-align:right;line-height:1.7}
  .hero::after{content:"";position:absolute;inset:0;z-index:-1;
    background:linear-gradient(200deg, rgba(6,6,7,.1) 22%, rgba(6,6,7,.62) 58%, rgba(6,6,7,.93) 100%)}

  .hero-inner{position:relative;z-index:2;max-width:640px;
    opacity:0;transform:translateY(12px);animation:rise 1s cubic-bezier(.2,.7,.2,1) .1s forwards}
  @keyframes rise{to{opacity:1;transform:none}}
  .eyebrow{font-weight:600;text-transform:uppercase;letter-spacing:.22em;font-size:11.5px;color:var(--cin-dim);margin-bottom:18px}
  /* hero eyebrow larger + warmer so "mortgage industry" registers immediately */
  .hero .eyebrow{font-size:clamp(12.5px,1.5vw,16px);letter-spacing:.24em;color:var(--warm);margin-bottom:20px}
  .hero h1{font-weight:600;font-size:clamp(40px,5.6vw,72px);line-height:1.02;letter-spacing:-.025em;color:#fff;margin-bottom:18px}
  .hero .sub{font-size:clamp(15.5px,1.5vw,18px);line-height:1.6;color:var(--cin-light);max-width:44ch;margin-bottom:28px}
  .cta-row{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:34px}

  .doors{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
  @media(max-width:820px){.doors{grid-template-columns:1fr}}
  .door{background:rgba(255,255,255,.08);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.12);
    border-radius:14px;padding:14px 16px;text-decoration:none;transition:background .25s,border-color .25s}
  .door:hover{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.3)}
  .door .k{text-transform:uppercase;letter-spacing:.16em;font-size:10px;color:var(--cin-dim);margin-bottom:5px;font-weight:600}
  .door .t{font-weight:600;font-size:15.5px;color:#fff;display:flex;justify-content:space-between;gap:8px}
  .door .t span{transition:transform .25s}
  .door:hover .t span{transform:translateX(3px)}

  /* ===== WHITE EDITORIAL BASE ===== */
  .section{padding:clamp(96px,12vw,180px) clamp(20px,4vw,44px)}
  /* content grid left-aligns to the page padding edge (= the logo/header edge) at every width */
  .sec-inner{max-width:var(--maxw);margin:0}
  .sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:56px;flex-wrap:wrap}
  .kicker{font-family:var(--mono);font-weight:600;text-transform:uppercase;letter-spacing:.2em;font-size:clamp(12.5px,1.1vw,14px);line-height:1.1;color:var(--navy);margin-bottom:8px}
  h2{font-weight:600;font-size:clamp(30px,3.8vw,52px);line-height:1.05;letter-spacing:-.03em;max-width:20ch;text-wrap:balance}
  h3{text-wrap:balance}
  .sec-link{font-weight:600;font-size:14.5px;color:var(--ink);text-decoration:none;white-space:nowrap;border-bottom:2px solid var(--line);padding-bottom:2px;transition:border-color .2s}
  .sec-link:hover{border-color:var(--navy)}

  /* Problem cards — white, rounded, modern */
  .cards{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
  @media(max-width:860px){.cards{grid-template-columns:1fr}}
  .card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:30px 28px;
    text-decoration:none;color:var(--ink);display:flex;flex-direction:column;gap:0;transition:transform .25s,box-shadow .25s,border-color .25s}
  .card:hover{transform:translateY(-4px);box-shadow:0 18px 44px rgba(14,15,17,.09);border-color:#DDD}
  .card .n{font-weight:700;font-size:12.5px;color:var(--navy);letter-spacing:.14em;margin-bottom:20px}
  .card h3{font-weight:600;font-size:clamp(20px,2vw,24px);letter-spacing:-.015em;line-height:1.15;margin-bottom:10px}
  .card p{color:var(--grey);font-size:15px;line-height:1.6;margin-bottom:22px;flex:1}
  .card .a{font-weight:600;font-size:14.5px;color:var(--navy)}
  .card:hover .a{text-decoration:underline}

  /* For Your Team — capability buckets (capabilities, not products) */
  .cap-card p{flex:initial;margin-bottom:0}
  .cap-card .fineprint{font-size:12.5px;line-height:1.5;color:#8895A6;margin-top:12px}
  .cap-card .conf{margin-top:14px}
  /* Bench strength — leadership products list */
  .leadership-list{display:flex;flex-wrap:wrap;gap:9px;margin-top:22px}
  .leadership-list a{font-family:var(--mono);font-size:11.5px;letter-spacing:.04em;color:var(--ink);
    text-decoration:none;border:1px solid var(--line);border-radius:99px;padding:7px 13px;
    transition:border-color .2s,color .2s}
  .leadership-list a:hover{border-color:rgba(255,184,107,.55);color:#FFB86B}

  /* Events — clean white rows */
  .rows{border-top:1px solid var(--line)}
  .rowitem{display:grid;grid-template-columns:120px 1fr auto auto;gap:clamp(14px,3vw,40px);align-items:center;
    padding:26px 6px;border-bottom:1px solid var(--line);text-decoration:none;color:var(--ink);transition:background .2s;border-radius:8px}
  .rowitem:hover{background:var(--paper)}
  .rowitem .date{font-weight:600;font-size:14px;color:var(--navy);text-transform:uppercase;letter-spacing:.04em;line-height:1.35}
  .rowitem .t{font-weight:600;font-size:clamp(18px,2.2vw,26px);letter-spacing:-.015em}
  .rowitem .mode{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--grey)}
  .rowitem .a{font-weight:600;font-size:14.5px;color:var(--ink);white-space:nowrap}
  .rowitem:hover .a{color:var(--navy)}
  @media(max-width:720px){.rowitem{grid-template-columns:1fr}.rowitem .mode{display:none}}

  /* Results — white, navy numbers (the brand moment) */
  .results{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
  @media(max-width:820px){.results{grid-template-columns:1fr}}
  .result{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:36px 30px}
  .result .big{font-weight:600;font-size:clamp(44px,5vw,68px);line-height:1;letter-spacing:-.03em;color:var(--navy);margin-bottom:10px}
  .result .cap{font-size:14.5px;color:var(--grey);line-height:1.55;max-width:26ch}
  .result .flag{display:inline-block;margin-top:12px;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#B0483F;border:1px solid #E5C2BE;border-radius:99px;padding:3px 10px;background:#FBF1F0}

  /* Founder — white editorial with image card */
  .founder{display:grid;grid-template-columns:1fr 1.15fr;gap:clamp(28px,5vw,64px);align-items:center}
  @media(max-width:860px){.founder{grid-template-columns:1fr}}
  .founder .imagewrap{position:relative;aspect-ratio:4/5;border-radius:var(--r);overflow:hidden;background:
    radial-gradient(46% 40% at 60% 30%, rgba(255,233,207,.16), transparent 62%),
    linear-gradient(170deg, #17150F, #0B0B0C 78%)}
  .founder .imagewrap img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.9) contrast(1.1) brightness(.85)}
  .founder .imagewrap .note{position:absolute;inset:auto 0 12px 0;text-align:center;font-size:9.5px;letter-spacing:.08em;color:#8E8F92;opacity:.8;text-transform:uppercase}
  .founder h2{margin-bottom:16px}
  .founder p{color:var(--grey);font-size:16px;line-height:1.7;margin-bottom:14px;max-width:52ch}
  .founder p b{color:var(--ink);font-weight:600}
  .founder .pill{margin-top:12px}

  /* ===== BLACK CINEMATIC CLOSER (Robbins pattern: dark beat as punctuation) ===== */
  .closer-wrap{padding:0 clamp(14px,2.5vw,28px) clamp(18px,3vw,28px)}
  .closer{position:relative;border-radius:calc(var(--r) + 6px);overflow:hidden;background:var(--black);
    text-align:center;padding:clamp(80px,10vw,140px) clamp(22px,5vw,56px);isolation:isolate}
  .closer::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:
    radial-gradient(40% 50% at 50% 0%, rgba(255,233,207,.10), transparent 65%),
    linear-gradient(180deg,#111,#0B0B0C)}
  .closer .closer-bg{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:center 30%;opacity:.34;filter:saturate(.9) contrast(1.1) brightness(.85)}
  .closer h2{color:#fff;position:relative;margin:0 auto 16px;max-width:18ch}
  .closer p{color:var(--cin-dim);position:relative;max-width:46ch;margin:0 auto 32px;font-size:16.5px;line-height:1.65}

  footer{padding:34px clamp(20px,4vw,44px) 44px;display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;border-top:1px solid var(--line)}
  footer .links{display:flex;gap:22px;flex-wrap:wrap}
  footer a{color:var(--grey);text-decoration:none;font-size:13.5px;font-weight:500}
  footer a:hover{color:var(--ink)}
  footer .fine{font-size:12px;color:#A8AAAE}


  /* Ground School commerce feature — dark premium card on white */
  .gs-wrap{padding:0 clamp(20px,4vw,44px)}
  .gs{position:relative;max-width:var(--maxw);margin:0 auto;border-radius:calc(var(--r) + 4px);overflow:hidden;
    background:var(--black);display:grid;grid-template-columns:1.1fr 1fr;isolation:isolate}
  @media(max-width:860px){.gs{grid-template-columns:1fr}}
  .gs .gs-copy{padding:clamp(34px,5vw,60px)}
  .gs .kicker{color:#C9A96A}
  .gs h2{color:#fff;margin-bottom:14px}
  .gs p{color:var(--cin-dim);font-size:16px;line-height:1.65;max-width:46ch;margin-bottom:22px}
  .gs .price{display:flex;align-items:baseline;gap:12px;margin-bottom:24px}
  .gs .price .amt{font-weight:600;font-size:clamp(30px,3.4vw,44px);letter-spacing:-.02em;color:#fff}
  .gs .price .tbd{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#B0483F;border:1px solid rgba(201,123,123,.5);border-radius:99px;padding:3px 10px;background:rgba(201,123,123,.08)}
  .gs .gs-ctas{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
  .gs .team-line{margin-top:18px;font-size:14px;color:var(--cin-dim)}
  .gs .team-line a{color:#fff;font-weight:600;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.3)}
  .gs .team-line a:hover{border-color:#fff}
  .gs .gs-visual{position:relative;min-height:320px}
  .gs .gs-visual img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.9) contrast(1.1) brightness(.85)}
  .gs .gs-visual::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg, rgba(11,11,12,.75), transparent 45%)}
  @media(max-width:860px){.gs .gs-visual{min-height:240px;order:-1}.gs .gs-visual::after{background:linear-gradient(0deg, rgba(11,11,12,.8), transparent 60%)}}
  /* Originator = the program; the three schools are its phases beneath it */
  .gs .originator-head{font-size:clamp(22px,2.7vw,32px);font-weight:600;color:#fff;letter-spacing:-.02em;line-height:1.1;margin-bottom:16px}
  .gs .originator-head .phase-tag{color:var(--cin-dim);font-weight:500}
  .gs .ladder{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:24px}
  .gs .step{font-size:12px;font-weight:600;letter-spacing:.04em;color:var(--cin-light);border:1px solid rgba(255,255,255,.18);border-radius:99px;padding:6px 13px}
  .gs .step.hot{background:#fff;color:var(--ink);border-color:#fff}
  /* clickable phase chips */
  .gs a.step{text-decoration:none;cursor:pointer;transition:background .2s,color .2s,border-color .2s}
  .gs a.step:not(.hot):hover{border-color:rgba(255,255,255,.55);color:#fff}
  .gs a.step.hot:hover{background:rgba(255,255,255,.88)}

  /* The System — three pillars */
  .pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
  @media(max-width:820px){.pillars{grid-template-columns:1fr}}
  .pillar{border:1px solid var(--line);border-radius:var(--r);padding:30px 28px;background:#fff;transition:transform .25s,box-shadow .25s}
  .pillar:hover{transform:translateY(-4px);box-shadow:0 18px 44px rgba(14,15,17,.08)}
  .pillar .icon{width:44px;height:44px;border-radius:12px;background:var(--paper);border:1px solid var(--line);
    display:flex;align-items:center;justify-content:center;margin-bottom:20px;color:var(--navy)}
  .pillar h3{font-weight:600;font-size:20px;letter-spacing:-.01em;margin-bottom:10px}
  .pillar p{color:var(--grey);font-size:15px;line-height:1.6}
  .pillar .flagline{margin-top:14px;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#8A6D2F}

  /* Proof strip — quotes + logos */
  .quotes{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:44px}
  @media(max-width:860px){.quotes{grid-template-columns:1fr}}
  .quote{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:30px 28px;display:flex;flex-direction:column}
  .quote p{font-size:16px;line-height:1.6;color:var(--ink);font-weight:500;margin-bottom:20px;flex:1}
  .quote p::before{content:"\201C"}
  .quote p::after{content:"\201D"}
  .quote.nq p::before,.quote.nq p::after{content:none}  /* render quote text without decorative wrapping marks */
  .quote .who{font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--grey)}
  .quote .who b{font-family:'Hanken Grotesk',system-ui,sans-serif;color:var(--ink);font-weight:600;
    display:block;font-size:15.5px;letter-spacing:-.01em;text-transform:none;margin-bottom:4px}

  /* ---- Featured testimonial layout (Option B) — one large card with a
     photo panel, plus two supporting cards with small circular avatars ---- */
  .quotes.tfeatured{grid-template-columns:repeat(3,1fr)}
  @media(max-width:900px){.quotes.tfeatured{grid-template-columns:repeat(2,1fr)}}
  @media(max-width:600px){.quotes.tfeatured{grid-template-columns:1fr}}
  .quote.feature{grid-column:1/-1;display:grid;grid-template-columns:clamp(160px,20vw,220px) 1fr;
    padding:0;overflow:hidden;align-items:stretch}
  @media(max-width:620px){.quote.feature{grid-template-columns:1fr}}
  .quote.feature .t-photo{position:relative;min-height:280px;background:#0B0F16}
  /* image is already graded — no CSS filters */
  .quote.feature .t-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
  .quote.feature .t-body{padding:clamp(28px,3.4vw,46px);display:flex;flex-direction:column;justify-content:center}
  .quote.feature p{font-size:clamp(17px,1.75vw,21px);line-height:1.62}
  .quote .hl{color:#FFB86B;font-weight:600;white-space:nowrap}
  /* supporting cards — small circular avatar placeholder (initials) */
  .quote.support .t-avatar{width:60px;height:60px;flex:0 0 auto;border-radius:50%;margin-bottom:18px;overflow:hidden;
    display:flex;align-items:center;justify-content:center;
    font-family:var(--mono);font-size:17px;letter-spacing:.03em;color:#FFB86B;
    background:rgba(255,184,107,.1);border:1px solid rgba(255,184,107,.4)}
  /* photo avatars — pre-graded headshot fills the circle (no filters); neutral
     card-colour border, no amber wash. Monogram cards keep the amber style, same 60px frame. */
  .quote.support .t-avatar.photo{background:none;border:1px solid rgba(255,255,255,.14)}
  .quote.support .t-avatar img{width:100%;height:100%;object-fit:cover;object-position:center top;display:block}
  /* Confirmed testimonial set — masonry columns so the very different quote
     lengths pack tight without big row gaps; cards never split across a column. */
  .tmasonry{columns:3;column-gap:16px;margin-top:16px}
  .tmasonry .quote{display:block;break-inside:avoid;-webkit-column-break-inside:avoid;margin:0 0 16px}
  @media(max-width:900px){.tmasonry{columns:2}}
  @media(max-width:600px){.tmasonry{columns:1}}
  .logos{display:flex;justify-content:space-between;align-items:center;gap:clamp(16px,4vw,40px);flex-wrap:wrap;
    border-top:1px solid var(--line);padding-top:36px}
  .logos .lg{font-weight:700;font-size:15px;letter-spacing:.06em;color:#B4B6BA;text-transform:uppercase}
  .logos .note{font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#B0483F;border:1px solid #E5C2BE;border-radius:99px;padding:3px 10px;background:#FBF1F0}

  @media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}.hero-inner{opacity:1;transform:none}}
  :focus-visible{outline:2px solid var(--navy);outline-offset:3px}

  /* ==================================================================
     SHARED ADDITIONS — same tokens, same system, propagated site-wide.
     No new colors, fonts, radii, or button styles are introduced here;
     every value below is drawn from the reference design system above.
     ================================================================== */

  /* ---- Film grain: 5% site-wide texture (design-system requirement) ---- */
  body::after{content:"";position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:.05;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E")}
  @media(prefers-reduced-motion:reduce){body::after{opacity:.035}}

  /* ---- Active nav link ---- */
  .nav-left a.is-current,.nav-right a.is-current:not(.pill){color:var(--ink)}

  /* ---- Mobile hamburger + full-screen menu (below 680px) ---- */
  .nav-burger{display:none;flex-direction:column;justify-content:center;gap:5px;width:40px;height:40px;
    padding:9px;border:0;background:transparent;cursor:pointer;border-radius:10px;margin-left:2px}
  .nav-burger span{display:block;height:2px;width:100%;background:var(--ink);border-radius:2px;transition:transform .25s,opacity .2s}
  .nav-burger.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  .nav-burger.is-open span:nth-child(2){opacity:0}
  .nav-burger.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
  .mobile-menu{position:fixed;inset:0;z-index:55;background:rgba(255,255,255,.98);backdrop-filter:blur(14px);
    opacity:0;pointer-events:none;visibility:hidden;transition:opacity .28s ease,visibility 0s linear .28s;
    display:flex;align-items:center;justify-content:center}
  .mobile-menu.open{opacity:1;pointer-events:auto;visibility:visible;transition:opacity .28s ease}
  .mobile-menu-inner{display:flex;flex-direction:column;gap:22px;text-align:center;padding:40px}
  .mobile-menu-inner a:not(.pill){color:var(--ink);text-decoration:none;font-weight:600;font-size:24px;letter-spacing:-.015em}
  .mobile-menu-inner a.is-current{color:var(--navy)}
  .mobile-menu-inner .pill{margin-top:8px;align-self:center;font-size:16px;padding:13px 26px}
  body.menu-open{overflow:hidden}
  @media(max-width:680px){.nav-burger{display:flex}}
  @media(prefers-reduced-motion:reduce){.mobile-menu{transition:none}.nav-burger span{transition:none}}

  /* ---- Social icons in the nav (left of Student Login) — muted, secondary ---- */
  /* margin-right sets a deliberate gap so the icons read as their own group,
     clearly separated from the Student Login / Book a Call action items */
  .nav-social{display:flex;align-items:center;gap:13px;margin-right:clamp(14px,1.6vw,20px)}
  /* .nav-right .nav-social wins the tie with `.nav-right a:not(.pill)`; the
     hover selector is more specific than the amber `.nav-right a:hover`.
     #9DB0C6 = one step below the #B4C6DC nav links in the hierarchy. */
  .nav-right .nav-social a{display:inline-flex;align-items:center;color:#9DB0C6;line-height:0;
    transition:color .2s,opacity .2s}
  .nav-right .nav-social a:hover{color:#EDF2F8}
  .nav-social svg{width:16px;height:16px;fill:currentColor;display:block}
  /* narrow desktop: drop to three (LinkedIn, Instagram, YouTube) rather than crowd the action items.
     Selector must out-specify `.nav-right .nav-social a` (which sets display:inline-flex). */
  @media(max-width:1040px){.nav-right .nav-social a.soc-extra{display:none}}
  /* collapsed mobile bar: hide the group — the icons live in the hamburger menu instead */
  @media(max-width:680px){.nav-social{display:none}}

  /* ---- Social icons inside the opened hamburger menu (mobile) ---- */
  .mm-social{display:flex;justify-content:center;gap:26px;margin-top:10px}
  .mobile-menu-inner .mm-social a{display:inline-flex;color:#9DB0C6;line-height:0;transition:color .2s}
  .mobile-menu-inner .mm-social a:hover{color:#EDF2F8}
  .mm-social svg{width:23px;height:23px;fill:currentColor;display:block}

  /* ---- Light interior hero ---- */
  .subhero{max-width:var(--maxw);margin:0;
    padding:clamp(118px,16vh,172px) clamp(20px,4vw,44px) clamp(28px,4vw,48px)}
  .subhero h1{font-weight:600;font-size:clamp(34px,5vw,60px);line-height:1.04;letter-spacing:-.03em;max-width:17ch;margin-bottom:18px;text-wrap:balance}
  .subhero .sub{font-size:clamp(16px,1.6vw,19px);line-height:1.62;color:var(--grey);max-width:56ch}
  .subhero .cta-row{margin-top:28px;margin-bottom:0}

  /* Compact variant of the black cinematic hero (interior use) */
  .hero.compact{min-height:min(62vh,560px)}

  /* ---- Reusable honest-placeholder pill (matches the reference flags) ---- */
  .pending{display:inline-block;white-space:nowrap;font-size:10px;letter-spacing:.1em;text-transform:uppercase;
    color:#B0483F;border:1px solid #E5C2BE;border-radius:99px;padding:3px 10px;background:#FBF1F0}
  .pending.on-dark{color:#E4A9A2;border-color:rgba(201,123,123,.5);background:rgba(201,123,123,.08)}
  .conf{display:inline-block;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:#8A6D2F;
    border:1px solid #E8DCC2;border-radius:99px;padding:3px 10px;background:#FBF6EA}
  .conf.on-dark{color:#C9A96A;border-color:rgba(201,169,106,.4);background:rgba(201,169,106,.08)}

  /* Price line in light context */
  .priceline{display:flex;align-items:baseline;flex-wrap:wrap;gap:10px;margin-bottom:22px}
  .priceline .amt{font-weight:600;font-size:26px;letter-spacing:-.02em;color:var(--ink)}
  /* unit label (e.g. ENERGY "per class") — muted mono, matches the detail-page treatment */
  .priceline .per{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:#8895A6}

  /* ---- Tinted band + intro copy ---- */
  .band{background:var(--paper);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
  .lead{font-size:clamp(16px,1.7vw,19px);line-height:1.65;color:var(--grey);max-width:60ch}
  .sec-head .sub{font-size:15.5px;color:var(--grey);line-height:1.6;max-width:52ch;margin-top:12px;flex-basis:100%}

  /* ---- Program tiers ---- */
  /* clear separation between the tab pills and the panel eyebrow/hairline below */
  .tabbar{display:flex;gap:8px;flex-wrap:wrap;margin-top:26px;margin-bottom:clamp(34px,4.5vw,50px)}
  .tab{border:1px solid var(--line);background:#fff;font:inherit;font-weight:600;font-size:14px;color:var(--grey);
    padding:10px 18px;border-radius:99px;cursor:pointer;transition:background .2s,color .2s,border-color .2s;white-space:nowrap}
  .tab:hover{color:var(--ink);border-color:#DDD}
  .tab[aria-selected="true"]{background:var(--navy);border-color:var(--navy);color:#fff}
  .tabpanel[hidden]{display:none}
  .tabpanel{animation:fadein .42s ease-out}      /* smooth crossfade on tab switch */
  @keyframes fadein{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
  @media(prefers-reduced-motion:reduce){.tabpanel{animation:none}}
  .panel-intro{font-size:16px;line-height:1.6;color:var(--grey);max-width:58ch;margin-bottom:28px}

  .tiers{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
  @media(max-width:900px){.tiers{grid-template-columns:1fr}}
  .tier{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:30px 28px;
    display:flex;flex-direction:column;transition:transform .25s,box-shadow .25s,border-color .25s}
  .tier:hover{transform:translateY(-4px);box-shadow:0 18px 44px rgba(14,15,17,.08);border-color:#DDD}
  /* subtle pilot imagery inside each program card — a graded corner accent
     that supports the copy without overpowering it; content sits above it */
  .tier{position:relative;overflow:hidden}
  .tier-img{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;border-radius:inherit}
  .tier-img img{width:100%;height:100%;object-fit:cover;object-position:center;
    opacity:.15;filter:saturate(.8) contrast(1.05) brightness(.72);
    -webkit-mask-image:linear-gradient(135deg,transparent 40%,#000 100%);
            mask-image:linear-gradient(135deg,transparent 40%,#000 100%)}
  .tier > :not(.tier-img){position:relative;z-index:1}
  .tier .trole{font-weight:600;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--navy);margin-bottom:12px}
  .tier .tname{font-weight:600;font-size:clamp(21px,2.2vw,25px);letter-spacing:-.015em;line-height:1.12;margin-bottom:10px}
  .tier p{color:var(--grey);font-size:15px;line-height:1.62;margin-bottom:20px;flex:1}
  .tier .gate{font-size:12.5px;color:var(--grey);margin:-8px 0 18px;font-style:italic}
  .tier .pill{align-self:flex-start}

  /* Featured tier — dark full-width (ORIGINATOR) */
  .tier-feature{position:relative;border-radius:calc(var(--r) + 4px);overflow:hidden;background:var(--black);
    color:#fff;padding:clamp(34px,5vw,58px);margin-top:16px;isolation:isolate}
  .tier-feature::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
    background:radial-gradient(48% 60% at 82% 12%,rgba(255,233,207,.12),transparent 60%),linear-gradient(180deg,#121110,#0B0B0C)}
  .tier-feature .kicker{color:#C9A96A}
  .tier-feature h3{font-weight:600;font-size:clamp(26px,3.2vw,38px);letter-spacing:-.02em;line-height:1.08;margin-bottom:14px;max-width:20ch}
  .tier-feature p{color:var(--cin-dim);font-size:16px;line-height:1.65;max-width:60ch;margin-bottom:22px}
  .tier-feature .badge{display:inline-block;font-weight:600;font-size:12px;letter-spacing:.06em;color:var(--cin-light);
    border:1px solid rgba(255,255,255,.2);border-radius:99px;padding:6px 14px;margin-bottom:22px}
  .tier-feature .priceline .amt{color:#fff}
  .tier-feature .gs-ctas{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
  .tier-feature .team-line{margin-top:18px;font-size:14px;color:var(--cin-dim)}
  .tier-feature .team-line a{color:#fff;font-weight:600;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.3)}
  .tier-feature .team-line a:hover{border-color:#fff}

  /* ---- Flagship program — the cinematic hero of a tab (full-bleed image) ---- */
  .panel-label{margin-bottom:12px}
  .flagship{position:relative;border-radius:calc(var(--r) + 6px);overflow:hidden;background:var(--black);
    isolation:isolate;min-height:clamp(430px,50vw,560px);
    display:flex;flex-direction:column;justify-content:flex-end;
    padding:clamp(30px,5vw,66px);margin-bottom:clamp(30px,4.5vw,52px)}
  .flagship-bg{position:absolute;inset:0;z-index:-2;width:100%;height:100%;object-fit:cover;object-position:center;
    filter:saturate(.92) contrast(1.08) brightness(.7);animation:flagshipKen 32s ease-in-out infinite}
  @keyframes flagshipKen{0%{scale:1.02}50%{scale:1.09}100%{scale:1.02}}
  .flagship::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
    background:
      linear-gradient(180deg,rgba(6,8,12,.42),rgba(6,8,12,.12) 26%,rgba(6,8,12,.6) 66%,rgba(6,8,12,.95)),
      linear-gradient(90deg,rgba(6,8,12,.62),rgba(6,8,12,.14) 58%,transparent 82%)}
  .flagship-inner{position:relative;z-index:1;max-width:680px;color:#fff}
  .flagship .kicker{color:#FFB86B;margin-bottom:14px}
  .flagship h3{font-weight:600;font-size:clamp(38px,6vw,72px);letter-spacing:-.03em;line-height:1;margin-bottom:18px}
  .flagship .desc{color:var(--cin-light);font-size:clamp(15px,1.5vw,17.5px);line-height:1.62;max-width:56ch;margin-bottom:22px}
  .flagship .badge{display:inline-block;font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;
    color:#EFE6D6;border:1px solid rgba(255,184,107,.42);background:rgba(255,184,107,.09);border-radius:99px;padding:7px 15px;margin-bottom:22px}
  .flagship .priceline{margin-bottom:22px}
  .flagship .priceline .amt{color:#fff}
  .flagship .gs-ctas{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
  .flagship .team-line{margin-top:18px;font-size:14px;color:var(--cin-dim)}
  .flagship .team-line a{color:#fff;font-weight:600;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.3)}
  .flagship .team-line a:hover{border-color:#fff}
  @media(prefers-reduced-motion:reduce){.flagship-bg{animation:none;scale:1.02}}

  /* framing line + paired supporting cards below a flagship */
  .tier-framing{font-family:var(--mono);font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:#8895A6;
    margin:0 0 clamp(16px,2vw,22px)}
  .tiers.pair{grid-template-columns:repeat(2,1fr)}
  @media(max-width:900px){.tiers.pair{grid-template-columns:1fr}}
  /* outcome stat inside a program card (e.g. Officer School) */
  .tier .tier-stat{font-size:13.5px;line-height:1.55;font-weight:500;color:#FFB86B;margin:-4px 0 18px}

  /* Quiet supporting rows */
  .quietrow{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:16px}
  @media(max-width:720px){.quietrow{grid-template-columns:1fr}}
  .quietline{border:1px dashed var(--line);border-radius:14px;padding:18px 22px;color:var(--grey);font-size:14.5px;line-height:1.55}
  .quietline b{color:var(--ink);font-weight:600}

  /* ---- Problem / answer rows (for-your-team) ---- */
  .pa{border-top:1px solid var(--line)}
  .pa-row{display:grid;grid-template-columns:1fr 1fr;gap:clamp(22px,5vw,60px);
    padding:clamp(32px,4vw,48px) 0;border-bottom:1px solid var(--line);align-items:start}
  @media(max-width:820px){.pa-row{grid-template-columns:1fr;gap:20px}}
  .pa-row .lbl{font-weight:600;font-size:11px;letter-spacing:.16em;text-transform:uppercase;margin-bottom:12px}
  .pa-row .problem .lbl{color:var(--grey)}
  .pa-row .answer .lbl{color:var(--navy)}
  .pa-row h3{font-weight:600;font-size:clamp(20px,2.2vw,26px);letter-spacing:-.015em;line-height:1.15;margin-bottom:12px}
  .pa-row p{color:var(--grey);font-size:15.5px;line-height:1.65;margin-bottom:16px}
  .pa-row .a{font-weight:600;font-size:14.5px;color:var(--navy);text-decoration:none}
  .pa-row .a:hover{text-decoration:underline}

  /* ---- Media grids (podcast / blog placeholders) ---- */
  .media-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
  @media(max-width:860px){.media-grid{grid-template-columns:1fr}}
  .media-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;
    display:flex;flex-direction:column;transition:transform .25s,box-shadow .25s}
  a.media-card{color:inherit;text-decoration:none}
  .media-card:hover{transform:translateY(-4px);box-shadow:0 18px 44px rgba(14,15,17,.08)}
  .media-card .thumb{aspect-ratio:16/10;position:relative;
    background:radial-gradient(60% 70% at 60% 20%,rgba(0,52,102,.10),transparent 62%),linear-gradient(160deg,#EDEFF1,#E2E4E7)}
  .media-card .thumb .ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
    font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#9A9DA3;text-align:center;padding:14px}
  .media-card .mbody{padding:20px 22px;display:flex;flex-direction:column;gap:8px;flex:1}
  .media-card .meta{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--navy);font-weight:600}
  .media-card h3{font-weight:600;font-size:17.5px;letter-spacing:-.01em;line-height:1.25}
  .media-card p{font-size:14px;color:var(--grey);line-height:1.55;flex:1}

  /* ---- Form stubs (lead magnets) ---- */
  .form-stub{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
  .form-stub input{flex:1;min-width:180px;border:1px solid var(--line);border-radius:99px;padding:12px 18px;
    font:inherit;font-size:14.5px;color:var(--ink);background:#fff}
  .form-stub input::placeholder{color:#A8AAAE}
  .form-stub input:focus-visible{outline:2px solid var(--navy);outline-offset:2px}
  .form-stub button{border:0;font:inherit;font-weight:600;font-size:14px;border-radius:99px;padding:12px 22px;
    background:var(--navy);color:#fff;opacity:.5;cursor:not-allowed}
  .stub-note{font-size:11px;letter-spacing:.06em;color:var(--grey);margin-top:10px}

  /* ---- Calendar embed slot (book-a-call) ---- */
  .embed-slot{border:2px dashed var(--line);border-radius:var(--r);background:var(--paper);
    min-height:440px;display:flex;flex-direction:column;align-items:center;justify-content:center;
    text-align:center;color:var(--grey);padding:clamp(30px,5vw,56px);gap:12px}
  .embed-slot .label{font-weight:600;letter-spacing:.1em;text-transform:uppercase;font-size:13px;color:var(--ink)}
  .embed-slot .sub{font-size:14px;color:var(--grey);max-width:44ch;line-height:1.55}

  /* ---- Small utilities ---- */
  .center{text-align:center}
  .maxw-inner{max-width:var(--maxw);margin:0}
  .slot-note{font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:#9A9DA3;margin-top:8px}
  .prose p{color:var(--grey);font-size:16px;line-height:1.7;margin-bottom:16px;max-width:60ch}
  .prose p b{color:var(--ink);font-weight:600}
  .accolade .big{color:var(--navy)}
  .grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
  @media(max-width:760px){.grid-2{grid-template-columns:1fr}}
  .awards-row{display:flex;flex-wrap:wrap;gap:clamp(14px,2vw,20px);align-items:center;
    border-top:1px solid var(--line);padding-top:32px;margin-top:8px}
  .awards-row .aw{font-weight:700;font-size:14px;letter-spacing:.05em;color:#B4B6BA;text-transform:uppercase}
  /* award-logo placeholder slots — real logos drop in from Dave */
  .award-slot{display:inline-flex;align-items:center;justify-content:center;min-width:132px;height:60px;
    padding:0 18px;border:1px dashed rgba(255,255,255,.2);border-radius:10px;background:rgba(255,255,255,.02);
    font-family:var(--mono);font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;
    color:#8895A6;text-align:center;line-height:1.35}
  .callsign-note{font-size:14.5px;line-height:1.65;color:var(--grey);max-width:62ch;margin:-4px 0 30px}

  /* ---- Culture-award logo strip — real white-on-transparent logos placed
     directly on the dark ground (no boxes, no CSS filters). Understated,
     centred, evenly spaced; heights capped so the mixed proportions read as
     one balanced set (the tall Great Place To Work badge gets a smaller cap
     so it doesn't dominate the wide line-art logos). ---- */
  .award-logos{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;
    gap:clamp(30px,5vw,64px);border-top:1px solid var(--line);
    padding-top:clamp(30px,4vw,44px);margin-top:clamp(8px,1.5vw,12px)}
  .award-logos img{width:auto;max-width:100%;opacity:1;display:block}
  .award-logos .aw-wide{max-height:54px}
  .award-logos .aw-tall{max-height:70px}
  @media(max-width:600px){
    .award-logos{display:grid;grid-template-columns:1fr 1fr;justify-items:center;
      gap:clamp(26px,7vw,38px) clamp(20px,6vw,30px)}
    .award-logos .aw-wide{max-height:46px}
    .award-logos .aw-tall{max-height:60px}
  }

  /* ---- Resources hub — a menu of content sections ---- */
  .hub{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:8px}
  @media(max-width:760px){.hub{grid-template-columns:1fr}}
  .hub-tile{display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);
    border-radius:var(--r);padding:30px 28px;text-decoration:none;color:var(--ink);min-height:196px;
    transition:box-shadow .25s,border-color .25s}
  a.hub-tile:hover{box-shadow:0 18px 44px rgba(0,0,0,.3);border-color:rgba(255,184,107,.42)}
  .ht-eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:#FFB86B;margin-bottom:15px}
  .hub-tile h3{font-weight:600;font-size:clamp(23px,2.4vw,29px);letter-spacing:-.02em;line-height:1.08;margin-bottom:11px}
  .hub-tile p{color:var(--grey);font-size:15px;line-height:1.62;flex:1;margin-bottom:20px}
  .ht-go{font-family:var(--mono);font-size:12px;letter-spacing:.05em;font-weight:600;color:var(--ink);transition:color .2s}
  a.hub-tile:hover .ht-go{color:#FFB86B}
  .tool-links{display:flex;flex-direction:column;gap:10px}
  .tool-links a{display:flex;align-items:center;justify-content:space-between;gap:10px;font-weight:600;font-size:15px;
    color:var(--ink);text-decoration:none;border:1px solid var(--line);border-radius:11px;padding:12px 15px;
    transition:border-color .2s,color .2s,background .2s}
  .tool-links a:hover{border-color:rgba(255,184,107,.5);color:#FFB86B;background:rgba(255,184,107,.05)}
  .tool-links .conf{margin:0}
  /* ---- section-page empty / coming-soon state (podcast/blog/newsroom stubs) ---- */
  .empty-state{border:1px dashed var(--line);border-radius:var(--r);padding:clamp(40px,7vw,84px) 32px;text-align:center;
    background:rgba(255,255,255,.015)}
  .empty-state .es-badge{display:inline-block;font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;
    color:#FFB86B;border:1px solid rgba(255,184,107,.4);border-radius:99px;padding:6px 14px;margin-bottom:22px}
  .empty-state p{color:var(--grey);font-size:16px;line-height:1.65;max-width:52ch;margin:0 auto 26px}

  /* ---- Business Tools weekly briefing (Market Script / Weekly Market Recap).
     The .briefing card is the swappable weekly block; left-anchored to the grid. ---- */
  .briefing{max-width:760px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.14);
    border-radius:calc(var(--r) + 2px);padding:clamp(28px,4vw,48px)}
  .briefing-date{font-family:var(--mono);font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:#FFB86B;
    padding-bottom:16px;margin-bottom:clamp(22px,3vw,30px);border-bottom:1px solid rgba(255,255,255,.1)}
  .briefing-item + .briefing-item{margin-top:clamp(24px,3.2vw,34px)}
  .briefing-label{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#8895A6;margin-bottom:12px}
  .briefing-item p{font-size:clamp(16px,1.55vw,18px);line-height:1.72;color:var(--ink);margin:0}
  .briefing-item p + p{margin-top:16px}
  .briefing-attr{display:block;margin-top:14px;font-family:var(--mono);font-size:12px;letter-spacing:.05em;color:#9DB0C6}
  /* white-on-transparent partner logo — placed directly, no box, no filter */
  .briefing-source{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:clamp(28px,4vw,38px);
    padding-top:clamp(20px,2.6vw,28px);border-top:1px solid rgba(255,255,255,.1)}
  .briefing-source img{height:26px;width:auto;display:block;opacity:.9}
  .briefing-source span{font-family:var(--mono);font-size:11px;letter-spacing:.06em;color:#8895A6}

  /* ---- Blog / Newsroom — featured article + article cards (title + Read) ---- */
  .article-feature{display:flex;flex-direction:column;align-items:flex-start;gap:clamp(16px,2.4vw,22px);
    background:rgba(255,184,107,.05);border:1px solid rgba(255,184,107,.28);border-radius:calc(var(--r) + 4px);
    padding:clamp(30px,4.5vw,52px);text-decoration:none;color:var(--ink);margin-bottom:clamp(20px,3vw,28px);
    transition:border-color .2s,box-shadow .2s}
  .article-feature:hover{border-color:rgba(255,184,107,.5);box-shadow:0 22px 60px rgba(0,0,0,.4)}
  .article-feature .af-chip{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;
    color:#FFB86B;border:1px solid rgba(255,184,107,.5);border-radius:99px;padding:6px 13px}
  .article-feature h2{font-size:clamp(23px,3.2vw,38px);line-height:1.14;letter-spacing:-.02em;max-width:26ch;margin:0}
  .article-feature .go,.article-card .go{font-family:var(--mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase}
  .article-feature .go{color:#FFB86B}

  .article-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:16px}
  @media(max-width:900px){.article-grid{grid-template-columns:repeat(2,1fr)}}
  @media(max-width:600px){.article-grid{grid-template-columns:1fr}}
  .article-card{display:flex;flex-direction:column;justify-content:space-between;gap:22px;min-height:178px;
    background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.14);border-radius:var(--r);
    padding:26px;text-decoration:none;color:var(--ink);transition:border-color .2s,box-shadow .2s}
  .article-card:hover{border-color:rgba(255,184,107,.42);box-shadow:0 18px 44px rgba(0,0,0,.3)}
  .article-card h3{font-size:clamp(17px,1.6vw,20px);line-height:1.3;letter-spacing:-.01em;font-weight:600;margin:0}
  .article-card .go{color:#9DB0C6;transition:color .2s}
  .article-card:hover .go{color:#FFB86B}

  /* ---- Premium "coming soon" state (Podcast / Newsroom) ---- */
  .coming{text-align:center;max-width:760px;margin:0 auto;padding:clamp(20px,4vw,56px) 0}
  .coming .coming-chip{display:inline-block;font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;
    color:#FFB86B;border:1px solid rgba(255,184,107,.4);border-radius:99px;padding:7px 15px;margin-bottom:26px}
  .coming h2{font-size:clamp(34px,5vw,58px);letter-spacing:-.03em;line-height:1.05;color:var(--ink);margin:0 0 20px}
  .coming p{font-size:clamp(16px,1.7vw,19px);line-height:1.7;color:var(--grey);max-width:62ch;margin:0 auto}

  /* ---- Leadership team ---- */
  .team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;grid-auto-rows:1fr}
  @media(max-width:860px){.team-grid{grid-template-columns:repeat(2,1fr)}}
  @media(max-width:560px){.team-grid{grid-template-columns:1fr}}
  .person{background:var(--white);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;
    display:flex;flex-direction:column;transition:transform .25s,box-shadow .25s}
  .person:hover{transform:translateY(-4px);box-shadow:0 18px 44px rgba(14,15,17,.08)}
  .person .headshot{position:relative;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center;
    background:radial-gradient(60% 60% at 50% 32%,rgba(0,52,102,.12),transparent 60%),linear-gradient(160deg,#EDEFF1,#E2E4E7)}
  .person .headshot .initials{font-weight:600;font-size:34px;letter-spacing:.04em;color:#AFB2B7}
  .person .headshot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center top}
  .person .pbody{padding:22px 22px 26px;display:flex;flex-direction:column;gap:5px;flex:1}
  .person .pname{font-weight:600;font-size:18px;letter-spacing:-.01em;line-height:1.2}
  .person .pname .call{color:var(--navy)}
  .person .prole{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--grey);font-weight:600}
  .person .pbio{font-size:14px;color:var(--grey);line-height:1.55;margin-top:6px}
  .byline{font-size:14.5px;color:var(--grey);margin-top:18px}
  .byline b{color:var(--ink);font-weight:600}
  .statement{color:var(--ink);font-size:17px;line-height:1.5}

  /* ---- Life-at gallery (image placeholders) ---- */
  .gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
  @media(max-width:760px){.gallery{grid-template-columns:repeat(2,1fr)}}
  .gallery .tile{position:relative;aspect-ratio:4/3;border-radius:14px;overflow:hidden;border:1px solid var(--line);
    background:radial-gradient(60% 70% at 50% 28%,rgba(0,52,102,.10),transparent 62%),linear-gradient(160deg,#EDEFF1,#E2E4E7)}
  .gallery .tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
  .gallery .tile .ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
    font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:#9A9DA3}

  /* ---- Culture gallery (About) — life-at-XINNIX photo band, dark cinematic tiles ---- */
  .culture-gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,1.6vw,18px);margin-top:clamp(20px,2.6vw,30px)}
  @media(max-width:820px){.culture-gallery{grid-template-columns:repeat(2,1fr)}}
  @media(max-width:480px){.culture-gallery{grid-template-columns:1fr}}
  .culture-gallery figure{position:relative;margin:0;aspect-ratio:3/2;border-radius:var(--r);overflow:hidden;
    border:1px solid rgba(255,255,255,.12);background:#0B0F16;box-shadow:0 10px 30px rgba(0,0,0,.35);
    transition:transform .3s ease,box-shadow .3s ease}
  .culture-gallery figure img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
  .culture-gallery figure:hover{transform:translateY(-4px);box-shadow:0 22px 52px rgba(0,0,0,.5),0 0 30px rgba(255,184,107,.1)}
  @media(prefers-reduced-motion:reduce){.culture-gallery figure{transition:none}.culture-gallery figure:hover{transform:none}}

  /* ==================================================================
     CINEMATIC IMAGE BANDS — the aviation register. Every image carries
     the same grade and sits in shadow, with a dark overlay wherever type
     sits over it so copy stays legible. Grade: saturate .9 / contrast 1.1
     / brightness .85, matching the hero, Ground School and closer.
     ================================================================== */

  /* Full-width dark break band (section breaks / heritage / results accent) */
  .filmstrip-wrap{padding:clamp(8px,1.5vw,16px) clamp(14px,2.5vw,28px)}
  .filmstrip{position:relative;border-radius:calc(var(--r) + 6px);overflow:hidden;background:var(--black);
    min-height:clamp(200px,32vh,360px);isolation:isolate}
  .filmstrip img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
    filter:saturate(.9) contrast(1.1) brightness(.85)}
  .filmstrip::after{content:"";position:absolute;inset:0;
    background:linear-gradient(90deg,rgba(6,6,7,.66),rgba(6,6,7,.2) 52%,rgba(6,6,7,.6)),
    radial-gradient(130% 100% at 50% 45%,transparent 52%,rgba(6,6,7,.55))}
  /* caption box spans the content grid (maxw + side padding, centered) so its
     text lands on the same left column as .sec-inner at every viewport width */
  .filmstrip .cap{position:absolute;left:50%;bottom:0;transform:translateX(-50%);z-index:2;color:#fff;
    width:100%;max-width:calc(var(--maxw) + clamp(40px,8vw,88px));padding:clamp(20px,4vw,44px)}
  .filmstrip .cap .t{max-width:30ch}
  .filmstrip .cap .k{font-weight:600;text-transform:uppercase;letter-spacing:.2em;font-size:11px;color:var(--cin-light);margin-bottom:9px}
  .filmstrip .cap .t{font-weight:600;font-size:clamp(20px,3vw,32px);letter-spacing:-.02em;line-height:1.12}

  /* Programs tab-header banner */
  .panel-banner{position:relative;border-radius:var(--r);overflow:hidden;background:var(--black);
    height:clamp(150px,22vw,210px);margin-bottom:clamp(24px,3vw,34px);isolation:isolate}
  .panel-banner img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
    filter:saturate(.9) contrast(1.1) brightness(.85)}
  .panel-banner::after{content:"";position:absolute;inset:0;
    background:linear-gradient(90deg,rgba(6,6,7,.74),rgba(6,6,7,.28) 60%,rgba(6,6,7,.5))}
  .panel-banner .pb{position:absolute;left:clamp(20px,3vw,34px);bottom:clamp(16px,2.5vw,26px);z-index:2;color:#fff}
  .panel-banner .pb .k{font-weight:600;text-transform:uppercase;letter-spacing:.18em;font-size:10.5px;color:var(--cin-light);margin-bottom:6px}
  .panel-banner .pb .t{font-weight:600;font-size:clamp(19px,2.4vw,26px);letter-spacing:-.015em}

  /* Lead-magnet card image header (bleeds to the card edges) */
  .card .card-media{position:relative;margin:-30px -28px 20px;border-radius:var(--r) var(--r) 0 0;overflow:hidden;
    background:var(--black);height:clamp(130px,18vw,170px)}
  .card .card-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
    filter:saturate(.9) contrast(1.1) brightness(.85)}
  .card .card-media::after{content:"";position:absolute;inset:0;
    background:linear-gradient(180deg,rgba(6,6,7,.12),rgba(6,6,7,.5))}

  /* ==================================================================
     SCROLL REVEAL — subtle fade-up as content enters the viewport.
     JS adds .reveal (so nothing is ever hidden without JS) then flips
     .is-visible via IntersectionObserver. Card grids stagger via an
     inline transition-delay. Fully disabled under reduced-motion.
     ================================================================== */
  .reveal{opacity:0;transform:translateY(16px);transition:opacity .6s ease-out, transform .6s ease-out}
  .reveal.is-visible{opacity:1;transform:none}
  @media(prefers-reduced-motion:reduce){
    .reveal{opacity:1!important;transform:none!important;transition:none!important}
  }

  /* ==================================================================
     UNIFORM LIGHT GROUND — the whole light page sits on --paper
     (#F6F6F7), a soft off-white; content cards lift to --white so they
     still read as raised (gentle card-vs-ground contrast). The dark
     cinematic cards (hero, Ground School, closer) are unaffected.
     ================================================================== */
  body{background:var(--paper)}
  .card,
  .result,
  .quote,
  .tier,
  .media-card,
  .embed-slot{background:var(--white)}
  .rowitem:hover{background:var(--white)}

  /* ==================================================================
     ★★★ DARK CINEMATIC THEME — site-wide inversion.
     The whole page is now one continuous dark, filmic ground. Images go
     full-bleed; type is light; navy stays a brand tone and warm amber
     (#FFE9CF) glows like instrument light on kickers, key numbers and
     hover. Content, copy, structure and honest-placeholder flags are
     unchanged — this is purely a visual + motion transformation.
     ================================================================== */

  :root{
    --paper:#0B1420;      /* dark ground surface (was soft off-white) */
    --ink:#EDF2F8;        /* light primary text + logo (was near-black) */
    --grey:#B4C6DC;       /* dim light text (was mid-grey) */
    --line:rgba(255,255,255,.12);  /* hairlines on dark */
    --amber:#FFE9CF;      /* instrument-light accent (= --warm) */
    --ground:#0A0E14;     /* deepest base */
  }
  html{background:var(--ground)}
  /* Dark ground colour + ink. The barely-there texture (a ~2% fine grid)
     is applied in one place below — see "Deck atmosphere". */
  body{background-color:var(--ground);color:var(--ink)}
  ::selection{background:var(--warm);color:#0A0E14}
  /* the navy focus ring is invisible on the dark ground — amber annunciator */
  :focus-visible{outline:2px solid var(--amber-hot);outline-offset:3px}
  .form-stub input:focus-visible{outline-color:var(--amber-hot)}

  /* ---- Nav / mobile menu → dark glass; light logo ---- */
  nav{background:rgba(10,14,20,.72);border-bottom:1px solid rgba(255,255,255,.08)}
  .nav-left a:hover,.nav-right a:hover{color:var(--warm)}
  .nav-left a.is-current,.nav-right a.is-current:not(.pill){color:var(--warm)}
  .mobile-menu{background:rgba(8,11,16,.97)}
  .mobile-menu-inner a.is-current{color:var(--warm)}
  footer a:hover{color:var(--warm)}
  footer .fine{color:#7E90A6}

  /* ---- Amber accents: kickers, key numbers, labels, action links ---- */
  /* one eyebrow amber everywhere — matches the hero/hub/flagship kickers
     and the hairline rule beneath, so the eyebrow reads as a single unit */
  .kicker{color:var(--amber-hot)}
  .card .n,.rowitem .date,.tier .trole,.pa-row .answer .lbl,
  .media-card .meta,.person .pname .call{color:var(--warm)}
  .card .a,.pa-row .a,.rowitem:hover .a{color:var(--warm)}
  .result .big,.accolade .big{color:var(--warm);text-shadow:0 0 34px rgba(255,233,207,.28)}
  .sec-link{color:var(--ink)}
  .sec-link:hover{border-color:var(--warm)}
  .pillar .flagline{color:#C9A96A}

  /* amber divider that draws itself in on scroll (JS adds .in on reveal) */
  .kicker{position:relative}
  /* standardized section eyebrow rule — a short static amber hairline */
  .kicker::after{content:"";display:block;width:32px;height:2px;margin-top:8px;border-radius:2px;
    background:#FFB86B}

  /* ---- Cards → dark glass panels floating on the cinematic ground ---- */
  .card,.result,.quote,.tier,.media-card,.person,.pillar{
    background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.10);
    -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
  /* hover = illumination only (background/border/glow) — no movement.
     transform:none also overrides the legacy light-theme translateY lifts */
  .card:hover,.tier:hover,.pillar:hover,.media-card:hover,.person:hover{
    transform:none;background:rgba(255,255,255,.07);border-color:rgba(255,233,207,.45);
    box-shadow:0 26px 64px rgba(0,0,0,.55),0 0 34px rgba(255,233,207,.06)}
  .embed-slot{background:rgba(255,255,255,.03);border:2px dashed rgba(255,255,255,.16);color:var(--grey)}
  .band{background:rgba(255,255,255,.02)}
  .rowitem:hover{background:rgba(255,255,255,.05)}
  /* The XINNIX System icons → aviation squadron patches: a circular
     embroidered badge with a stitched amber edge, a faint concentric
     inner stitch ring, and a warm radial that catches light like an
     emblem. Icon stays centred as the device. (index only) */
  .pillar .icon{position:relative;width:56px;height:56px;border-radius:50%;margin-bottom:22px;
    color:#FFE9CF;border:1.5px solid rgba(255,184,107,.5);
    background:radial-gradient(circle at 50% 38%, rgba(255,184,107,.16), rgba(255,184,107,.05) 58%, rgba(255,255,255,.02) 100%);
    box-shadow:inset 0 1px 1px rgba(255,255,255,.10), inset 0 0 14px rgba(255,184,107,.10), 0 0 20px rgba(255,184,107,.10)}
  .pillar .icon::after{content:"";position:absolute;inset:4px;border-radius:50%;pointer-events:none;
    border:1px solid rgba(255,184,107,.2)}
  .pillar .icon svg{position:relative}
  .quote p{color:var(--ink)}
  .priceline .amt{color:#fff}

  /* ---- Pills on dark ---- */
  .pill.white{color:#0A0E14}
  .pill.dark{background:rgba(255,255,255,.08);color:#fff;border:1px solid rgba(255,255,255,.22)}
  .pill.dark:hover{background:rgba(255,255,255,.14);border-color:rgba(255,233,207,.6)}
  .pill.navy:hover{box-shadow:0 10px 34px rgba(0,52,102,.55)}

  /* ---- Tabs / GS steps / inputs on dark ---- */
  .tab{background:rgba(255,255,255,.05);color:var(--grey);border-color:var(--line)}
  .tab:hover{color:var(--ink);border-color:rgba(255,233,207,.4)}
  .tab[aria-selected="true"]{background:var(--navy);border-color:var(--navy);color:#fff}
  .gs .step.hot{color:#0A0E14}
  .form-stub input{background:rgba(255,255,255,.06);color:var(--ink);border-color:var(--line)}
  .form-stub input::placeholder{color:#7E90A6}

  /* ---- Honest-placeholder flags on dark (kept clearly warning-toned) ---- */
  .pending,.result .flag,.gs .price .tbd,.logos .note{
    color:#F0ABA3;border:1px solid rgba(224,120,110,.45);background:rgba(224,120,110,.13)}
  .conf{color:#EBC89B;border:1px solid rgba(201,169,106,.42);background:rgba(201,169,106,.13)}

  /* ---- Dark placeholder fills (podcast/blog thumbs, gallery, headshots) ---- */
  .media-card .thumb,.gallery .tile,.person .headshot{
    background:radial-gradient(70% 80% at 55% 22%,rgba(0,52,102,.32),transparent 62%),linear-gradient(160deg,#15202F,#0A121C)}
  .media-card .thumb .ph,.gallery .tile .ph{color:#7E90A6}
  .person .headshot .initials{color:rgba(255,255,255,.30)}

  /* ================= FULL-BLEED CINEMATIC FRAMES ================= */
  .hero-wrap{padding:0}
  .hero{border-radius:0;min-height:100vh}
  .hero::after{background:
    linear-gradient(to bottom, #0A0E14 0%, rgba(10,14,20,0) 11%, rgba(10,14,20,0) 90%, #0A0E14 100%),
    linear-gradient(180deg,rgba(6,8,12,.5) 0%,rgba(6,8,12,.12) 30%,rgba(6,8,12,.5) 62%,rgba(6,8,12,.92) 100%)}
  .hero.compact{min-height:min(90vh,780px)}

  .closer-wrap{padding:0}
  .closer{border-radius:0;min-height:min(90vh,780px);display:flex;flex-direction:column;
    align-items:center;justify-content:center;padding:clamp(90px,14vh,180px) clamp(22px,5vw,56px)}
  .closer .closer-bg{opacity:.5}
  .closer::before{background:
    linear-gradient(to bottom, #0A0E14 0%, rgba(10,14,20,0) 13%, rgba(10,14,20,0) 87%, #0A0E14 100%),
    radial-gradient(60% 60% at 50% 32%,rgba(255,233,207,.10),transparent 60%),
    linear-gradient(180deg,rgba(6,8,12,.55),rgba(6,8,12,.8))}

  .filmstrip-wrap{padding:0}
  .filmstrip{border-radius:0;min-height:clamp(360px,64vh,680px)}
  .filmstrip::after{background:
    linear-gradient(to bottom, #0A0E14 0%, rgba(10,14,20,0) 15%, rgba(10,14,20,0) 85%, #0A0E14 100%),
    linear-gradient(90deg,rgba(6,6,7,.34),transparent 55%,rgba(6,6,7,.34))}

  /* Ground School → full-bleed frame, copy laid over the image */
  .gs-wrap{padding:0}
  /* side padding on the frame + bare maxw copy block = text lands on the
     same grid column as .sec-inner (the bg is absolute inset:0, still full-bleed) */
  .gs{max-width:none;margin:0;border-radius:0;grid-template-columns:1fr;
    min-height:min(38vh,380px);display:flex;flex-direction:column;justify-content:flex-end;position:relative;
    padding:0 clamp(20px,4vw,44px)}
  .gs .gs-visual{position:absolute;inset:0;min-height:0;z-index:0}
  .gs .gs-visual::after{background:
    linear-gradient(to bottom, #0A0E14 0%, rgba(10,14,20,0) 12%, rgba(10,14,20,0) 40%, rgba(10,14,20,.55) 68%, #0A0E14 100%)}
  @media(max-width:860px){.gs .gs-visual{order:0}.gs .gs-visual::after{background:linear-gradient(to bottom,#0A0E14 0%,rgba(10,14,20,0) 12%,rgba(10,14,20,0) 38%,rgba(10,14,20,.6) 66%,#0A0E14 100%)}}
  .gs .gs-copy{position:relative;z-index:2;width:100%;max-width:var(--maxw);margin:0;
    padding:clamp(16px,2.4vw,34px) 0}
  .gs .gs-copy > *{max-width:660px}
  /* audience-lane kicker must register on the busy dark image, not get missed */
  .gs .gs-copy .kicker{font-size:clamp(12.5px,1.35vw,15px);letter-spacing:.28em;color:var(--amber-hot)}

  /* ---- Bigger, more confident type ---- */
  .hero h1{font-size:clamp(46px,6.4vw,88px)}
  h2{font-size:clamp(34px,4.4vw,62px)}
  .subhero h1{font-size:clamp(40px,5.8vw,76px)}
  .subhero{padding-top:clamp(140px,20vh,220px)}
  .result .big{font-size:clamp(48px,5.6vw,78px)}
  .pillar h3{font-size:22px}

  /* ---- Motion: slower cinematic reveal + parallax baseline ---- */
  .reveal{transform:translateY(40px);transition:opacity .8s ease-out, transform .8s ease-out}
  .gs .gs-visual img,.filmstrip img,.closer .closer-bg{will-change:transform}
  .hero .photo{will-change:transform,scale,opacity}

  @media(prefers-reduced-motion:reduce){
    .kicker::after{transform:scaleX(1);transition:none}
    .gs .gs-visual img,.filmstrip img,.closer .closer-bg{transform:none!important}
    /* static hero: no Ken Burns, no fade, no parallax — exact still */
    .hero .photo{animation:none!important;scale:1!important;translate:none!important;transform:none!important;opacity:1!important}
    .hero-veil{opacity:0!important}
  }

  /* ==================================================================
     ★★★ GLASS COCKPIT — instrument-deck interface layer.
     Small / technical elements become precise monospaced readouts; amber
     is the live/active annunciator; cards gain HUD corner-ticks + glass
     edge-light; a barely-there deck grid sits behind the content. Big
     headlines, prose, photographs and copy are untouched.
     ================================================================== */
  :root{
    --mono:'JetBrains Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;
    --amber-hot:#FFB86B;   /* richer indicator amber — live / active glow */
    --ice:#8FD3FF;         /* sparing secondary data tint */
    --tick:rgba(255,255,255,.16);
  }

  /* ---- Monospaced technical type: labels, tags, numbers, nav, buttons ---- */
  .kicker,.eyebrow,.rowitem .date,.rowitem .mode,.door .k,
  .pending,.conf,.flag,.tbd,.note,.logos .note,.gs .price .tbd,.pillar .flagline,
  .slot-note,.stub-note,.badge,.step,.tab,.media-card .meta,.person .prole,
  .pa-row .lbl,.awards-row .aw,.embed-slot .label,.panel-banner .pb .k,.filmstrip .cap .k,
  .nav-left a,.nav-right a:not(.pill),.pill,.sec-link,.card .a,.pa-row .a,.rowitem .a,
  .result .big,.accolade .big,.priceline .amt,.gs .price .amt{
    font-family:var(--mono)}

  /* nav + buttons + tabs → technical uppercase softkeys */
  .nav-left a,.nav-right a:not(.pill){text-transform:uppercase;letter-spacing:.13em;font-size:11px;font-weight:500}
  .pill{text-transform:uppercase;letter-spacing:.11em;font-weight:600;font-size:12px;padding:11px 22px}
  .tab{text-transform:uppercase;letter-spacing:.08em;font-size:11.5px}
  .sec-link,.card .a,.pa-row .a,.rowitem .a{text-transform:uppercase;letter-spacing:.09em;font-size:11.5px}
  .kicker{font-size:clamp(12.5px,1.1vw,14px);letter-spacing:.24em}
  .eyebrow{letter-spacing:.26em}
  .result .big,.accolade .big{letter-spacing:-.01em}   /* mono digits — ease the negative tracking */

  /* production · recruiting · retention tag — amber accent above each card
     headline and each result stat, reinforcing the three-results theme */
  .cards .card .cat,.result .cat{font-family:var(--mono);font-size:11px;letter-spacing:.24em;
    text-transform:uppercase;color:#FFB86B;margin-bottom:12px}
  /* amber discipline: in a result card the big glowing numeral is the amber
     moment — the small label above it goes neutral so the two never compete */
  .result .cat{color:#8895A6}
  .rowitem .date{color:var(--ice)}   /* cyan telemetry tint on scheduled data */

  /* ---- One toggled audience section — a large interactive heading ---- */
  .audience-head{margin-bottom:clamp(28px,4vw,46px)}
  .audience-title{display:flex;flex-wrap:wrap;align-items:center;
    column-gap:clamp(12px,1.6vw,22px);row-gap:13px;margin:0;
    font-family:var(--mono);font-weight:500;text-transform:uppercase;
    font-size:clamp(19px,2.7vw,30px);letter-spacing:.08em;line-height:1.1;color:#D9E0EA}
  /* keep "FOR THE PEOPLE WHO" as one unbroken unit — never orphan "WHO" */
  .audience-title .lead-in{white-space:nowrap}
  /* segmented control — refined size; active option lit amber, inactive dimmed */
  .audience-toggle{display:inline-flex;gap:3px;padding:4px;font-size:.68em;
    border:1px solid rgba(255,255,255,.14);border-radius:999px;background:rgba(255,255,255,.03)}
  .aud-opt{font:inherit;font-size:inherit;letter-spacing:.08em;text-transform:inherit;line-height:1;
    cursor:pointer;border:0;background:transparent;color:#768392;
    padding:.4em .85em;border-radius:999px;transition:color .25s,background .25s,box-shadow .25s}
  .aud-opt:not(.is-active):hover{color:#BAC5D3}
  .aud-opt.is-active{color:#FFB86B;background:rgba(255,184,107,.14);
    box-shadow:inset 0 0 0 1px rgba(255,184,107,.55),0 0 20px rgba(255,184,107,.2)}
  .aud-opt:focus-visible{outline:2px solid #FFB86B;outline-offset:3px}

  /* Card-set swap — the reliable pattern the Programs tabs use: only the
     active set is in the DOM (hidden = display:none), and the newly shown
     set fades in via a keyframe. No fragile opacity/visibility crossfade,
     and the stack is NOT tied to the scroll-reveal (which previously left
     it stuck invisible). Reduced-motion drops the fade. */
  .aud-stack{position:relative}
  .aud-panel{animation:audFade .42s ease}
  .aud-panel[hidden]{display:none}
  @keyframes audFade{from{opacity:0}to{opacity:1}}
  @media(prefers-reduced-motion:reduce){ .aud-panel{animation:none} }

  /* ---- Amber indicator light (live / active) ---- */
  .nav-left a:hover,.nav-right a:hover,footer a:hover{color:var(--amber-hot)}
  .card .a,.pa-row .a,.sec-link,.rowitem .a{color:var(--amber)}
  .card:hover .a,.pa-row .a:hover,.rowitem:hover .a,.sec-link:hover{color:var(--amber-hot)}
  .result .big,.accolade .big{color:var(--amber-hot);text-shadow:0 0 26px rgba(255,184,107,.35)}
  .tab[aria-selected="true"]{border-color:rgba(255,184,107,.55);
    box-shadow:0 0 0 1px rgba(255,184,107,.22),0 0 22px rgba(255,184,107,.18)}

  /* live-status annunciator — small pulsing amber dot before each event status */
  .rowitem .mode{display:inline-flex;align-items:center;gap:8px;color:var(--amber)}
  .rowitem .mode::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--amber-hot);
    box-shadow:0 0 9px rgba(255,184,107,.9);animation:annun 2.1s ease-in-out infinite}
  @keyframes annun{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.32;transform:scale(.68)}}

  /* ---- Cards as illuminated glass panels: brighter thin border + edge-light ---- */
  .card,.result,.quote,.tier,.media-card,.person,.pillar{
    border-color:rgba(255,255,255,.14);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.06), inset 0 0 42px rgba(255,255,255,.015)}
  /* the same border weight on every card-grade surface site-wide */
  .hub-tile,.pdp-gain,.pband{border-color:rgba(255,255,255,.14)}
  .card:hover,.tier:hover,.pillar:hover,.media-card:hover,.person:hover{
    border-color:rgba(255,184,107,.5);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.09), 0 26px 64px rgba(0,0,0,.55), 0 0 34px rgba(255,184,107,.12)}

  /* ---- HUD corner-tick framing on panels (faint; locks amber on hover) ---- */
  .card,.tier,.pillar,.result,.quote,.media-card,.person{position:relative}
  .card::after,.tier::after,.pillar::after,.result::after,.quote::after,.media-card::after,.person::after{
    content:"";position:absolute;inset:9px;pointer-events:none;z-index:3;opacity:.55;transition:opacity .25s,background .25s;
    background:
      linear-gradient(var(--tick),var(--tick)) top left/11px 1px no-repeat,
      linear-gradient(var(--tick),var(--tick)) top left/1px 11px no-repeat,
      linear-gradient(var(--tick),var(--tick)) top right/11px 1px no-repeat,
      linear-gradient(var(--tick),var(--tick)) top right/1px 11px no-repeat,
      linear-gradient(var(--tick),var(--tick)) bottom left/11px 1px no-repeat,
      linear-gradient(var(--tick),var(--tick)) bottom left/1px 11px no-repeat,
      linear-gradient(var(--tick),var(--tick)) bottom right/11px 1px no-repeat,
      linear-gradient(var(--tick),var(--tick)) bottom right/1px 11px no-repeat}
  .card:hover::after,.tier:hover::after,.pillar:hover::after,.media-card:hover::after,.person:hover::after{
    opacity:1;
    background:
      linear-gradient(var(--amber-hot),var(--amber-hot)) top left/15px 1px no-repeat,
      linear-gradient(var(--amber-hot),var(--amber-hot)) top left/1px 15px no-repeat,
      linear-gradient(var(--amber-hot),var(--amber-hot)) top right/15px 1px no-repeat,
      linear-gradient(var(--amber-hot),var(--amber-hot)) top right/1px 15px no-repeat,
      linear-gradient(var(--amber-hot),var(--amber-hot)) bottom left/15px 1px no-repeat,
      linear-gradient(var(--amber-hot),var(--amber-hot)) bottom left/1px 15px no-repeat,
      linear-gradient(var(--amber-hot),var(--amber-hot)) bottom right/15px 1px no-repeat,
      linear-gradient(var(--amber-hot),var(--amber-hot)) bottom right/1px 15px no-repeat}

  /* ---- Deck atmosphere: barely-there fine grid behind the content ---- */
  body{background:
    repeating-linear-gradient(0deg,transparent 0 39px,rgba(255,255,255,.020) 39px 40px),
    repeating-linear-gradient(90deg,transparent 0 39px,rgba(255,255,255,.020) 39px 40px),
    var(--ground)}

  @media(prefers-reduced-motion:reduce){ .rowitem .mode::before{animation:none} }

  /* ==================================================================
     TRUSTED-BY LOGO MARQUEE — cleared client logos, normalized into one
     designed row: uniform ~31px visual height, width-capped so no single
     wordmark dominates, uniform off-white at 85% (brighten to 100% on
     hover), slow seamless auto-scroll (duplicate set, translateX -50%),
     pause on hover, edge fade. Reduced-motion → static centered row.
     ================================================================== */
  .trusted{padding:clamp(30px,5vw,58px) clamp(20px,4vw,44px);overflow:hidden}
  .trusted .kicker{text-align:center;margin-bottom:clamp(22px,3vw,34px)}
  .trusted .kicker::after{transform:scaleX(1);margin-left:auto;margin-right:auto}
  .marquee{position:relative;overflow:hidden;max-width:var(--maxw);margin:0 auto;
    -webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);
    mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
  .marquee-track{display:flex;width:max-content;animation:marquee 50s linear infinite}
  .marquee:hover .marquee-track{animation-play-state:paused}
  .marquee-set{display:flex;align-items:center}
  .marquee-set img{height:31px;width:auto;max-width:180px;object-fit:contain;
    margin:0 clamp(22px,3vw,42px);opacity:.85;transition:opacity .3s ease}
  .marquee-set img:hover{opacity:1}
  @keyframes marquee{to{transform:translateX(-50%)}}
  @media(prefers-reduced-motion:reduce){
    .marquee{-webkit-mask-image:none;mask-image:none}
    .marquee-track{animation:none;width:100%}
    .marquee-set{flex-wrap:wrap;justify-content:center;width:100%}
    .marquee-set[aria-hidden="true"]{display:none}
  }

  /* ==================================================================
     HAPPENING NOW — split-flap / solari departure board.
     A live class schedule styled as an authentic airport departures
     board: a dark recessed panel, mono column headers, per-character
     flap tiles (portrait tiles, center seam, faint separation, warm
     glow), and amber/green glowing status indicators. Characters flip
     into place staggered left-to-right on scroll-in; an occasional idle
     re-flip keeps it alive. Reduced-motion → static board, no flip.
     Character tiles are built by assets/js/site.js from the cell text.
     ================================================================== */
  .board-section{overflow:hidden}
  /* full content-width panel — commands the same width as the other sections */
  .board{--go:#7FE3AC;                              /* board "on time / live" green */
    position:relative;width:100%;max-width:var(--maxw);margin:0 auto;
    background:linear-gradient(180deg,#0C1119,#080B11);
    border:1px solid rgba(255,255,255,.10);border-radius:calc(var(--r) - 4px);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.05),inset 0 0 90px rgba(0,0,0,.55),0 28px 70px -28px rgba(0,0,0,.7);
    overflow:hidden}
  /* title bar — the board's header strip */
  .board-head{display:flex;justify-content:space-between;align-items:center;gap:16px;
    padding:clamp(14px,1.5vw,20px) clamp(20px,3.4vw,52px);
    background:linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,0));
    border-bottom:1px solid rgba(255,255,255,.09)}
  .board-title{font-family:var(--mono);font-weight:500;font-size:clamp(12px,1vw,14px);letter-spacing:.24em;
    text-transform:uppercase;color:#E9E0D0;white-space:nowrap}
  .board-title b{color:var(--amber-hot);font-weight:600;letter-spacing:.16em}
  .board-link{font-family:var(--mono);font-size:clamp(11px,0.85vw,12.5px);letter-spacing:.12em;text-transform:uppercase;
    color:var(--grey);text-decoration:none;white-space:nowrap;transition:color .2s}
  .board-link:hover{color:var(--amber-hot)}
  /* mobile: let the header stack so the right-side CTA link never clips */
  @media(max-width:600px){.board-head{flex-wrap:wrap;gap:4px 12px}}
  /* scroll shell keeps the rigid grid intact on narrow screens */
  .board-scroll{overflow-x:auto;overflow-y:hidden;
    padding:clamp(20px,3vw,40px) clamp(20px,3.4vw,52px) clamp(24px,3.4vw,44px)}
  /* fills the panel on desktop (space-between spreads the columns edge to
     edge); min-content keeps it rigid and scrollable when it can't fit */
  .board-grid{width:100%;min-width:max-content;font-family:var(--mono);font-size:clamp(14px,1.75vw,23px)}
  .board-cols,.board-row{display:grid;grid-template-columns:13ch 29ch 16ch 10ch;
    justify-content:space-between;column-gap:clamp(20px,2.6vw,48px);align-items:center}
  .board + .board{margin-top:clamp(30px,4vw,54px)}

  /* ---- Live cluster: Live Schedule + Events read as one connected area ---- */
  .live-cluster .board + .board{margin-top:clamp(14px,2vw,22px)}   /* tighter gap between the two live boards */
  .live-cluster + .board{margin-top:clamp(34px,4.5vw,58px)}        /* clear break before On Demand */
  /* September rows collapsed until the "See September" toggle opens the cluster */
  .brow.is-sep{display:none}
  .live-cluster.show-sep .brow.is-sep{display:grid;opacity:1;transform:none}
  .sched-more-wrap{padding:clamp(6px,1vw,10px) clamp(20px,3.4vw,52px) 0}
  .sched-more{display:inline-flex;align-items:center;gap:8px;background:none;border:0;cursor:pointer;
    font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#8895A6;
    padding:8px 0;transition:color .2s}
  .sched-more:hover{color:#FFB86B}

  /* ---- Rebuilt schedule boards: four columns (Date · Program · Status ·
     Action), Hanken program names, small mono status chips, amber action
     links. Reuses the .board shell; no split-flap. ---- */
  .sched-window{padding:clamp(12px,1.6vw,16px) clamp(20px,3.4vw,52px) 0}
  .sched-window .win-label{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:#8895A6}
  .sched-body{padding:clamp(8px,1.4vw,16px) clamp(20px,3.4vw,52px) clamp(18px,2.6vw,30px)}
  .sched-cols,.brow{display:grid;
    grid-template-columns:clamp(78px,8vw,116px) minmax(0,1fr) clamp(118px,13vw,150px) clamp(80px,8vw,108px);
    align-items:center;gap:clamp(12px,2vw,28px)}
  .sched-cols{padding:clamp(10px,1.4vw,16px) 0 13px;border-bottom:1px solid rgba(255,255,255,.09)}
  .sched-cols span{font-family:var(--mono);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:#69768A}
  .sched-cols span:last-child{text-align:right}
  .brow{padding:clamp(15px,1.9vw,22px) 0;text-decoration:none;border-radius:6px;transition:background .18s}
  .brow + .brow{border-top:1px solid rgba(255,255,255,.055)}
  a.brow:hover{background:rgba(255,255,255,.028)}
  .bc-date{font-family:var(--mono);font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:#93A6BC;white-space:nowrap}
  .bc-prog{font-family:'Hanken Grotesk',system-ui,sans-serif;font-size:clamp(15px,1.45vw,18.5px);font-weight:500;
    letter-spacing:-.01em;color:#EDF2F8;line-height:1.25}
  .bc-status{display:flex;min-width:0}
  .bc-action{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;
    color:#FFB86B;text-align:right;white-space:nowrap;transition:color .2s}
  a.brow:hover .bc-action{color:#FFD9AE}
  .brow.is-full{cursor:default}
  .brow.is-full:hover{background:transparent}
  .brow.is-full .bc-action{color:#6E7B8C}
  /* non-actionable action label (e.g. private events) — muted, not a link */
  .bc-action.na{color:#6E7B8C}
  .brow.is-full .bc-prog{color:#B4C0CE}
  /* status chips — mono; amber = active/enrolling, muted = full/pending */
  .st{font-family:var(--mono);font-size:10px;letter-spacing:.11em;text-transform:uppercase;line-height:1;
    padding:6px 11px;border-radius:99px;border:1px solid;white-space:nowrap;display:inline-block}
  .st.live,.st.enrolling,.st.reserve{color:#FFB86B;border-color:rgba(255,184,107,.42);background:rgba(255,184,107,.09)}
  .st.pending{color:#9DB0C6;border-color:rgba(157,176,198,.32);background:rgba(157,176,198,.06)}
  .st.full{color:#7E8B9C;border-color:rgba(126,139,156,.32);background:rgba(126,139,156,.05)}
  .st.elite{color:#EBC89B;border-color:rgba(235,200,155,.42);background:rgba(235,200,155,.09)}
  .st sup{font-size:.85em}
  .sched-note{font-family:var(--mono);font-size:11px;letter-spacing:.03em;color:#8895A6;line-height:1.65;
    padding:0 clamp(20px,3.4vw,52px) clamp(18px,2.4vw,26px)}
  /* mobile: stack each row into a two-line card (program + status / date + action) */
  @media(max-width:640px){
    .sched-cols{display:none}
    .brow{grid-template-columns:1fr auto;grid-template-areas:"prog status" "date action";row-gap:10px;column-gap:14px;padding:16px 0}
    .bc-prog{grid-area:prog;align-self:center}
    .bc-status{grid-area:status;justify-content:flex-end;align-items:center}
    .bc-date{grid-area:date}
    .bc-action{grid-area:action}
  }
  .board-cols{margin-bottom:clamp(13px,1.6vw,22px);padding-bottom:clamp(10px,1.2vw,15px);
    border-bottom:1px solid rgba(255,255,255,.08)}
  .board-cols span{font-family:var(--mono);font-size:clamp(10px,0.8vw,12px);letter-spacing:.22em;
    text-transform:uppercase;color:#69768A}
  .board-row{padding:clamp(14px,1.9vw,26px) 0;text-decoration:none;border-radius:6px;transition:background .2s}
  .board-row + .board-row{border-top:1px solid rgba(255,255,255,.045)}
  .board-row:hover{background:rgba(255,255,255,.022)}

  /* character cell → row of flap tiles */
  .cell{white-space:nowrap;font-family:var(--mono)}
  .cell[data-flap]{display:flex}
  .flap{position:relative;flex:0 0 1ch;width:1ch;height:1.62em;line-height:1.62em;text-align:center;
    font-size:inherit;color:#ECE3D2;
    background:linear-gradient(180deg,#222A35 0%,#151C26 49%,#0B111A 51%,#182029 100%);
    box-shadow:inset -1px 0 0 rgba(0,0,0,.6),inset 0 1px 0 rgba(255,255,255,.05);
    border-radius:2.5px;
    transform:perspective(640px) rotateX(-90deg);transform-origin:center;opacity:0;backface-visibility:hidden;
    transition:transform .28s cubic-bezier(.2,.9,.2,1),opacity .16s ease}
  .flap::after{content:"";position:absolute;left:1px;right:1px;top:50%;height:1px;margin-top:-.5px;
    background:rgba(0,0,0,.55);pointer-events:none}
  .flap.blank{color:transparent}
  .board.flipped .flap{transform:perspective(640px) rotateX(0deg);opacity:1}
  .board-row:hover .cell.act .flap{color:var(--amber-hot)}

  /* status column — glowing board indicator with live pulsing dot */
  .cell.stat{display:inline-flex;align-items:center;gap:clamp(8px,0.7vw,11px);
    font-family:var(--mono);font-size:clamp(13px,1.25vw,16px);letter-spacing:.11em;text-transform:uppercase;line-height:1;
    transform:perspective(640px) rotateX(-90deg);transform-origin:center;opacity:0;
    transition:transform .28s cubic-bezier(.2,.9,.2,1),opacity .16s ease}
  .board.flipped .cell.stat{transform:perspective(640px) rotateX(0deg);opacity:1}
  .cell.stat::before{content:"";flex:0 0 auto;width:8px;height:8px;border-radius:50%;
    animation:annun 2.1s ease-in-out infinite}
  .cell.stat[data-status="enrolling"]{color:var(--amber-hot);text-shadow:0 0 14px rgba(255,184,107,.45)}
  .cell.stat[data-status="enrolling"]::before{background:var(--amber-hot);box-shadow:0 0 11px rgba(255,184,107,.95)}
  .cell.stat[data-status="live"]{color:var(--go);text-shadow:0 0 14px rgba(127,227,172,.45)}
  .cell.stat[data-status="live"]::before{background:var(--go);box-shadow:0 0 11px rgba(127,227,172,.95)}
  /* pending — dimmed / neutral, no pulse */
  .cell.stat[data-status="pending"]{color:#8A97A8}
  .cell.stat[data-status="pending"]::before{background:#8A97A8;box-shadow:none;animation:none;opacity:.7}
  /* full — muted red, no pulse, no action; the whole row reads as closed */
  .cell.stat[data-status="full"]{color:#EC6A7E}
  .cell.stat[data-status="full"]::before{background:#EC6A7E;box-shadow:0 0 10px rgba(236,106,126,.55);animation:none}
  .board-row.is-full{cursor:default}
  .board-row.is-full:hover{background:transparent}
  .board-row.is-full .cell.sched,.board-row.is-full .cell.prog{opacity:.6}

  @media(max-width:720px){
    .board-scroll{-webkit-mask-image:linear-gradient(90deg,#000 92%,transparent);
      mask-image:linear-gradient(90deg,#000 92%,transparent)}
  }
  /* honour reduced-motion — settled board, no flip, no pulse */
  @media(prefers-reduced-motion:reduce){
    .flap,.cell.stat{transform:none!important;opacity:1!important;transition:none!important}
    .cell.stat::before{animation:none}
  }

  /* ==================================================================
     FOR YOUR TEAM — cinematic elevation: alternating aviation problem
     bands + weighted program cards (flagship leadership lead, supporting
     cards follow), on the dark cockpit ground.
     ================================================================== */
  /* tighten the empty gap under the compact hero */
  .ft-first{padding-top:clamp(16px,2.2vw,28px)}

  /* --- Problem bands: aviation image one side, problem + answer the other --- */
  .problems{display:flex;flex-direction:column;gap:clamp(20px,2.8vw,32px);margin-top:clamp(22px,3vw,34px)}
  .pband{display:grid;grid-template-columns:minmax(0,44%) 1fr;align-items:stretch;
    border:1px solid rgba(255,255,255,.14);border-radius:calc(var(--r) + 2px);overflow:hidden;
    background:rgba(255,255,255,.03);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
  .pband.flip{grid-template-columns:1fr minmax(0,44%)}
  .pband-media{position:relative;grid-column:1;min-height:clamp(230px,25vw,320px)}
  .pband.flip .pband-media{grid-column:2}
  .pband-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
    filter:saturate(.92) contrast(1.06) brightness(.8)}
  .pband-media::after{content:"";position:absolute;inset:0;pointer-events:none;
    background:linear-gradient(90deg,transparent 50%,rgba(10,14,20,.6))}
  .pband.flip .pband-media::after{background:linear-gradient(270deg,transparent 50%,rgba(10,14,20,.6))}
  .pband-body{grid-column:2;padding:clamp(26px,3.2vw,46px);display:flex;flex-direction:column;justify-content:center}
  .pband.flip .pband-body{grid-column:1;grid-row:1}
  .pband .cat{font-family:var(--mono);font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:#FFB86B;margin-bottom:15px}
  .pband .lbl{font-family:var(--mono);font-weight:600;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;margin-bottom:9px}
  .pband .problem{margin-bottom:18px}
  .pband .problem .lbl{color:var(--grey)}
  .pband .answer .lbl{color:var(--amber)}
  .pband h3{font-weight:600;font-size:clamp(21px,2.3vw,28px);letter-spacing:-.015em;line-height:1.14;margin-bottom:11px}
  .pband p{color:var(--grey);font-size:15.5px;line-height:1.62;margin-bottom:14px}
  .pband .a{display:inline-block;font-family:var(--mono);font-weight:600;font-size:11.5px;letter-spacing:.09em;
    text-transform:uppercase;color:var(--amber);text-decoration:none}
  .pband .a:hover{color:var(--amber-hot)}
  @media(max-width:820px){
    .pband,.pband.flip{grid-template-columns:1fr}
    .pband-media,.pband.flip .pband-media{grid-column:1;grid-row:1;min-height:200px}
    .pband-body,.pband.flip .pband-body{grid-column:1;grid-row:2}
    .pband-media::after,.pband.flip .pband-media::after{background:linear-gradient(0deg,rgba(10,14,20,.65),transparent 62%)}
  }

  /* --- Team programs: flagship leadership cards lead, support cards follow --- */
  .team-lead{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:clamp(22px,3vw,32px)}
  .team-support{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:16px}
  @media(max-width:760px){.team-lead,.team-support{grid-template-columns:1fr}}
  /* flagship cards — header image + larger name = more weight */
  .lead-card{padding:0;overflow:hidden}
  .lead-media{position:relative;height:clamp(160px,17vw,210px)}
  .lead-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
    filter:saturate(.9) contrast(1.1) brightness(.82)}
  .lead-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,8,12,.12),rgba(6,8,12,.6))}
  .lead-body{padding:clamp(26px,3vw,38px);display:flex;flex-direction:column}
  .lead-card h3{font-size:clamp(24px,2.6vw,32px);margin-bottom:12px}
  /* supporting cards — subtle pilot texture in the corner */
  .support-card{position:relative;overflow:hidden}
  .support-card .soft-img{position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden;border-radius:inherit}
  .support-card .soft-img img{width:100%;height:100%;object-fit:cover;opacity:.13;
    filter:saturate(.8) contrast(1.05) brightness(.72);
    -webkit-mask-image:linear-gradient(135deg,transparent 42%,#000);mask-image:linear-gradient(135deg,transparent 42%,#000)}
  .support-card > :not(.soft-img){position:relative;z-index:1}

  /* ==================================================================
     ABOUT — a cinematic documentary about the company: bigger opening,
     an editorial founder-story centerpiece with integrated aviation
     imagery, foundational statements with gravity, a living values
     system, and animated stats.
     ================================================================== */
  /* (1) Opening hero — full-bleed hangar image with text lower-left, matching
     the image-hero composition on Home / For Your Team. Min-height mirrors
     .hero.compact. The image grade is baked in — NO CSS filters. */
  .about-hero{position:relative;overflow:hidden;isolation:isolate;background:#0A0E14;
    min-height:min(90vh,780px);
    display:flex;flex-direction:column;justify-content:flex-end;
    padding:clamp(30px,6vw,72px) clamp(20px,5vw,64px) clamp(42px,7vw,88px)}
  .about-hero .about-hero-bg{position:absolute;inset:0;z-index:0;width:100%;height:100%;
    object-fit:cover;object-position:center 42%;animation:heroFadeIn 1.2s ease-out both}
  /* dark scrim — heavier at the lower-left where the text sits */
  .about-hero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
    background:linear-gradient(to top right, rgba(10,14,20,.92) 0%, rgba(10,14,20,.6) 45%, rgba(10,14,20,.35) 100%)}
  .about-hero-inner{position:relative;z-index:2;max-width:640px;
    opacity:0;transform:translateY(14px);animation:aboutRise .9s cubic-bezier(.2,.7,.2,1) .1s forwards}
  .about-hero .kicker{color:#FFB86B;margin-bottom:20px}
  .about-hero h1{font-size:clamp(42px,6.2vw,92px);line-height:1.02;letter-spacing:-.03em;color:#fff;max-width:16ch;margin-bottom:18px}
  .about-hero .sub{font-size:clamp(16px,1.7vw,20px);line-height:1.62;color:var(--cin-light);max-width:56ch;margin:0}
  @keyframes aboutRise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}

  /* (2+3) Founder story — the emotional centerpiece; aviation image
     integrated as the chapter opener, then portrait + editorial prose */
  .story{padding:clamp(60px,9vw,120px) 0 clamp(40px,6vw,84px)}
  .story-head{max-width:var(--maxw);margin:0 0 clamp(30px,4.5vw,60px);padding:0 clamp(20px,4vw,44px)}
  .story-head .kicker{color:#FFB86B}
  .story-head h2{font-size:clamp(34px,5.4vw,68px);letter-spacing:-.03em;line-height:1.02;color:var(--ink);margin:6px 0 0}
  .story-inner{max-width:var(--maxw);margin:0;padding:0 clamp(20px,4vw,44px);
    display:grid;grid-template-columns:.82fr 1.18fr;gap:clamp(30px,5vw,72px);align-items:center}
  @media(max-width:860px){.story-inner{grid-template-columns:1fr;gap:28px}}
  .story-portrait{position:relative;aspect-ratio:4/5;border-radius:calc(var(--r) + 2px);overflow:hidden;
    background:#0B0F16;border:1px solid rgba(255,255,255,.08)}
  .story-portrait img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
  .story-prose p{color:#C6D0DC;font-size:clamp(17px,1.65vw,21px);line-height:1.72;margin-bottom:20px;max-width:60ch}
  .story-prose p:first-child{font-size:clamp(19px,1.95vw,25px);line-height:1.6;color:#E7ECF3;font-weight:500}
  .story-prose .byline{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--grey);margin-top:26px}
  .story-prose .byline b{font-family:'Hanken Grotesk',system-ui,sans-serif;color:#fff;font-weight:600;letter-spacing:0;text-transform:none}

  /* (4) Vision & Mission — foundational statements with gravity */
  .why-section{text-align:center}
  .why-section .kicker::after{margin-left:auto;margin-right:auto}
  .why-head{margin-bottom:0;margin-left:auto;margin-right:auto}
  .why-statements{max-width:940px;margin:clamp(30px,5vw,60px) auto 0;
    display:flex;flex-direction:column;gap:clamp(40px,6.5vw,84px)}
  .why-label{font-family:var(--mono);font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:#FFB86B;margin-bottom:16px}
  .why-statement{font-size:clamp(23px,3.3vw,40px);line-height:1.24;letter-spacing:-.02em;color:#EDF2F8;font-weight:500;max-width:22ch;margin:0 auto;text-wrap:balance}
  .why-statement.lg{font-size:clamp(34px,5.4vw,66px);line-height:1.06;letter-spacing:-.03em;font-weight:600;max-width:16ch}

  /* (5) Core values — a living, numbered system */
  .pillar .vnum{font-family:var(--mono);font-size:12px;letter-spacing:.2em;color:#6E7B8C;margin-bottom:16px;transition:color .3s}
  .pillar:hover .vnum{color:#FFB86B}
  .pillar h3{transition:color .3s}
  .pillar:hover h3{color:#FFE9CF}

  /* (6) Team — real graded headshots (no filters), warm hover surfacing.
     images are pre-graded, so the container carries no overlay/tint — the
     lift + soft amber glow come from the shared card:hover treatment. */
  .person:hover .headshot .initials{color:rgba(255,184,107,.55)}
  .person:hover .pname{color:#FFF1E1}
  .person:hover .pname .call{color:var(--amber-hot)}
  .person .pname,.person .pname .call{transition:color .3s}
  @media(prefers-reduced-motion:reduce){
    /* hero: the global *{animation:none} would leave the inner block parked
       at opacity:0 — force it visible and static */
    .about-hero-inner,.pdp-hero-inner{opacity:1!important;transform:none!important;animation:none!important}
    .about-hero .about-hero-bg,.pdp-hero .pdp-hero-bg{animation:none!important}
    /* team: keep the warm glow + name surfacing, drop the movement */
    .person:hover{transform:none}
    .person .headshot img,.person:hover .headshot img{transition:none;transform:none}
  }

  /* ==================================================================
     PROGRAM DETAIL PAGE (managex / ignite / soar) — shared template.
     Full-bleed hero (no image filters) -> What it solves -> What you'll
     gain -> How it works -> CTA. Reuses the site tokens + card surface.
     ================================================================== */
  /* SOAR-standard composition: subject weighted low, text hard to the
     lower-left, minimal dead space up top. Shorter than the marketing
     heroes + object-position pushed down so the empty sky crops first. */
  /* ==================================================================
     UNIFIED PAGE HERO (every page uses .pdp-hero) — full-bleed graded
     image, static, text anchored lower-left to the SAME content grid edge
     as the body (inner is max-width:var(--maxw) centered, like .sec-inner).
     No filters, no motion. Height matches the SOAR/program-template. */
  /* Horizontal padding lives on the hero (like .section); inner is a bare
     max-width:var(--maxw) centered block (like .sec-inner) so the hero text's
     left edge lands on EXACTLY the same grid column as body content. The
     full-bleed bg/scrim use inset:0 → they fill the padding box, staying edge-to-edge. */
  .pdp-hero{position:relative;overflow:hidden;isolation:isolate;background:#0A0E14;
    min-height:min(72vh,620px);display:flex;flex-direction:column;justify-content:flex-end;
    /* top padding reserves the fixed-nav height so the bottom-anchored headline can never ride
       under the header when the vh-based hero shrinks on short viewports (nav is ~83px). */
    padding:clamp(92px,10vh,108px) clamp(20px,4vw,44px) clamp(38px,5vw,64px)}
  .pdp-hero .pdp-hero-bg{position:absolute;inset:0;z-index:0;width:100%;height:100%;
    object-fit:cover;object-position:center 62%}
  /* directional scrim — heavier bottom-left so text always passes contrast */
  .pdp-hero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
    background:linear-gradient(to top right, rgba(10,14,20,.92) 0%, rgba(10,14,20,.55) 48%, rgba(10,14,20,.30) 100%)}
  .pdp-hero-inner{position:relative;z-index:2;width:100%;max-width:var(--maxw);margin:0;padding:0}
  .pdp-hero .kicker{color:#FFB86B;margin-bottom:18px}
  .pdp-hero h1{font-size:clamp(40px,5.6vw,82px);line-height:1.02;letter-spacing:-.03em;color:#fff;margin-bottom:16px;text-wrap:balance;max-width:20ch}
  .pdp-promise,.pdp-hero .sub{font-size:clamp(16px,1.8vw,22px);line-height:1.6;color:var(--cin-light);max-width:54ch;margin:0}
  .pdp-hero .cta-row{margin:clamp(22px,3vw,30px) 0 0}
  /* homepage hero — tightened vertical rhythm beneath the eyebrow/headline */
  .home-hero{min-height:min(62vh,540px);padding-bottom:clamp(14px,2.2vw,28px)}
  .home-hero .kicker{margin-bottom:6px}
  .home-hero h1{margin-bottom:8px}
  .home-hero .cta-row{margin-top:clamp(10px,1.6vw,16px)}
  /* content sections — tighter, even top rhythm */
  .pdp-sec{padding:clamp(50px,7vw,92px) clamp(20px,4vw,44px) 0}
  .pdp-sec .sec-inner{max-width:var(--maxw);margin:0}
  .pdp-sec .sec-inner.pdp-narrow{max-width:840px;margin:0}
  .pdp-lead{font-size:clamp(17px,1.7vw,20px);line-height:1.72;color:var(--grey);max-width:66ch;margin:0}
  .pdp-gains{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(215px,1fr));margin-top:4px}
  .pdp-gain{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.14);border-radius:var(--r);
    padding:28px;font-size:15.5px;line-height:1.55;color:var(--ink);font-weight:500}
  .pdp-chips{display:flex;flex-wrap:wrap;gap:9px;margin:2px 0 22px}
  .pdp-chip{font-family:var(--mono);font-size:11px;letter-spacing:.13em;text-transform:uppercase;text-align:center;
    color:#FFB86B;border:1px solid rgba(255,184,107,.34);border-radius:99px;padding:8px 14px;background:rgba(255,184,107,.06)}
  .pdp-included{margin-top:28px;max-width:66ch}
  .pdp-inc-label{font-family:var(--mono);font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:#8895A6;margin-bottom:14px}
  .pdp-included ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}
  .pdp-included li{position:relative;padding-left:26px;font-size:16px;line-height:1.55;color:var(--grey)}
  .pdp-included li::before{content:"";position:absolute;left:2px;top:9px;width:7px;height:7px;border-radius:50%;
    background:#FFB86B;box-shadow:0 0 10px rgba(255,184,107,.55)}
  /* CTA block */
  .pdp-cta-sec{padding-top:clamp(56px,8vw,104px);padding-bottom:clamp(72px,10vw,140px)}
  .pdp-cta{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.14);border-radius:calc(var(--r) + 4px);
    padding:clamp(36px,5vw,64px) clamp(24px,4vw,48px);text-align:center}
  .pdp-cta h2{font-size:clamp(26px,3.4vw,42px);letter-spacing:-.02em;line-height:1.1;margin:0 0 clamp(22px,3vw,30px);color:var(--ink)}
  .pdp-cta-row{display:flex;flex-wrap:wrap;gap:15px;align-items:center;justify-content:center}
  .pdp-price-flag{font-family:var(--mono);font-size:11.5px;letter-spacing:.13em;text-transform:uppercase;
    color:#FFB86B;border:1px dashed rgba(255,184,107,.6);border-radius:99px;padding:13px 20px;background:rgba(255,184,107,.05)}

  /* ---- Confirmed program pricing (inside the CTA block) ---- */
  /* prominent base price */
  .pdp-price{display:flex;align-items:baseline;justify-content:center;gap:12px;flex-wrap:wrap;
    margin:0 0 clamp(24px,3vw,30px)}
  .pdp-price-amt{font-family:var(--mono);font-weight:600;font-size:clamp(36px,4.6vw,54px);
    letter-spacing:-.02em;line-height:1;color:var(--ink)}
  .pdp-price-unit{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:#8895A6}
  /* secondary "talk first" link beneath the Enroll button */
  .pdp-cta-alt{display:inline-block;margin-top:clamp(16px,2vw,20px);font-family:var(--mono);
    font-size:11.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--grey);text-decoration:none;
    border-bottom:1px solid rgba(255,255,255,.2);padding-bottom:3px;transition:color .2s,border-color .2s}
  .pdp-cta-alt:hover{color:var(--amber-hot);border-color:rgba(255,184,107,.6)}
  /* FAQ disclosure accordion (EDGE/IGNITE/ELITE) — real disclosure widget, animated via grid-rows */
  .faq{max-width:820px;margin:0 auto}
  .faq-item{border-bottom:1px solid rgba(255,255,255,.1)}
  .faq-item:first-child{border-top:1px solid rgba(255,255,255,.1)}
  .faq-h{margin:0;font-size:inherit;font-weight:inherit;line-height:normal;letter-spacing:normal;text-wrap:wrap}
  .faq-q{width:100%;display:flex;align-items:flex-start;justify-content:space-between;gap:18px;
    background:none;border:0;cursor:pointer;text-align:left;color:var(--ink);font-family:inherit;
    font-weight:600;font-size:clamp(16px,1.9vw,19px);line-height:1.4;letter-spacing:-.01em;
    padding:clamp(18px,2.4vw,24px) 2px}
  .faq-q:hover{color:#fff}
  .faq-q:focus-visible{outline:2px solid var(--amber-hot);outline-offset:2px;border-radius:6px}
  .faq-ico{flex:0 0 auto;width:20px;height:20px;margin-top:3px;color:#FFB86B;transition:transform .3s ease}
  .faq-ico svg{display:block;width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
  .faq-item.open .faq-ico{transform:rotate(180deg)}
  /* height animated by JS (measures content) — robust across engines, no jump */
  .faq-a{overflow:hidden;height:0;transition:height .32s ease}
  .faq-a-inner{overflow:hidden}
  .faq-a-body{padding:0 2px clamp(20px,2.6vw,26px);color:var(--grey);font-size:clamp(15px,1.7vw,16.5px);line-height:1.7;max-width:72ch}
  .faq-a-body>p{margin:0 0 13px}
  .faq-a-body>p:last-child{margin-bottom:0}
  .faq-a-body b{color:var(--ink);font-weight:600}
  .faq-a-body ul{margin:6px 0 13px;padding-left:20px}
  .faq-a-body li{margin:0 0 7px;line-height:1.6}
  .faq-a-body li:last-child{margin-bottom:0}
  .faq-sub{color:var(--ink);font-weight:600;margin:16px 0 4px}
  @media(prefers-reduced-motion:reduce){.faq-a,.faq-ico{transition:none}}
  /* bundle pages — individual phase list + one emphasized bundle */
  .pdp-phases{list-style:none;margin:0 auto clamp(20px,2.6vw,26px);padding:0;max-width:540px;text-align:left}
  .pdp-phases li{display:flex;justify-content:space-between;align-items:baseline;gap:8px 18px;flex-wrap:wrap;
    padding:12px 2px;border-bottom:1px solid rgba(255,255,255,.09)}
  .pdp-phases .ph-buy{display:flex;align-items:baseline;gap:14px}
  .pdp-phases .ph-pill{padding:7px 15px;font-size:11px;letter-spacing:.08em}
  .pdp-phases li:last-child{border-bottom:0}
  .pdp-phases .ph-name{font-size:15px;color:var(--grey);line-height:1.4}
  .pdp-phases .ph-name .ph-sub{color:#8895A6}
  .pdp-phases .ph-amt{font-family:var(--mono);font-size:15px;letter-spacing:-.01em;color:var(--ink);white-space:nowrap}
  .pdp-phases li.ph-total .ph-name{color:var(--ink);font-weight:600}
  .pdp-phases li.ph-total .ph-amt{color:var(--ink);font-weight:600;font-size:16px}
  .pdp-bundle{max-width:520px;margin:0 auto clamp(26px,3vw,32px);text-align:left;
    border:1px solid rgba(255,184,107,.28);border-radius:calc(var(--r) - 2px);background:rgba(255,184,107,.05);
    padding:clamp(18px,2.4vw,24px) clamp(20px,2.6vw,26px)}
  .pdp-bundle .bundle-tag{display:block;font-family:var(--mono);font-size:10px;letter-spacing:.18em;
    text-transform:uppercase;color:#FFB86B;margin-bottom:10px}
  .pdp-bundle .bundle-name{display:block;font-size:15.5px;line-height:1.45;color:var(--ink);font-weight:500;margin-bottom:11px}
  .pdp-bundle .bundle-price{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;
    font-family:var(--mono);font-weight:600;font-size:clamp(22px,2.6vw,28px);letter-spacing:-.01em;color:#fff}
  .pdp-bundle .bundle-save{font-family:var(--mono);font-weight:400;font-size:12px;letter-spacing:.06em;color:#FFB86B}
  /* ORIGINATOR pricing — three equal standalone-phase cards, centered */
  .orig-phases{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;max-width:720px;
    margin:0 auto clamp(20px,2.6vw,28px)}
  @media(max-width:640px){.orig-phases{grid-template-columns:1fr}}
  .orig-phases .phase-card{display:flex;flex-direction:column;gap:5px;text-align:left;
    padding:clamp(16px,2vw,20px);border:1px solid rgba(255,255,255,.12);
    border-radius:calc(var(--r) - 4px);background:rgba(255,255,255,.02)}
  .orig-phases .ph-tag{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#8895A6}
  .orig-phases .ph-name{font-size:16px;font-weight:600;color:var(--ink);line-height:1.2}
  .orig-phases .ph-amt{font-family:var(--mono);font-weight:600;font-size:clamp(20px,2.4vw,24px);
    letter-spacing:-.01em;color:var(--ink);margin-top:2px}
  .orig-phases .ph-note{font-size:12.5px;color:#8895A6;line-height:1.5;margin-top:auto;padding-top:10px}
  .orig-phases .phase-card .pill{margin-top:14px;text-align:center}
  /* Complete Package — the hero bundle: bigger Best Value flag, weighted inclusions */
  .pdp-bundle.complete{max-width:560px;border-color:rgba(255,184,107,.6);background:rgba(255,184,107,.11);
    box-shadow:0 14px 40px rgba(0,0,0,.3)}
  .pdp-bundle.complete .bundle-tag{display:inline-block;font-size:14px;font-weight:700;letter-spacing:.14em;
    color:#0A0E14;background:#FFB86B;border-radius:99px;padding:7px 16px;margin-bottom:14px}
  .orig-incl{list-style:none;margin:14px 0 0;padding:0;display:flex;flex-direction:column;gap:9px}
  .orig-incl li{font-size:14px;line-height:1.4;color:var(--cin-light);display:flex;align-items:baseline;gap:9px}
  .orig-incl li::before{content:"\2713";color:#FFB86B;font-weight:700}
  .orig-incl li.coach{font-size:clamp(16px,2vw,19px);color:#fff;font-weight:600;line-height:1.3;
    margin-top:3px;padding-top:10px;border-top:1px solid rgba(255,184,107,.25)}
  .orig-incl li.coach b{color:#FFB86B}
  /* tighter masonry variant — ORIGINATOR testimonials size to content, no equal-height stretch */
  .tmasonry.tight{column-gap:12px;margin-top:clamp(14px,2vw,20px)}
  .tmasonry.tight .quote{margin:0 0 12px}
  /* ORIGINATOR proof callout — the rookie-applications stat, given weight and repeated */
  .orig-proof{margin:clamp(18px,2.6vw,28px) auto 0;max-width:760px;text-align:center;
    background:rgba(255,184,107,.1);border:1px solid rgba(255,184,107,.42);border-radius:calc(var(--r) + 2px);
    padding:clamp(22px,3.4vw,36px) clamp(22px,4vw,40px)}
  .orig-proof .op-eyebrow{display:block;font-family:var(--mono);font-size:clamp(10.5px,1vw,12px);letter-spacing:.18em;
    text-transform:uppercase;color:#FFB86B;font-weight:600;margin-bottom:12px}
  .orig-proof .op-stat{font-size:clamp(19px,2.5vw,28px);line-height:1.36;color:var(--ink);font-weight:500;letter-spacing:-.01em}
  .orig-proof .op-stat b{color:#FFB86B;font-weight:700}
  /* XINNIX Unlimited ROI calculator — dark cinematic, self-contained */
  .roi{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,3vw,32px);align-items:start;margin-top:clamp(8px,1.5vw,16px)}
  @media(max-width:820px){.roi{grid-template-columns:1fr}}
  .roi-inputs{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:0}
  @media(max-width:520px){.roi-inputs{grid-template-columns:1fr}}
  .roi-field{display:flex;flex-direction:column;gap:6px;min-width:0}
  .roi-field label{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#9DB0C6;line-height:1.3}
  .roi-field input{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.16);border-radius:10px;
    padding:12px 14px;color:var(--ink);font-size:16px;font-family:var(--mono);width:100%;transition:border-color .2s,background .2s}
  .roi-field input:focus{outline:none;border-color:#FFB86B;background:rgba(255,184,107,.06)}
  .roi-help{font-size:12px;color:#8895A6;line-height:1.4}
  .roi-privacy{grid-column:1/-1;font-size:12px;color:#8895A6;line-height:1.5;margin:2px 0 0}
  .roi-results{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.14);
    border-radius:calc(var(--r) + 4px);padding:clamp(20px,3vw,32px)}
  .roi-badge{display:inline-block;font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;
    color:#FFB86B;border:1px solid rgba(255,184,107,.4);background:rgba(255,184,107,.08);border-radius:99px;padding:6px 12px;margin-bottom:18px}
  .roi-cards{display:flex;flex-direction:column;gap:12px}
  .roi-card{background:rgba(255,255,255,.02);border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:clamp(16px,2.2vw,22px)}
  .roi-card-hero{border-color:rgba(255,184,107,.5);background:rgba(255,184,107,.09)}
  .roi-card-val{font-family:var(--mono);font-weight:600;font-size:clamp(26px,4vw,40px);letter-spacing:-.02em;color:var(--ink);line-height:1;word-break:break-word}
  .roi-card-hero .roi-card-val{color:#FFB86B}
  .roi-card-lbl{font-size:13px;color:var(--grey);margin-top:8px;line-height:1.4}
  /* headline outcomes as a matched pair of circles — gross (amber) + net (green) */
  .roi-circles{display:flex;gap:clamp(12px,2vw,18px);flex-wrap:wrap}
  .roi-circle{flex:1 1 160px;min-width:0;aspect-ratio:1/1;border-radius:50%;border:1px solid;
    display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;
    padding:clamp(12px,2.6vw,20px);gap:5px}
  .roi-circle-val{font-family:var(--mono);font-weight:600;font-size:clamp(20px,3.1vw,30px);
    letter-spacing:-.02em;line-height:1;word-break:normal}
  .roi-circle-lbl{font-size:12.5px;color:var(--grey);line-height:1.3;max-width:16ch}
  .roi-circle-sub{font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#8895A6}
  .roi-circle-gross{border-color:rgba(255,184,107,.5);background:rgba(255,184,107,.09)}
  .roi-circle-gross .roi-circle-val{color:#FFB86B}
  .roi-circle-net{border-color:rgba(91,217,140,.5);background:rgba(91,217,140,.10)}
  .roi-circle-net .roi-circle-val{color:#5BD98C}
  /* phones: keep them circular, just stack centered at a comfortable capped size */
  @media(max-width:520px){.roi-circles{flex-direction:column;align-items:center}
    .roi-circle{flex:0 0 auto;width:min(260px,86%)}}
  .roi-exact{font-size:14px;color:var(--grey);line-height:1.5;margin:16px 0 0}
  .roi-exact a{color:var(--ink);border-bottom:1px solid rgba(255,184,107,.6);text-decoration:none;white-space:nowrap}
  .roi-exact a:hover{color:var(--amber-hot)}
  .roi-fullpage-link{display:inline-block;margin-top:14px;font-family:var(--mono);font-size:11.5px;
    letter-spacing:.09em;text-transform:uppercase;color:#FFB86B;text-decoration:none;
    border-bottom:1px solid rgba(255,184,107,.4);padding-bottom:3px;transition:border-color .2s}
  .roi-fullpage-link:hover{border-color:#FFB86B}
  .roi-support{font-size:13px;color:#8895A6;margin:16px 0 0;line-height:1.5}
  .roi-cta{margin-top:clamp(18px,2.4vw,24px);text-align:center}
  .roi-assume{margin-top:clamp(20px,2.6vw,28px);max-width:820px;border-top:1px solid rgba(255,255,255,.1);padding-top:clamp(14px,2vw,20px)}
  .roi-assume summary{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#9DB0C6;cursor:pointer;list-style:revert}
  .roi-assume ul{margin:10px 0 0;padding:0 0 0 18px;color:var(--grey);font-size:13.5px;line-height:1.75}
  .roi-assume ul b{color:#FFB86B;font-family:var(--mono)}
  .roi-benefits{margin-top:clamp(24px,3vw,34px)}
  .roi-benefits-lbl{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#FFB86B;margin-bottom:12px}
  .roi-benefits ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:8px 22px}
  .roi-benefits li{font-size:14px;color:var(--grey);line-height:1.5;display:flex;align-items:baseline;gap:9px}
  .roi-benefits li::before{content:"+";color:#FFB86B;font-weight:700}
  /* ROI dedicated page (roi-calculator.html) — additive, all scoped under .roi-adv /
     the editable-assumptions panel. Never rendered on the embedded Unlimited calc. */
  .roi-adv .roi-card-val,.roi-adv .roi-circle-val{font-variant-numeric:tabular-nums}
  /* instrument ring arcs on the two outcome circles */
  .roi-adv .roi-circle{position:relative}
  .roi-adv .roi-circle-val,.roi-adv .roi-circle-lbl,.roi-adv .roi-circle-sub{position:relative;z-index:1}
  .roi-ring{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg);pointer-events:none;overflow:visible}
  .roi-ring-bg{fill:none;stroke:rgba(255,255,255,.10);stroke-width:2.4}
  .roi-ring-arc{fill:none;stroke-width:2.6;stroke-linecap:round}
  .roi-ring-gross .roi-ring-arc{stroke:#FFB86B}
  .roi-ring-net .roi-ring-arc{stroke:#5BD98C}
  /* editable assumptions */
  .roi-assumptions{margin-top:clamp(22px,3vw,32px);max-width:960px;border-top:1px solid rgba(255,255,255,.1);padding-top:clamp(16px,2.2vw,22px)}
  .roi-assump-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:16px}
  .roi-assump-title{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#9DB0C6}
  .roi-assump-note{font-size:12.5px;color:#8895A6;line-height:1.5;margin-top:4px;max-width:52ch}
  .roi-reset{flex:0 0 auto;font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#FFB86B;background:none;border:1px solid rgba(255,184,107,.4);border-radius:99px;padding:7px 14px;cursor:pointer;transition:border-color .2s,background .2s}
  .roi-reset:hover{border-color:#FFB86B;background:rgba(255,184,107,.08)}
  .roi-reset:focus-visible{outline:2px solid var(--amber-hot);outline-offset:2px}
  .roi-assump-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(266px,1fr));gap:14px 20px}
  .roi-assump{display:grid;grid-template-columns:1fr auto;grid-template-areas:"label input" "help def";gap:6px 12px;align-items:center;padding:13px 15px;border:1px solid rgba(255,255,255,.10);border-radius:12px;background:rgba(255,255,255,.02);transition:border-color .2s,background .2s}
  .roi-assump.is-changed{border-color:rgba(255,184,107,.55);background:rgba(255,184,107,.06)}
  .roi-assump label{grid-area:label;font-size:13.5px;color:var(--ink);line-height:1.35}
  .roi-assump-inputwrap{grid-area:input;display:inline-flex;align-items:center;gap:7px;white-space:nowrap}
  .roi-assump input{width:76px;text-align:right;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.16);border-radius:8px;padding:8px 10px;color:var(--ink);font-family:var(--mono);font-size:15px;font-variant-numeric:tabular-nums}
  .roi-assump input:focus{outline:none;border-color:#FFB86B;background:rgba(255,184,107,.06)}
  .roi-assump-unit{font-family:var(--mono);font-size:11.5px;color:#8895A6;min-width:34px}
  .roi-assump-help{grid-area:help;font-size:12px;color:#8895A6;line-height:1.45}
  .roi-assump-def{grid-area:def;justify-self:end;align-self:end;font-family:var(--mono);font-size:10.5px;letter-spacing:.04em;color:#7C8A9C;white-space:nowrap}
  .roi-assump.is-changed .roi-assump-def{color:#FFB86B}
  @media(max-width:520px){.roi-assump-def{display:none}}
  /* PROBLEM-FIRST "what we solve" cards (Experienced LOs) — each routes to its program */
  .solve{margin:clamp(22px,3.2vw,34px) 0 clamp(30px,4.5vw,52px)}
  .solve > .kicker{color:#FFB86B}
  .solve-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:12px;margin-top:clamp(16px,2.2vw,24px)}
  .solve-card{display:flex;flex-direction:column;gap:9px;text-decoration:none;
    background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.14);border-radius:var(--r);
    padding:clamp(18px,2.2vw,24px);transition:border-color .2s,background .2s,transform .2s,box-shadow .2s}
  .solve-card:hover{border-color:rgba(255,184,107,.5);background:rgba(255,184,107,.05);transform:translateY(-3px);box-shadow:0 16px 40px rgba(0,0,0,.3)}
  .solve-card:focus-visible{outline:2px solid #FFB86B;outline-offset:3px}
  .solve-card h4{font-size:clamp(15.5px,1.55vw,18px);font-weight:600;line-height:1.28;letter-spacing:-.01em;color:var(--ink);margin:0}
  .solve-card p{font-size:14px;line-height:1.55;color:var(--grey);margin:0;flex:1}
  .solve-card .solve-prog{font-family:var(--mono);font-size:12px;letter-spacing:.05em;color:#FFB86B;font-weight:600;margin-top:2px}
  .solve-card:hover .solve-prog{color:#FFD9AE}
  /* GHL booking calendar embed — page-width dark frame; min-height reserves space
     so form_embed.js resizing doesn't shift the layout */
  /* CAREERS APPLICATION FORM (working-at-xinnix) — dark cinematic */
  .apply-head{max-width:640px;margin:0 0 clamp(22px,3vw,32px)}
  .apply-eyebrow{font-family:var(--mono);font-size:clamp(11px,1.1vw,13px);letter-spacing:.28em;
    text-transform:uppercase;color:#FFB86B;font-weight:600;margin:2px 0 14px}
  .apply-head h2{font-size:clamp(28px,3.6vw,44px);letter-spacing:-.02em;line-height:1.08;color:var(--ink);margin:0 0 12px}
  .apply-sub{font-size:clamp(15px,1.7vw,18px);line-height:1.6;color:var(--grey);margin:0;max-width:54ch}

  /* Plain centering wrapper — no card chrome, no overflow, no height: the GHL widget renders its
     own rounded card, so this stays a transparent passthrough (one rounded container, not two)
     and never constrains the iframe's height. */
  /* Book-a-call — compressed hero + two-column booking (rail | calendar) */
  /* hero: headline + subhead only, tight — the calendar sits just below the fold at 900px */
  .book-hero{min-height:min(36vh,300px);padding-bottom:clamp(16px,2.2vw,24px)}
  /* solid ground on the booking section: the GHL widget card is #0A0E14 SOLID, which hides the
     body's faint grid texture. Painting the same solid ground here means the rail sits on the
     identical surface as the card — no texture boundary, no seam, one continuous ground. */
  .book-sec{padding-top:clamp(24px,3.2vw,40px);padding-bottom:clamp(48px,7vw,88px);background:#0A0E14}
  .book-grid{display:grid;grid-template-columns:minmax(360px,430px) minmax(0,1fr);
    gap:clamp(28px,4vw,56px);align-items:start}
  .book-rail{display:flex;flex-direction:column;gap:clamp(22px,2.8vw,30px);min-width:0;
    padding-top:2px}   /* rail's first line sits level with the widget card's top edge */
  @media(max-width:1000px){
    .book-grid{grid-template-columns:1fr;gap:clamp(30px,5vw,42px)}
    .book-cal{order:1}          /* calendar first on mobile — never scroll past a pitch to book */
    .book-rail{order:2;max-width:640px;padding-top:0}
  }
  .book-lead{font-size:clamp(23px,2.7vw,31px);line-height:1.2;letter-spacing:-.02em;
    color:var(--ink);font-weight:600;margin:0;text-wrap:balance;max-width:18ch}
  .book-phone-eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.16em;
    text-transform:uppercase;color:#9DB0C6;margin-bottom:9px}
  .book-phone-num{display:inline-block;font-family:var(--mono);font-weight:600;
    font-size:clamp(27px,3.6vw,36px);letter-spacing:-.01em;color:#FFB86B;text-decoration:none;
    line-height:1;transition:color .2s}
  .book-phone-num:hover{color:var(--amber-hot)}
  .book-phone-sub{font-size:14px;color:var(--grey);margin-top:9px;line-height:1.5}
  .book-logos-eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.16em;
    text-transform:uppercase;color:#9DB0C6;margin-bottom:18px}
  /* six strongest logos, sized up with real breathing room — a trust signal, not noise */
  .book-logos-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px 24px;align-items:center;
    justify-items:center;max-width:400px}
  .book-logos-grid img{height:32px;width:auto;max-width:100%;object-fit:contain;
    opacity:.72;transition:opacity .3s ease}
  .book-logos-grid img:hover{opacity:1}
  @media(max-width:420px){.book-logos-grid{gap:22px 18px}.book-logos-grid img{height:28px}}
  /* The calendar is the destination: no wrapping card. .cal-embed is a bare, transparent
     passthrough (one rounded container = the widget's own surface). NO height / max-height /
     overflow / aspect-ratio here or on any ancestor — only a measured min-height floor. */
  .cal-embed{margin:0}
  /* min-height MEASURED to the tallest step (the Enter Details form): 1103px at an 804px-wide
     column, ~1071px narrower. Floor set to 1160 (buffer over 1103) so the widget content always
     fits — no inner scrollbar. On production the widget postMessages each step's height and the
     listener grows the iframe to it (removing whitespace on short steps); the floor covers any
     under-report. This floor is the definitive fix — the prior 1000px floor was ~103px short. */
  .cal-embed iframe{display:block;width:100%!important;max-width:100%!important;
    position:static!important;left:auto!important;top:auto!important;
    opacity:1!important;visibility:visible!important;pointer-events:auto!important;
    min-height:1160px}
  /* phones: fields/labels can wrap a line taller — a touch more floor for safety */
  @media(max-width:640px){.cal-embed iframe{min-height:1200px}}
  /* featured proof stat (recruiting-workshop) — large numeral treatment */
  .pdp-stat{margin-top:28px;padding:clamp(28px,4vw,42px) clamp(24px,4vw,44px);
    background:rgba(255,184,107,.05);border:1px solid rgba(255,184,107,.22);border-radius:calc(var(--r) + 2px)}
  .pdp-stat-big{font-size:clamp(23px,3.2vw,38px);line-height:1.2;letter-spacing:-.02em;color:var(--ink);font-weight:600;max-width:26ch}
  .pdp-stat-big .num{color:#FFB86B;font-weight:700;white-space:nowrap}
  .pdp-stat-cap{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:#8895A6;margin-top:16px}
  /* signature keynote cards (keynote-speaking) — title + one line, gain-card style */
  .pdp-gain.kn{display:flex;flex-direction:column}
  .pdp-gain.kn .kn-title{font-weight:600;font-size:17px;line-height:1.25;letter-spacing:-.01em;color:var(--ink);margin-bottom:9px}
  .pdp-gain.kn p{font-size:14.5px;line-height:1.55;color:var(--grey);font-weight:400;margin:0}
  /* program-name links on programs.html -> detail pages */
  .tname a,.flagship-inner h3 a{color:inherit;text-decoration:none;transition:color .2s}
  .tname a:hover,.flagship-inner h3 a:hover{color:#FFB86B}
  /* whole-card click-through (JS sets data-href -> role=link) */
  [data-href]{cursor:pointer}
  [data-href]:focus-visible{outline:2px solid #FFB86B;outline-offset:3px}
  /* clickable quiet variants (ORIGINATOR Direct / Assist) */
  .quietline[data-href] b{transition:color .2s}
  .quietline[data-href]:hover b{color:#FFB86B}
  /* flagship hover — same illumination-only affordance as the cards */
  .flagship[data-href]{transition:box-shadow .28s ease}
  .flagship[data-href]:hover{
    box-shadow:0 26px 64px rgba(0,0,0,.5),0 0 34px rgba(255,184,107,.14)}

  /* ---- Team flip cards (about.html) — CSS/JS 3D flip, no libraries. Structure built by inline script; content via data-* (default "Coming soon"). ---- */
  /* flex column so .p-inner fills the full (grid-stretched) card height */
  .team-grid .person{background:transparent;border:0;overflow:visible;cursor:pointer;perspective:1500px;padding:0;display:flex;flex-direction:column}
  .team-grid .person::after{display:none}
  /* Grid-stack both faces in one cell so both fill the card; grid-auto-rows:1fr
     makes every card a uniform height across the grid (no short left cards). */
  .team-grid .person .p-inner{display:grid;flex:1 1 auto;width:100%;transition:transform .6s cubic-bezier(.2,.75,.25,1);transform-style:preserve-3d}
  .team-grid .person.flipped .p-inner{transform:rotateY(180deg)}
  .team-grid .person .p-front,
  .team-grid .person .p-back{grid-area:1/1;-webkit-backface-visibility:hidden;backface-visibility:hidden;
    background:rgba(255,255,255,.043);border:1px solid rgba(255,255,255,.14);border-radius:var(--r);overflow:hidden}
  /* front fills the (possibly taller) card: photo flexes, name/role stay natural */
  .team-grid .person .p-front{position:relative;z-index:2;display:flex;flex-direction:column}
  .team-grid .person .p-front .headshot{aspect-ratio:auto;flex:1 1 auto;min-height:clamp(200px,20vw,280px)}
  .team-grid .person .p-front .pbody{flex:0 0 auto}
  .team-grid .person .p-back{transform:rotateY(180deg);
    display:flex;flex-direction:column;justify-content:center;gap:clamp(13px,2.2vw,20px);padding:clamp(22px,3.2vw,30px)}
  .team-grid .person .pb-field{display:flex;flex-direction:column;gap:5px}
  .team-grid .person .pb-label{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#FFB86B}
  .team-grid .person .pb-val{font-size:14px;line-height:1.45;color:var(--ink)}
  .team-grid .person .pb-val.tbd{color:#8895A6}
  .team-grid .person:hover .p-front{box-shadow:0 18px 44px rgba(0,0,0,.35)}
  /* subtle "flip me" affordance */
  .team-grid .person .flip-hint{position:absolute;top:12px;right:12px;z-index:4;width:26px;height:26px;border-radius:50%;
    display:flex;align-items:center;justify-content:center;background:rgba(10,14,20,.55);border:1px solid rgba(255,255,255,.2);
    color:#FFB86B;font-size:14px;line-height:1;opacity:0;transition:opacity .25s;pointer-events:none}
  .team-grid .person:hover .flip-hint,.team-grid .person.flipped .flip-hint,.team-grid .person:focus-visible .flip-hint{opacity:1}
  .team-grid .person:focus-visible{outline:2px solid #FFB86B;outline-offset:3px}
  @media(prefers-reduced-motion:reduce){.team-grid .person .p-inner{transition:none}}

  /* CLICK-TO-PLAY VIDEO FACADE — branded poster shows first; YouTube iframe
     loads only on click. 16:9 frame, no layout shift on swap. */
  .video-facade{position:relative;width:100%;aspect-ratio:16/9;border-radius:var(--r);overflow:hidden;
    border:1px solid var(--line);background:#000;cursor:pointer;display:block;padding:0}
  .video-facade .vf-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
  .video-facade iframe{position:absolute;inset:0;width:100%;height:100%;border:0;display:block}
  .video-facade .vf-scrim{position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(10,14,20,.15),rgba(10,14,20,.45));
    transition:background .25s}
  .video-facade .vf-play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
    width:clamp(64px,7vw,84px);height:clamp(64px,7vw,84px);border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    background:rgba(10,14,20,.55);border:2px solid #FFB86B;
    box-shadow:0 8px 30px rgba(0,0,0,.4);transition:transform .2s,background .2s;backdrop-filter:blur(2px)}
  .video-facade .vf-play svg{width:38%;height:38%;margin-left:8%;fill:#FFB86B;display:block}
  .video-facade:hover .vf-play,.video-facade:focus-visible .vf-play{transform:translate(-50%,-50%) scale(1.07);background:rgba(10,14,20,.72)}
  .video-facade:hover .vf-scrim{background:radial-gradient(ellipse at center,rgba(10,14,20,.05),rgba(10,14,20,.35))}
  .video-facade:focus-visible{outline:2px solid #FFB86B;outline-offset:3px}
  .video-facade.playing{cursor:default}
  .video-facade.playing .vf-poster,.video-facade.playing .vf-scrim,.video-facade.playing .vf-play{display:none}
  @media(prefers-reduced-motion:reduce){.video-facade .vf-play,.video-facade .vf-scrim{transition:none}}