/* Kortex landing, lower sections. Everything is scoped under .kl */
@font-face{font-family:Geist;src:url(../assets/fonts/Geist-Variable.woff2) format('woff2');font-weight:100 900;font-display:swap}
@font-face{font-family:'Geist Mono';src:url(../assets/fonts/GeistMono-Variable.woff2) format('woff2');font-weight:100 900;font-display:swap}

.kl{
  --bg:#06101c;--raise:#0a1828;--card:#0e2033;--line:#17324a;--line2:#1f4060;
  --ink:#eaf6fb;--dim:#8fb0c4;--muted:#62839a;--cy:#35C9E8;--hot:#6fe3ff;--deep:#0b86a6;
  --you:#f1f7fa;
  --k-short:#35C9E8;--k-clip:#8c9cff;--k-product:#f2b766;--k-audio:#45dfa6;
  --gut:20px;--sec:96px;
  --ease:cubic-bezier(.16,1,.3,1);
  --mono:'Geist Mono',ui-monospace,Menlo,Consolas,monospace;
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .05 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  position:relative;background:var(--bg);color:var(--ink);
  font-family:Geist,system-ui,sans-serif;font-variant-numeric:tabular-nums;font-kerning:normal;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:clip;line-height:1.5
}
.kl *,.kl *::before,.kl *::after{box-sizing:border-box}
:where(.kl) :where(p,ul,ol,li,figure,figcaption,h2,h3,dl,dt,dd){margin:0;padding:0}
:where(.kl) :where(ul,ol){list-style:none}
:where(.kl) :where(a){color:inherit;text-decoration:none}
:where(.kl) :where(img){display:block;max-width:100%;height:auto}
:where(.kl) :where(p){text-wrap:pretty}
.kl-nw{white-space:nowrap}
.kl-defs{position:absolute;width:0;height:0;overflow:hidden}
.kl :focus-visible{outline:2px solid var(--hot);outline-offset:3px;border-radius:6px}

.kl-wrap{position:relative;max-width:1200px;margin:0 auto;padding:0 var(--gut)}
.kl-sec{position:relative;padding:var(--sec) 0}

/* infinite loops only run while their section is on screen */
.kl-sec:not(.kl-live) .kl-loop,.kl-strip:not(.kl-live) .kl-loop,
.kl-sec:not(.kl-live) .kl-loop::before,.kl-sec:not(.kl-live) .kl-loop::after{animation-play-state:paused !important}

/* ---------- the motif: a timeline track with frame ticks ---------- */
.kl-ruler,.kl-track-rule{
  --tc:rgba(234,246,251,.26);--tc2:rgba(234,246,251,.12);
  display:block;height:12px;width:100%;
  background:
    linear-gradient(var(--tc),var(--tc)) left bottom/100% 1px no-repeat,
    repeating-linear-gradient(90deg,var(--tc) 0 1px,transparent 1px 48px) left bottom/100% 11px no-repeat,
    repeating-linear-gradient(90deg,var(--tc2) 0 1px,transparent 1px 6px) left bottom/100% 5px no-repeat}
.kl-playhead{position:absolute;top:0;bottom:0;left:0;width:2px;margin-left:-1px;background:var(--hot);z-index:3;pointer-events:none;
  box-shadow:0 0 10px rgba(111,227,255,.9),0 0 24px rgba(53,201,232,.45)}
.kl-playhead::before{content:'';position:absolute;left:50%;top:-2px;width:11px;height:12px;margin-left:-5.5px;background:var(--hot);
  clip-path:polygon(0 0,100% 0,100% 55%,50% 100%,0 55%);border-radius:1px}

/* section divider: the playhead scrubs in and the timecode counts up */
.kl-div{max-width:1200px;margin:0 auto;padding:0 var(--gut)}
.kl-div i{position:relative;display:block;height:22px;
  -webkit-mask:linear-gradient(90deg,#000 0,#000 70%,transparent);mask:linear-gradient(90deg,#000 0,#000 70%,transparent)}
.kl-div i::before{content:attr(data-tc);position:absolute;left:182px;bottom:-1px;font:500 10.5px/1 var(--mono);letter-spacing:.14em;color:var(--hot);transition:opacity .6s ease .5s}
.kl-div i::after{content:'';position:absolute;left:0;bottom:0;height:22px;width:170px;
  border-right:2px solid var(--hot);
  background:
    linear-gradient(90deg,rgba(53,201,232,.15),var(--cy)) left bottom/100% 1.5px no-repeat,
    repeating-linear-gradient(90deg,var(--cy) 0 1.5px,transparent 1.5px 48px) left bottom/100% 12px no-repeat,
    repeating-linear-gradient(90deg,rgba(53,201,232,.55) 0 1px,transparent 1px 6px) left bottom/100% 6px no-repeat;
  filter:drop-shadow(0 0 6px rgba(53,201,232,.5));transition:width 1.5s var(--ease)}
.kl-div{position:relative}
.kl-div::before{content:'';position:absolute;left:var(--gut);right:var(--gut);bottom:0;height:12px;
  background:
    linear-gradient(rgba(234,246,251,.16),rgba(234,246,251,.16)) left bottom/100% 1px no-repeat,
    repeating-linear-gradient(90deg,rgba(234,246,251,.16) 0 1px,transparent 1px 48px) left bottom/100% 11px no-repeat,
    repeating-linear-gradient(90deg,rgba(234,246,251,.08) 0 1px,transparent 1px 6px) left bottom/100% 5px no-repeat;
  -webkit-mask:linear-gradient(90deg,#000 0,#000 60%,transparent);mask:linear-gradient(90deg,#000 0,#000 60%,transparent)}
.kl.kl-ready .kl-div:not(.in) i::after{width:0}
.kl.kl-ready .kl-div:not(.in) i::before{opacity:0}

/* ---------- type ---------- */
.kl-eyebrow{display:flex;align-items:center;flex-wrap:wrap;gap:10px 12px;font:500 11.5px/1.2 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--cy);margin-bottom:20px}
.kl-tc{display:inline-flex;align-items:center;height:22px;padding:0 7px;border-radius:5px;font-size:10.5px;letter-spacing:.08em;color:var(--dim);
  background:rgba(53,201,232,.05);box-shadow:inset 0 0 0 1px var(--line2)}
.kl .kl-h{font-family:Geist,system-ui,sans-serif;font-weight:800;font-size:clamp(33px,9vw,44px);line-height:1.02;letter-spacing:-.042em;color:var(--ink);margin:0 0 22px;text-wrap:balance}
.kl .kl-h em{font-style:normal;color:var(--cy);background:linear-gradient(180deg,#8ceaff,#35C9E8 80%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.kl h3{font-family:Geist,sans-serif;font-weight:650;font-size:17px;line-height:1.3;letter-spacing:-.015em}
.kl-lede{font-size:16px;line-height:1.66;color:var(--dim);max-width:54ch}
.kl-lede + .kl-lede{margin-top:16px}
.kl-fine{font-size:13px;line-height:1.6;color:var(--muted);margin-top:18px;max-width:70ch}
.kl-split-top{display:grid;gap:4px;align-items:end}

/* heading lines, split by JS, rise from a mask */
.kl-h .kl-ln{display:block;overflow:hidden;padding-bottom:.12em;margin-bottom:-.12em}
.kl-h .kl-ln>span{display:block;transition:transform 1.1s var(--ease),opacity .8s ease}
.kl-h .kl-ln:nth-child(2)>span{transition-delay:.12s}
.kl.kl-ready .kl-h:not(.in) .kl-ln>span{transform:translateY(105%);opacity:0}

/* generic block entrance (fade and lift, no wipes) */
.kl [data-rv]{transition:opacity .9s ease,transform 1.1s var(--ease)}
.kl.kl-ready [data-rv]:not(.in){opacity:0;transform:translateY(20px)}

/* shared bits */
.kl-dot{display:inline-block;width:8px;height:8px;border-radius:2px;flex:none;background:var(--cy);box-shadow:0 0 8px rgba(53,201,232,.7)}
.kl-dot.you{background:transparent;box-shadow:inset 0 0 0 1.5px var(--you)}
.kl-nle-rec{width:7px;height:7px;border-radius:50%;background:#ff5a5a;box-shadow:0 0 8px rgba(255,90,90,.8);flex:none}
.kl-ex{position:absolute;z-index:4;left:10px;top:10px;padding:4px 7px;border-radius:5px;font:600 9.5px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;
  color:#04121d;background:rgba(234,246,251,.92)}
.kl-ex-inline{position:static;display:inline-block;vertical-align:.15em;margin-left:8px}
.kl-panel{position:relative;isolation:isolate}

/* ---------- buttons ---------- */
.kl .btn{position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:14px 24px;border-radius:12px;
  background:linear-gradient(180deg,#86ebff,#35C9E8);color:#04121d;font-family:Geist,sans-serif;font-weight:650;font-size:15.5px;line-height:1.2;text-align:center;letter-spacing:-.005em;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),inset 0 -1px 0 rgba(0,60,90,.3),0 10px 30px -12px rgba(53,201,232,.7);transition:transform .25s,box-shadow .25s}
.kl .btn .kl-arrow{width:14px;height:12px;flex:none}
.kl .kl-out-i{width:12px;height:12px;flex:none;opacity:.8}
.kl .btn:active{transform:translateY(1px) scale(.99)}
@media (hover:hover){.kl .btn:hover{transform:translateY(-2px)}}

/* tick bullets: a tiny clip on a track */
.kl-ticklist li{position:relative;padding-left:32px}
.kl-ticklist li::before{content:'';position:absolute;left:0;top:.42em;width:20px;height:9px;border-radius:2px;
  background:linear-gradient(90deg,var(--cy) 0 60%,transparent 60%),rgba(53,201,232,.12);box-shadow:inset 0 0 0 1px rgba(53,201,232,.6)}
.kl-ticklist li::after{content:'';position:absolute;left:12px;top:calc(.42em - 3px);width:1.5px;height:15px;background:var(--hot);box-shadow:0 0 6px var(--hot)}

.kl-meta{display:grid;grid-template-columns:1fr 1fr;gap:1px;margin-top:14px;border-radius:14px;overflow:hidden;background:var(--line)}
.kl-meta>div{padding:14px 14px 13px;background:var(--raise)}
.kl-meta dt{font:500 10px/1.2 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:7px}
.kl-meta dd{font-size:14px;line-height:1.35;color:var(--ink)}

/* =========================================================
   1. THE LINE: eight stages on a sequence, a playhead reading them
   ========================================================= */
.kl-nle{margin-top:40px;border-radius:20px;padding:14px 14px 18px;isolation:isolate;
  background:var(--grain),radial-gradient(90% 60% at 20% 0,rgba(53,201,232,.08),transparent 70%),linear-gradient(180deg,#0b1a2b,#081421);
  box-shadow:inset 0 0 0 1px var(--line),inset 0 1px 0 rgba(255,255,255,.05),0 50px 90px -50px rgba(0,0,0,.9)}
.kl-nle-bar{display:flex;align-items:center;gap:10px;padding:2px 4px 12px;font:500 10.5px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.kl-nle-tc{margin-left:auto;color:var(--hot);letter-spacing:.06em;font-size:12px}
.kl-nle-ribbon{position:relative;padding:0 2px;margin-bottom:16px}
.kl-nle-clips{display:flex;gap:3px;margin-top:6px}
.kl-nle-clips i{flex:1;height:30px;border-radius:5px;position:relative;
  background:linear-gradient(180deg,rgba(53,201,232,.34),rgba(53,201,232,.16));box-shadow:inset 0 0 0 1px rgba(53,201,232,.5),inset 0 1px 0 rgba(255,255,255,.12);
  transition:background .35s,box-shadow .35s}
.kl-nle-clips i.h{background:repeating-linear-gradient(135deg,rgba(241,247,250,.2) 0 3px,rgba(241,247,250,.05) 3px 7px);box-shadow:inset 0 0 0 1px rgba(241,247,250,.55)}
.kl-nle-clips i.on{background:linear-gradient(180deg,#8ceaff,#35C9E8);box-shadow:0 0 18px rgba(53,201,232,.6)}
.kl-nle-clips i.h.on{background:var(--you);box-shadow:0 0 18px rgba(241,247,250,.45)}
.kl-nle-ribbon .kl-playhead{top:-4px;bottom:-4px}
.kl-stages{display:grid;gap:8px}
.kl-stage{position:relative;display:grid;grid-template-columns:34px 1fr;column-gap:10px;padding:14px 14px 14px 12px;border-radius:12px;
  background:rgba(10,24,40,.7);box-shadow:inset 0 0 0 1px var(--line);transition:background .4s,box-shadow .4s}
.kl-stage>*{grid-column:2}
.kl-stage-n{grid-column:1;grid-row:1 / span 3;font:500 11px/1.9 var(--mono);color:var(--muted);letter-spacing:.06em}
.kl-stage h3{font-size:16px}
.kl-stage p{margin-top:4px;font-size:14px;line-height:1.55;color:var(--dim)}
.kl-stage-e{display:inline-flex;align-items:center;gap:8px;margin-top:10px;font:500 11px/1 var(--mono);letter-spacing:.06em;color:var(--dim)}
.kl-stage.is-you{box-shadow:inset 0 0 0 1px rgba(241,247,250,.2);background:repeating-linear-gradient(135deg,rgba(241,247,250,.025) 0 4px,transparent 4px 10px),rgba(10,24,40,.7)}
.kl-stage.on{background:linear-gradient(90deg,rgba(53,201,232,.14),rgba(53,201,232,.03) 70%);box-shadow:inset 0 0 0 1px rgba(53,201,232,.55),0 14px 40px -24px rgba(53,201,232,.7)}
.kl-stage.on .kl-stage-n{color:var(--hot)}
.kl-stage.is-you.on{background:linear-gradient(90deg,rgba(241,247,250,.1),rgba(241,247,250,.02) 70%);box-shadow:inset 0 0 0 1px rgba(241,247,250,.6)}
.kl-stage.is-you.on .kl-stage-n{color:var(--you)}
.kl-legend{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:16px;padding:0 4px;font:500 11px/1 var(--mono);letter-spacing:.08em;color:var(--muted)}
.kl-legend span{display:inline-flex;align-items:center;gap:9px}

/* =========================================================
   2. PROOF: counters that roll like a timecode
   ========================================================= */
.kl-proof-sec{padding-top:0}
.kl-proof{position:relative;border-radius:22px;padding:26px 18px 20px;isolation:isolate;overflow:hidden;
  background:var(--grain),radial-gradient(70% 70% at 100% 0,rgba(53,201,232,.12),transparent 65%),linear-gradient(180deg,#0c1d30,#09172a);
  box-shadow:inset 0 0 0 1px rgba(53,201,232,.22),inset 0 1px 0 rgba(160,235,255,.12),0 60px 110px -60px rgba(53,201,232,.45)}
.kl-livedot{width:8px;height:8px;border-radius:50%;background:var(--cy);box-shadow:0 0 0 4px rgba(53,201,232,.18);animation:kl-pulse 2s ease-in-out infinite}
@keyframes kl-pulse{50%{box-shadow:0 0 0 7px rgba(53,201,232,.05)}}
.kl .kl-h-sm{font-size:clamp(28px,7.6vw,36px);margin-bottom:6px}
.kl-stats{display:grid;grid-template-columns:1fr 1fr;gap:26px 16px;margin-top:28px}
.kl-stats li{position:relative;display:flex;flex-direction:column;padding-bottom:14px}
.kl-stat{font-weight:800;font-size:46px;line-height:1;letter-spacing:-.045em;color:var(--ink);font-variant-numeric:tabular-nums;text-shadow:0 0 30px rgba(53,201,232,.25)}
.kl-stat-l{margin-top:10px;font-size:14px;font-weight:600;color:var(--ink);line-height:1.3}
.kl-stat-s{margin-top:3px;font:500 11px/1.4 var(--mono);letter-spacing:.04em;color:var(--muted)}
.kl-stat-t{position:absolute;left:0;right:0;bottom:0;height:6px;
  background:linear-gradient(rgba(234,246,251,.18),rgba(234,246,251,.18)) left bottom/100% 1px no-repeat,repeating-linear-gradient(90deg,rgba(234,246,251,.18) 0 1px,transparent 1px 6px) left bottom/100% 5px no-repeat}
.kl-stat-t::after{content:'';position:absolute;inset:0;transform-origin:left;transform:scaleX(var(--f,1));
  background:linear-gradient(var(--cy),var(--cy)) left bottom/100% 1.5px no-repeat,repeating-linear-gradient(90deg,var(--cy) 0 1px,transparent 1px 6px) left bottom/100% 5px no-repeat;filter:drop-shadow(0 0 4px rgba(53,201,232,.7))}
.kl-proof-foot{margin-top:24px;padding-top:16px;border-top:1px solid var(--line);font-size:13px;line-height:1.6;color:var(--muted);max-width:70ch}

/* =========================================================
   3. THE WEEK: two tracks, one crowded with you
   ========================================================= */
.kl-ways{display:grid;gap:14px;margin-top:40px;align-items:stretch}
.kl-way{position:relative;border-radius:18px;padding:22px 18px 18px;isolation:isolate;overflow:hidden}
.kl-way-hand{background:linear-gradient(180deg,#0a1522,#08121d);box-shadow:inset 0 0 0 1px #142638;color:var(--dim)}
.kl-way-kx{background:var(--grain),radial-gradient(110% 70% at 100% 0,rgba(53,201,232,.16),transparent 60%),linear-gradient(180deg,#0d2136,#0a1a2c);
  box-shadow:inset 0 0 0 1px rgba(53,201,232,.35),inset 0 1px 0 rgba(160,235,255,.16),0 40px 90px -45px rgba(53,201,232,.55)}
.kl-glow{position:absolute;right:-40%;top:-60%;width:120%;height:140%;z-index:-1;pointer-events:none;background:radial-gradient(closest-side,rgba(53,201,232,.22),transparent);transition:opacity 1.6s ease,transform 1.8s var(--ease)}
.kl.kl-ready .kl-way-kx:not(.in) .kl-glow{opacity:0;transform:translate(25%,-20%)}
.kl-way-tag{font:500 11px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.kl-way-kx .kl-way-tag{color:var(--cy)}
.kl-way-h{margin-top:10px;font-weight:750;font-size:22px;letter-spacing:-.03em;line-height:1.15;color:var(--ink)}
.kl-way-hand .kl-way-h{color:#b9cfdc}
.kl-way-track{display:flex;gap:3px;margin:18px 0 6px;padding-top:12px;position:relative;
  background:linear-gradient(rgba(234,246,251,.16),rgba(234,246,251,.16)) left top/100% 1px no-repeat,repeating-linear-gradient(90deg,rgba(234,246,251,.16) 0 1px,transparent 1px 6px) left top/100% 5px no-repeat}
.kl-way-track i{flex:1;height:14px;border-radius:3px;transition:transform .6s var(--ease),opacity .6s ease}
.kl-way-hand .kl-way-track i{background:repeating-linear-gradient(135deg,rgba(185,207,220,.28) 0 3px,rgba(185,207,220,.1) 3px 7px);box-shadow:inset 0 0 0 1px rgba(185,207,220,.35)}
.kl-way-kx .kl-way-track i{background:linear-gradient(180deg,#7de7ff,#35C9E8);box-shadow:0 0 12px rgba(53,201,232,.45)}
.kl-way-kx .kl-way-track i.y{background:var(--you);box-shadow:none;flex:.35}
.kl-way-track i{transition-delay:calc(.3s + var(--n,0) * .09s)}
.kl.kl-ready .kl-way:not(.in) .kl-way-track i{transform:scaleX(0);opacity:0}
.kl-way-track i:nth-child(1){--n:0}.kl-way-track i:nth-child(2){--n:1}.kl-way-track i:nth-child(3){--n:2}.kl-way-track i:nth-child(4){--n:3}.kl-way-track i:nth-child(5){--n:4}.kl-way-track i:nth-child(6){--n:5}
.kl-way-list li{display:grid;grid-template-columns:62px 1fr;gap:12px;align-items:baseline;padding:12px 0;border-bottom:1px solid rgba(23,50,74,.8);font-size:15px;line-height:1.45}
.kl-way-list li:last-child{border-bottom:0}
.kl-way-list b{font:500 11px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--you)}
.kl-way-hand .kl-way-list b{color:#b9cfdc}
.kl-way-hand .kl-way-list span{color:#93aabb}
.kl-way-kx .kl-way-list span{color:var(--ink)}
.kl-way-kx .kl-way-list li.auto b{color:var(--cy);display:inline-flex;align-items:center;gap:6px}
.kl-way-kx .kl-way-list li.auto b::before{content:'';width:6px;height:6px;border-radius:1.5px;background:var(--cy);box-shadow:0 0 6px var(--cy)}
.kl-way-kx .kl-way-list li.auto span{color:var(--dim)}
.kl-way-list li{transition:opacity .7s ease,transform .9s var(--ease);transition-delay:calc(.35s + var(--i) * .08s)}
.kl.kl-ready .kl-way:not(.in) .kl-way-list li{opacity:0;transform:translateY(8px)}
.kl-way-foot{margin-top:12px;padding-top:12px;border-top:1px solid var(--line);font:500 11px/1.4 var(--mono);letter-spacing:.08em;color:var(--muted)}
.kl-way-foot span{color:var(--you)}
.kl-way-foot span.c{color:var(--cy)}

/* =========================================================
   4. CAPTIONS: the line, on its timestamps
   ========================================================= */
.kl-cap{margin-top:40px}
.kl-cap-screen{position:relative;border-radius:20px;overflow:hidden;isolation:isolate;padding:14px 14px 16px;
  background:var(--grain),radial-gradient(80% 60% at 50% 30%,rgba(53,201,232,.1),transparent 70%),linear-gradient(180deg,#07121f,#050d17);
  box-shadow:inset 0 0 0 1px var(--line),inset 0 1px 0 rgba(255,255,255,.05),0 50px 100px -50px rgba(0,0,0,.95)}
.kl-cap-top{display:flex;align-items:center;gap:10px;font:500 10.5px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.kl-cap-clock{margin-left:auto;color:var(--hot);letter-spacing:.04em;font-size:12px}
.kl-cap-words{min-height:5.2em;padding:28px 6px 26px;font-weight:750;font-size:25px;line-height:1.28;letter-spacing:-.025em;color:rgba(234,246,251,.2)}
.kl-cap-words span{display:inline;padding:0 .1em;margin:0 -.1em;border-radius:5px;transition:color .12s,background-color .12s,box-shadow .12s}
.kl-cap-words span.said{color:rgba(234,246,251,.82)}
.kl-cap-words span.now{color:#04121d;background:var(--hot);box-shadow:0 0 22px rgba(111,227,255,.55)}
.kl:not(.kl-ready) .kl-cap-words span{color:var(--ink)}
.kl-cap-tracks{position:relative;display:grid;gap:5px;padding-top:10px;border-top:1px solid var(--line)}
.kl-cap-row{display:grid;grid-template-columns:34px 1fr;align-items:center;gap:8px}
.kl-cap-lab{font:500 9.5px/1 var(--mono);letter-spacing:.1em;color:var(--muted)}
.kl-cap-lane{position:relative;height:22px;border-radius:4px;background:rgba(10,24,40,.9);box-shadow:inset 0 0 0 1px rgba(23,50,74,.9);overflow:hidden}
.kl-cap-lane b{position:absolute;top:3px;bottom:3px;border-radius:3px;background:rgba(53,201,232,.2);box-shadow:inset 0 0 0 1px rgba(53,201,232,.4);transition:background .12s}
.kl-cap-lane b.said{background:rgba(53,201,232,.5)}
.kl-cap-lane b.now{background:var(--hot)}
.kl-wave{display:flex;align-items:center;gap:2px;padding:0 3px}
.kl-wave i{flex:1;height:3px;border-radius:1px;background:rgba(143,176,196,.45);transition:height 90ms linear}
.kl-wave i.v{background:var(--cy)}
.kl-bed{position:absolute;left:0;right:0;top:50%;height:12px;margin-top:-6px;border-radius:2px;
  background:repeating-linear-gradient(90deg,rgba(69,223,166,.5) 0 2px,rgba(69,223,166,.18) 2px 5px);transition:transform .25s var(--ease)}
.kl-bed.duck{transform:scaleY(.36)}
.kl-cap-ph{left:42px}
.kl-cap .kl-meta{grid-template-columns:1fr 1fr}

/* =========================================================
   5. OUTPUT: the phone, with the safe zones it renders inside
   ========================================================= */
.kl-out{display:grid;gap:44px;align-items:center}
.kl-out-h3{font-weight:700;font-size:21px;letter-spacing:-.025em;color:var(--ink);margin:6px 0 12px}
.kl-reels{display:flex;gap:8px;margin-top:24px}
.kl-reel-b{position:relative;display:inline-flex;flex-direction:column;justify-content:center;gap:7px;min-width:64px;min-height:48px;padding:8px 12px;border:0;border-radius:10px;cursor:pointer;
  font:500 12px/1 var(--mono);letter-spacing:.08em;color:var(--dim);background:var(--raise);box-shadow:inset 0 0 0 1px var(--line);text-align:left;transition:color .3s,box-shadow .3s,background .3s}
.kl-reel-b i{display:block;height:3px;border-radius:2px;background:rgba(234,246,251,.1);overflow:hidden;position:relative}
.kl-reel-b i::after{content:'';position:absolute;inset:0;background:var(--cy);transform-origin:left;transform:scaleX(var(--rp,0))}
.kl-reel-b[aria-pressed="true"]{color:var(--hot);background:rgba(53,201,232,.1);box-shadow:inset 0 0 0 1px rgba(53,201,232,.55)}
.kl-meta-out{margin-top:24px;grid-template-columns:1fr}
.kl-meta-out>div{display:grid;grid-template-columns:120px 1fr;align-items:baseline;gap:10px}
.kl-meta-out dt{margin:0}
.kl-phone-fig{position:relative;display:flex;flex-direction:column;align-items:center}
.kl-phone-fig::before{content:'';position:absolute;left:50%;top:44%;width:520px;height:520px;margin:-260px 0 0 -260px;border-radius:50%;z-index:0;pointer-events:none;
  background:radial-gradient(closest-side,rgba(53,201,232,.22),transparent)}
.kl-phone{position:relative;z-index:1;width:min(76vw,272px);padding:9px;border-radius:40px;
  background:linear-gradient(160deg,#233a50,#0c1826 45%,#18293b);box-shadow:inset 0 0 0 1px rgba(160,220,255,.22),0 0 0 1px #050b13,0 50px 90px -30px rgba(0,0,0,.95),0 30px 80px -40px rgba(53,201,232,.5)}
.kl-phone-screen{position:relative;aspect-ratio:9/16;border-radius:32px;overflow:hidden;
  background:linear-gradient(180deg,#0d2238,#07121f);box-shadow:inset 0 0 0 1px rgba(0,0,0,.6)}
.kl-phone-screen::before{content:'Example short';position:absolute;inset:0;display:grid;place-items:center;font:500 11px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.kl-phone-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.03);transition:opacity .6s ease,transform 1.2s var(--ease)}
.kl-phone-img.on{opacity:1;transform:none}
.kl-phone-img.miss{display:none}
.kl-safe{position:absolute;left:5%;right:5%;z-index:3;border:1px dashed rgba(111,227,255,.45);border-radius:6px;pointer-events:none;
  background:rgba(111,227,255,.04);transition:opacity .8s ease .5s,transform 1s var(--ease) .5s}
.kl-safe b{position:absolute;left:6px;font:600 7.5px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--hot);background:rgba(4,18,29,.75);padding:3px 5px;border-radius:3px}
.kl-safe-t{top:3%;height:6.5%}
.kl-safe-t b{bottom:-1px;transform:translateY(100%)}
.kl-safe-b{bottom:4%;height:14%}
.kl-safe-b b{top:-1px;transform:translateY(-100%)}
.kl.kl-ready .kl-phone-fig:not(.in) .kl-safe{opacity:0;transform:scale(.94)}
.kl-scrub{position:relative;z-index:1;display:flex;align-items:center;gap:10px;width:min(76vw,272px);margin-top:18px;font:500 10px/1 var(--mono);letter-spacing:.06em;color:var(--dim)}
.kl-scrub-bar{position:relative;flex:1;height:12px;
  background:linear-gradient(rgba(234,246,251,.22),rgba(234,246,251,.22)) left bottom/100% 1px no-repeat,repeating-linear-gradient(90deg,rgba(234,246,251,.2) 0 1px,transparent 1px 6px) left bottom/100% 5px no-repeat}
.kl-scrub-bar i{position:absolute;left:0;bottom:0;height:5px;width:100%;transform-origin:left;transform:scaleX(var(--sp,0));background:linear-gradient(var(--hot),var(--hot)) left bottom/100% 1.5px no-repeat,repeating-linear-gradient(90deg,var(--cy) 0 1px,transparent 1px 6px) left bottom/100% 5px no-repeat;filter:drop-shadow(0 0 4px rgba(53,201,232,.8))}
.kl-scrub-tc:first-child{color:var(--hot)}
.kl-phone-fig figcaption{position:relative;z-index:1;margin-top:18px;font-size:13px;color:var(--muted);text-align:center;max-width:36ch}

/* =========================================================
   6. B-ROLL: a contact sheet read by meaning
   ========================================================= */
.kl-match{margin-top:40px}
.kl-match-line{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.kl-match-line span{display:inline-flex;align-items:center;min-height:34px;padding:0 13px;border-radius:999px;font-size:14px;color:var(--muted);background:var(--raise);box-shadow:inset 0 0 0 1px var(--line);transition:color .35s,background .35s,box-shadow .35s}
.kl-match-line span.on{color:var(--ink);background:rgba(53,201,232,.12);box-shadow:inset 0 0 0 1px rgba(53,201,232,.6),0 8px 24px -12px rgba(53,201,232,.8)}
.kl-match-line span.none{font-style:normal;box-shadow:inset 0 0 0 1px var(--line2);background:transparent;border:0;outline:1px dashed rgba(143,176,196,.35);outline-offset:-1px}
.kl-match-line span.none.on{color:var(--ink);outline-color:rgba(234,246,251,.6);background:rgba(234,246,251,.05);box-shadow:none}
.kl-sheet{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:4px;padding:6px;border-radius:14px;background:#040b14;box-shadow:inset 0 0 0 1px var(--line);overflow:hidden}
.kl-sheet::after{content:'';position:absolute;top:0;bottom:0;left:0;width:2px;z-index:3;background:var(--hot);box-shadow:0 0 14px var(--hot),0 0 40px rgba(53,201,232,.6);opacity:0;pointer-events:none}
.kl-sheet.scan::after{animation:kl-scan .9s var(--ease) both}
@keyframes kl-scan{0%{left:0;opacity:0}12%{opacity:1}88%{opacity:1}100%{left:100%;opacity:0}}
.kl-cell{position:relative;aspect-ratio:16/9;border-radius:4px;overflow:hidden;background-color:#0b1a2a;background-repeat:no-repeat;background-size:600% 600%;
  transition:opacity .45s ease,filter .45s ease,box-shadow .35s,transform .45s var(--ease)}
.kl-cell:nth-child(n+25){display:none}
.kl-sheet.dim .kl-cell{opacity:.26;filter:saturate(.3)}
.kl-sheet.dim .kl-cell.hit{opacity:1;filter:none;box-shadow:0 0 0 2px var(--hot),0 0 20px rgba(111,227,255,.55);z-index:2;transform:scale(1.04)}
.kl-sheet.void .kl-cell{opacity:.16;filter:saturate(0)}
.kl-slot-row{display:grid;grid-template-columns:auto auto 1fr;align-items:center;gap:12px;margin-top:16px}
.kl-slot-lab{font:500 10.5px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.kl-slot{position:relative;width:96px;aspect-ratio:16/9;border-radius:6px;overflow:hidden;background:#0b1a2a;box-shadow:inset 0 0 0 1px rgba(53,201,232,.5)}
.kl-slot-thumb{position:absolute;inset:0;background-repeat:no-repeat;background-size:600% 600%;transition:opacity .4s}
.kl-slot-empty{position:absolute;inset:0;display:grid;place-items:center;font:500 9px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--dim);opacity:0;transition:opacity .4s}
.kl-slot.empty{background:transparent;box-shadow:none;outline:1px dashed rgba(234,246,251,.45);outline-offset:-1px}
.kl-slot.empty .kl-slot-thumb{opacity:0}
.kl-slot.empty .kl-slot-empty{opacity:1}
.kl-slot-note{font-size:13.5px;line-height:1.45;color:var(--dim);min-width:0}
.kl-match .kl-fine{margin-top:14px}

/* =========================================================
   7. DISTRIBUTION: one master, five lanes
   ========================================================= */
.kl-fan{display:grid;gap:14px;margin-top:40px;border-radius:20px;padding:16px;isolation:isolate;
  background:var(--grain),radial-gradient(70% 90% at 0 50%,rgba(53,201,232,.1),transparent 70%),linear-gradient(180deg,#0b1a2b,#081421);
  box-shadow:inset 0 0 0 1px var(--line),inset 0 1px 0 rgba(255,255,255,.05),0 50px 90px -50px rgba(0,0,0,.9)}
.kl-fan-src{display:flex;align-items:center;gap:14px;padding:4px 4px 14px;border-bottom:1px solid var(--line)}
.kl-fan-thumb{position:relative;width:46px;aspect-ratio:9/16;border-radius:7px;overflow:hidden;flex:none;background:linear-gradient(180deg,#123452,#0a1c2e);box-shadow:0 0 0 1px rgba(53,201,232,.6),0 0 24px rgba(53,201,232,.35)}
.kl-fan-thumb img{width:100%;height:100%;object-fit:cover}
.kl-fan-src-l{font:500 13px/1.35 var(--mono);color:var(--ink)}
.kl-fan-src-l small{font-size:11px;color:var(--muted);letter-spacing:.04em}
.kl-fan-rows{display:grid;gap:4px}
.kl-fan-rows li{display:grid;grid-template-columns:22px 78px 1fr 62px;align-items:center;gap:10px;min-height:48px;padding:0 4px;border-radius:10px;transition:background .4s}
.kl-pm{width:20px;height:20px;color:var(--dim);transition:color .4s}
.kl-fan-n{font-size:14.5px;font-weight:550;color:var(--ink)}
.kl-fan-lane{position:relative;height:12px;
  background:linear-gradient(rgba(234,246,251,.2),rgba(234,246,251,.2)) left 50%/100% 1px no-repeat,repeating-linear-gradient(90deg,rgba(234,246,251,.16) 0 1px,transparent 1px 8px) left 50%/100% 7px no-repeat}
.kl-fan-lane::after{content:'';position:absolute;left:0;top:50%;height:2px;margin-top:-1px;width:100%;background:linear-gradient(90deg,rgba(53,201,232,.2),var(--cy));transform-origin:left;transform:scaleX(0);transition:transform .6s var(--ease)}
.kl-fan-lane i{position:absolute;left:0;top:50%;width:9px;height:14px;margin:-7px 0 0 -4px;border-radius:2px;background:var(--hot);box-shadow:0 0 12px var(--hot);opacity:0}
.kl-fan-s{justify-self:end;font:500 10.5px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);transition:color .3s}
.kl-fan-rows li.go .kl-fan-lane i{animation:kl-go .6s var(--ease) forwards}
@keyframes kl-go{0%{left:0;opacity:0}15%{opacity:1}85%{opacity:1}100%{left:100%;opacity:0}}
.kl-fan-rows li.sent{background:rgba(53,201,232,.06)}
.kl-fan-rows li.sent .kl-fan-lane::after{transform:scaleX(1)}
.kl-fan-rows li.sent .kl-fan-s{color:var(--hot)}
.kl-fan-rows li.sent .kl-pm{color:var(--ink)}

/* =========================================================
   8. THE QUEUE: a fortnight filling up
   ========================================================= */
.kl-cal-sec{padding-top:24px}
.kl-cal{margin-top:36px;border-radius:20px;padding:16px 12px 16px;isolation:isolate;
  background:var(--grain),linear-gradient(180deg,#0b1a2b,#081421);box-shadow:inset 0 0 0 1px var(--line),inset 0 1px 0 rgba(255,255,255,.05)}
.kl-sched{position:relative;display:grid;grid-template-columns:34px 1fr;height:230px;padding-bottom:20px}
.kl-sched-hours{position:relative}
.kl-sched-hours span{position:absolute;left:0;transform:translateY(-50%);font:500 8.5px/1 var(--mono);color:var(--muted);letter-spacing:.02em}
.kl-sched-grid{position:relative;display:grid;grid-template-columns:repeat(21,1fr);
  background:repeating-linear-gradient(180deg,transparent 0 calc(25% - 1px),rgba(23,50,74,.6) calc(25% - 1px) 25%)}
.kl-sched-day{position:relative;border-left:1px solid rgba(23,50,74,.55)}
.kl-sched-day:nth-child(7n+1){border-left-color:rgba(53,201,232,.3)}
.kl-sched-day.wk{background:rgba(234,246,251,.015)}
.kl-sched-dl{position:absolute;left:0;right:0;bottom:-18px;text-align:center;font:500 8.5px/1 var(--mono);color:var(--muted)}
.kl-chip{position:absolute;left:1.5px;right:1.5px;height:8px;margin-top:-4px;border-radius:2px;background:var(--k);box-shadow:0 0 8px color-mix(in srgb,var(--k) 60%,transparent);
  transform:scale(.2);opacity:0;transition:transform .45s cubic-bezier(.3,1.5,.5,1),opacity .3s,box-shadow .3s}
.kl-chip.in{transform:none;opacity:1}
.kl-chip.spot{box-shadow:0 0 0 2px var(--bg),0 0 0 3.5px var(--you),0 0 18px var(--k);z-index:2}
.kl-chip.short{--k:var(--k-short)}.kl-chip.clip{--k:var(--k-clip)}.kl-chip.product{--k:var(--k-product)}.kl-chip.audio{--k:var(--k-audio)}
.kl:not(.kl-ready) .kl-chip{transform:none;opacity:1}
.kl-sched-ph{top:-6px;bottom:14px;transition:left .7s var(--ease),opacity .4s;opacity:0}
.kl-sched-ph.on{opacity:1}
.kl-narrate{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px;min-height:52px;margin-top:12px;padding:10px 12px;border-radius:10px;background:rgba(4,11,20,.6);box-shadow:inset 0 0 0 1px var(--line);font-size:13.5px;line-height:1.4;color:var(--dim)}
.kl-narrate b{font-weight:650;color:var(--ink)}
.kl-narrate-t{font:500 12px/1 var(--mono);color:var(--hot)}
.kl-narrate-idle{color:var(--dim)}
.kl-sw{display:inline-block;width:10px;height:6px;border-radius:1.5px;background:var(--k);flex:none}
.kl-sw.short{--k:var(--k-short)}.kl-sw.clip{--k:var(--k-clip)}.kl-sw.product{--k:var(--k-product)}.kl-sw.audio{--k:var(--k-audio)}
.kl-next{margin-top:20px}
.kl-next-h{font:500 11px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:12px}
.kl-next-row{display:grid;grid-auto-flow:column;grid-auto-columns:128px;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;
  margin:0 -12px;padding:0 12px 4px;scroll-padding:0 12px}
.kl-next-row::-webkit-scrollbar{display:none}
.kl-next-row li{scroll-snap-align:start;display:flex;flex-direction:column;gap:8px}
.kl-next-thumb{position:relative;aspect-ratio:9/16;border-radius:10px;overflow:hidden;background-color:#0b1a2a;background-repeat:no-repeat;box-shadow:inset 0 0 0 1px var(--line),0 16px 30px -18px rgba(0,0,0,.9)}
.kl-next-thumb img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.kl-next-thumb img.miss{display:none}
.kl-kind{display:inline-block;margin-right:7px;padding:3px 5px;border-radius:4px;font:600 9px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:#04121d;background:var(--k)}
.kl-kind.short{--k:var(--k-short)}.kl-kind.clip{--k:var(--k-clip)}.kl-kind.product{--k:var(--k-product)}.kl-kind.audio{--k:var(--k-audio)}
.kl-next-cap{font-size:13px;line-height:1.35;font-weight:550;color:var(--ink)}
.kl-next-m{display:flex;align-items:center;justify-content:space-between;font:500 10.5px/1 var(--mono);color:var(--muted);letter-spacing:.04em}
.kl-cal-legend{display:flex;flex-wrap:wrap;gap:10px 18px;margin-top:18px;padding-top:14px;border-top:1px solid var(--line);font:500 11px/1 var(--mono);letter-spacing:.06em;color:var(--dim)}
.kl-cal-legend span{display:inline-flex;align-items:center;gap:7px}
.kl-cal-legend b{font-weight:500;color:var(--ink)}
.kl-cal-total{margin-left:auto;color:var(--hot) !important}
.kl-cal-total b{color:var(--hot) !important}

/* =========================================================
   FILMSTRIP: the library as texture
   ========================================================= */
.kl-strip{position:relative;overflow:hidden;padding:14px 0;margin:24px 0 0;background:#030810;
  border-top:1px solid #0f2236;border-bottom:1px solid #0f2236;
  -webkit-mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.kl-strip::before,.kl-strip::after{content:'';position:absolute;left:0;right:0;height:8px;z-index:2;
  background:repeating-linear-gradient(90deg,transparent 0 6px,rgba(234,246,251,.16) 6px 12px,transparent 12px 18px);background-size:18px 5px;background-repeat:repeat-x;background-position:0 50%}
.kl-strip::before{top:3px}.kl-strip::after{bottom:3px}
.kl-strip-track{display:flex;gap:4px;width:max-content;animation:kl-roll 110s linear infinite}
.kl-strip-track span{position:relative;width:150px;aspect-ratio:16/9;flex:none;border-radius:2px;background-color:#0b1a2a;background-repeat:no-repeat;background-size:600% 600%;filter:saturate(.8) brightness(.85)}
@keyframes kl-roll{to{transform:translateX(-50%)}}

/* =========================================================
   9. DOES / DOES NOT
   ========================================================= */
.kl-honest{display:grid;gap:14px;margin-top:40px}
.kl-hcol{border-radius:18px;padding:18px 16px 8px;isolation:isolate}
.kl-hcol.yes{background:var(--grain),radial-gradient(90% 60% at 0 0,rgba(53,201,232,.1),transparent 70%),linear-gradient(180deg,#0c1d30,#09172a);box-shadow:inset 0 0 0 1px rgba(53,201,232,.3)}
.kl-hcol.no{background:linear-gradient(180deg,#0a1522,#08121d);box-shadow:inset 0 0 0 1px var(--line)}
.kl-hcol-h{display:flex;align-items:center;gap:10px;padding-bottom:14px;border-bottom:1px solid var(--line);font:500 11.5px/1 var(--mono);letter-spacing:.16em;text-transform:uppercase}
.kl-hcol-h svg{width:22px;height:22px;padding:4px;border-radius:6px}
.kl-hcol.yes .kl-hcol-h{color:var(--cy)}
.kl-hcol.yes .kl-hcol-h svg{color:#04121d;background:var(--cy)}
.kl-hcol.no .kl-hcol-h{color:var(--dim)}
.kl-hcol.no .kl-hcol-h svg{color:var(--dim);box-shadow:inset 0 0 0 1.5px var(--line2)}
.kl-hcol li{position:relative;padding:16px 0 16px 20px;border-bottom:1px solid rgba(23,50,74,.7)}
.kl-hcol li:last-child{border-bottom:0}
.kl-hcol li::before{content:'';position:absolute;left:0;top:19px;bottom:19px;width:4px;border-radius:2px;transform-origin:top;transition:transform .8s var(--ease);transition-delay:calc(.3s + var(--i) * .14s)}
.kl-hcol.yes li::before{background:linear-gradient(180deg,var(--hot),var(--cy));box-shadow:0 0 10px rgba(53,201,232,.6)}
.kl-hcol.no li::before{background:repeating-linear-gradient(180deg,rgba(143,176,196,.5) 0 3px,transparent 3px 6px)}
.kl-hcol li b{display:block;font-size:16px;font-weight:650;letter-spacing:-.012em;color:var(--ink)}
.kl-hcol li p{margin-top:5px;font-size:14.5px;line-height:1.6;color:var(--dim)}
.kl-hcol li>*{transition:opacity .7s ease,transform .9s var(--ease);transition-delay:calc(.2s + var(--i) * .14s)}
.kl.kl-ready .kl-hcol:not(.in) li::before{transform:scaleY(0)}
.kl.kl-ready .kl-hcol:not(.in) li>*{opacity:0;transform:translateY(8px)}

/* =========================================================
   10. HOW WE BUILD IT
   ========================================================= */
.kl-vary{margin-top:40px}
.kl-vary-l{display:block;font:500 10.5px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:12px}
.kl-vary-row{display:grid;grid-template-columns:repeat(8,1fr);gap:6px}
.kl-vary-row i{position:relative;aspect-ratio:9/16;border-radius:6px;overflow:hidden;background-color:#0b1a2a;background-repeat:no-repeat;box-shadow:inset 0 0 0 1px var(--line);
  transition:opacity .6s ease,transform .8s var(--ease);transition-delay:calc(var(--n) * .07s)}
.kl-vary-row i::before,.kl-vary-row i::after{content:'';position:absolute;border-radius:2px}
.kl-vary-row i::before{left:14%;right:14%;height:6%;background:var(--hot);box-shadow:0 0 8px rgba(111,227,255,.6)}
.kl-vary-row i::after{left:22%;right:30%;height:4%;background:rgba(234,246,251,.7)}
.kl-vary-row .v1{--n:0}.kl-vary-row .v1::before{bottom:28%}.kl-vary-row .v1::after{bottom:22%}
.kl-vary-row .v2{--n:1}.kl-vary-row .v2::before{top:22%;right:36%}.kl-vary-row .v2::after{top:30%}
.kl-vary-row .v3{--n:2}.kl-vary-row .v3::before{bottom:40%;left:24%;right:24%}.kl-vary-row .v3::after{bottom:34%;left:32%;right:32%}
.kl-vary-row .v4{--n:3}.kl-vary-row .v4::before{top:44%;background:#f1f7fa}.kl-vary-row .v4::after{top:52%;background:var(--cy)}
.kl-vary-row .v5{--n:4}.kl-vary-row .v5::before{bottom:18%;left:10%;right:40%}.kl-vary-row .v5::after{bottom:12%;left:10%;right:20%}
.kl-vary-row .v6{--n:5}.kl-vary-row .v6::before{top:12%}.kl-vary-row .v6::after{top:20%;left:14%;right:44%}
.kl-vary-row .v7{--n:6}.kl-vary-row .v7::before{bottom:30%;left:20%;right:20%;background:#f1f7fa}.kl-vary-row .v7::after{bottom:24%;left:28%;right:28%;background:var(--hot)}
.kl-vary-row .v8{--n:7}.kl-vary-row .v8::before{top:36%;left:20%;right:20%}.kl-vary-row .v8::after{top:44%;left:30%;right:30%}
.kl.kl-ready .kl-vary:not(.in) .kl-vary-row i{opacity:0;transform:translateY(12px) scale(.96)}

.kl-steps{position:relative;display:grid;gap:30px;margin-top:48px;padding-left:52px}
.kl-steps::before,.kl-steps::after{content:'';position:absolute;left:17px;top:18px;bottom:10px;width:12px}
.kl-steps::before{background:
    linear-gradient(rgba(234,246,251,.2),rgba(234,246,251,.2)) left top/1px 100% no-repeat,
    repeating-linear-gradient(180deg,rgba(234,246,251,.2) 0 1px,transparent 1px 48px) left top/11px 100% no-repeat,
    repeating-linear-gradient(180deg,rgba(234,246,251,.1) 0 1px,transparent 1px 6px) left top/5px 100% no-repeat}
.kl-steps::after{transform-origin:top;transform:scaleY(var(--p,1));filter:drop-shadow(0 0 5px rgba(53,201,232,.6));
  background:
    linear-gradient(var(--cy),var(--cy)) left top/1.5px 100% no-repeat,
    repeating-linear-gradient(180deg,var(--cy) 0 1.5px,transparent 1.5px 48px) left top/12px 100% no-repeat,
    repeating-linear-gradient(180deg,rgba(53,201,232,.55) 0 1px,transparent 1px 6px) left top/6px 100% no-repeat}
.kl-steps li{position:relative}
.kl-step-n{position:absolute;left:-52px;top:-6px;width:36px;height:36px;border-radius:9px;display:grid;place-items:center;z-index:2;
  font:500 12px/1 var(--mono);color:var(--cy);background:#0b1a2a;box-shadow:0 0 0 5px var(--bg),inset 0 0 0 1.5px rgba(53,201,232,.5);transition:background .5s,color .5s,box-shadow .5s}
.kl-steps li.on .kl-step-n,.kl:not(.kl-ready) .kl-step-n{background:var(--cy);color:#04121d;box-shadow:0 0 0 5px var(--bg),0 0 26px rgba(53,201,232,.6)}
.kl-steps h3{margin-bottom:6px}
.kl-steps p{font-size:15px;line-height:1.6;color:var(--dim)}

/* =========================================================
   11. ALSO FROM KAPLEX
   ========================================================= */
.kl-cards{display:grid;gap:14px;margin-top:40px}
.kl-card{position:relative;display:grid;grid-template-columns:84px 1fr;grid-template-areas:"plate k" "plate t" "p p";column-gap:18px;align-items:end;padding:18px;border-radius:20px;
  background:var(--grain),radial-gradient(70% 90% at 0 0,color-mix(in srgb,var(--acc) 9%,transparent),transparent 70%),linear-gradient(180deg,#0c1b2c,#091523);
  box-shadow:inset 0 0 0 1px var(--line),inset 0 1px 0 rgba(255,255,255,.04);transition:box-shadow .3s,transform .3s}
@media (hover:hover){.kl-card:hover{box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--acc) 45%,transparent);transform:translateY(-2px)}}
.kl-plate{grid-area:plate;align-self:start;position:relative;display:block;aspect-ratio:1;border-radius:16px;
  box-shadow:0 0 0 1px color-mix(in srgb,var(--acc) 35%,transparent),0 18px 30px -16px rgba(0,0,0,.9)}
.kl-plate img,.kl-plate .kl-mark{position:relative;z-index:1;display:block;width:100%;height:100%;object-fit:cover;border-radius:16px;background:#0b0e12}
.kl-plate::after{content:'';position:absolute;inset:0;z-index:2;border-radius:16px;pointer-events:none;
  background:linear-gradient(160deg,rgba(255,255,255,.14),rgba(255,255,255,0) 35%);box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}
.kl-plate-glow{position:absolute;inset:-12%;z-index:0;border-radius:30%;background:radial-gradient(closest-side,color-mix(in srgb,var(--acc) 55%,transparent),transparent);
  filter:blur(14px);opacity:.6;animation:kl-breathe 6s ease-in-out infinite;animation-delay:var(--d,0s)}
@keyframes kl-breathe{0%,100%{opacity:.35;transform:scale(.94)}50%{opacity:.85;transform:scale(1.04)}}
.kl-card-k{grid-area:k;align-self:end;font:500 10.5px/1.2 var(--mono);letter-spacing:.16em;text-transform:uppercase;color:var(--acc);margin-bottom:7px}
.kl-card-t{grid-area:t;align-self:start;display:block;font-size:19px;line-height:1.3;font-weight:700;letter-spacing:-.02em;color:var(--ink)}
.kl-card-t .kl-out-i{display:inline-block;margin-left:8px;vertical-align:.08em;color:var(--muted)}
.kl-card-p{grid-area:p;margin-top:16px;font-size:14.5px;line-height:1.62;color:var(--dim)}

/* =========================================================
   12. QUESTIONS
   ========================================================= */
.kl-faq{display:grid;gap:28px}
.kl-faq-note{margin-top:4px;padding:14px 16px;border-radius:12px;font-size:13.5px;line-height:1.6;color:var(--muted);background:rgba(255,255,255,.02);box-shadow:inset 0 0 0 1px var(--line);max-width:42ch}
.kl-faq-note a,.kl-mail{position:relative;color:var(--ink);text-decoration:underline;text-decoration-color:rgba(53,201,232,.6);text-underline-offset:4px;text-decoration-thickness:1px;white-space:nowrap}
.kl-faq-note a::after,.kl-mail::after{content:'';position:absolute;left:0;right:0;top:-12px;bottom:-12px}
.kl-acc{border-top:1px solid var(--line)}
.kl-acc details{position:relative;border-bottom:1px solid var(--line)}
.kl-acc details::before{content:'';position:absolute;left:0;top:-1px;height:1px;width:100%;background:linear-gradient(90deg,var(--cy),transparent 60%);transform:scaleX(0);transform-origin:left;transition:transform .6s var(--ease)}
.kl-acc details[open]::before{transform:scaleX(1)}
.kl-acc details.closing::before{transform:scaleX(0)}
.kl-acc summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:46px 1fr 32px;align-items:center;gap:8px;min-height:64px;padding:18px 0;
  font-size:16.5px;font-weight:550;line-height:1.4;color:var(--ink)}
.kl-acc summary::-webkit-details-marker{display:none}
.kl-acc summary::marker{content:''}
.kl-q-n{font:500 11px/1 var(--mono);letter-spacing:.04em;color:var(--muted);transition:color .4s}
.kl-acc details[open] .kl-q-n{color:var(--hot)}
.kl-acc details.closing .kl-q-n{color:var(--muted)}
.kl-acc summary i{position:relative;width:32px;height:32px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--line2);transition:box-shadow .3s,background .3s}
.kl-acc summary i::before,.kl-acc summary i::after{content:'';position:absolute;left:50%;top:50%;width:12px;height:1.5px;margin:-.75px 0 0 -6px;background:var(--cy);border-radius:1px;transition:transform .45s var(--ease)}
.kl-acc summary i::after{transform:rotate(90deg)}
.kl-acc details[open] summary i{background:rgba(53,201,232,.1);box-shadow:inset 0 0 0 1px rgba(53,201,232,.45)}
.kl-acc details[open] summary i::after{transform:rotate(0deg)}
.kl-acc details.closing summary i{background:transparent;box-shadow:inset 0 0 0 1px var(--line2)}
.kl-acc details.closing summary i::after{transform:rotate(90deg)}
.kl-ans{overflow:hidden}
.kl-ans p{padding:0 8px 24px 54px;font-size:15.5px;line-height:1.72;color:var(--dim);max-width:66ch}

/* =========================================================
   13. START HERE
   ========================================================= */
.kl-talk-sec{padding-top:24px}
.kl-talk{position:relative;display:grid;gap:34px;overflow:hidden;border-radius:26px;padding:40px 16px 22px;isolation:isolate;
  background:var(--grain),radial-gradient(70% 45% at 50% 0,rgba(53,201,232,.2),transparent 70%),radial-gradient(60% 40% at 50% 100%,rgba(53,201,232,.06),transparent 70%),linear-gradient(180deg,#0c1d30,#07121f);
  box-shadow:inset 0 0 0 1px rgba(53,201,232,.22),inset 0 1px 0 rgba(160,235,255,.14),0 70px 140px -70px rgba(53,201,232,.5)}
.kl-talk-copy{text-align:center}
.kl-talk-copy .kl-eyebrow{justify-content:center}
.kl-talk-copy .kl-lede{margin:0 auto}
.kl-talk-copy .kl-ticklist{display:inline-grid;gap:12px;margin-top:24px;text-align:left;font-size:15.5px;color:var(--ink)}
.kl-talk-copy .kl-ticklist li{transition:opacity .7s ease,transform .9s var(--ease);transition-delay:calc(.3s + var(--i) * .12s)}
.kl.kl-ready .kl-talk-copy .kl-ticklist:not(.in) li{opacity:0;transform:translateX(-8px)}
.kl-monitor{position:relative;width:150px;height:150px;margin:0 auto 26px;display:grid;place-items:center}
.kl-monitor-ring{position:absolute;inset:0;border-radius:50%;
  background:
    repeating-conic-gradient(from 0deg,rgba(111,227,255,.95) 0 .8deg,transparent .8deg 30deg),
    repeating-conic-gradient(from 0deg,rgba(234,246,251,.3) 0 .5deg,transparent .5deg 6deg);
  -webkit-mask:radial-gradient(closest-side,transparent 84%,#000 85%,#000 99%,transparent 100%);mask:radial-gradient(closest-side,transparent 84%,#000 85%,#000 99%,transparent 100%);
  animation:kl-spin 60s linear infinite}
.kl-monitor-ring::after{content:'';position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,rgba(111,227,255,.9) 0deg,transparent 60deg);animation:kl-spin 6s linear infinite}
@keyframes kl-spin{to{transform:rotate(360deg)}}
.kl-monitor::before{content:'';position:absolute;inset:18px;border-radius:50%;background:radial-gradient(closest-side,rgba(53,201,232,.28),transparent);box-shadow:inset 0 0 0 1px rgba(234,246,251,.1)}
.kl-monitor img{position:relative;width:62px;height:auto;filter:drop-shadow(0 0 18px rgba(53,201,232,.45))}
.kl-monitor-rec{position:absolute;left:50%;bottom:-14px;transform:translateX(-50%);display:inline-flex;align-items:center;gap:7px;padding:5px 9px;border-radius:6px;white-space:nowrap;
  font:500 10px/1 var(--mono);letter-spacing:.12em;color:var(--dim);background:#07121f;box-shadow:inset 0 0 0 1px var(--line2)}
.kl-monitor-rec i{width:6px;height:6px;border-radius:50%;background:#ff5a5a;box-shadow:0 0 8px #ff5a5a;animation:kl-blink 1.2s steps(1) infinite}
.kl-monitor-rec b{font-weight:500;color:var(--ink)}
@keyframes kl-blink{50%{opacity:.2}}
.kl-edl{position:relative;border-radius:18px;padding:18px 16px 18px;background:rgba(4,11,20,.72);box-shadow:inset 0 0 0 1px var(--line2),0 30px 60px -40px rgba(0,0,0,.9)}
.kl-edl-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.kl-edl-t{font-size:16px;font-weight:650;color:var(--ink);letter-spacing:-.012em}
.kl-edl-tag{white-space:nowrap;flex:none;font:500 10px/1 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--cy);padding:6px 8px;border-radius:6px;background:rgba(53,201,232,.1);box-shadow:inset 0 0 0 1px rgba(53,201,232,.35)}
.kl-edl-rows{position:relative;margin:4px 0 20px}
.kl-edl-rows li{position:relative;display:grid;grid-template-columns:66px 1fr;gap:12px;padding:14px 8px 14px 8px;border-bottom:1px solid rgba(23,50,74,.7);border-radius:8px;transition:background .5s}
.kl-edl-rows li:last-child{border-bottom:0}
.kl-edl-rows li.on{background:rgba(53,201,232,.08)}
.kl-edl-rows li.on .kl-edl-tc{color:var(--hot)}
.kl-edl-tc{font:500 11px/1.6 var(--mono);color:var(--muted);transition:color .4s}
.kl-edl-rows b{display:block;font-size:15px;font-weight:650;color:var(--ink)}
.kl-edl-rows p{margin-top:3px;font-size:14px;line-height:1.5;color:var(--dim)}
.kl .kl-btn-lg{width:100%;min-height:56px;font-size:16px;border-radius:14px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),inset 0 -1px 0 rgba(0,60,90,.3),0 0 0 6px rgba(53,201,232,.08),0 18px 44px -14px rgba(53,201,232,.75)}
.kl-sheen{position:absolute;top:0;bottom:0;left:-60%;width:40%;pointer-events:none;background:linear-gradient(100deg,transparent,rgba(255,255,255,.6),transparent);transform:skewX(-18deg);animation:kl-sheen 6s ease-in-out infinite}
@keyframes kl-sheen{0%,62%{left:-60%}82%,100%{left:130%}}
.kl-edl-fine{margin-top:16px;font-size:13px;line-height:1.7;color:var(--muted)}

.kl-intake{padding:20px 16px 18px}
.kl-form-grid{display:grid;gap:14px;margin:18px 0 6px}
.kl-inp{display:flex;flex-direction:column;gap:8px;min-width:0}
.kl-inp-l{display:flex;align-items:center;gap:9px;font-size:14px;font-weight:600;color:var(--ink);letter-spacing:-.005em}
.kl-inp-l i{font:500 10px/1 var(--mono);font-style:normal;letter-spacing:.04em;color:var(--muted);padding:4px 5px;border-radius:4px;box-shadow:inset 0 0 0 1px var(--line2);transition:color .3s,box-shadow .3s}
.kl-inp input,.kl-inp textarea{width:100%;min-height:48px;padding:12px 14px;border:0;border-radius:11px;font:400 16px/1.4 Geist,system-ui,sans-serif;color:var(--ink);
  background:#06101c;box-shadow:inset 0 0 0 1px var(--line2),inset 0 2px 6px rgba(0,0,0,.35);transition:box-shadow .25s,background .25s;-webkit-appearance:none;appearance:none}
.kl-inp textarea{resize:vertical;min-height:112px}
.kl-inp input::placeholder,.kl-inp textarea::placeholder{color:#557389;opacity:1}
.kl-inp input:focus,.kl-inp textarea:focus{outline:none;background:#081626;box-shadow:inset 0 0 0 1.5px var(--cy),0 0 0 4px rgba(53,201,232,.16)}
.kl-inp:focus-within .kl-inp-l i{color:var(--hot);box-shadow:inset 0 0 0 1px rgba(53,201,232,.6)}
.kl-hp{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}
.kl-optin{position:relative;display:flex;align-items:flex-start;gap:12px;min-height:44px;padding:12px 0 6px;cursor:pointer;font-size:13.5px;line-height:1.5;color:var(--dim)}
.kl-optin input{position:absolute;left:0;top:10px;width:24px;height:24px;margin:0;opacity:0;cursor:pointer}
.kl-check{flex:none;position:relative;width:22px;height:22px;margin-top:1px;border-radius:6px;background:#06101c;box-shadow:inset 0 0 0 1.5px var(--line2);transition:background .2s,box-shadow .2s}
.kl-check::after{content:'';position:absolute;left:7px;top:3px;width:6px;height:11px;border:solid #04121d;border-width:0 2px 2px 0;transform:rotate(45deg) scale(0);transition:transform .2s var(--ease)}
.kl-optin input:checked + .kl-check{background:var(--cy);box-shadow:0 0 12px rgba(53,201,232,.5)}
.kl-optin input:checked + .kl-check::after{transform:rotate(45deg) scale(1)}
.kl-optin input:focus-visible + .kl-check{outline:2px solid var(--hot);outline-offset:3px}
.kl-intake .kl-btn-lg{margin-top:14px}
.kl-intake .kl-btn-lg[disabled]{opacity:.7;cursor:progress}
.kl-form-note{margin-top:14px;font-size:13px;line-height:1.55;color:var(--muted)}
.kl-form-note.err{color:#ffb4a8;padding:10px 12px;border-radius:10px;background:rgba(255,120,100,.08);box-shadow:inset 0 0 0 1px rgba(255,140,120,.35)}
.kl-form-alt{margin-top:10px;font-size:13px;line-height:1.7;color:var(--muted)}
.kl-form[hidden]{display:none}
.kl-done{display:flex;gap:16px;align-items:flex-start;padding:10px 4px;outline:none}
.kl-done[hidden]{display:none}
.kl-done-mark{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:11px;background:var(--cy);color:#04121d;box-shadow:0 0 26px rgba(53,201,232,.55)}
.kl-done-mark svg{width:20px;height:20px}
.kl-done b{display:block;font-size:20px;font-weight:750;letter-spacing:-.02em;color:var(--ink)}
.kl-done p{margin-top:6px;font-size:15px;line-height:1.6;color:var(--dim)}

/* =========================================================
   14. FOOTER
   ========================================================= */
.kl-foot{padding:64px 0 calc(40px + env(safe-area-inset-bottom));border-top:1px solid var(--line);margin-top:24px;background:linear-gradient(180deg,#06101c,#040b14)}
.kl-foot-top{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px}
.kl-foot-lock{display:flex;align-items:center;gap:12px}
.kl-foot-lock img{width:34px;height:auto;filter:drop-shadow(0 0 12px rgba(53,201,232,.35))}
.kl-foot-lock span{font-weight:800;font-size:22px;letter-spacing:-.035em}
.kl-top{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;border-radius:999px;font-size:13px;color:var(--dim);box-shadow:inset 0 0 0 1px var(--line2)}
.kl-top svg{width:12px;height:12px;color:var(--cy)}
.kl-foot-grid{display:grid;grid-template-columns:1fr 1fr;gap:34px 20px;margin-bottom:40px}
.kl-foot-brand{grid-column:1 / -1}
.kl-foot-brand p{font-size:14px;line-height:1.6;color:var(--muted);max-width:42ch}
.kl-foot nav:last-child{grid-column:1 / -1}
.kl-foot nav:last-child ul{display:flex;flex-wrap:wrap;column-gap:22px}
.kl-foot-h{font:500 10.5px/1 var(--mono);letter-spacing:.18em;text-transform:uppercase;color:var(--cy);margin-bottom:8px}
.kl-foot nav a{display:flex;align-items:center;min-height:44px;font-size:14px;color:var(--dim);line-height:1.35}
.kl-foot .kl-track-rule{--tc:rgba(234,246,251,.14);--tc2:rgba(234,246,251,.07)}
.kl-legal{margin-top:22px;display:grid;gap:6px;font-size:12px;line-height:1.6;color:var(--muted)}

/* =========================================================
   15. STICKY CTA (phone only)
   ========================================================= */
.kl-sticky{position:fixed;left:0;right:0;bottom:0;z-index:40;padding:14px 16px calc(10px + env(safe-area-inset-bottom));
  background:linear-gradient(180deg,rgba(6,16,28,0),rgba(6,16,28,.94) 38%);
  transform:translateY(110%);visibility:hidden;transition:transform .45s var(--ease),visibility 0s linear .45s}
.kl-sticky.show{transform:none;visibility:visible;transition:transform .45s var(--ease),visibility 0s}
.kl-sticky .btn{width:100%;min-height:50px;box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 12px 30px -10px rgba(53,201,232,.6),0 0 0 1px rgba(0,0,0,.4)}

/* =========================================================
   TABLET / DESKTOP
   ========================================================= */
@media (min-width:640px){
  .kl{--gut:32px}
  .kl-stages{grid-template-columns:1fr 1fr}
  .kl-stats{grid-template-columns:repeat(4,1fr)}
  .kl-ways{grid-template-columns:1fr 1fr}
  .kl-cap .kl-meta{grid-template-columns:repeat(4,1fr)}
  .kl-sheet{grid-template-columns:repeat(6,1fr)}
  .kl-cell:nth-child(n+25){display:block}
  .kl-honest{grid-template-columns:1fr 1fr}
  .kl-cards{grid-template-columns:1fr 1fr}
  .kl-next-row{grid-auto-flow:row;grid-template-columns:repeat(5,1fr);grid-auto-columns:auto;overflow:visible;margin:0;padding:0}
  .kl-foot-grid{grid-template-columns:repeat(3,1fr)}
  .kl-foot nav:last-child{grid-column:auto}
  .kl-foot nav:last-child ul{display:block}
  .kl-strip-track span{width:190px}
}
@media (min-width:900px){
  .kl{--gut:48px;--sec:136px}
  .kl .kl-h{font-size:clamp(46px,4.2vw,62px);margin-bottom:26px;letter-spacing:-.045em}
  .kl .kl-h-sm{font-size:clamp(34px,3vw,44px)}
  .kl-lede{font-size:17.5px}
  .kl-split-top{grid-template-columns:1.25fr 1fr;gap:56px}
  .kl-split-top .kl-lede:last-child{padding-bottom:30px}
  .kl-split-top>div>.kl-lede:last-child{padding-bottom:30px}

  .kl-nle{margin-top:56px;padding:18px 22px 24px;border-radius:24px}
  .kl-nle-clips i{height:38px}
  .kl-stages{grid-template-columns:repeat(4,1fr);gap:10px}
  .kl-stage{grid-template-columns:1fr;padding:18px 18px 18px}
  .kl-stage>*{grid-column:1}
  .kl-stage-n{grid-row:auto;margin-bottom:12px;line-height:1}
  .kl-stage h3{font-size:17px}

  .kl-proof{padding:44px 48px 32px;border-radius:26px}
  .kl-stats{margin-top:40px;gap:36px}
  .kl-stat{font-size:clamp(52px,5vw,72px)}
  .kl-proof-foot{margin-top:34px}

  .kl-ways{grid-template-columns:.85fr 1.15fr;gap:24px;margin-top:56px;align-items:center}
  .kl-way{padding:26px 26px 22px}
  .kl-way-kx{padding:40px 44px 32px;border-radius:24px}
  .kl-way-kx .kl-way-h{font-size:30px}
  .kl-way-kx .kl-way-list li{font-size:17px;padding:15px 0}
  .kl-way-kx .kl-way-track i{height:18px}

  .kl-cap{margin-top:56px;display:grid;grid-template-columns:1fr 250px;gap:20px;align-items:stretch}
  .kl-cap-screen{padding:20px 24px 22px;border-radius:24px}
  .kl-cap-words{font-size:clamp(34px,3.3vw,46px);padding:48px 8px 44px;line-height:1.22;min-height:0}
  .kl-cap-lane{height:26px}
  .kl-cap .kl-meta{grid-template-columns:1fr;margin-top:0;align-content:stretch}
  .kl-cap .kl-meta>div{display:flex;flex-direction:column;justify-content:center;padding:18px 20px}
  .kl-cap .kl-meta dd{font-size:15.5px}

  .kl-out{grid-template-columns:1fr 1fr;gap:80px}
  .kl-out-copy{max-width:520px}
  .kl-out-h3{font-size:24px}
  .kl-phone{width:310px;padding:10px;border-radius:46px}
  .kl-phone-screen{border-radius:37px}

  .kl-match{margin-top:56px}
  .kl-sheet{gap:5px;padding:8px;border-radius:18px}
  .kl-slot{width:128px}

  .kl-fan{grid-template-columns:230px 1fr;gap:0;padding:22px;margin-top:56px;border-radius:24px}
  .kl-fan-src{flex-direction:column;align-items:flex-start;justify-content:center;gap:16px;padding:10px 28px 10px 10px;border-bottom:0;border-right:1px solid var(--line)}
  .kl-fan-thumb{width:92px;border-radius:12px}
  .kl-fan-rows{padding-left:24px;gap:6px}
  .kl-fan-rows li{grid-template-columns:24px 110px 1fr 80px;min-height:58px;padding:0 14px;gap:16px}
  .kl-pm{width:22px;height:22px}
  .kl-fan-n{font-size:16px}

  .kl-cal{padding:26px 26px 22px;border-radius:24px;margin-top:48px}
  .kl-sched{height:300px;grid-template-columns:48px 1fr}
  .kl-sched-hours span{font-size:10px}
  .kl-sched-dl{font-size:10px}
  .kl-chip{height:11px;margin-top:-5.5px;left:3px;right:3px}
  .kl-narrate{font-size:14.5px}
  .kl-next-cap{font-size:14px}

  .kl-strip-track span{width:230px}

  .kl-honest{gap:24px;margin-top:56px}
  .kl-hcol{padding:26px 28px 12px;border-radius:22px}
  .kl-hcol li b{font-size:17.5px}
  .kl-hcol li p{font-size:15.5px}

  .kl-vary{margin-top:56px}
  .kl-vary-row{gap:10px}
  .kl-steps{grid-template-columns:repeat(4,1fr);gap:36px;padding-left:0;padding-top:70px;margin-top:64px}
  .kl-steps::before,.kl-steps::after{left:0;right:0;top:17px;bottom:auto;width:auto;height:12px}
  .kl-steps::before{background:
      linear-gradient(rgba(234,246,251,.2),rgba(234,246,251,.2)) left bottom/100% 1px no-repeat,
      repeating-linear-gradient(90deg,rgba(234,246,251,.2) 0 1px,transparent 1px 48px) left bottom/100% 11px no-repeat,
      repeating-linear-gradient(90deg,rgba(234,246,251,.1) 0 1px,transparent 1px 6px) left bottom/100% 5px no-repeat}
  .kl-steps::after{transform-origin:left;transform:scaleX(var(--p,1));
    background:
      linear-gradient(var(--cy),var(--cy)) left bottom/100% 1.5px no-repeat,
      repeating-linear-gradient(90deg,var(--cy) 0 1.5px,transparent 1.5px 48px) left bottom/100% 12px no-repeat,
      repeating-linear-gradient(90deg,rgba(53,201,232,.55) 0 1px,transparent 1px 6px) left bottom/100% 6px no-repeat}
  .kl-step-n{left:0;top:-70px;width:40px;height:40px;font-size:13px}
  .kl-steps h3{font-size:19px;margin-bottom:10px}
  .kl-steps p{font-size:15.5px;max-width:30ch}

  .kl-cards{gap:20px;margin-top:56px}
  .kl-card{grid-template-columns:120px 1fr;grid-template-areas:"plate k" "plate t" "plate p" "plate .";grid-template-rows:auto auto auto 1fr;column-gap:26px;padding:26px;align-items:start}
  .kl-card-k{align-self:start}
  .kl-card-p{margin-top:8px}

  .kl-faq{grid-template-columns:.72fr 1.28fr;gap:72px;align-items:start}
  .kl-faq-side{position:sticky;top:120px}
  .kl-faq-note{margin-top:8px}
  .kl-acc summary{font-size:18px;min-height:76px;padding:24px 0;grid-template-columns:60px 1fr 32px}
  .kl-ans p{padding-left:68px;font-size:16px}

  .kl-talk{grid-template-columns:.9fr 1.1fr;gap:56px;align-items:center;padding:72px 64px 64px;border-radius:34px}
  .kl-talk-copy{text-align:left}
  .kl-talk-copy .kl-eyebrow{justify-content:flex-start}
  .kl-talk-copy .kl-lede{margin:0}
  .kl-monitor{margin:0 0 34px;width:168px;height:168px}
  .kl-monitor img{width:70px}
  .kl-edl{padding:24px 24px 24px;border-radius:22px}
  .kl-intake{padding:26px 28px 24px}
  .kl-form-grid{grid-template-columns:1fr 1fr;gap:18px 16px}
  .kl-inp-wide{grid-column:1 / -1}

  .kl-foot-grid{grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px}
  .kl-foot-brand{grid-column:auto}
  .kl-legal{grid-template-columns:1fr 1.2fr;gap:24px}

  .kl-sticky{display:none}
}
@media (min-width:1200px){
  .kl-cards{grid-template-columns:repeat(4,1fr);gap:22px}
  .kl-card{grid-template-columns:1fr;grid-template-areas:"plate" "k" "t" "p";grid-template-rows:auto;align-content:start;padding:22px 22px 26px}
  .kl-plate{margin-bottom:26px}
  .kl-card-p{margin-top:10px}
}

/* ---------- reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  .kl *,.kl *::before,.kl *::after{transition:none !important;animation:none !important}
  .kl.kl-ready [data-rv]:not(.in),.kl.kl-ready .kl-h:not(.in) .kl-ln>span{opacity:1;transform:none}
  .kl.kl-ready .kl-div:not(.in) i::after{width:170px}
  .kl.kl-ready .kl-div:not(.in) i::before{opacity:1}
  .kl-chip{transform:none;opacity:1}
  .kl-sheen{display:none}
  .kl-strip-track{transform:none}
}

/* phones: "Next out" as a tidy grid (three across, then two), nothing cut off or squeezed */
@media (max-width:759px){
  .kl .kl-next-row{grid-auto-flow:row;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-columns:auto;overflow:visible;gap:14px 10px;margin:0;padding:0}
  .kl .kl-next-cap{font-size:12px;line-height:1.3}
  .kl .kl-next-m{flex-direction:column;align-items:flex-start;gap:4px;font-size:9.5px}
}

/* nothing below the story may widen the page: the film strip runs far past the right edge by design, and on a real
   phone an unclipped strip stretched the layout viewport to ~5700px (fixed items like Kira ended up off screen) */
.kl{overflow-x:clip}
.kl-strip{height:113px}
.kl-strip-track{position:absolute;left:0;top:14px}
@media (min-width:640px){.kl-strip{height:135px}}
@media (min-width:900px){.kl-strip{height:157px}}