/* home.css — extracted from index.html on 2026-05-09 to slim the page weight. */

/* --- block 1 --- */
:root {
 --brand: #A88838;
 --navy: #0F1629;
 --navy-light: #1A2238;
 --ivory: #F8F7F2;
 --warm: #FAF9F4;
 --white: #FFFFFF;
 --gold: #A88838;
 --teal: #4ECDC4;
 --td: #1A1A2E;
 --ts: #4A4A60;
 --tm: #8A8AA0;
 --tl: #F5F6FA;
 --tls: #CAD1E6;
 --tlm: #A9B2D0;
 --serif: 'Cormorant Garamond', Georgia, serif;
 --sans: 'Inter', -apple-system, sans-serif;
 --mono: 'Fira Code', 'Courier New', monospace;
 --s1:12px; --s2:16px; --s3:21px; --s4:28px; --s5:38px; --s6:51px; --s7:68px; --s8:91px;
 }

 *{margin:0;padding:0;box-sizing:border-box}
 html{scroll-behavior:smooth}

 /* === Typography uplift (larger, more readable) === */
 p{font-size:16.5px}
 .lbl{font-size:12.5px}
 .nav-links a{font-size:12px}
 .nav-cta{font-size:12px;padding:9px 18px}
 .hero-sub{font-size:19px;max-width:600px;line-height:1.55}
 .hero-eyebrow{font-size:13.5px}
 .cc h4{font-size:19px}
 .cc p{font-size:14.5px}
 .st-l{font-size:12.5px;color:var(--tlm)}
 .st-n{font-size:46px}
 .crisis-label{font-size:13.5px}
 .crisis-detail{font-size:13.5px;color:var(--tlm)}
 .crisis-num{font-size:40px}
 .fed-cred-lbl{font-size:12px;color:var(--tlm)}
 .fed-cred-val{font-size:14.5px;color:var(--tls)}
 .fed-lbl{font-size:12px}
 .fed-agent h3{font-size:26px}
 .fed-agent p{font-size:15.5px;color:var(--tls)}
 .rc-benefits{font-size:15.5px;color:var(--tls)}
 .rc-benefits li{line-height:2}
 .rc-left p{font-size:16.5px;color:var(--tls)}
 .ps-t .ps-n{font-size:19.5px}
 .ps-t .ps-p{font-size:28px}
 .ps-t .ps-d{font-size:13px}
 .ps-lbl{font-size:13px}
 .pc-tier{font-size:22px}
 .pc-amt{font-size:30px}
 .pc-per{font-size:12.5px}
 .pc-who{font-size:13.5px}
 .pc-list li{font-size:13.5px}
 .pc-btn{font-size:12.5px}
 .pc.pop::before{font-size:10.5px}
 .dm-title{font-size:12.5px;color:var(--tls)}
 .dm-live{font-size:11px}
 .dm-cell{font-size:10.5px;color:rgba(255,255,255,.88)}
 .dm-cell-v{font-size:15px;color:#FFFFFF}
 .dm-feed{font-size:12px;color:var(--tls)}
 .dm-row .dm-ts{color:var(--tlm);opacity:.75}
 .dm-row .dm-tag{font-size:10.5px}
 .dm-row .dm-msg{color:var(--tl)}
 .dm-stat-l{font-size:11px;color:var(--tlm)}
 .dm-stat-v{font-size:24px}
 .dm-gauge-val{font-size:58px}
 .dm-gauge-lbl{font-size:11.5px;color:var(--tlm)}
 .btn{font-size:13px}
 .fd{font-size:14.5px;color:var(--tls)}
 .fc h5{font-size:11.5px;color:var(--tls)}
 .fc a{font-size:14.5px;color:var(--tls)}
 .fc a:hover{color:var(--tl)}
 .fbot{color:var(--tls)}
 .fbot a{color:var(--tls)}
 .hero-meta .m b{font-size:20px}
 .hero-meta .m span{font-size:11.5px;color:var(--tlm)}
 .strip .s b{font-size:15px}
 .strip .s span{font-size:13px}
 .ctrl-fam{font-size:13px;color:var(--tl)}
 .ctrl-count{font-size:12px;color:var(--tls)}
 .fca-amount{font-size:28px}
 .fca-case h4{font-size:17px}
 .fca-detail{font-size:13px}
 .step-n{font-size:46px}
 .step h4{font-size:20px}
 .step p{font-size:16.5px;line-height:1.55}
 .badge{font-size:11px;color:var(--tls)}
 .term{font-size:13.5px}

 /* === Scroll-hide banners === */
 .uc-banner,.cmmc-clock{transition:transform .5s cubic-bezier(.16,1,.3,1),top .5s cubic-bezier(.16,1,.3,1)}
 body.banners-hidden .uc-banner,body.banners-hidden .cmmc-clock{transform:translateY(-100%)}
 body.banners-hidden .nav{top:0!important;transition:top .4s cubic-bezier(.16,1,.3,1)}
 /* Roll-away: on first scroll the gold uc-banner slides up out of view and the orange cmmc-clock slides up to take its place at top:0. Nav must slide up by 32px too — otherwise a 32px gap opens up between cmmc-clock (top:36px end) and nav (top:68px) where scrolling H1 text peeks through. */
 body.uc-hidden .uc-banner{transform:translateY(-100%)}
 body.uc-hidden .cmmc-clock{top:0}
 body.uc-hidden .nav{top:36px;transition:top .5s cubic-bezier(.16,1,.3,1)}

 /* Award-winning touch: scroll progress bar */
 .scroll-progress{position:fixed;top:0;left:0;height:2px;background:var(--gold);z-index:1003;width:0%;transition:width .08s linear;box-shadow:0 0 14px var(--gold);pointer-events:none}

 /* Award-winning touch: SVG noise overlay for premium editorial texture */
 .noise-overlay{position:absolute;inset:0;pointer-events:none;opacity:.045;mix-blend-mode:overlay;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");z-index:1}
 .bD .noise-overlay,.bN .noise-overlay,.hero .noise-overlay{opacity:.08}

 /* Award-winning touch: sticky section-dot navigation */
 .sec-dots{position:fixed;right:28px;top:50%;transform:translateY(-50%);z-index:999;display:flex;flex-direction:column;gap:14px}
 .sec-dot{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.22);border:1px solid rgba(201,168,76,.4);transition:all .35s cubic-bezier(.25,.1,.25,1);cursor:pointer;text-decoration:none;display:block}
 .sec-dot:hover{background:rgba(201,168,76,.65);transform:scale(1.25)}
 .sec-dot.active{background:var(--gold);box-shadow:0 0 14px var(--gold);transform:scale(1.5);border-color:var(--gold)}
 body.on-light .sec-dot{background:rgba(26,26,46,.15);border-color:rgba(26,26,46,.3)}
 body.on-light .sec-dot:hover{background:rgba(168,136,56,.55)}
 body.on-light .sec-dot.active{background:var(--brand);box-shadow:0 0 14px rgba(168,136,56,.45);border-color:var(--brand)}
 @media(max-width:820px){.sec-dots{display:none}}

 /* Award-winning touch: magnetic button prep */
 .btn,.ps-cta,.nav-cta{will-change:transform;transition:transform .4s cubic-bezier(.25,.1,.25,1),filter .3s,box-shadow .3s}
 body{font-family:var(--sans);color:var(--td);line-height:1.7;background:var(--ivory);overflow-x:hidden}

 h1,h2,h3,h4{font-family:var(--serif);font-weight:400;letter-spacing:.02em}
 h1{font-size:clamp(40px,5.4vw,84px);line-height:1}
 h1 em{font-style:italic;color:var(--gold);font-weight:400;letter-spacing:-.005em}
 h2{font-size:clamp(26px,3vw,42px);line-height:1.18}
 h3{font-size:clamp(20px,2.4vw,28px);line-height:1.25}
 h4{font-size:17px;line-height:1.3}
 p{margin-bottom:var(--s2);font-weight:300;font-size:15px}
 a{color:inherit;text-decoration:none;transition:all .3s ease}
 .keep-case{text-transform:none!important}

 .box{max-width:1060px;margin:0 auto}
 .div{width:50px;height:2px;background:var(--brand);margin:var(--s1) auto 0}
 .lbl{font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:3px;text-transform:uppercase;margin-bottom:var(--s1);display:block}
 .particle-canvas{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:1}

 /* Under-Construction Banner */
 .uc-banner{position:fixed;top:0;left:0;right:0;height:32px;background:var(--gold);color:var(--navy);display:flex;align-items:center;justify-content:center;gap:14px;font-family:var(--sans);font-size:10.5px;font-weight:700;letter-spacing:2.5px;text-transform:uppercase;z-index:1002;box-shadow:0 2px 10px rgba(0,0,0,.1);padding:0 var(--s2);text-align:center}
 .uc-banner .uc-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--brand);animation:ucPulse 2s ease-in-out infinite}
 @keyframes ucPulse{0%,100%{opacity:.5;transform:scale(.85)}50%{opacity:1;transform:scale(1.1)}}

 /* CMMC Phase-2 Countdown (Safety Orange) */
 .cmmc-clock{position:fixed;top:32px;left:0;right:0;height:36px;background:#FF6600;color:#FFFFFF;display:flex;align-items:center;justify-content:center;gap:18px;font-family:var(--sans);font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;z-index:1001;box-shadow:0 2px 12px rgba(0,0,0,.12);padding:0 var(--s2);flex-wrap:wrap;text-align:center}
 .cmmc-clock .cc-lbl{opacity:.98}
 .cmmc-clock .cc-date{background:rgba(0,0,0,.18);padding:3px 11px;border-radius:3px}
 .cmmc-clock .cc-count{font-family:var(--mono);font-weight:600;font-size:12px;letter-spacing:1.5px}
 @media(max-width:720px){
 .cmmc-clock{font-size:9.5px;gap:8px;letter-spacing:1.5px;height:auto;padding:6px var(--s2);line-height:1.4}
 .cmmc-clock .cc-date{padding:2px 7px}
 }

 /* Nav — IN-FLOW (not position:fixed). Scrolls away with the page like any other element.
    Was position:fixed;top:68px with z-index:1000 — that was pinning a near-white bar over content
    and never letting it scroll away. Top:68px also referenced two banners (.uc-banner + .cmmc-clock)
    that aren't actually rendered, leaving a dead 68px gap above the bar. Fixed 2026-05-12. */
 .nav{position:relative;width:100%;height:62px;background:rgba(248,247,242,.96);display:flex;align-items:center;justify-content:space-between;padding:0 var(--s6);z-index:10;border-bottom:1px solid rgba(0,0,0,.06)}
 .nav.scrolled{background:rgba(248,247,242,.97)}
 .nav-brand{font-family:var(--serif);font-size:22px;color:var(--td);letter-spacing:1px}
 .nav-brand em{font-style:italic;color:var(--brand)}
 .nav-links{display:flex;list-style:none;gap:var(--s4)}
 .nav-links a{font-size:11px;font-weight:400;letter-spacing:1.5px;text-transform:uppercase;color:var(--tm)}
 .nav-links a:hover{color:var(--td)}
 .nav-cta{padding:7px 22px;background:var(--brand);color:white;font-size:11px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase}
 .nav-cta:hover{box-shadow:0 4px 14px rgba(168,136,56,.3)}

 /* Buttons */
 .btn{display:inline-block;padding:13px 36px;font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;cursor:pointer;transition:all .3s ease}
 .btn-fill{background:var(--brand);color:white}
 .btn-fill:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(168,136,56,.3)}
 .btn-line-d{background:transparent;border:1px solid rgba(0,0,0,.12);color:var(--ts)}
 .btn-line-d:hover{border-color:var(--brand);color:var(--brand)}
 .btn-line-l{background:transparent;border:1px solid rgba(255,255,255,.15);color:var(--tls)}
 .btn-line-l:hover{border-color:rgba(255,255,255,.35);color:var(--tl)}

 /* Bands */
 .bL{background:var(--ivory);padding:var(--s8) var(--s6)}
 .bW{background:var(--white);padding:var(--s8) var(--s6)}
 .bV{background:var(--warm);padding:var(--s8) var(--s6)}
 .bD{background:var(--navy);padding:var(--s8) var(--s6);position:relative;overflow:hidden}
 .bN{background:var(--navy-light);padding:var(--s8) var(--s6);position:relative;overflow:hidden}

 /* Splits */
 .split{display:grid;grid-template-columns:1fr 1.34fr;gap:var(--s7);align-items:center}
 .split-r{display:grid;grid-template-columns:1.34fr 1fr;gap:var(--s7);align-items:center}

 .accent{padding:var(--s6) var(--s5);text-align:center;background:var(--brand)}
 .accent h3{color:white;font-size:clamp(24px,2.8vw,38px);margin-bottom:var(--s1)}
 .accent p{color:rgba(255,255,255,.8);font-size:15px;margin-bottom:0}

 .il{list-style:none;padding:0;margin:var(--s3) 0 0}
 .il li{font-size:14px;color:var(--ts);padding:9px 0 9px 20px;position:relative;font-weight:300;border-bottom:1px solid rgba(0,0,0,.04)}
 .il li::before{content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);width:5px;height:5px;border-radius:50%;background:var(--brand)}

 /* ━━ HERO ━━ */
 .hero{position:relative;min-height:100vh;display:flex;align-items:center;padding:120px var(--s6) var(--s7);background:radial-gradient(ellipse at 25% 35%,var(--navy-light) 0%,var(--navy) 70%);overflow:hidden}

 /* Live Dashboard Preview */
 .dash-mock{background:linear-gradient(180deg,#0B1020 0%,#070B18 100%);border:1px solid rgba(201,168,76,.22);border-radius:10px;padding:var(--s3) var(--s4);box-shadow:0 30px 80px -30px rgba(0,0,0,.7),inset 0 1px 0 rgba(255,255,255,.04);position:relative;overflow:hidden}
 .dm-head{display:flex;align-items:center;justify-content:space-between;padding-bottom:var(--s2);border-bottom:1px solid rgba(255,255,255,.06);margin-bottom:var(--s3)}
 .dm-title{font-family:var(--mono);font-size:11px;letter-spacing:1.5px;color:var(--tls);text-transform:uppercase}
 .dm-live{display:flex;align-items:center;gap:6px;font-family:var(--mono);font-size:10px;letter-spacing:2px;color:#34D399;text-transform:uppercase}
 .dm-live-dot{width:7px;height:7px;border-radius:50%;background:#34D399;box-shadow:0 0 10px #34D399;animation:dmLive 1.4s ease-in-out infinite}
 @keyframes dmLive{0%,100%{opacity:.55;transform:scale(.85)}50%{opacity:1;transform:scale(1.15)}}
 .dm-gauge{text-align:center;padding:var(--s2) 0 var(--s3);position:relative}
 .dm-gauge svg{width:100%;max-width:340px;height:auto;display:block;margin:0 auto}
 .dm-gauge-val{position:absolute;left:0;right:0;bottom:26%;font-family:var(--serif);font-size:54px;font-weight:300;color:var(--tl);line-height:1;transition:color .6s}
 .dm-gauge-lbl{font-family:var(--mono);font-size:10px;letter-spacing:2.5px;color:var(--tlm);text-transform:uppercase;margin-top:-4px}
 .dm-arc-bg{stroke:rgba(255,255,255,.06);stroke-width:10;fill:none;stroke-linecap:round}
 .dm-arc-fg{stroke:url(#gaugeGrad);stroke-width:10;fill:none;stroke-linecap:round;stroke-dasharray:282;stroke-dashoffset:282;transition:stroke-dashoffset 2.5s cubic-bezier(.16,1,.3,1)}
 .dm-arc-fg.animate{stroke-dashoffset:60}
 .dm-heatmap{display:grid;grid-template-columns:repeat(7,1fr);gap:5px;margin-bottom:var(--s3)}
 .dm-cell{aspect-ratio:1;border-radius:4px;display:flex;flex-direction:column;align-items:center;justify-content:center;font-family:var(--mono);font-size:9px;letter-spacing:.5px;color:rgba(255,255,255,.7);position:relative;overflow:hidden;transition:transform .3s}
 .dm-cell:hover{transform:translateY(-2px)}
 .dm-cell-v{font-family:var(--serif);font-size:13px;font-weight:400;color:rgba(255,255,255,.95);line-height:1}
 .dm-cell.dg1{background:linear-gradient(135deg,#10B981,#059669)}
 .dm-cell.dg2{background:linear-gradient(135deg,#34D399,#10B981)}
 .dm-cell.dg3{background:linear-gradient(135deg,#FBBF24,#A88838)}
 .dm-cell.dg4{background:linear-gradient(135deg,#A88838,#A88838)}
 .dm-cell.dg5{background:linear-gradient(135deg,#EF4444,#B91C1C)}
 .dm-cell::before{content:'';position:absolute;inset:0;background:rgba(255,255,255,0);animation:dmPulse 3s ease-in-out infinite}
 @keyframes dmPulse{0%,100%{background:rgba(255,255,255,0)}50%{background:rgba(255,255,255,.08)}}
 .dm-feed{background:rgba(0,0,0,.3);border:1px solid rgba(255,255,255,.04);border-radius:5px;padding:var(--s2);font-family:var(--mono);font-size:10.5px;line-height:1.7;color:var(--tlm);max-height:120px;overflow:hidden;position:relative}
 .dm-row{display:flex;gap:10px;white-space:nowrap;align-items:center}
 .dm-row .dm-ts{color:var(--tlm);opacity:.6}
 .dm-row .dm-tag{padding:0 6px;border-radius:2px;font-size:9px;letter-spacing:.5px;text-transform:uppercase}
 .dm-row .dm-tag.ok{background:rgba(16,185,129,.16);color:#34D399}
 .dm-row .dm-tag.warn{background:rgba(245,158,11,.16);color:#FBBF24}
 .dm-row .dm-tag.heal{background:rgba(74,158,255,.16);color:#60A5FA}
 .dm-row .dm-msg{color:var(--tls)}
 .dm-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s2);margin-bottom:var(--s3);padding:var(--s2) 0;border-top:1px solid rgba(255,255,255,.05);border-bottom:1px solid rgba(255,255,255,.05)}
 .dm-stat{text-align:center}
 .dm-stat-v{font-family:var(--serif);font-size:22px;font-weight:300;color:var(--gold);line-height:1}
 .dm-stat-l{font-family:var(--mono);font-size:9px;letter-spacing:1.5px;color:var(--tlm);text-transform:uppercase;margin-top:4px}

 /* CMMC Readiness Snapshot featured block */
 .rc-feat{max-width:1060px;margin:0 auto var(--s6);background:linear-gradient(135deg,var(--navy) 0%,var(--navy-light) 100%);padding:var(--s6);border-radius:6px;position:relative;overflow:hidden;box-shadow:0 18px 50px -20px rgba(15,22,41,.4)}
 .rc-feat::before{content:'';position:absolute;top:0;right:0;width:360px;height:100%;background:radial-gradient(circle at top right,rgba(201,168,76,.18),transparent 60%);pointer-events:none}
 .rc-inner{display:grid;grid-template-columns:1.618fr 1fr;gap:var(--s5);align-items:center;position:relative;z-index:2}
 .rc-left h3{font-family:var(--serif);font-weight:400;color:var(--tl);font-size:clamp(26px,3vw,36px);margin-bottom:var(--s2)}
 .rc-left p{color:var(--tls);max-width:480px;margin-left:auto;margin-right:auto;margin-bottom:var(--s3);font-size:15px;line-height:1.75}
 .rc-benefits{list-style:none;padding:0;margin:0 0 var(--s4);color:var(--tls);font-size:14px;line-height:1.95}
 .rc-benefits li{padding-left:22px;position:relative}
 .rc-benefits li::before{content:'\2713';position:absolute;left:0;color:var(--gold);font-weight:700}
 .rc-benefits li b{color:var(--gold);font-weight:600}
 .rc-right{text-align:center;padding-left:var(--s5);border-left:1px solid rgba(255,255,255,.08)}
 .rc-price{font-family:var(--serif);font-size:84px;font-weight:300;color:var(--gold);line-height:1}
 .rc-price-lbl{font-size:11px;color:var(--tls);letter-spacing:2.5px;text-transform:uppercase;font-weight:600;margin-top:8px}
 .rc-ship{margin-top:var(--s3);font-size:10.5px;color:var(--tlm);letter-spacing:2px;text-transform:uppercase;font-weight:600}
 @media(max-width:820px){.rc-inner{grid-template-columns:1fr}.rc-right{padding-left:0;border-left:0;border-top:1px solid rgba(255,255,255,.08);padding-top:var(--s3);margin-top:var(--s3)}}

 /* Business Impact Widget — RULE 12/13 surface */
 .bi{background:linear-gradient(180deg,var(--navy) 0%,var(--navy-light) 100%);padding:var(--s7) var(--s6);position:relative;overflow:hidden;border-top:1px solid rgba(201,168,76,.18);border-bottom:1px solid rgba(201,168,76,.18)}
 .bi::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 20% 30%,rgba(168,136,56,.10) 0%,transparent 50%),radial-gradient(circle at 80% 70%,rgba(201,168,76,.06) 0%,transparent 50%);pointer-events:none}
 .bi-wrap{max-width:1100px;margin:0 auto;position:relative;z-index:1}
 .bi-eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:3.5px;text-transform:uppercase;color:var(--gold);font-weight:600;margin-bottom:14px}
 .bi-h{font-family:var(--serif);font-size:44px;font-weight:600;color:var(--tl);line-height:1.12;margin-bottom:14px;max-width:780px}
 .bi-h em{font-style:italic;color:var(--brand)}
 .bi-sub{font-size:15.5px;color:var(--tls);max-width:700px;margin-bottom:var(--s5);line-height:1.65}
 .bi-big{font-family:var(--serif);font-size:96px;font-weight:300;color:var(--gold);line-height:1;margin-bottom:6px;letter-spacing:-2px;font-variant-numeric:tabular-nums}
 .bi-big-lbl{font-family:var(--mono);font-size:11px;letter-spacing:2.5px;text-transform:uppercase;color:var(--tlm);font-weight:600;margin-bottom:var(--s5)}
 .bi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s4);margin-bottom:var(--s5)}
 .bi-cell{padding:var(--s3) var(--s3);border-left:2px solid rgba(168,136,56,.42);background:rgba(255,255,255,.02)}
 .bi-cell-lbl{font-family:var(--mono);font-size:10px;letter-spacing:2px;text-transform:uppercase;color:var(--gold);font-weight:600;margin-bottom:8px}
 .bi-cell-n{font-family:var(--serif);font-size:38px;font-weight:500;color:var(--tl);line-height:1;margin-bottom:8px;font-variant-numeric:tabular-nums}
 .bi-cell-desc{font-size:13px;color:var(--tlm);line-height:1.55}
 .bi-cta{display:flex;gap:var(--s2);flex-wrap:wrap;align-items:center;margin-top:var(--s4)}
 .bi-cta a.primary{display:inline-block;background:var(--brand);color:#FFF;padding:13px 26px;border-radius:3px;font-weight:700;text-decoration:none;font-size:14.5px;letter-spacing:.2px}
 .bi-cta a.primary:hover{background:#A85F04}
 .bi-cta a.secondary{color:var(--tl);text-decoration:none;font-size:13.5px;border-bottom:1px dotted var(--gold);padding-bottom:2px}
 .bi-cta a.secondary:hover{color:var(--gold)}
 .bi-note{margin-top:var(--s3);font-size:11.5px;color:var(--tm);font-style:italic;max-width:720px}
 /* Live Control Effectiveness strip — Patent 313 umbrella */
 .lce{margin:var(--s4) 0 var(--s5) 0;padding:18px 22px;background:rgba(10,14,30,.55);border:1px solid rgba(201,168,76,.22);border-radius:3px;font-family:var(--mono);position:relative;overflow:hidden}
 .lce::after{content:'';position:absolute;top:0;bottom:0;right:0;width:80px;background:linear-gradient(90deg,transparent,rgba(10,14,30,.9));pointer-events:none}
 .lce-hdr{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;padding-bottom:10px;border-bottom:1px dotted rgba(201,168,76,.2)}
 .lce-ttl{font-size:10.5px;letter-spacing:2.5px;text-transform:uppercase;color:var(--gold);font-weight:600}
 .lce-live{display:flex;align-items:center;gap:6px;font-size:10px;letter-spacing:2px;text-transform:uppercase;color:#6FCF97;font-weight:600}
 .lce-dot{width:7px;height:7px;border-radius:50%;background:#6FCF97;animation:lcePulse 1.8s ease-in-out infinite}
 @keyframes lcePulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.75)}}
 .lce-rows{display:flex;flex-direction:column;gap:5px;min-height:132px;overflow:hidden;position:relative}
 .lce-row{display:grid;grid-template-columns:90px 1fr 72px 90px;align-items:center;gap:14px;padding:7px 2px;font-size:12.5px;border-bottom:1px dotted rgba(255,255,255,.04);transition:opacity .4s ease,transform .4s ease}
 .lce-row:last-child{border-bottom:none}
 .lce-row.enter{opacity:0;transform:translateY(-6px)}
 .lce-cid{color:var(--gold);font-weight:600;letter-spacing:.3px}
 .lce-name{color:var(--tls);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
 .lce-eff{text-align:right;font-weight:600;font-variant-numeric:tabular-nums}
 .lce-eff.hi{color:#6FCF97}
 .lce-eff.mid{color:var(--gold)}
 .lce-eff.lo{color:#EB5757}
 .lce-ts{font-size:10.5px;color:var(--tlm);text-align:right}
 .lce-ftr{margin-top:12px;padding-top:10px;border-top:1px dotted rgba(201,168,76,.2);font-size:10.5px;color:var(--tm);letter-spacing:1.5px;text-transform:uppercase;font-weight:600;display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px}
 .lce-ftr em{font-style:italic;font-weight:500;color:var(--tlm);letter-spacing:.3px;text-transform:none}
 @media(max-width:840px){.bi-h{font-size:32px}.bi-big{font-size:64px}.bi-grid{grid-template-columns:1fr;gap:var(--s3)}.lce-row{grid-template-columns:80px 1fr 60px;gap:10px}.lce-ts{display:none}}

 /* Pricing Snapshot Strip */
 .price-strip{background:var(--warm);padding:var(--s5) var(--s6);border-top:1px solid rgba(0,0,0,.06);border-bottom:1px solid rgba(0,0,0,.06)}
 .ps-box{max-width:1060px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:var(--s5);flex-wrap:wrap}
 .ps-lbl{font-family:var(--sans);font-size:13.5px;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:var(--ts)}
 .ps-tiers{display:flex;align-items:center;gap:var(--s4);flex-wrap:wrap}
 .ps-t{display:flex;align-items:baseline;gap:var(--s2);flex-direction:column}
 .ps-t .ps-n{font-family:var(--serif);font-size:23px;color:var(--td);font-weight:500;line-height:1.2}
 .ps-t .ps-p{font-family:var(--serif);font-size:30px;color:var(--brand);font-weight:400;line-height:1.1}
 /* Sub-text under the price is block; the price-value span itself stays inline so $ + 499 read together */
 .ps-t .ps-p > span:last-child{display:block;font-family:var(--sans);font-size:14px;color:var(--ts);margin-left:0;margin-top:4px;font-weight:400;line-height:1.4}
 .ps-t .ps-d{font-size:13.5px;color:var(--ts);margin-left:0;margin-top:2px;font-weight:500}
 .ps-div{width:1px;height:32px;background:rgba(0,0,0,.08)}
 .ps-cta{padding:10px 22px;background:var(--brand);color:white;font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;transition:all .3s ease}
 .ps-cta:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(168,136,56,.28)}
 @media(max-width:820px){.ps-box{flex-direction:column;text-align:center}.ps-tiers{justify-content:center}.ps-div{display:none}}
 /* hero-grid changed 2026-05-20 from 2-col (1.34fr 1fr) to 1-col — the second column has been empty for a while (no terminal display element), which was leaving the hero text marooned in the left 57% of the page with empty navy on the right. Single-column hero centers properly on full page width. */
 .hero-grid{display:grid;grid-template-columns:1fr;gap:var(--s7);align-items:center;max-width:820px;margin:0 auto;position:relative;z-index:5}
 .hero-eyebrow{font-family:var(--sans);font-size:12px;font-weight:600;letter-spacing:3px;text-transform:uppercase;color:var(--gold);margin-bottom:var(--s3)}
 /* Hero h1: scoped font-size override 2026-05-20 — global h1 clamp(40px,5.4vw,84px) was too large for the hero column, causing word-by-word wrap. Tuned so 6-10 words fit per line. max-width matches hero-grid for consistent center-line. */
 .hero h1{color:var(--tl);margin-bottom:var(--s3);font-size:clamp(30px,4vw,56px);line-height:1.18;max-width:780px;margin-left:auto;margin-right:auto}
 .hero-sub{font-size:18.5px;color:var(--tls);max-width:620px;margin-bottom:var(--s5);line-height:1.55}
 .hero-actions{display:flex;gap:var(--s2);flex-wrap:wrap}

 /* Terminal */
 .term{text-align:left;font-family:var(--mono);font-size:13px;color:var(--tlm);background:rgba(0,0,0,.35);padding:var(--s4);border-radius:6px;min-height:240px;position:relative}
 .term::before{content:'';position:absolute;top:0;left:0;right:0;height:26px;background:rgba(255,255,255,.03);border-radius:6px 6px 0 0}
 .term-dots{position:absolute;top:8px;left:12px;display:flex;gap:6px}
 .term-dots span{width:9px;height:9px;border-radius:50%}
 .dot-r{background:#FF5F56}.dot-y{background:#FFBD2E}.dot-g{background:#27C93F}
 .term-title{position:absolute;top:6px;left:50%;transform:translateX(-50%);font-size:10px;color:var(--tlm);font-family:var(--sans)}
 .term-body{margin-top:var(--s2);white-space:pre;line-height:1.6}
 .term-body .kw{color:var(--brand)}.term-body .fn{color:var(--teal)}.term-body .str{color:#E8D48B}.term-body .cmt{color:#555}
 .term-cursor{display:inline-block;width:7px;height:14px;background:var(--gold);animation:blink 1s step-end infinite;vertical-align:text-bottom;margin-left:2px}
 @keyframes blink{0%,100%{opacity:1}50%{opacity:0}}

 .scroll-cue{position:absolute;bottom:var(--s4);left:50%;transform:translateX(-50%);z-index:5}
 .scroll-cue svg{width:22px;height:22px;animation:bob 2.5s ease-in-out infinite;opacity:.25}
 @keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(8px)}}

 /* Capability cards */
 .cg{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s3);margin-top:var(--s6)}
 .cc{padding:var(--s5) var(--s4);background:var(--white);transition:all .4s ease}
 .cc:hover{transform:translateY(-3px);box-shadow:0 6px 20px rgba(0,0,0,.06)}
 .cc h4{color:var(--td);margin-bottom:8px}
 .cc p{font-size:13px;color:var(--ts);margin-bottom:0}
 .ci{font-size:24px;margin-bottom:var(--s1);display:block}

 /* Stats */
 .sg{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s3)}
 .st{text-align:center;padding:var(--s4) var(--s2)}
 .st-n{font-family:var(--serif);font-size:42px;font-weight:300;color:var(--brand);line-height:1;margin-bottom:4px}
 .st-l{font-size:11px;color:var(--tm);letter-spacing:.5px}

 /* Crisis stats (dark bg) */
 .crisis-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s3);margin-top:var(--s6)}
 .crisis-card{padding:var(--s5) var(--s4);background:rgba(255,255,255,.025);text-align:center;transition:all .4s ease}
 .crisis-card:hover{transform:translateY(-2px);background:rgba(255,255,255,.04)}
 .crisis-num{font-family:var(--serif);font-size:36px;font-weight:300;color:var(--brand);line-height:1;margin-bottom:6px}
 .crisis-label{font-size:12px;color:var(--tls);margin-bottom:8px;font-weight:500}
 .crisis-detail{font-size:12px;color:var(--tlm);line-height:1.5}

 /* FCA section */
 .fca-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s3);margin-top:var(--s5)}
 .fca-case{padding:var(--s4) var(--s3);background:var(--white)}
 .fca-case h4{color:var(--td);margin-bottom:4px;font-size:16px}
 .fca-amount{font-family:var(--serif);font-size:24px;color:var(--brand);font-weight:300;margin-bottom:4px}
 .fca-detail{font-size:12px;color:var(--tm);margin-bottom:0}

 /* Process */
 /* Steps grid: 2026-06-09 fix — was repeat(4,1fr) which left an empty
    4th slot when only 3 .step items were present, visually off-centering
    the "Three artifacts" section. Set to repeat(3,1fr) to center the 3
    columns; mobile breakpoints later collapse to 2 then 1. */
 .steps{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s4);margin-top:var(--s6);max-width:1100px;margin-left:auto;margin-right:auto}
 .step{text-align:center}
 .step-n{font-family:var(--serif);font-size:44px;font-weight:300;color:var(--brand);line-height:1;margin-bottom:var(--s1)}
 /* Body text bumped 2026-06-09 — original 13/16px was too small for hero-
    adjacent body copy on desktop. */
 .step h4{color:var(--td);margin-bottom:8px;font-size:19px}
 .step p{font-size:16px;color:var(--ts);margin-bottom:0;line-height:1.55}

 /* CMMC controls */
 .ctrl-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s2);margin-top:var(--s4)}
 .ctrl{padding:var(--s2) var(--s3);background:rgba(255,255,255,.025)}
 .ctrl-fam{font-size:12px;color:var(--tl);font-weight:500}
 .ctrl-count{font-size:11px;color:var(--tlm)}
 .badges{display:flex;flex-wrap:wrap;gap:6px;margin-top:var(--s3)}
 .badge{padding:6px 12px;font-family:var(--sans);font-size:10px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:var(--tlm);background:rgba(255,255,255,.04)}

 /* Pricing — 6 tiers in 3x2 grid */
 .pg{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s3);margin-top:var(--s6)}
 .pc{padding:var(--s4) var(--s3);background:var(--white);text-align:center;transition:all .4s ease;position:relative}
 .pc:hover{transform:translateY(-3px);box-shadow:0 6px 20px rgba(0,0,0,.07)}
 .pc.pop{box-shadow:0 4px 24px rgba(168,136,56,.12)}
 .pc.pop::before{content:'MOST POPULAR';position:absolute;top:0;left:0;right:0;background:var(--brand);color:white;font-size:9px;font-weight:700;letter-spacing:2px;padding:4px 0}
 .pc-tier{font-family:var(--serif);font-size:20px;color:var(--td);margin-bottom:4px}
 .pc-amt{font-family:var(--serif);font-size:28px;font-weight:300;color:var(--brand);line-height:1;margin-bottom:2px}
 .pc-per{font-size:11px;color:var(--tm);margin-bottom:var(--s2);display:block}
 .pc-who{font-size:12px;color:var(--ts);margin-bottom:var(--s2);padding-bottom:var(--s2);border-bottom:1px solid rgba(0,0,0,.06)}
 .pc-list{list-style:none;padding:0;margin:0 0 var(--s3)}
 .pc-list li{font-size:12px;color:var(--tm);padding:3px 0}
 .pc-btn{display:block;padding:9px 0;color:var(--brand);font-family:var(--sans);font-size:11px;font-weight:600;letter-spacing:1px;text-transform:uppercase;text-align:center;transition:all .3s ease}
 .pc-btn:hover{background:var(--brand);color:white}
 .pc.pop .pc-btn{background:var(--brand);color:white}
 .pc.pop .pc-btn:hover{background:#B45309}
 .price-note{text-align:center;margin-top:var(--s4);font-size:13px;color:var(--tm)}

 /* Footer */
 footer{background:var(--navy);padding:var(--s6) var(--s6) var(--s4)}
 .fi{max-width:1060px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:var(--s5)}
 .fb{font-family:var(--serif);font-size:22px;color:var(--tl);margin-bottom:8px}
 .fb em{font-style:italic;color:var(--brand)}
 .fd{font-size:13px;color:var(--tlm);line-height:1.6}
 .fc h5{font-family:var(--sans);font-size:10px;font-weight:600;letter-spacing:2px;text-transform:uppercase;color:var(--tlm);margin-bottom:10px}
 .fc a{display:block;font-size:13px;color:var(--tlm);padding:3px 0}
 .fc a:hover{color:var(--tl)}
 .fbot{max-width:1060px;margin:var(--s4) auto 0;padding-top:var(--s2);border-top:1px solid rgba(255,255,255,.04);display:flex;justify-content:space-between;font-size:11px;color:var(--tlm)}

 @keyframes fadeUp{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}
 /* EMERGENCY OVERRIDE — ensure content is visible regardless of JS state. JS scroll-reveal is enhancement, not requirement. */
 .reveal{opacity:1!important;transform:none!important}
 /* Headline balance — wraps "What Enclave AI&trade; Is / Is Not" h2s on equal-mass lines so the two columns align visually */
 #what-we-are .split{align-items:start}
 #what-we-are h2{text-wrap:balance;max-width:18ch}
 /* AaaS vs SaaS — level the two columns so the bullet lists start on the same line */
 #aaas-vs-saas .split{align-items:start}
 #aaas-vs-saas .split > .reveal{display:flex;flex-direction:column}
 #aaas-vs-saas .split > .reveal > h3{min-height:5.6em;text-wrap:balance}
 /* Dashboard Command Center bullets — high-contrast white on navy bg + larger, heavier text */
 .dash-bullets li{color:#FFFFFF!important;font-weight:500!important;font-size:18.5px!important;padding:13px 0 13px 24px!important;line-height:1.65!important;border-bottom:1px solid rgba(255,255,255,.08)!important}
 .dash-bullets li::before{width:7px!important;height:7px!important;background:var(--brand)!important;box-shadow:0 0 12px rgba(168,136,56,.6)}
 .dash-bullets li:last-child{border-bottom:none!important}
 /* Terminal typewriter reveal — uses CSS step-clip so static content stays as fallback if JS doesn't run */
 .term-body{position:relative}
 .term-body.typewriter{opacity:0;animation:termFade .4s ease forwards .8s}
 @keyframes termFade{from{opacity:0}to{opacity:1}}
 /* === GLOBAL CENTERING PASS (per user direction: center every block of text) === */
 /* Default-center all section-level content. Multi-column grids override below to keep card content readable. */
 .box{text-align:center}
 .bi-wrap{text-align:center}
 /* Center the block itself, not just the text inside — .bi-h and .bi-sub have max-width set, so without auto-margins the block stays left-aligned */
 .bi-eyebrow,.bi-h,.bi-sub,.bi-big,.bi-big-lbl{text-align:center;margin-left:auto!important;margin-right:auto!important}
 /* Hero left column centered (terminal stays right) */
 .hero-grid > div:first-child{text-align:center}
 .hero-grid > div:first-child .hero-eyebrow,.hero-grid > div:first-child .hero-sub{margin-left:auto;margin-right:auto}
 .hero-actions{justify-content:center}
 /* Override for grid layouts: cards/columns/lists keep left-aligned text for legibility */
 .split,.split-r{text-align:left}
 .split > .reveal,.split-r > .reveal,.split > .accent,.split-r > .accent{text-align:left}
 .pg,.crisis-grid,.bi-grid,.step-grid,.pf-grid,.ag-grid,.tier-grid,.cc-grid{text-align:left}
 /* .step removed from this left-align override 2026-05-20: .step is defined as text-align:center in its own block (line ~366) — including it here was a regression that left the 3-column "Three artifacts" section reading off-register vs its centered heading. */
 .pc,.crisis-card,.bi-cell,.cc,.dash-mock,.lce-row,.dm-row,.fed-agent{text-align:left}
 /* Long body paragraphs: keep readable by constraining width + auto-margin so they center as a block */
 .box > p,.box .lead,.bi-sub,.box > .reveal > p{max-width:760px;margin-left:auto;margin-right:auto}
 /* Bullet lists: left-align text but center the block */
 .il,.rc-benefits{max-width:640px;margin-left:auto;margin-right:auto;text-align:left}
 /* === LEGIBILITY: bump secondary-text contrast slightly === */
 :root{--ts:#3A3A55;--tlm:#B8C0D8}  /* darker secondary on light bg / brighter secondary on dark bg */
 .reveal{opacity:0;transform:translateY(22px);transition:all .7s cubic-bezier(.16,1,.3,1)}
 .reveal.visible{opacity:1;transform:translateY(0)}

 @media(max-width:1100px){.pg{grid-template-columns:repeat(3,1fr)}}
 @media(max-width:900px){
 .hero-grid,.split,.split-r{grid-template-columns:1fr}
 .cg,.crisis-grid{grid-template-columns:repeat(2,1fr)}
 .steps{grid-template-columns:repeat(2,1fr)}
 .pg{grid-template-columns:repeat(2,1fr)}
 .sg{grid-template-columns:repeat(2,1fr)}
 .fca-grid{grid-template-columns:1fr}
 .ctrl-grid{grid-template-columns:1fr}
 }
 @media(max-width:600px){
 .nav{padding:0 var(--s2)}.nav-links{display:none}
 .hero,.bL,.bW,.bV,.bD,.bN{padding-left:20px;padding-right:20px}
 .cg,.pg,.crisis-grid{grid-template-columns:1fr}
 .steps{grid-template-columns:1fr}
 .fi{grid-template-columns:1fr}
 }
 
 /* === FONT-SIZE BUMP (per user direction: increase non-headline text for legibility, mobile floor 16px) === */
 body{font-size:17.5px;line-height:1.65}
 p{font-size:17.5px;line-height:1.7}
 li{font-size:17px;line-height:1.75}
 .lead{font-size:19.5px;line-height:1.55}
 .lbl,.eyebrow{font-size:13px;letter-spacing:2.5px}
 details summary{font-size:17px}
 details div p,details div{font-size:16px;line-height:1.7}
 .nav,.nav a{font-size:14px}
 .footer-compliance{font-size:13.5px;line-height:1.75}
 .fine{font-size:14px;line-height:1.7}
 .footer{font-size:13px}
 table{font-size:15.5px}
 input,select,textarea{font-size:16px} /* iOS Safari mobile floor — prevents zoom-on-focus */
 .help{font-size:13.5px}
 .checkbox-group label,.radio-group label{font-size:15px}
 /* Mobile responsiveness: scale down headings + keep readable body */
 @media(max-width:720px){
   body,p{font-size:17px;line-height:1.65}
   li{font-size:16.5px}
   .lead{font-size:18px}
   h1{font-size:36px!important;line-height:1.12}
   h2{font-size:26px!important;line-height:1.18}
   h3{font-size:22px!important;line-height:1.25}
   .wrap,.box,.bi-wrap{padding-left:18px!important;padding-right:18px!important}
   .nav{flex-wrap:wrap;gap:8px;font-size:13px}
   .footer-compliance{font-size:13px}
   table{font-size:14px}
   th,td{padding:10px 8px}
 }
 @media(max-width:480px){
   h1{font-size:32px!important}
   h2{font-size:24px!important}
   .lead{font-size:17px}
   .footer-inner{grid-template-columns:1fr!important}
 }

/* --- block 2 --- */
/* Mobile overflow safety net — added 2026-04-29 to fix viewport-width issues on phones.
 Hero terminal had white-space:pre with 50+ char monospace lines → forced page width
   wider than 375px viewport → customer had to horizontal-scroll to see anything. */
html, body { max-width: 100%; overflow-x: hidden; }
@media (max-width: 720px) {
  /* Banner — reduce padding (was 32px, ate 17% of 375px viewport) */
  #ed3m-launch-banner { padding: 12px 14px !important; gap: 10px !important; font-size: 13.5px !important; line-height: 1.4 !important; }
  #ed3m-launch-banner > span:first-of-type { padding: 4px 10px !important; font-size: 10.5px !important; letter-spacing: 0.1em !important; }
  #ed3m-launch-banner > span:nth-of-type(2) { font-size: 13px !important; gap: 4px !important; }
  #ed3m-launch-banner > span:nth-of-type(2) strong:nth-of-type(2) { font-size: 14px !important; }
  #ed3m-launch-banner a { padding: 6px 14px !important; font-size: 11.5px !important; }
  /* Hero terminal — scroll inside its own container, never the page */
  .term, .term-body { overflow-x: auto !important; max-width: 100%; -webkit-overflow-scrolling: touch; }
  .term-body { font-size: 11px !important; line-height: 1.55 !important; }
  /* Dashboard mockup rows — allow wrap so they don't force horizontal scroll */
  .dm-row { white-space: normal !important; flex-wrap: wrap !important; }
  .dm-stats { grid-template-columns: 1fr 1fr !important; }
  .dm-heatmap { overflow-x: auto !important; }
  /* Generic safety net: anything that should self-contain on small screens */
  pre, code { overflow-x: auto; max-width: 100%; -webkit-overflow-scrolling: touch; }
  svg:not(.icon) { max-width: 100%; height: auto; }
  img { max-width: 100%; height: auto; }
  /* Wider tables get wrapped — most are already in .table-wrap{overflow:auto} */
  .lce-row { grid-template-columns: 60px 1fr !important; gap: 8px !important; }
  /* SPRS live counter — prevent layout reflow when JS swaps the price/remaining text */
  #hero-sprs-price, #ps-sprs-price, .rc-price, .rc-price-lbl {
    font-variant-numeric: tabular-nums !important;
    transition: none !important;
    animation: none !important;
  }
  #hero-sprs-price, #ps-sprs-price { display: inline-block !important; min-width: 38px !important; text-align: right !important; }
  #ps-sprs-sub { display: block !important; min-height: 1.4em !important; transition: none !important; animation: none !important; }
  /* Reserve space on the price-strip so digit length changes don't shove neighbors */
  .ps-box, .ps-tiers, .ps-name, .ps-p { transition: none !important; }
  .lce-ts, .lce-name { font-size: 11px !important; }
  /* 3-col splits using inline repeat(3,1fr) — collapse to 1 column on mobile.
 Inline style beats the .split media query at line 530, so we force it here. */
  #time-to-ready .split, #commitments .split { grid-template-columns: 1fr !important; gap: var(--s3) !important; }
  /* Commitments numeric values — shrink the 46px monospace headline so it fits in narrow cards */
  #commitments .split > div > div[style*="font-size:46px"] { font-size: 38px !important; }
  /* MOBILE STABILIZATION 2026-04-30 — kill every continuous animation that
     causes jitter on phones. Hero terminal canvases hide; dashboard mockup
     transitions disable; live-feed transforms zero out so pushed rows don't
     animate-thrash. JS still injects rows but they appear instantly without
     the reflow + repaint cycle that was visible as jitter. */
  .particle-canvas { display: none !important; }
  #termBody .term-cursor { animation: none !important; }
  .dm-cell, .dm-row, .lce-row { transition: none !important; transform: none !important; }
  [data-dm-count], [data-count] { transition: none !important; transform: none !important; }
  /* Stop the hero terminal "live" stream container from shrinking/growing — fixed height */
  #termLive { max-height: 140px !important; }
}
/* User-OS preference — kill all animations on prefers-reduced-motion */
@media (prefers-reduced-motion: reduce) {
  .particle-canvas { display: none !important; }
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
    scroll-behavior: auto !important;
  }
}
@media (max-width: 480px) {
  /* Banner contents reflow to a more compact stack on tiny screens */
  #ed3m-launch-banner { padding: 10px 12px !important; }
  #ed3m-launch-banner > span:nth-of-type(2) { font-size: 12.5px !important; }
}

/* --- block 3 --- */
@media (max-width: 720px) {
   #founding-remaining-big, #cmmc-days-remaining { font-size: 38px !important; }
   section[style*="Founding Cohort"] > div { grid-template-columns: 1fr !important; }
 }

/* --- block 4 --- */
@media(max-width:720px){section[style*="Authority Bar"] > div > div[style*="repeat(5"]{grid-template-columns:repeat(2,1fr) !important;gap:var(--s3) !important;}}

/* --- block 5: LEGIBILITY PASS 2026-06-09 (per Jim: make all text legible for human readers, desktop + mobile) ---
   The earlier global bump (block "FONT-SIZE BUMP") set p/body to 17.5px, but
   component-scoped selectors like `.cc p` and `.pc-list li` are more specific
   and kept their 13-15px sizes. This block sits LAST in the cascade and uses
   the same selectors (or higher specificity) to win those battles.
   Principle: body copy ≥16px, secondary/supporting copy ≥14.5px, UI chrome
   (badges, tags, uppercase labels) ≥12px. Decorative terminal/dashboard
   mockups stay small — they're illustrations, not reading copy. */

/* Card + column body copy */
.cc p{font-size:16.5px;line-height:1.6}
.fed-agent p{font-size:16.5px;line-height:1.6}
.rc-benefits{font-size:16.5px;line-height:1.6}
.rc-left p{font-size:17px;line-height:1.65}
.accent p{font-size:16.5px;line-height:1.6}

/* Crisis stat band */
.crisis-label{font-size:15.5px}
.crisis-detail{font-size:15px;line-height:1.55}

/* Federal credentials strip */
.fed-cred-val{font-size:16px}
.fed-cred-lbl{font-size:12.5px}
.fed-lbl{font-size:12.5px}

/* Pricing cards */
.pc-who{font-size:15.5px;line-height:1.55}
.pc-list li{font-size:15.5px;line-height:1.6}
.pc-per{font-size:13.5px}
.pc-btn{font-size:13.5px}
.ps-t .ps-d{font-size:14.5px}
.ps-lbl{font-size:14px}

/* Stat strips + control-family grid */
.st-l{font-size:13.5px}
.strip .s b{font-size:16px}
.strip .s span{font-size:14.5px}
.ctrl-fam{font-size:15px}
.ctrl-count{font-size:13.5px}
.fca-detail{font-size:14.5px;line-height:1.55}

/* Footer */
.fd{font-size:15.5px;line-height:1.6}
.fc a{font-size:15px}
.fc h5{font-size:12.5px}

/* Buttons + nav (UI chrome — modest bump for tap targets) */
.btn{font-size:14px}
.nav-links a{font-size:13px}
.nav-cta{font-size:13px}

/* Badges + meta */
.badge{font-size:12px}
.hero-meta .m span{font-size:12.5px}
.term{font-size:14px}

/* Mobile floor: at phone width, body copy never below 15.5px */
@media(max-width:720px){
  .cc p,.fed-agent p,.rc-benefits,.rc-left p,.accent p{font-size:16px}
  .pc-who,.pc-list li{font-size:15.5px}
  .crisis-label,.crisis-detail{font-size:15px}
  .step p{font-size:16px;line-height:1.6}
  .step h4{font-size:19px}
  .hero-sub{font-size:17.5px;line-height:1.6}
  .fd,.fc a{font-size:15px}
  .fca-detail,.strip .s span,.ctrl-fam{font-size:14.5px}
}

/* === TYPE-SIZE PASS 2026-08-05 (owner direction: larger type — hero eyebrow,
   section eyebrows, snapshot price column, FAQ) === */
.hero-eyebrow{font-size:15px}
.lbl{font-size:14px}
.rc-price-lbl{font-size:13px}
.rc-ship{font-size:12.5px}
details summary{font-size:18px}
details div{font-size:17px;line-height:1.7}

/* === TAP TARGETS 2026-08-05 (T&E mobile readiness) ===
   Measured at 375px: 5 standalone controls under the 44x44 minimum (Apple HIG /
   WCAG 2.5.5) and 20 inline links under the 24px WCAG 2.5.8 AA floor. The tap
   area is expanded with an invisible ::after overlay so the visible text and
   its dotted underline do not move — a padding-based fix would detach the
   underline from the text. */
@media(max-width:900px){
  /* Standalone links: sole child of their block-level parent. */
  p > a:only-child,
  a.taptarget{position:relative;display:inline-block}
  p > a:only-child::after,
  a.taptarget::after{content:"";position:absolute;left:-10px;right:-10px;
    top:50%;transform:translateY(-50%);height:44px}
  /* Primary nav CTA was 37px tall. */
  .nav-cta{padding-top:12px;padding-bottom:12px}
  /* Inline links inside running text: reach the 24px AA floor without
     disturbing line boxes. Covers div/span/address wrappers too — the legal
     footer row and the address block are span/address, not p. */
  p a,li a,div a,span a,address a{position:relative}
  p a::after,li a::after,div a::after,span a::after,address a::after{
    content:"";position:absolute;left:0;right:0;
    top:50%;transform:translateY(-50%);height:24px}
  /* Legal footer links sit shoulder-to-shoulder; keep their 24px boxes from
     overlapping each other by giving the row breathing room. */
  .fbot a,.fbot span a{padding:0 2px}
}

/* === MOBILE NAV DRAWER + FOOTER WRAP 2026-08-05 (T&E readiness) ===
   Below 600px .nav-links was display:none with NO replacement: a phone
   visitor could not reach pricing, the gap check, or the C3PAO page at all.
   At 768px (iPad portrait) the same links overflowed and overlapped. */
.nav-toggle{display:none;background:none;border:0;padding:10px;cursor:pointer;
  width:44px;height:44px;flex-direction:column;justify-content:center;gap:5px}
.nav-toggle span{display:block;height:2px;width:22px;background:var(--td);
  transition:transform .25s ease,opacity .2s ease}
.nav-drawer-cta{display:none}
/* 2026-09-24: the header carries thirteen links (owner order, seats in
   scaling order: Pricing, Level 1, Level 2, For MSP / MSSP / ESP, For C3PAO,
   For Prime, For Agency / PEO, Insights, FAQ, Contact, then Free gap check and
   About). Measured in a browser, the row with the brand and Subscribe needs
   about 1,700px at the default spacing and about 1,460px tightened, so between
   1521px and 1780px the row tightens, and at 1520px and below the drawer takes
   over. With twelve links the points were 1361px and 1600px; at 1361px the
   thirteenth link pushed Subscribe off-screen and the links under the brand. */
@media(min-width:1521px) and (max-width:1780px){
  .nav{padding:0 24px}
  .nav-links{gap:16px}
  .nav-links a{letter-spacing:1px}
}
.nav-links a{white-space:nowrap}
.nav-brand{white-space:nowrap;flex-shrink:0}
.nav > .nav-cta{flex-shrink:0}
@media(max-width:1520px){
  .nav{padding:0 18px}
  .nav-toggle{display:flex}
  .nav-cta{display:none}                 /* lives inside the drawer instead */
  .nav-drawer-cta{display:block}
  /* Open/closed is driven by `display` alone. An earlier version animated
     max-height/opacity; on the deployed build those two properties did not
     take effect on this element while every other rule in this same block
     (including body.nav-open span transforms) did. Not worth chasing for a
     nav drawer — display none/block is bulletproof and instant. */
  .nav-links{display:none;position:fixed;top:62px;left:0;right:0;
    background:#F8F7F2;border-bottom:1px solid rgba(0,0,0,.10);
    box-shadow:0 18px 40px -18px rgba(15,22,41,.35);
    padding:8px 18px 18px;margin:0;list-style:none;z-index:1000;
    max-height:80vh;overflow-y:auto}
  body.nav-open .nav-links{display:block}
  .nav-links li{display:block;border-bottom:1px solid rgba(0,0,0,.06)}
  .nav-links li:last-child{border-bottom:0}
  .nav-links a{display:block;padding:14px 2px;font-size:15px;min-height:44px}
  .nav-drawer-cta a{color:var(--brand);font-weight:700}
  body.nav-open .nav-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg)}
  body.nav-open .nav-toggle span:nth-child(2){opacity:0}
  body.nav-open .nav-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
}
@media(max-width:900px){
  /* Footer legal row ran 70px past a 390px viewport ('Refund' off-screen). */
  .fbot{flex-wrap:wrap;justify-content:center;gap:6px 14px;text-align:center}
}

/* === WCAG AA CONTRAST 2026-08-05 (Section 508 / federal-facing) ===
   Measured: white on brand gold #A88838 = 3.36:1 and gold text on the ivory
   background = 3.14:1 — both below the 4.5:1 AA threshold for normal text,
   and this hit the $999 and subscription CTAs directly. Fixes:
   1. Filled gold buttons carry NAVY text (#0F1629 on #A88838 = 5.35:1). The
      brand gold stays exactly as-is; only the label darkens.
   2. Gold TEXT on light backgrounds uses a darker gold (#806722 on ivory =
      5.04:1). Gold on the NAVY sections already passes and is untouched. */
:root{--brand-ink:#806722}
.btn-fill,.nav-cta,.ps-cta,.pc-btn{color:#0F1629}
.btn-fill:hover,.nav-cta:hover,.ps-cta:hover,.pc-btn:hover{color:#0F1629}
/* Light-background sections: bL (light), bW (warm/white), bV (ivory). */
.bL [style*="color:var(--brand)"],.bW [style*="color:var(--brand)"],
.bV [style*="color:var(--brand)"],
.bL .lbl,.bW .lbl,.bV .lbl{color:var(--brand-ink)!important}

/* === MOBILE TYPE FLOOR 2026-08-05 (Section 508 / WCAG 2.1 AA readability) ===
   Measured live at a 390px viewport before this block, 14 distinct rules
   rendered text below 14px — the smallest at 11px (the legal footer row:
   copyright, "Patent Pending", and all seven Bonterms links). Sub-14px body
   text forces a reader to pinch-zoom, which a federal readability review
   fails. Everything here is scoped to max-width:900px, so the desktop type
   scale is untouched.

   iOS also inflates text on its own when text-size-adjust is left at `auto`,
   which silently rescales the layout on rotate; pinning it to 100% keeps the
   rendered size exactly what these rules say it is.

   Two carve-outs, both deliberate:
   - The inline-style floor below uses attribute selectors because index.html
     carries 19 inline sub-14px font-sizes that no class selector can reach.
     !important is required to beat an inline declaration.
   - The `sup` trademark glyph keeps its em-relative size. It is a typographic
     mark, not reading copy, and forcing it to 14px destroys the superscript.
   Decorative mockup classes (.dm-*, .lce-*, .term-body) are measured absent
   from the current page; they are illustrations, not reading copy, and are
   left alone so a future re-use is not silently blown out of its grid. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
@media(max-width:900px){
  /* Live at 390px today */
  .fbot,.fbot a,.fbot span,.fbot strong{font-size:14px}
  /* The legal-links row is a flex item; its automatic minimum size
     (min-width:auto) pinned it to max-content, so at 14px it laid out 442px
     inside a 288px footer and "Refund" was clipped by body{overflow-x:hidden}.
     min-width:0 lets it wrap the way inline links should. The seven anchors
     are written with no whitespace between them, so there is no soft-wrap
     opportunity either; inline-block gives each one its own break point.
     Measured at 390px: one line ending at x=493 (clipped) becomes two lines
     ending at x=316. */
  .fbot>span{min-width:0}
  .fbot a{display:inline-block}
  .fc h5{font-size:14px}
  .rc-price-lbl,.rc-ship{font-size:14px}
  /* Component classes that are dormant on the current index.html but still
     shipped in this stylesheet — pinned so a re-use cannot reintroduce the
     defect. */
  .lbl,.eyebrow,.hero-eyebrow,.bi-eyebrow,.bi-big-lbl,.bi-cell-lbl,
  .bi-note,.bi-cell-desc,.bi-cta a.secondary,
  .badge,.pill,.hero-meta .m span,.st-l,.ctrl-fam,.ctrl-count,
  .fed-cred-lbl,.fed-lbl,.crisis-label,.crisis-detail,.fca-detail,
  .pc-per,.pc-who,.pc-btn,.pc-list li,.pc.pop::before,.price-note,
  .ps-lbl,.ps-cta,.ps-t .ps-d,.strip .s span,
  .btn,.nav,.nav a,.nav-links a,.nav-cta,
  .fd,.fc a,.footer,.footer-compliance,.fine,.help,.term,
  .checkbox-group label,.radio-group label{font-size:14px}
  /* Inline sub-14px font-sizes written into index.html markup. */
  [style*="font-size:10.5px"],[style*="font-size: 10.5px"],
  [style*="font-size:11px"],[style*="font-size: 11px"],
  [style*="font-size:11.5px"],[style*="font-size: 11.5px"],
  [style*="font-size:12px"],[style*="font-size: 12px"],
  [style*="font-size:12.5px"],[style*="font-size: 12.5px"],
  [style*="font-size:13px"],[style*="font-size: 13px"],
  [style*="font-size:13.5px"],[style*="font-size: 13.5px"]{font-size:14px!important}
}

/* === VISIBLE KEYBOARD FOCUS 2026-08-05 (WCAG 2.4.7 / Section 508) ===
   Gold ring on the navy sections, ink ring on the light ones, both well over
   the 3:1 non-text contrast floor against their own background. */
:focus-visible{outline:3px solid #C9A84C;outline-offset:2px;border-radius:2px}
.bL :focus-visible,.bW :focus-visible,.bV :focus-visible{outline-color:#806722}
