/* ============================================================
   ABSO · The Case for Sleep — page styles (scoped under .cfs3,
   including selectors inside @media blocks). Regenerated from
   website/case-for-sleep-v3_2026-08-08 — edit THERE, re-run the
   pipeline. Loads AFTER vi-enhance.css; cache-bust ?v=N.
   ============================================================ */
body.cfs-native-overflow{overflow:clip !important}


/* self-hosted fonts, the EXACT files the live site serves (from abso-hydrogen main) */
/* ============================================================
   ABSO · The Case for Sleep — v3 preview build (2026-08-08)
   Standalone preview of the page for absohealth.com/case-for-sleep.
   Tokens mirror the live site (style.css vG system).
   ============================================================ */
:root{
  --cream:#FFF7E9; --cream-warm:#F7EDD8;
  --ink:#1F1A12; --ink-80:rgba(31,26,18,.80); --ink-64:rgba(31,26,18,.64);
  --ink-44:rgba(31,26,18,.44); --ink-12:rgba(31,26,18,.12);
  --cream-80:rgba(255,247,233,.80); --cream-55:rgba(255,247,233,.55); --cream-22:rgba(255,247,233,.22);
  --solar:#DF6D09; --solar-soft:#F0A14A;
  --sleep-a:#3546A0; --sleep-b:#7574C1; --sleep-c:#BDB8DC; --sleep-d:#E5EEF1;
  --serif:"Instrument Serif",Georgia,serif;
  --sans:"Inter Tight","Inter",-apple-system,BlinkMacSystemFont,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --e-expo:cubic-bezier(.16,1,.3,1);
  --pad:clamp(20px,5vw,72px); --maxw:1320px;
  --night-dark:#0b0d18; --night-deep:#07080f;
}
.cfs3 img{display:block;max-width:100%}
.cfs3 a{color:inherit}
.cfs3 .serif, .cfs3 h1, .cfs3 h2, .cfs3 h3{font-family:var(--serif);font-weight:400;letter-spacing:-.01em}
.cfs3 .solar{color:var(--solar)}
.cfs3 .wrap{max-width:var(--maxw);margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
.cfs3 .ey{font-family:var(--mono);font-size:12px;letter-spacing:.3em;text-transform:uppercase;color:var(--solar)}

/* rises */
.cfs3 .rise{opacity:0;transform:translateY(26px);transition:opacity .9s var(--e-expo),transform .9s var(--e-expo)}
.cfs3 .rise.in{opacity:1;transform:none}
.cfs3 .stagger>*{opacity:0;transform:translateY(20px);transition:opacity .8s var(--e-expo),transform .8s var(--e-expo)}
.cfs3 .stagger.in>*{opacity:1;transform:none}
.cfs3 .stagger.in>*:nth-child(2){transition-delay:.08s}
.cfs3 .stagger.in>*:nth-child(3){transition-delay:.16s}
.cfs3 .stagger.in>*:nth-child(4){transition-delay:.24s}
.cfs3 .stagger.in>*:nth-child(5){transition-delay:.32s}
.cfs3 .stagger.in>*:nth-child(6){transition-delay:.4s}

/* night meter (whole-page progress, sleep gradient) */
.cfs3 .meter{position:fixed;top:0;left:0;height:3px;z-index:300;width:0;background:linear-gradient(90deg,var(--sleep-a),var(--sleep-b),var(--sleep-c),var(--sleep-d))}

/* nav */
@media(max-width:720px){}

/* hero */
.cfs3 .hero{position:relative;min-height:92svh;display:flex;align-items:flex-end;background:var(--night-deep);color:var(--cream);overflow:hidden;isolation:isolate}
.cfs3 .hero-bg{position:absolute;inset:0;z-index:-2}
.cfs3 .hero-bg img{width:100%;height:100%;object-fit:cover;object-position:center 30%;transform:scale(1.06)}
.cfs3 .hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(7,8,15,.45),rgba(7,8,15,.15) 40%,rgba(7,8,15,.72) 82%,rgba(7,8,15,.95))}
.cfs3 .hero-inner{position:relative;width:100%;max-width:var(--maxw);margin:0 auto;padding:0 var(--pad) clamp(70px,12vh,130px)}
.cfs3 .hero h1{font-family:var(--serif);font-size:clamp(46px,7.4vw,108px);line-height:.98;letter-spacing:-.01em;margin-top:22px}
.cfs3 .hero h1 .ln{display:block;overflow:hidden}
.cfs3 .hero h1 .ln>span{display:inline-block;transform:translateY(110%);transition:transform 1.1s var(--e-expo)}
.cfs3 .hero.in h1 .ln>span{transform:none}
.cfs3 .hero.in h1 .ln:nth-child(2)>span{transition-delay:.1s}
.cfs3 .hero .it{font-style:italic}
.cfs3 .hero-sub{margin-top:26px;max-width:54ch;font-size:clamp(15px,1.5vw,18px);font-weight:300;color:var(--cream-80);opacity:0;transform:translateY(16px);transition:opacity 1s var(--e-expo) .5s,transform 1s var(--e-expo) .5s}
.cfs3 .hero.in .hero-sub{opacity:1;transform:none}
.cfs3 .hero-cue{position:absolute;bottom:20px;left:50%;transform:translateX(-50%);font-family:var(--mono);font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--cream-55)}
.cfs3 .hero-cue i{display:block;width:1px;height:26px;margin:8px auto 0;background:var(--cream-55);animation:cue 1.8s var(--e-expo) infinite;transform-origin:top}
@keyframes cue{0%,100%{transform:scaleY(.35);opacity:.4}50%{transform:scaleY(1);opacity:1}}

/* lede */
.cfs3 .lede{padding:clamp(70px,11vh,130px) 0;background:var(--cream)}
.cfs3 .lede .wrap{max-width:900px}
.cfs3 .lede h2{font-family:var(--serif);font-size:clamp(30px,4.2vw,56px);line-height:1.04;margin:14px 0 18px}
.cfs3 .lede p{font-size:clamp(16px,1.7vw,20px);color:var(--ink-64);max-width:56ch}

/* ============ pinned night scrub ============ */
.cfs3 .pin-wrap{position:relative;height:560vh;background:var(--night-deep)}
.cfs3 .stage{position:sticky;top:0;height:100vh;overflow:hidden;isolation:isolate;background:#05060d;color:var(--cream)}
.cfs3 .beat{position:absolute;inset:0;opacity:0;will-change:opacity}
.cfs3 .beat[data-i="0"]{opacity:1}
.cfs3 .beat>img{width:100%;height:100%;object-fit:cover;object-position:center 42%}
.cfs3 .beat::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(4,5,12,.55),rgba(4,5,12,.14) 38%,rgba(4,5,12,.5) 70%,rgba(4,5,12,.88))}
.cfs3 .beat-cap{position:absolute;z-index:5;left:var(--pad);right:var(--pad);bottom:clamp(34px,8vh,96px);max-width:24ch;opacity:0}
.cfs3 .beat-cap .ts{display:none;font-family:var(--mono);font-variant-numeric:tabular-nums;font-size:13px;letter-spacing:.18em;color:var(--solar-soft)}
.cfs3 .beat-cap .ln{font-family:var(--serif);font-size:clamp(28px,4.2vw,58px);line-height:1.03;margin-top:8px}
.cfs3 .beat-cap .why{margin-top:12px;font-size:clamp(13px,1.3vw,15px);color:var(--cream-80);max-width:44ch;font-weight:300}
.cfs3 .stage-head{position:absolute;z-index:6;top:clamp(76px,10vh,110px);left:0;right:0;text-align:center;pointer-events:none}
.cfs3 .stage-head .ey{display:block;letter-spacing:.3em}
.cfs3 .clock{margin-top:10px;font-family:var(--mono);font-variant-numeric:tabular-nums;font-size:clamp(13px,1.4vw,16px);letter-spacing:.22em;color:var(--solar-soft)}
.cfs3 .hypno{position:absolute;z-index:4;left:var(--pad);right:var(--pad);top:clamp(150px,20vh,210px);max-width:var(--maxw);margin:0 auto;height:clamp(120px,22vh,190px);pointer-events:none}
.cfs3 .hypno svg{width:100%;height:100%;overflow:visible}
.cfs3 .hypno .grid{stroke:rgba(255,247,233,.1);stroke-width:1}
.cfs3 .hypno .rowlab{fill:rgba(255,247,233,.45);font-size:10px;letter-spacing:.08em;font-family:var(--mono);text-transform:uppercase}
.cfs3 .hypno .curve{fill:none;stroke:var(--solar-soft);stroke-width:3;stroke-linejoin:round;stroke-linecap:round;filter:drop-shadow(0 0 8px rgba(240,161,74,.4))}
.cfs3 .an{position:absolute;transform:translate(-50%,-130%);opacity:0;transition:opacity .4s var(--e-expo);font-size:11px;color:var(--cream);background:rgba(8,9,18,.78);padding:4px 9px;border:1px solid var(--cream-22);white-space:nowrap;font-family:var(--mono)}
.cfs3 .an.on{opacity:1}
.cfs3 .an .d{color:var(--solar-soft)}
.cfs3 .stage-cue{position:absolute;z-index:4;bottom:16px;left:50%;transform:translateX(-50%);font-family:var(--mono);font-size:10px;letter-spacing:.2em;color:var(--cream-55);text-transform:uppercase}
.cfs3 .stage-cue i{display:block;width:1px;height:24px;margin:7px auto 0;background:var(--cream-55);animation:cue 1.8s var(--e-expo) infinite;transform-origin:top}
.cfs3 .stage-src{position:absolute;z-index:4;right:var(--pad);bottom:16px;font-family:var(--mono);font-size:10px;color:var(--cream-55)}
/* static fallback */
.cfs-static .cfs3 .pin-wrap{height:auto}
.cfs-static .cfs3 .stage{position:static;height:auto;overflow:visible;background:transparent}
.cfs-static .cfs3 .beat{position:relative;inset:auto;opacity:1!important;min-height:72vh;display:flex;flex-direction:column;justify-content:flex-end}
.cfs-static .cfs3 .beat>img{position:absolute;inset:0}
.cfs-static .cfs3 .beat-cap{position:relative;left:auto;right:auto;bottom:auto;opacity:1!important;max-width:none;width:100%;padding:0 var(--pad) clamp(28px,6vh,60px)}
.cfs-static .cfs3 .beat-cap .ln{max-width:22ch}
.cfs-static .cfs3 .beat-cap .ts{display:block}
.cfs-static .cfs3 .stage-head{position:relative;top:auto;padding:60px var(--pad) 8px}
.cfs-static .cfs3 .clock{display:none}
.cfs-static .cfs3 .stage-cue, .cfs-static .cfs3 .stage-src{display:none}
.cfs-static .cfs3 .hypno{position:relative;left:auto;right:auto;top:auto;margin:26px auto;height:190px;padding:0 var(--pad)}
.cfs-static .cfs3 .hypno .curve{stroke-dashoffset:0!important}
.cfs-static .cfs3 .an{display:none}

/* ============ stat sections ============ */
.cfs3 .stat{position:relative;display:grid;grid-template-columns:1.02fr .98fr;min-height:88vh;align-items:stretch}
.cfs3 .stat.dark{background:#16110a;color:var(--cream)}
.cfs3 .stat.cream{background:var(--cream);color:var(--ink)}
.cfs3 .fig{position:relative;overflow:hidden;min-height:50vh}
.cfs3 .fig>img{width:100%;height:100%;object-fit:cover}
.cfs3 .fig::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(15,11,6,.28),transparent 45%)}
.cfs3 .stat.rev .fig{order:-1}
.cfs3 .stat-body{display:flex;flex-direction:column;justify-content:center;padding:clamp(40px,6.5vw,104px)}
.cfs3 .kick{font-family:var(--mono);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--solar);margin-bottom:18px}
.cfs3 .num{font-family:var(--serif);font-size:clamp(74px,13vw,210px);line-height:.8;letter-spacing:-.03em;color:var(--solar)}
.cfs3 .num.ink{color:var(--ink)}
.cfs3 .num .u{font-size:.26em;letter-spacing:0;opacity:.85;margin-left:.06em}
.cfs3 .say{font-family:var(--serif);font-size:clamp(22px,2.6vw,38px);line-height:1.08;margin-top:26px;max-width:22ch}
.cfs3 .sub{font-size:clamp(14px,1.4vw,16px);margin-top:16px;max-width:44ch;line-height:1.6}
.cfs3 .stat.dark .sub{color:rgba(255,247,233,.76)}
.cfs3 .stat.cream .sub{color:var(--ink-64)}
.cfs3 .src{font-family:var(--mono);font-size:11.5px;margin-top:22px;opacity:.55}
@media(max-width:880px){.cfs3 .stat{grid-template-columns:1fr;min-height:0}.cfs3 .stat.rev .fig{order:0}.cfs3 .fig{min-height:56vh}.cfs3 .stat-body{padding:clamp(40px,9vw,64px) var(--pad)}}

/* ribbons */
.cfs3 .ribbon{background:var(--ink);color:var(--cream);text-align:center;padding:clamp(70px,13vh,150px) var(--pad);position:relative}
.cfs3 .ribbon .ey{display:block;margin-bottom:22px}
.cfs3 .ribbon p{font-family:var(--serif);font-size:clamp(28px,4.6vw,68px);line-height:1.04;max-width:19ch;margin:0 auto}
.cfs3 .ribbon .rsrc{font-family:var(--mono);font-size:11.5px;opacity:.5;margin-top:28px}

/* ============ sleep debt slider ============ */
.cfs3 .debt{background:var(--night-dark);color:var(--cream);padding:clamp(70px,12vh,140px) 0;position:relative}
.cfs3 .debt .wrap{max-width:960px;text-align:center}
.cfs3 .debt h2{font-family:var(--serif);font-size:clamp(30px,4.6vw,58px);line-height:1.03;margin:14px 0 12px}
.cfs3 .debt .intro{color:var(--cream-80);font-weight:300;max-width:52ch;margin:0 auto 44px}
.cfs3 .debt-readout{font-family:var(--serif);font-size:clamp(56px,9vw,120px);line-height:.9;color:var(--solar-soft);font-variant-numeric:tabular-nums}
.cfs3 .debt-readout .u{font-size:.3em;opacity:.85}
.cfs3 .debt-verdict{font-family:var(--serif);font-size:clamp(19px,2.2vw,28px);margin-top:14px;min-height:2.4em}
.cfs3 .debt-verdict .d{color:var(--solar-soft)}
.cfs3 .nights{display:flex;justify-content:center;gap:10px;margin:34px auto 40px;max-width:560px}
.cfs3 .night-cell{flex:1;max-width:64px}
.cfs3 .night-cell .bar{position:relative;height:110px;background:rgba(255,247,233,.07);border:1px solid rgba(255,247,233,.14);overflow:hidden}
.cfs3 .night-cell .fill{position:absolute;left:0;right:0;bottom:0;height:50%;background:linear-gradient(180deg,var(--sleep-b),var(--sleep-a));transition:height .5s var(--e-expo),background .5s}
.cfs3 .night-cell.low .fill{background:linear-gradient(180deg,var(--solar-soft),var(--solar))}
.cfs3 .night-cell .goal{position:absolute;left:0;right:0;bottom:calc(7/10*100%);height:0;border-top:1px dashed rgba(255,247,233,.5)}
.cfs3 .night-cell .dlab{font-family:var(--mono);font-size:10px;color:var(--cream-55);margin-top:8px;letter-spacing:.1em}
.cfs3 .debt-ctrl{max-width:520px;margin:0 auto}
.cfs3 .debt-ctrl label{display:block;font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--cream-80);margin-bottom:16px}
.cfs3 .debt-ctrl label b{color:var(--solar-soft);font-weight:500}
.cfs3 input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:4px;border-radius:2px;background:linear-gradient(90deg,var(--solar),var(--sleep-b),var(--sleep-d));outline:none;cursor:pointer}
.cfs3 input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:26px;height:26px;border-radius:50%;background:var(--cream);border:3px solid var(--sleep-b);box-shadow:0 2px 10px rgba(0,0,0,.4);cursor:grab}
.cfs3 input[type=range]::-moz-range-thumb{width:26px;height:26px;border-radius:50%;background:var(--cream);border:3px solid var(--sleep-b);cursor:grab}
.cfs3 .debt-src{font-family:var(--mono);font-size:11px;color:var(--cream-55);margin-top:36px}

/* ============ myths flip cards ============ */
.cfs3 .myths{background:var(--cream);padding:clamp(70px,12vh,140px) 0}
.cfs3 .myths .head{text-align:center;max-width:760px;margin:0 auto 46px}
.cfs3 .myths h2{font-family:var(--serif);font-size:clamp(30px,4.6vw,58px);line-height:1.03;margin:14px 0 12px}
.cfs3 .myths .head p{color:var(--ink-64);font-weight:300}
.cfs3 .myth-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;max-width:1160px;margin:0 auto;padding:0 var(--pad)}
.cfs3 .myth{perspective:1200px;cursor:pointer;min-height:320px}
.cfs3 .myth-inner{position:relative;width:100%;height:100%;min-height:320px;transform-style:preserve-3d;transition:transform .8s var(--e-expo)}
.cfs3 .myth.flipped .myth-inner{transform:rotateY(180deg)}
.cfs3 .myth-face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;display:flex;flex-direction:column;justify-content:space-between;padding:26px}
.cfs3 .myth-front{background:#fff;border:1px solid var(--ink-12)}
.cfs3 .myth-front .q{font-family:var(--serif);font-size:clamp(22px,2vw,28px);line-height:1.12;font-style:italic}
.cfs3 .myth-front .hint{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-44)}
.cfs3 .myth-back{background:var(--ink);color:var(--cream);transform:rotateY(180deg)}
.cfs3 .myth-back .a{font-family:var(--serif);font-size:clamp(17px,1.6vw,21px);line-height:1.2}
.cfs3 .myth-back .a .d{color:var(--solar-soft)}
.cfs3 .myth-back .msrc{font-family:var(--mono);font-size:10px;color:var(--cream-55);margin-top:14px}
.cfs3 .myth .tag{font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--solar)}

/* ============ benefits chips ============ */
.cfs3 .bene{background:var(--cream-warm);padding:clamp(70px,11vh,130px) 0;text-align:center}
.cfs3 .bene h2{font-family:var(--serif);font-size:clamp(28px,5vw,56px);margin:14px 0 28px}
.cfs3 .chips{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;max-width:820px;margin:0 auto}
.cfs3 .chips span{background:rgba(255,255,255,.7);backdrop-filter:blur(6px);border:1px solid var(--ink-12);padding:12px 20px;border-radius:100px;font-size:15px;font-weight:500}
.cfs3 .chips .tick{color:var(--solar);margin-right:4px}
.cfs3 .chips .ast{opacity:.45}
.cfs3 .bene .foot{font-size:12px;margin-top:24px;color:var(--ink-64);max-width:62ch;margin-left:auto;margin-right:auto}

/* ============ two nights toggle ============ */
.cfs3 .tog{background:var(--night-dark);color:var(--cream);padding:clamp(64px,11vh,130px) 0}
.cfs3 .tog .wrap{display:grid;grid-template-columns:1.4fr 1fr;gap:clamp(24px,4vw,60px);align-items:center}
.cfs3 .tog h2{font-family:var(--serif);font-size:clamp(28px,3.6vw,48px);line-height:1.04;margin:12px 0 20px}
.cfs3 .tabs{display:inline-flex;border:1px solid var(--cream-22);margin-bottom:22px}
.cfs3 .tab{appearance:none;background:transparent;border:0;color:var(--cream-80);font:inherit;font-size:13px;font-weight:600;padding:11px 20px;cursor:pointer;transition:all .2s}
.cfs3 .tab.on{background:var(--cream);color:var(--ink)}
.cfs3 .tab.on.bad-on{background:rgba(140,150,200,.95)}
.cfs3 .bgraph svg{width:100%;height:auto;overflow:visible}
.cfs3 .bgraph .grid{stroke:rgba(255,247,233,.1);stroke-width:1}
.cfs3 .bgraph .rowlab{fill:rgba(255,247,233,.45);font-size:11px;font-family:var(--mono);text-transform:uppercase;letter-spacing:.08em}
.cfs3 .bgraph .pathB{fill:none;stroke-width:3.5;stroke-linejoin:round;stroke-linecap:round;transition:opacity .5s var(--e-expo)}
.cfs3 .bgraph .pathB.good{stroke:var(--solar-soft);filter:drop-shadow(0 0 8px rgba(240,161,74,.4))}
.cfs3 .bgraph .pathB.bad{stroke:rgba(140,150,200,.85);stroke-dasharray:7 7}
.cfs3 .bcap{font-size:13.5px;color:var(--cream-80);margin-top:16px;max-width:52ch;font-weight:300}
.cfs3 .tog .tsrc{font-family:var(--mono);font-size:11px;color:var(--cream-55);margin-top:14px}
.cfs3 .tog-copy p{color:var(--cream-80);font-weight:300;font-size:15px;max-width:40ch}
@media(max-width:860px){.cfs3 .tog .wrap{grid-template-columns:1fr}}

/* ============ soft close ============ */
.cfs3 .close{background:#16110a;color:var(--cream);padding:clamp(70px,12vh,140px) 0}
.cfs3 .close .wrap{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(28px,5vw,72px);align-items:center}
.cfs3 .close-fig{position:relative;aspect-ratio:4/5;overflow:hidden;background:#0e0b06}
.cfs3 .close-fig img{width:100%;height:100%;object-fit:cover}
.cfs3 .close h2{font-family:var(--serif);font-size:clamp(32px,5vw,68px);line-height:1;margin:14px 0 16px}
.cfs3 .close p{color:rgba(255,247,233,.78);font-size:16px;max-width:46ch}
.cfs3 .three{display:flex;gap:26px;flex-wrap:wrap;margin:26px 0 30px}
.cfs3 .three span{display:flex;gap:9px;align-items:baseline;font-size:14px;color:rgba(255,247,233,.9)}
.cfs3 .three b{font-family:var(--serif);font-size:22px;color:var(--solar-soft);font-weight:400}
.cfs3 .acts{display:flex;gap:14px;flex-wrap:wrap;align-items:center}
@media(max-width:820px){.cfs3 .close .wrap{grid-template-columns:1fr}.cfs3 .close-fig{max-height:60vh}}

/* footer */
.cfs3 footer{background:var(--night-deep);color:var(--cream);padding:clamp(50px,8vh,90px) 0 40px}
.cfs3 footer .cols{display:grid;grid-template-columns:1.4fr 1fr;gap:40px}
.cfs3 footer .note{color:var(--cream-55);font-size:13px;max-width:60ch;margin-top:14px;line-height:1.7}
.cfs3 footer h5{font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--cream-55);margin-bottom:12px}
.cfs3 footer .srcs{font-family:var(--mono);font-size:11px;color:var(--cream-55);line-height:2}
.cfs3 footer .bot{display:flex;justify-content:space-between;margin-top:44px;padding-top:22px;border-top:1px solid rgba(255,247,233,.12);font-size:12px;color:var(--cream-55)}
@media(max-width:820px){.cfs3 footer .cols{grid-template-columns:1fr}}

@media(prefers-reduced-motion:reduce){.cfs3 .rise, .cfs3 .stagger>*{opacity:1;transform:none}}

/* ============================================================
   SLEEP COLOURWAY — this is a Sleep-context page (canon: Sleep
   hero = Sleep Deep Indigo #3546A0 + the Sleep gradient).
   Solar survives ONLY as the functional deficit warning in the
   debt module. Everything else runs on the Sleep palette.
   ============================================================ */
:root{--sleep-night:#151B52;--night-stat:#12153E}
/* eyebrows / kickers */
.cfs3 .ey{color:var(--sleep-a)}
.cfs3 .hero .ey, .cfs3 .stage-head .ey, .cfs3 .ribbon .ey, .cfs3 .debt .ey, .cfs3 .tog .ey, .cfs3 .close .ey{color:var(--sleep-c)}
.cfs3 .stat.dark .kick, .cfs3 .close .ck{color:var(--sleep-c)}
.cfs3 .stat.cream .kick{color:var(--sleep-a)}
/* headline accent words */
.cfs3 .hero .solar, .cfs3 .ribbon .solar, .cfs3 .stat.dark .solar, .cfs3 .tog h2 .solar, .cfs3 .close h2 .solar{color:var(--sleep-c)}
.cfs3 .stat.cream .solar, .cfs3 .lede .solar{color:var(--sleep-a)}
/* big stat numbers */
.cfs3 .num{color:var(--sleep-c);background:linear-gradient(100deg,var(--sleep-b),var(--sleep-c) 70%,var(--sleep-d));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.cfs3 .num.ink{background:none;-webkit-text-fill-color:currentColor;color:var(--sleep-a)}
/* section grounds */
.cfs3 .stat.dark{background:var(--night-stat)}
.cfs3 .ribbon{background:var(--sleep-night)}
.cfs3 .close{background:var(--night-stat)}
.cfs3 .bene{background:var(--sleep-d)}
/* night scrub */
.cfs3 .clock, .cfs3 .beat-cap .ts{color:var(--sleep-c)}
.cfs3 .an .d{color:var(--sleep-c)}
.cfs3 .hypno .curve{stroke:var(--sleep-b);filter:drop-shadow(0 0 8px rgba(117,116,193,.5))}
/* debt module: indigo readout, solar stays the WARNING colour */
.cfs3 .debt-readout{color:var(--sleep-c)}
.cfs3 .debt-verdict .d{color:var(--sleep-c)}
/* myths */
.cfs3 .myth .tag{color:var(--sleep-a)}
.cfs3 .myth-back{background:var(--sleep-night)}
.cfs3 .myth-back .tag{color:var(--sleep-c)}
.cfs3 .myth-back .a .d{color:var(--sleep-c)}
/* benefits */
.cfs3 .chips .tick{color:var(--sleep-a)}
.cfs3 .bene h2 .solar{color:var(--sleep-a)}
.cfs3 .chips span{background:rgba(255,255,255,.75)}
/* two-nights toggle */
.cfs3 .bgraph .pathB.good{stroke:var(--sleep-b);filter:drop-shadow(0 0 8px rgba(117,116,193,.5))}
/* close: chips + CTA go Sleep */
.cfs3 .three b{color:var(--sleep-c)}

/* ============ problem opener ============ */
.cfs3 .stat.op{background:var(--sleep-night)}
.cfs3 .op-head{font-size:clamp(26px,3.2vw,44px);line-height:1.04;margin-bottom:26px;max-width:20ch}
.cfs3 .op-head .solar{color:var(--sleep-c)}
.cfs3 .stat.op .num{font-size:clamp(64px,10vw,160px)}
.cfs3 .stat.op .say{margin-top:14px}
.cfs3 .dots{display:grid;grid-template-columns:repeat(20,1fr);gap:6px;max-width:520px;margin:28px 0 10px}
.cfs3 .dots i{display:block;aspect-ratio:1;border-radius:50%;background:rgba(255,247,233,.13);transform:scale(.65);opacity:.55;transition:background .45s var(--e-expo),transform .45s var(--e-expo),opacity .45s var(--e-expo),box-shadow .45s}
.cfs3 .dots.lit i{transform:scale(1);opacity:1}
.cfs3 .dots.lit i.hit{background:linear-gradient(135deg,var(--solar),var(--solar-soft));box-shadow:0 0 10px rgba(223,109,9,.45)}
.cfs3 .dots-cap{font-family:var(--mono);font-size:11px;color:var(--cream-55);max-width:46ch}
.cfs3 .op-facts{list-style:none;margin-top:22px;display:flex;flex-direction:column;gap:8px}
.cfs3 .op-facts li{font-size:14.5px;color:rgba(255,247,233,.8)}
.cfs3 .op-facts b{font-family:var(--serif);font-weight:400;font-size:21px;color:var(--sleep-c);margin-right:7px}
@media(max-width:880px){.cfs3 .dots{max-width:100%}}

/* ============ benefits: card grid (replaces pills) ============ */
.cfs3 .bene-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;max-width:1160px;margin:0 auto;padding:0 var(--pad);text-align:left}
.cfs3 .bcard{position:relative;background:rgba(255,255,255,.72);border:1px solid rgba(53,70,160,.14);padding:24px 24px 20px;overflow:hidden;transition:transform .4s var(--e-expo),box-shadow .4s var(--e-expo),border-color .4s}
.cfs3 .bcard::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--sleep-a),var(--sleep-b),var(--sleep-c))}
.cfs3 .bcard:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(53,70,160,.14);border-color:rgba(53,70,160,.3)}
.cfs3 .bcard .bi{font-family:var(--mono);font-size:10px;letter-spacing:.16em;color:var(--sleep-b)}
.cfs3 .bcard h4{font-size:clamp(21px,1.8vw,26px);margin:10px 0 8px;color:var(--ink)}
.cfs3 .bcard h4 .ast{color:var(--sleep-b);opacity:.7}
.cfs3 .bcard p{font-size:13.5px;line-height:1.55;color:var(--ink-64);min-height:3.2em;margin-bottom:12px}
.cfs3 .bcard .bsrc{font-family:var(--mono);font-size:10px;color:var(--ink-44)}

/* ============ debt slider: live impact panel ============ */
.cfs3 .impacts{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-width:820px;margin:36px auto 0;text-align:left;transition:opacity .3s var(--e-expo)}
.cfs3 .impacts.swap{opacity:0}
.cfs3 .imp{background:rgba(255,247,233,.05);border:1px solid rgba(255,247,233,.12);padding:16px 18px}
.cfs3 .imp .in{font-family:var(--serif);font-size:clamp(20px,1.9vw,26px);color:var(--sleep-c);line-height:1}
.cfs3 .imp.neg .in{color:var(--solar-soft)}
.cfs3 .imp p{font-size:12.5px;line-height:1.5;color:var(--cream-80);margin:8px 0 10px;min-height:3em}
.cfs3 .imp .is{font-family:var(--mono);font-size:10px;color:var(--cream-55)}
@media(max-width:720px){.cfs3 .impacts{grid-template-columns:1fr}.cfs3 .imp p{min-height:0}}

/* ============ round-2 restyles (2026-08-08 evening) ============ */
/* opener facts: ledger rows */
.cfs3 .op-facts{margin-top:26px}
.cfs3 .op-facts li{display:flex;align-items:baseline;gap:18px;padding:14px 0;border-top:1px solid rgba(255,247,233,.16);font-size:15px;color:rgba(255,247,233,.85)}
.cfs3 .op-facts li:last-child{border-bottom:1px solid rgba(255,247,233,.16)}
.cfs3 .op-facts b{font-size:clamp(26px,2.6vw,38px);min-width:140px;margin-right:0;line-height:1}

/* stress chart (compact, inside the cream stat body) */
.cfs3 .chart-in.inbody{width:100%;max-width:460px;margin-top:26px}
.cfs3 .ch-row{display:grid;grid-template-columns:120px 1fr 52px;align-items:center;gap:12px;margin-bottom:12px}
.cfs3 .ch-lab{font-size:13px;color:var(--ink-64)}
.cfs3 .ch-bar{height:28px;background:var(--ink-06);position:relative;overflow:hidden}
.cfs3 .ch-bar i{position:absolute;left:0;top:0;bottom:0;width:0;background:linear-gradient(90deg,var(--sleep-a),var(--sleep-b));transition:width 1.1s var(--e-expo)}
.cfs3 .chart-in.in .ch-bar i{width:var(--w)}
.cfs3 .ch-val{font-family:var(--serif);font-size:20px;color:var(--sleep-a);text-align:right}
.cfs3 .ch-src{font-family:var(--mono);font-size:10px;color:var(--ink-44);margin-top:10px}

/* brand buttons (live-site .btn spec) */
.cfs3 .abtn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.5em;padding:15px 26px;border-radius:3px;font-size:14px;font-weight:500;letter-spacing:.01em;border:1px solid;overflow:hidden;isolation:isolate;text-decoration:none;white-space:nowrap;transition:color .35s var(--e-expo),border-color .35s var(--e-expo)}
.cfs3 .abtn::before{content:"";position:absolute;inset:0;z-index:-1;transform:translateY(101%);transition:transform .45s var(--e-expo)}
.cfs3 .abtn:hover::before{transform:translateY(0)}
.cfs3 .abtn:active{transform:scale(.985)}
.cfs3 .abtn-fill{background:var(--cream);border-color:var(--cream);color:var(--ink)}
.cfs3 .abtn-fill::before{background:var(--sleep-b)}
.cfs3 .abtn-fill:hover{color:var(--cream);border-color:var(--sleep-b)}
.cfs3 .abtn-light{border-color:var(--cream-22);color:var(--cream);background:transparent}
.cfs3 .abtn-light::before{background:var(--cream)}
.cfs3 .abtn-light:hover{color:var(--ink);border-color:var(--cream)}
.cfs3 .close .acts .btn{display:none}

/* cta line */
.cfs3 .cta-line{background:var(--ink);color:var(--cream);padding:clamp(36px,6vh,64px) 0}
.cfs3 .cta-line .wrap{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.cfs3 .cta-line p{font-size:clamp(24px,3vw,40px)}

/* debt extras */
.cfs3 .presets{display:flex;justify-content:center;gap:8px;margin-top:18px;flex-wrap:wrap}
.cfs3 .preset{font-family:var(--mono);font-size:12px;letter-spacing:.06em;padding:10px 18px;border:1px solid rgba(255,247,233,.25);background:transparent;color:var(--cream-80);cursor:pointer;border-radius:3px;transition:all .25s}
.cfs3 .preset.on{background:var(--cream);color:var(--ink);border-color:var(--cream)}
.cfs3 input[type=range]{height:8px}
.cfs3 input[type=range]::-webkit-slider-thumb{width:34px;height:34px;touch-action:manipulation}
.cfs3 input[type=range]::-moz-range-thumb{width:34px;height:34px}
.cfs3 .debt-cta{margin-top:28px;font-size:15px;color:var(--cream-80)}
.cfs3 .debt-cta a{color:var(--sleep-c);border-bottom:1px solid rgba(189,184,220,.4)}
.cfs3 .debt-cta a:hover{border-bottom-color:var(--sleep-c)}

/* bento benefits */
.cfs3 .bene{background:var(--sleep-d);padding:clamp(70px,11vh,130px) 0}
.cfs3 .chips, .cfs3 .bene-grid{display:none}
.cfs3 .bento{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;max-width:1160px;margin:0 auto;padding:0 var(--pad);text-align:left}
.cfs3 .bt{padding:26px;min-height:180px;display:flex;flex-direction:column;justify-content:space-between;gap:18px;transition:transform .4s var(--e-expo),box-shadow .4s}
.cfs3 .bt:hover{transform:translateY(-4px);box-shadow:0 16px 40px rgba(53,70,160,.16)}
.cfs3 .bt .bi{font-family:var(--mono);font-size:10px;letter-spacing:.16em}
.cfs3 .bt h4{font-size:clamp(22px,2vw,30px);margin-top:10px;font-weight:400}
.cfs3 .bt h4 em{font-style:italic}
.cfs3 .bt p{font-size:13.5px;line-height:1.55;margin-bottom:10px}
.cfs3 .bt .bsrc{font-family:var(--mono);font-size:10px;opacity:.75}
.cfs3 .bt .bsrc a{color:inherit;text-decoration:none;border-bottom:1px dotted currentColor;pointer-events:auto}
.cfs3 .bt .bsrc a:hover{opacity:1;border-bottom-style:solid}
.cfs3 .bt .ast{opacity:.55}
.cfs3 .bt-indigo{grid-column:span 2;grid-row:span 2;background:var(--sleep-night);color:var(--cream)}
.cfs3 .bt-indigo .bi{color:var(--sleep-c)}
.cfs3 .bt-indigo h4{font-size:clamp(34px,3.4vw,52px)}
.cfs3 .bt-indigo p{font-size:15px;max-width:34ch}
.cfs3 .bt-grad{grid-column:span 2;background:linear-gradient(135deg,var(--sleep-a),var(--sleep-b) 55%,var(--sleep-c));color:var(--cream)}
.cfs3 .bt-grad .bi{color:rgba(255,247,233,.8)}
.cfs3 .bt-light{background:rgba(255,255,255,.8);border:1px solid rgba(53,70,160,.14);color:var(--ink)}
.cfs3 .bt-light .bi{color:var(--sleep-a)}
.cfs3 .bt-light p{color:var(--ink-64)}
.cfs3 .bt-soft{grid-column:span 2;background:#fff;border:1px solid rgba(53,70,160,.14);color:var(--ink)}
.cfs3 .bt-soft .bi{color:var(--sleep-a)}
.cfs3 .bt-soft p{color:var(--ink-64)}
.cfs3 .bt-note{background:transparent;border:1px dashed rgba(53,70,160,.35);min-height:0}
.cfs3 .bt-note p{font-size:11px;color:var(--ink-44);font-family:var(--mono);line-height:1.6;margin:0}

/* word-numeral stat display */
.cfs3 .num.word{font-size:clamp(44px,7vw,104px);line-height:.95}

/* where Abso fits the night */
.cfs3 .fit{background:var(--night-deep);color:var(--cream);padding:clamp(70px,11vh,130px) 0}
.cfs3 .fit-head{text-align:center;max-width:760px;margin:0 auto 44px}
.cfs3 .fit-head h2{font-size:clamp(28px,4.4vw,52px);line-height:1.04;margin:14px 0 12px}
.cfs3 .fit-intro{color:var(--cream-80);font-weight:300;font-size:15px}
.cfs3 .fit-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;max-width:1100px;margin:0 auto}
.cfs3 .fit-card{background:rgba(255,247,233,.04);border:1px solid rgba(255,247,233,.1);border-top:3px solid var(--sleep-b);padding:24px}
.cfs3 .fit-card:nth-child(1){border-top-color:var(--sleep-a)}
.cfs3 .fit-card:nth-child(3){border-top-color:var(--sleep-c)}
.cfs3 .ft-time{font-family:var(--mono);font-size:11px;letter-spacing:.18em;color:var(--sleep-c)}
.cfs3 .fit-card h4{font-size:clamp(22px,2vw,28px);margin:8px 0 16px;font-weight:400}
.cfs3 .fa{display:grid;grid-template-columns:auto auto;justify-content:start;align-items:baseline;column-gap:8px;padding:10px 0;border-top:1px solid rgba(255,247,233,.1)}
.cfs3 .fa b{font-size:14.5px;font-weight:500}
.cfs3 .fa .fd{font-family:var(--mono);font-size:11px;color:var(--sleep-c)}
.cfs3 .fa p{grid-column:1/-1;font-size:12.5px;color:var(--cream-55);margin-top:3px;line-height:1.5}
.cfs3 .fit-foot{font-family:var(--mono);font-size:10.5px;color:var(--cream-55);text-align:center;max-width:72ch;margin:32px auto 0;line-height:1.7}
@media(max-width:820px){.cfs3 .fit-grid{grid-template-columns:1fr}}

/* bento footnote */
.cfs3 .bene-foot{font-family:var(--mono);font-size:10.5px;color:var(--ink-44);text-align:center;max-width:78ch;margin:22px auto 0;padding:0 var(--pad);line-height:1.7}

/* in-scrub actives panels */
.cfs3 .ning{position:absolute;z-index:6;right:var(--pad);top:50%;transform:translateY(-46%);width:min(320px,78vw);background:rgba(8,9,18,.82);border:1px solid rgba(255,247,233,.16);backdrop-filter:blur(8px);padding:18px 20px;opacity:0;transition:opacity .5s var(--e-expo),transform .5s var(--e-expo);pointer-events:none}
.cfs3 .ning.on{opacity:1;transform:translateY(-50%)}
.cfs3 .ning .nr{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--sleep-c)}
.cfs3 .ning .na{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;padding:9px 0 7px;border-bottom:1px solid rgba(255,247,233,.12)}
.cfs3 .ning .na:first-of-type{margin-top:10px;border-top:1px solid rgba(255,247,233,.12)}
.cfs3 .ning .na b{font-size:13.5px;font-weight:500;color:var(--cream)}
.cfs3 .ning .na i{font-style:normal;font-family:var(--mono);font-size:10px;color:var(--sleep-c)}
.cfs3 .ning .na em{font-style:normal;display:block;width:100%;font-size:11px;color:var(--cream-55);line-height:1.45}
.cfs-static .cfs3 .ning{position:relative;top:auto;right:auto;transform:none;opacity:1;width:auto;margin:14px var(--pad);pointer-events:auto}
@media(max-width:880px){.cfs3 .ning{right:12px;width:min(280px,74vw)}}

/* ritual fold */
.cfs3 .ritual{background:var(--night-stat);color:var(--cream);padding:clamp(70px,11vh,130px) 0}
.cfs3 .rit-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;max-width:1100px;margin:0 auto}
.cfs3 .rit-card{background:rgba(255,247,233,.04);border:1px solid rgba(255,247,233,.1);padding:0 0 22px;overflow:hidden}
.cfs3 .rit-fig{aspect-ratio:4/4.4;overflow:hidden}
.cfs3 .rit-fig img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--e-expo)}
.cfs3 .rit-card:hover .rit-fig img{transform:scale(1.04)}
.cfs3 .rit-step{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.18em;color:var(--sleep-c);margin:18px 22px 4px;text-transform:uppercase}
.cfs3 .rit-card h4{font-size:clamp(24px,2.2vw,32px);margin:2px 22px 8px;font-weight:400}
.cfs3 .rit-card p{font-size:13.5px;line-height:1.55;color:var(--cream-80);margin:0 22px}
@media(max-width:820px){.cfs3 .rit-grid{grid-template-columns:1fr}.cfs3 .rit-fig{aspect-ratio:16/10}}

/* mech fold */
.cfs3 .mech{background:var(--cream);color:var(--ink);padding:clamp(70px,11vh,130px) 0}
.cfs3 .mech .wrap{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(28px,5vw,72px);align-items:center}
.cfs3 .mech-fig{aspect-ratio:4/5;overflow:hidden}
.cfs3 .mech-fig img{width:100%;height:100%;object-fit:cover}
.cfs3 .mech .kick{color:var(--sleep-a)}
.cfs3 .mech h2{font-size:clamp(30px,4.4vw,54px);line-height:1.02;margin:12px 0 16px}
.cfs3 .mech p{color:var(--ink-64);font-size:16px;max-width:46ch}
.cfs3 .mech .three{margin:24px 0 8px}
.cfs3 .mech .three span{color:var(--ink-80)}
.cfs3 .mech .three b{color:var(--sleep-a)}
.cfs3 .mech-link{margin-top:10px}
.cfs3 .mech-link a{color:var(--sleep-a);font-weight:500;text-decoration:none;border-bottom:1px solid rgba(53,70,160,.35)}
.cfs3 .mech p.mech-foot{font-family:var(--mono);font-size:10px;color:var(--ink-44);margin-top:16px;max-width:66ch;line-height:1.7}
@media(max-width:820px){.cfs3 .mech .wrap{grid-template-columns:1fr}.cfs3 .mech-fig{max-height:60vh}}

/* sleep dock — single quiet pill, hairline-divided */
.cfs3 .dock{position:fixed;left:50%;transform:translateX(-50%) translateY(150%);bottom:18px;z-index:250;display:flex;align-items:center;gap:16px;background:rgba(31,26,18,.94);backdrop-filter:blur(10px);color:var(--cream);padding:10px 10px 10px 22px;border-radius:10px;border:1px solid rgba(255,247,233,.08);box-shadow:0 18px 50px rgba(0,0,0,.35);transition:transform .5s var(--e-expo)}
.cfs3 .dock.on{transform:translateX(-50%) translateY(0)}
.cfs3 .dk-logo{height:14px;opacity:.9}
.cfs3 .dk-div{width:1px;height:22px;background:rgba(255,247,233,.15)}
.cfs3 .dk-chip{width:22px;height:22px;border-radius:4px;background:linear-gradient(135deg,var(--sleep-a),var(--sleep-b),var(--sleep-c))}
.cfs3 .dk-prod{display:flex;align-items:center;gap:10px}
.cfs3 .dk-t{display:flex;align-items:baseline;gap:7px}
.cfs3 .dk-t b{font-size:14px;font-weight:500;line-height:1}
.cfs3 .dk-t span{font-family:var(--mono);font-size:10px;color:var(--cream-55);letter-spacing:.04em}
.cfs3 .dk-price{display:flex;align-items:baseline;gap:7px}
.cfs3 .dk-price b{font-family:var(--serif);font-size:19px;font-weight:400;letter-spacing:.01em}
.cfs3 .dk-price s{font-size:11.5px;color:var(--cream-55);text-decoration-thickness:1px}
.cfs3 .dk-btn{background:var(--solar);color:#fff;font-size:13.5px;font-weight:600;padding:12px 22px;border-radius:3px;text-decoration:none;transition:transform .3s,box-shadow .3s;white-space:nowrap;letter-spacing:.01em}
.cfs3 .dk-btn:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(223,109,9,.35)}

/* ============ mobile pass ============ */
@media(max-width:720px){
  .cfs3 .myths{display:none}
  .cfs3 .bt{padding:16px 18px;min-height:0;gap:8px}
  .cfs3 .bt h4{font-size:20px;margin-top:4px}
  .cfs3 .bt-indigo h4{font-size:26px}
  .cfs3 .bt p{font-size:12px;min-height:0;margin-bottom:6px}
  .cfs3 .bt-indigo p{font-size:12.5px}
  .cfs3 .dots{grid-template-columns:repeat(10,1fr);gap:7px}
  .cfs3 .op-facts b{min-width:100px;font-size:26px}
  .cfs3 .op-head{font-size:clamp(24px,7vw,32px)}
  .cfs3 .stat-body{padding:38px var(--pad)}
  .cfs3 .num{font-size:clamp(64px,22vw,110px)}
  .cfs3 .say{font-size:clamp(20px,5.6vw,26px);max-width:none}
  .cfs3 .sub{max-width:none}
  .cfs3 .ch-row{grid-template-columns:92px 1fr 44px}
  .cfs3 .nights{gap:6px;max-width:100%}
  .cfs3 .night-cell .bar{height:84px}
  .cfs3 .tabs{display:flex;width:100%}
  .cfs3 .tab{flex:1;padding:11px 8px}
  .cfs3 .beat-cap .ln{font-size:clamp(24px,8vw,34px)}
  .cfs3 .cta-line .wrap{justify-content:center;text-align:center}
  .cfs3 .acts{width:100%}
  .cfs3 .abtn{flex:1;justify-content:center}
  .cfs3 .three{gap:14px}
  .cfs3 .close-fig{aspect-ratio:4/5}
  .cfs3 footer .bot{flex-direction:column;gap:8px}
  .cfs3 .dock{left:8px;right:8px;transform:translateY(150%);gap:8px;padding:8px 10px;justify-content:space-between}
  .cfs3 .dock.on{transform:translateY(0)}
  .cfs3 .dk-logo{display:none}
  .cfs3 .dk-price s{display:none}
  .cfs3 .dk-price em{display:none}
  .cfs3 .myth{min-height:280px}
  .cfs3 .myth-inner{min-height:280px}
  .cfs3 .hero h1{font-size:clamp(40px,12vw,64px)}
}
@media(max-width:900px){
  .cfs3 .bento{grid-template-columns:repeat(2,1fr)}
  .cfs3 .bt-indigo{grid-column:span 2;grid-row:auto}
  .cfs3 .bt-grad, .cfs3 .bt-soft{grid-column:span 2}
}
@media(max-width:560px){
  .cfs3 .bento{grid-template-columns:1fr}
  .cfs3 .bt-indigo, .cfs3 .bt-grad, .cfs3 .bt-soft{grid-column:span 1}
  .cfs3 .bt{min-height:0}
}

/* ============================================================
   SLEEP GRADIENT GROUNDS (2026-08-09, Niclas: fewer flat navies)
   Every dark band gets a subtle deep-indigo gradient from the
   Sleep family — modern Abso, still dark, never loud. CSS
   gradients only on page grounds (never as the Drift device).
   ============================================================ */
.cfs3 .stat.dark{background:linear-gradient(165deg,#10133A 0%,#151B52 55%,#1C2464 100%)}
.cfs3 .stat.op{background:linear-gradient(150deg,#151B52 0%,#1A2158 55%,#26307A 100%)}
.cfs3 .ribbon{background:linear-gradient(140deg,#151B52 0%,#1E2770 65%,#2A3585 100%)}
.cfs3 .close{background:linear-gradient(160deg,#10133A 0%,#151B52 50%,#202968 100%)}
.cfs3 .debt{background:linear-gradient(175deg,#0B0D18 0%,#10143A 70%,#151B52 100%)}
.cfs3 .tog{background:linear-gradient(200deg,#12163F 0%,#0B0D18 75%)}
.cfs3 .fit{background:linear-gradient(180deg,#07080F 0%,#12153E 100%)}
.cfs3 .ritual{background:linear-gradient(165deg,#12153E 0%,#1A2058 60%,#151B52 100%)}
.cfs3 .myth-back{background:linear-gradient(150deg,#151B52 0%,#1E2770 100%)}
.cfs3 .bt-indigo{background:linear-gradient(160deg,#12153E 0%,#1B2262 100%)}
.cfs3 .pin-wrap{background:linear-gradient(180deg,#12153E 0%,#07080F 30%)}

/* ============ mobile pass 2 (2026-08-09): scrub ON, layout polish ============ */
@media(max-width:720px){
  .cfs3 .pin-wrap{height:420vh}
  .cfs3 .stage-head{top:clamp(64px,9vh,90px)}
  .cfs3 .hypno{left:16px;right:16px;top:128px;height:88px}
  .cfs3 .hypno .rowlab{font-size:8px}
  .cfs3 .an{display:none}
  .cfs3 .stage-src{display:none}
  .cfs3 .beat-cap{left:16px;right:16px;bottom:118px;max-width:none}
  .cfs3 .beat-cap .ln{font-size:clamp(24px,7.4vw,32px)}
  .cfs3 .beat-cap .why{font-size:12.5px;max-width:none}
  .cfs3 .ning{left:16px;right:16px;width:auto;top:238px;bottom:auto;transform:translateY(8px);padding:12px 14px}
  .cfs3 .ning.on{transform:none}
  .cfs3 .ning .na{padding:7px 0 5px}
  .cfs3 .ning .na b{font-size:12.5px}
  .cfs3 .ning .na i{font-size:9px}
  .cfs3 .ning .na em{font-size:10.5px}
  .cfs3 .op-facts b{min-width:78px;font-size:22px}
  .cfs3 .op-facts li{font-size:13.5px;gap:12px}
  .cfs3 .chart-in.inbody{max-width:none}
  .cfs3 .ch-row{grid-template-columns:88px 1fr 40px}
  .cfs3 .ch-val{font-size:16px}
  .cfs3 .rit-fig{aspect-ratio:16/11}
  .cfs3 .rit-card h4{margin-top:0}
  .cfs3 .rit-card p{font-size:12.5px}
  .cfs3 .mech .three{display:grid;grid-template-columns:1fr;gap:10px;margin:20px 0 6px}
  .cfs3 .mech-fig{aspect-ratio:1/1}
  .cfs3 .close-fig{aspect-ratio:1/1;max-height:none}
  .cfs3 .close .acts{flex-direction:column}
  .cfs3 .close .acts .abtn{width:100%}
  .cfs3 .say{max-width:none}
}

/* ============ mobile condense (2026-08-09): shorter page, same impact ============ */
@media(max-width:720px){
  .cfs3 .stat{min-height:0}
  .cfs3 .stat .fig{min-height:0;height:30vh}
  .cfs3 .stat .sub{display:none}
  .cfs3 .stat-body{padding:34px var(--pad) 38px}
  .cfs3 .num{font-size:clamp(56px,18vw,88px)}
  .cfs3 .num.word{font-size:clamp(34px,10vw,52px)}
  .cfs3 .say{font-size:clamp(19px,5.4vw,24px);margin-top:14px}
  .cfs3 .src{margin-top:12px}
  .cfs3 .op-head{margin-bottom:18px}
  .cfs3 .dots{margin:20px 0 8px}
  .cfs3 .op-facts{margin-top:16px}
  .cfs3 .op-facts li{padding:10px 0}
  .cfs3 .lede{padding:52px 0}
  .cfs3 .ribbon{padding:50px var(--pad)}
  .cfs3 .pin-wrap{height:320vh}
  .cfs3 .debt{padding:52px 0}
  .cfs3 .debt-readout{font-size:clamp(44px,14vw,64px)}
  .cfs3 .nights{margin:20px auto 24px}
  .cfs3 .night-cell .bar{height:56px}
  .cfs3 .impacts{margin-top:22px}
  .cfs3 .imp p{margin:6px 0 8px}
  .cfs3 .debt-cta{margin-top:20px}
  .cfs3 .bene{padding:54px 0}
  .cfs3 .bento{gap:10px}
  .cfs3 .bene-foot{margin-top:16px}
  .cfs3 .tog{padding:48px 0}
  .cfs3 .ritual{padding:52px 0}
  .cfs3 .rit-grid{gap:10px}
  .cfs3 .rit-card{display:grid;grid-template-columns:112px 1fr;grid-template-rows:auto auto auto;column-gap:14px;align-items:start;padding:0 12px 0 0}
  .cfs3 .rit-fig{grid-row:1/4;aspect-ratio:auto;height:100%;min-height:132px}
  .cfs3 .rit-step{margin:12px 0 0}
  .cfs3 .rit-card h4{margin:2px 0 4px;font-size:19px}
  .cfs3 .rit-card p{margin:0 0 12px;font-size:12px}
  .cfs3 .mech{padding:52px 0}
  .cfs3 .mech .wrap{gap:20px}
  .cfs3 .mech-fig{aspect-ratio:4/3}
  .cfs3 .mech p{font-size:14px}
  .cfs3 .close{padding:52px 0}
  .cfs3 .close .wrap{gap:20px}
  .cfs3 .close-fig{aspect-ratio:4/3}
  .cfs3 .close p{font-size:14px}
  .cfs3 .three{margin:18px 0 22px;gap:10px}
  .cfs3 .cta-line{padding:36px 0}
}
