/* Page layout (k-*), taken from the handoff reference index.html */
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{margin:0;background:var(--navy);color:#fff;font-family:var(--font-body);font-size:17px;line-height:1.55}
a{color:inherit}a:hover{color:var(--yellow-500)}img{max-width:100%;display:block}
.k-wrap{max-width:var(--wrap-max);margin:0 auto;padding-inline:var(--wrap-pad)}
.k-sec{padding-block:88px}.k-dark{background:var(--navy)}.k-deep{background:var(--navy-deep)}.k-light{background:var(--white);color:var(--navy)}.k-paper{background:var(--paper);color:var(--navy)}.k-yellow{background:var(--yellow-500);color:var(--navy)}
.k-center{text-align:center;max-width:52ch;margin:0 auto;display:grid;justify-items:center;gap:14px}.k-center .lm-body{color:var(--mist-300);text-wrap:balance}.k-light .k-center .lm-body,.k-paper .k-center .lm-body{color:var(--slate-600)}
.k-hero{background:var(--navy);padding-block:22px 0;overflow:hidden}
.k-top{display:flex;align-items:center;justify-content:space-between;gap:16px}
.k-logo{font:800 22px/1 var(--font-display);letter-spacing:-.04em}.k-logo i{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--yellow-500);margin-left:3px}
.k-hero-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:64px;margin-top:56px}
.k-hero-copy{display:grid;gap:20px;justify-items:start}.k-soft{color:var(--mist-200);max-width:36ch}
.k-sub{font:700 clamp(20px,2.4vw,26px)/1.2 var(--font-display);letter-spacing:-.02em;color:var(--mist-200);margin:-4px 0 0;max-width:30ch}.k-punch{font:700 21px/1.25 var(--font-display);letter-spacing:-.02em;max-width:34ch;margin:0}
.k-cta-row{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px;margin-top:6px}.k-price-note{font-size:15px;color:var(--mist-300);max-width:30ch}.k-price-note b{color:#fff}
.k-hero-stripe{margin-top:72px}
.k-demo{justify-self:center;display:grid;justify-items:center;gap:14px}
.k-demo-hint{margin:0;background:var(--navy-raised);box-shadow:inset 0 0 0 1px var(--border-on-dark);color:#fff;font:600 14px var(--font-body);padding:8px 14px;border-radius:999px;text-align:center}
.k-phone{width:300px;max-width:100%;aspect-ratio:9/18.5;background:var(--navy-ink);border-radius:var(--radius-device);padding:11px;box-shadow:0 40px 80px -30px rgba(0,0,0,.7),inset 0 0 0 1px rgba(255,255,255,.08)}
.k-screen{width:100%;height:100%;border-radius:32px;overflow:hidden;background:var(--navy);position:relative}
.k-pick,.k-np{position:absolute;inset:0;padding:20px 14px 14px;display:flex;flex-direction:column;gap:10px}
.k-dbrand{font:800 16px/1 var(--font-display);letter-spacing:-.04em;text-align:center;margin:8px 0 0}.k-dbrand i{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--yellow-500);margin-left:2px}
.k-dq{font:800 30px/1 var(--font-display);letter-spacing:-.045em;margin:18px 4px 6px}
.k-lvl-tile{appearance:none;border:0;font:inherit;text-align:left;cursor:pointer;border-radius:22px;padding:16px;display:grid;grid-template-columns:1fr auto;grid-template-rows:1fr auto;gap:10px;min-height:0;flex:1 1 0;color:var(--navy);transition:transform .15s var(--ease-out)}
.k-lvl-tile:hover{transform:translateY(-2px)}.k-lvl-tile:focus-visible{outline:3px solid var(--focus-ring);outline-offset:3px}
.k-lvl-tile--a1{background:var(--yellow-500)}.k-lvl-tile--a2{background:var(--coral-500)}.k-lvl-tile--b1{background:var(--teal-500)}.k-lvl-tile--b2{background:var(--mist-200)}
/* four level tiles: compact so A1 to B2 fit the phone screen */
.k-pick .k-lvl-tile{padding:12px 14px;gap:4px;border-radius:18px}.k-pick .k-lvl-big{font-size:44px}.k-pick .k-lvl-txt b{font-size:16px}.k-pick .k-lvl-txt small{font-size:12px}.k-pick .k-lvl-go{width:30px;height:30px;font-size:14px}
.k-lvl-big{grid-column:1/-1;font:800 64px/.85 var(--font-display);letter-spacing:-.06em}
.k-lvl-txt b{display:block;font:700 18px/1.15 var(--font-display);letter-spacing:-.02em}.k-lvl-txt small{display:block;font-size:13px;line-height:1.3;opacity:.8}
.k-lvl-go{align-self:end;width:36px;height:36px;border-radius:50%;background:var(--navy);color:#fff;display:grid;place-items:center;font:700 16px var(--font-display);transition:transform .2s var(--ease-out)}.k-lvl-tile:hover .k-lvl-go{transform:translateX(2px)}
.k-dtop{display:flex;align-items:center;justify-content:space-between}
.k-dback{font:600 14px var(--font-body);background:none;border:0;color:#fff;cursor:pointer;padding:4px 2px}.k-dback:hover{color:var(--yellow-500)}
.k-np{padding:18px 16px 0;gap:0}
.k-a-top{margin-bottom:12px}
.k-a-cover{position:relative;flex:none;height:172px;border-radius:22px;padding:16px;display:flex;flex-direction:column;justify-content:space-between;overflow:hidden;color:var(--navy)}
.k-a-cover .lm-label{position:relative;font-size:10.5px}.k-a-cover .k-cover-title{position:relative}
.k-a-play{display:flex;align-items:center;gap:14px;margin-top:20px}.k-tx{margin-top:16px;background:var(--navy-raised);border-radius:14px;padding:10px 12px 12px;box-shadow:inset 0 0 0 1px var(--border-on-dark);display:grid;gap:6px}
.k-tx-head{display:flex;justify-content:space-between;align-items:center}.k-tx-head .lm-eyebrow{font-size:10px}
.k-tx-all{appearance:none;border:0;background:none;color:var(--teal-300);font:600 12px/1 var(--font-body);cursor:pointer;padding:2px 0}.k-tx-all:hover{color:#fff}
.k-tx-line{margin:0;font:500 14px/1.35 var(--font-body);color:#fff;animation:k-txin .35s var(--ease-out)}
.k-tx-who{font:700 11px/1 var(--font-body);letter-spacing:.04em;margin-right:6px}.k-tx-who--lena{color:var(--coral-500)}.k-tx-who--ben{color:var(--teal-300)}
.k-tx-w{background:rgba(255,210,63,.22);color:var(--yellow-500);border-radius:4px;padding:0 2px}
.k-tx-next{margin:0;font:400 12px/1.35 var(--font-body);color:var(--mist-400);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.k-tx-next b{font-weight:600}
.k-tx:not(.is-live) .k-tx-line{color:var(--mist-200)}
@keyframes k-txin{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.k-tx-list{display:grid;gap:2px;overflow:auto;min-height:0;flex:1;margin:0 -6px}
.k-tx-row{appearance:none;border:0;background:none;font:400 13px/1.4 var(--font-body);color:var(--mist-200);text-align:left;display:grid;grid-template-columns:34px 1fr;gap:8px;padding:7px 6px;border-radius:10px;cursor:pointer}
.k-tx-row:hover{background:rgba(255,255,255,.05)}.k-tx-row.is-now{background:rgba(255,255,255,.08);color:#fff}
.k-tx-row.is-break{margin-top:8px;box-shadow:0 -1px 0 var(--border-on-dark)}
.k-tx-at{font:500 11px/1.6 var(--font-body);color:var(--mist-400);font-variant-numeric:tabular-nums}
.k-tx-sheet{top:22%}
.k-a-main{flex:1;min-width:0;display:grid;gap:6px}.k-a-play .k-np-play{width:52px;height:52px}.k-a-play-txt{display:flex;align-items:baseline;justify-content:space-between;gap:8px}.k-a-play-txt b{font-size:15px!important}.k-a-play-txt small{margin-top:0!important;white-space:nowrap}
.k-a-play-txt b{display:block;font:700 16px/1.2 var(--font-display);letter-spacing:-.01em}.k-a-play-txt small{display:block;font:500 12px/1.3 var(--font-body);color:var(--mist-300);font-variant-numeric:tabular-nums;margin-top:2px}
.k-a-scrub{display:grid;gap:4px}
.k-a-track{position:relative;display:flex;gap:4px;height:18px;align-items:center;cursor:pointer;touch-action:none}
.k-a-track:focus-visible{outline:3px solid var(--focus-ring);outline-offset:3px;border-radius:6px}
.k-a-seg{height:6px;border-radius:3px;background:rgba(255,255,255,.16);overflow:hidden;min-width:0}.k-a-seg i{display:block;height:100%}
.k-a-seg.is-expl i{background:var(--teal-500)}.k-a-seg.is-story i{background:var(--yellow-500)}
.k-a-thumb{position:absolute;top:50%;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.4);pointer-events:none}
.k-a-ctrl{display:flex;justify-content:space-between;align-items:center}
.k-a-time{font:500 11px/1 var(--font-body);color:var(--mist-300);font-variant-numeric:tabular-nums}.k-a-time:last-child{text-align:right}
.k-a-btns{display:flex;gap:6px}
.k-a-mini{appearance:none;border:0;min-width:40px;height:28px;padding:0 8px;border-radius:999px;background:rgba(255,255,255,.08);color:#fff;font:700 11.5px/1 var(--font-display);cursor:pointer;font-variant-numeric:tabular-nums;transition:background-color .12s ease}.k-a-mini:hover{background:rgba(255,255,255,.16)}
.k-a-mini:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px}.k-a-rate{color:var(--yellow-500)}
.k-a-switch{appearance:none;border:0;font:600 13px/1 var(--font-body);color:#fff;margin-top:14px;display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-radius:14px;background:var(--navy-raised);box-shadow:inset 0 0 0 1px var(--border-on-dark);cursor:pointer;text-align:left}
.k-a-switch:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px}
.k-sw{width:38px;height:22px;border-radius:999px;background:rgba(255,255,255,.18);position:relative;flex:none;transition:background-color .2s ease}.k-sw i{position:absolute;left:3px;top:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:transform .2s var(--ease-out)}
.k-sw.is-on{background:var(--teal-500)}.k-sw.is-on i{transform:translateX(16px)}
.k-a-chapters{margin-top:8px;display:grid}
.k-a-ch{position:relative;display:grid;grid-template-columns:20px 1fr auto;gap:8px;align-items:center;padding:8px 6px;font-size:13px;border-bottom:1px solid var(--border-on-dark);overflow:hidden;transition:opacity .2s ease}
.k-a-ch:last-child{border-bottom:0}
.k-a-fill{position:absolute;left:0;top:0;bottom:0;background:rgba(255,255,255,.06);pointer-events:none}
.k-a-n{position:relative;font-weight:700}.k-a-ch.is-expl .k-a-n{color:var(--teal-300)}.k-a-ch.is-story .k-a-n{color:var(--yellow-500)}
.k-a-name,.k-a-t{position:relative}.k-a-t{color:var(--mist-300);font-variant-numeric:tabular-nums}
.k-a-ch.is-now .k-a-name{font-weight:700}.k-a-ch.is-expl.is-now .k-a-fill{background:rgba(37,179,170,.16)}.k-a-ch.is-story.is-now .k-a-fill{background:rgba(255,210,63,.13)}
.k-a-ch.is-off{opacity:.38}.k-a-ch.is-off .k-a-name{text-decoration:line-through}

.k-cover--a1{background:var(--yellow-500);--av-ring:var(--yellow-500)}.k-cover--a2{background:var(--coral-500);--av-ring:var(--coral-500)}.k-cover--b1{background:var(--teal-500);--av-ring:var(--teal-500)}.k-cover--b2{background:var(--mist-200);--av-ring:var(--mist-200)}
.k-np-hero{position:relative;flex:none;overflow:hidden;padding:20px 16px 20px;color:var(--navy);display:flex;flex-direction:column;gap:18px;border-radius:0 0 28px 28px}
.k-np-hero .k-dback{color:var(--navy)}.k-np-hero .k-dback:hover{color:var(--navy);opacity:.65}
.k-np-hero .k-dtop{position:relative;z-index:1}
.k-np-lvl{background:var(--navy);color:#fff;font:700 11px/1 var(--font-body);letter-spacing:.02em;padding:5px 8px;border-radius:6px}
.k-cover-lvl{position:absolute;right:-14px;top:22px;font:800 160px/1 var(--font-display);letter-spacing:-.07em;opacity:.14;pointer-events:none}
.k-np-head{position:relative;display:grid;gap:8px}.k-np-head .lm-label{font-size:10.5px}
.k-cover-title{font:800 30px/.98 var(--font-display);letter-spacing:-.05em;margin:0;max-width:11ch;text-wrap:balance}
.k-np-hosts{display:flex;align-items:center;margin-top:8px}
.k-av{width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font:700 12px/1 var(--font-display);box-shadow:0 0 0 2px var(--av-ring)}.k-av--l{background:var(--coral-500);color:var(--navy)}.k-av--b{background:var(--navy);color:#fff;margin-left:-6px}
.k-np-hosts small{margin-left:9px;font:500 11.5px/1.3 var(--font-body);opacity:.8}
.k-np-body{padding:14px 14px 6px;display:flex;flex-direction:column;gap:10px}
.k-np-dot{border-radius:50%;display:grid;place-items:center;flex:none}.k-np-dot .lm-ico-play{border-left-width:10px;border-top-width:6px;border-bottom-width:6px;margin-left:3px}.k-np-dot .lm-ico-pause{width:10px;height:12px}.k-opts{display:grid;gap:6px}.k-opt{appearance:none;border:0;font:inherit;display:flex;align-items:center;gap:10px;text-align:left;background:var(--navy-raised);border-radius:14px;padding:8px 10px 8px 8px;color:#fff;cursor:pointer;box-shadow:inset 0 0 0 1px var(--border-on-dark);transition:box-shadow .12s ease}.k-opt:hover{box-shadow:inset 0 0 0 1px var(--border-on-dark-strong)}.k-opt.is-on{box-shadow:inset 0 0 0 1.5px var(--yellow-500)}.k-opt:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px}.k-opt .lm-track__txt b{font-size:13.5px}.k-opt .lm-track__txt small{font-size:11px}.k-opt .k-np-dot{width:32px;height:32px;background:var(--yellow-500);color:var(--navy)}.k-seg{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;border-radius:14px;background:var(--navy-raised);box-shadow:inset 0 0 0 1px var(--border-on-dark)}
.k-seg button{appearance:none;border:0;font:600 11.5px/1.2 var(--font-body);color:var(--mist-300);background:none;border-radius:10px;padding:8px 6px;cursor:pointer;text-wrap:balance;transition:background-color .15s ease,color .15s ease}
.k-seg button{display:flex;align-items:center;justify-content:center;gap:7px}.k-seg-n{width:18px;height:18px;border-radius:50%;display:grid;place-items:center;font:700 10px/1 var(--font-body);background:rgba(255,255,255,.12);color:#fff;flex:none}.k-seg button.is-on .k-seg-n{background:var(--navy);color:var(--yellow-500)}.k-seg button.is-done .k-seg-n{background:var(--teal-500);color:var(--navy)}.k-seg button:hover{color:#fff}.k-seg button.is-on{background:#fff;color:var(--navy)}.k-seg button:focus-visible{outline:3px solid var(--focus-ring);outline-offset:1px}
.k-wave{display:flex;gap:7px;height:34px;cursor:pointer}
.k-wseg{display:flex;align-items:center;gap:2px;height:100%;min-width:0}
.k-wseg i{flex:1;border-radius:2px;background:rgba(255,255,255,.2);transition:background-color .25s ease}
.k-wseg.is-expl i.on{background:var(--teal-500)}.k-wseg.is-story i.on{background:var(--yellow-500)}
.k-wlabels{display:flex;justify-content:space-between;gap:10px;margin-top:4px;font:600 10.5px/1 var(--font-body);letter-spacing:.01em}
.k-wlabels>span{display:flex;align-items:center;gap:5px;min-width:0;white-space:nowrap;opacity:.55;transition:opacity .2s ease}.k-wlabels>span::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;flex:none}
.k-wlabels>.is-expl{color:var(--teal-300)}.k-wlabels>.is-story{color:var(--yellow-500)}.k-wlabels>.is-now{opacity:1}
.k-opt-parts{display:flex;flex-wrap:nowrap;align-items:center;gap:4px;margin-top:5px}
.k-pp{font:600 10.5px/1 var(--font-body);padding:4px 7px;border-radius:999px;white-space:nowrap}.k-pp.is-expl{background:rgba(37,179,170,.18);color:var(--teal-300)}.k-pp.is-story{background:rgba(255,210,63,.15);color:var(--yellow-500)}
.k-pp-arrow{font-size:10px;color:var(--mist-400)}

.k-wseg i.head{background:#fff;animation:k-pulse .5s ease-in-out infinite alternate}
@keyframes k-pulse{from{transform:scaleY(.7)}to{transform:scaleY(1.1)}}
.k-wave:focus-visible{outline:3px solid var(--focus-ring);outline-offset:3px;border-radius:4px}
.k-np-part{font-weight:600;color:var(--teal-300)}.k-np-times{display:flex;justify-content:space-between;margin-top:-4px;font:500 11px/1 var(--font-body);color:var(--mist-300);font-variant-numeric:tabular-nums}
.k-transport{display:flex;align-items:center;justify-content:center;gap:24px;margin-top:2px}
.k-skip{width:42px;height:42px;border-radius:50%;border:0;background:rgba(255,255,255,.08);color:#fff;font:700 12px/1 var(--font-display);cursor:pointer;transition:background-color .12s ease}.k-skip:hover{background:rgba(255,255,255,.16)}
.k-np-play{width:56px;height:56px;border-radius:50%;border:0;background:var(--yellow-500);color:var(--navy);display:grid;place-items:center;cursor:pointer;box-shadow:0 12px 30px -10px rgba(255,210,63,.55);transition:transform .12s ease}.k-np-play:hover{transform:scale(1.05)}.k-np-play:active{transform:scale(.95)}
.k-np-play .lm-ico-play{border-left-width:18px;border-top-width:11px;border-bottom-width:11px;margin-left:6px}.k-np-play .lm-ico-pause{width:16px;height:20px}
.k-skip:focus-visible,.k-np-play:focus-visible{outline:3px solid var(--focus-ring);outline-offset:3px}
.k-words-bar{margin:auto -2px 14px;appearance:none;border:0;font:inherit;text-align:left;cursor:pointer;background:var(--paper);border-radius:12px;padding:8px 8px 8px 12px;color:var(--navy);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:center;box-shadow:inset 0 0 0 1px var(--border-on-dark)}
.k-words-bar .lm-eyebrow,.k-sheet .lm-eyebrow{font-size:10.5px}
.k-words-t{grid-column:1;font:600 13px/1.3 var(--font-display);letter-spacing:-.01em;color:#fff;text-wrap:balance}.k-words-bar .k-words-t{font-weight:700;color:var(--navy)}.k-words-bar{box-shadow:none!important}.k-words-bar .k-dshow{background:var(--navy);color:#fff}.k-words-t b{color:var(--teal-300);font-weight:700}.k-sheet-head{gap:10px}.k-dprev{grid-column:1;font-size:12px;color:var(--mist-300);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.k-dshow{grid-column:2;font:600 12px/1 var(--font-body);color:var(--navy);background:var(--yellow-500);border:0;border-radius:999px;padding:6px 11px;cursor:pointer}
.k-sheet{position:absolute;left:0;right:0;bottom:0;top:34%;z-index:2;background:var(--navy-raised);border-radius:24px 24px 0 0;padding:10px 14px 16px;display:flex;flex-direction:column;gap:12px;box-shadow:0 -24px 40px -12px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.08);animation:k-up .3s var(--ease-out)}
.k-sheet-grab{width:36px;height:4px;border-radius:2px;background:rgba(255,255,255,.25);align-self:center}
.k-sheet-head{display:flex;justify-content:space-between;align-items:center}
.k-dwords{display:flex;flex-wrap:wrap;gap:5px;overflow:auto;align-content:flex-start;min-height:0;flex:1}
@keyframes k-up{from{transform:translateY(100%)}to{transform:none}}
.k-how{padding-block:0 96px}.k-how-stage{min-height:100vh;min-height:100svh;display:grid;align-content:center;padding-block:64px}.k-how-stage>.k-center{justify-items:center;text-align:center;max-width:none;margin:0}.k-how-stage>.k-center .lm-h2{font-size:clamp(48px,7vw,104px);line-height:.95;letter-spacing:-.05em}
.k-flow{--ts:clamp(40px,5vw,84px);display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr);gap:28px;align-items:start;margin-top:clamp(72px,14vh,144px)}
.k-flow-step{display:grid;gap:18px;opacity:0;transform:translateY(28px);transition:opacity .7s var(--ease-out) var(--d),transform .7s var(--ease-out) var(--d)}
.k-flow-bar{height:3px;border-radius:2px;background:var(--k-c);transform:scaleX(0);transform-origin:left;transition:transform .8s var(--ease-out) calc(var(--d) + .15s)}
.k-flow-t{margin:0;font:800 var(--ts)/.92 var(--font-display);letter-spacing:-.055em;color:var(--k-c);white-space:nowrap}
.k-flow-b{margin:0;font:400 17px/1.55 var(--font-body);color:var(--mist-200);max-width:30ch;text-wrap:pretty}
.k-flow-step--coral,.k-flow-arrow--coral{--k-c:var(--coral-500)}.k-flow-step--teal,.k-flow-arrow--teal{--k-c:var(--teal-500)}.k-flow-step--yellow,.k-flow-arrow--yellow{--k-c:var(--yellow-500)}
.k-flow-arrow{font:300 calc(var(--ts)*.6)/1 var(--font-display);color:var(--mist-400);padding-top:calc(21px + var(--ts)*.16);opacity:0;transform:translateX(-16px);transition:opacity .5s var(--ease-out) var(--d),transform .5s var(--ease-out) var(--d)}
.k-flow.is-in .k-flow-step,.k-flow.is-in .k-flow-arrow{opacity:1;transform:none}.k-flow.is-in .k-flow-bar{transform:none}
@media (min-width:821px){.k-flow{grid-template-rows:auto auto auto;row-gap:18px}.k-flow-step{grid-row:span 3;grid-template-rows:subgrid;gap:18px}.k-flow-arrow{grid-row:2;align-self:center;padding-top:0}.k-flow>:nth-child(1){grid-column:1}.k-flow>:nth-child(2){grid-column:2}.k-flow>:nth-child(3){grid-column:3}.k-flow>:nth-child(4){grid-column:4}.k-flow>:nth-child(5){grid-column:5}}
@media (max-width:820px){.k-flow{--ts:clamp(44px,12vw,64px);grid-template-columns:minmax(0,1fr);gap:20px}.k-flow-arrow{padding-top:0;transform:translateY(-12px) rotate(90deg);justify-self:start}.k-flow.is-in .k-flow-arrow{transform:rotate(90deg)}}
@media (prefers-reduced-motion:reduce){.k-flow-step,.k-flow-arrow,.k-flow-bar{transition:none;opacity:1;transform:none}.k-flow-arrow{transform:none}}
.k-how .k-flow-sr{background:rgba(255,255,255,.03);box-shadow:inset 0 0 0 1px var(--border-on-dark);margin-top:0}
.k-flow-sr{background:var(--navy);color:#fff;border-radius:var(--radius-2xl);padding:56px clamp(20px,4vw,48px) 36px;margin-top:12px}.k-flow-sr .k-center{max-width:56ch}.k-flow-sr .k-center .lm-body{color:var(--mist-300);text-wrap:balance}.k-flow-sr .k-sr-scroll{margin-top:48px}.k-flow-sr .k-mem-note{margin-top:16px}
.k-src-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:32px}#library{padding-block:64px}
@media (max-width:900px){.k-src-grid{grid-template-columns:minmax(0,1fr)}}
.k-src{background:rgba(255,255,255,.03);box-shadow:inset 0 0 0 1px var(--border-on-dark);border-radius:var(--radius-2xl);padding:22px;display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.k-src-lead{color:var(--mist-300);margin:0;min-height:3.1em;text-wrap:pretty}
.k-lib{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:10px;width:100%;max-width:400px}.k-stage{flex:1;width:100%;margin-top:6px;border-radius:var(--radius-xl);background:rgba(255,255,255,.035);display:grid;place-items:center;padding:20px}.k-shot{width:160px;max-width:100%;padding:5px;border-radius:26px;background:var(--navy-ink);box-shadow:0 30px 60px -30px rgba(0,0,0,.7),inset 0 0 0 1px rgba(255,255,255,.08)}.k-shot img{width:100%;border-radius:21px}
.k-note-hold{width:100%;display:grid;justify-items:center;padding:14px 0 6px}
.k-ways{display:grid;gap:22px;width:100%;max-width:340px}
.k-way{display:grid;grid-template-columns:56px minmax(0,1fr);gap:18px;align-items:start}.k-way h4{padding-top:4px}.k-way-ic{width:56px;height:56px;border-radius:16px;background:var(--navy-raised);box-shadow:inset 0 0 0 1px var(--border-on-dark);color:var(--yellow-500);display:grid;place-items:center}.k-way-ic svg{width:26px;height:26px}.k-way h4{margin:0 0 4px;font:700 18px/1.25 var(--font-display);letter-spacing:-.01em;color:#fff}.k-way p{margin:0;font-size:14px;line-height:1.45;color:var(--mist-300)}
.k-lib-note{text-wrap:balance;text-align:center;color:var(--mist-300);margin:24px auto 0;max-width:60ch}.k-lib-note b{color:#fff}
.k-cite{font:600 13px var(--font-body);color:var(--yellow-500);text-underline-offset:3px}
.k-sr-scroll{overflow-x:auto;margin:64px -20px 0;padding:0 20px 8px;scrollbar-width:thin}.k-sr{position:relative;height:210px;min-width:720px;max-width:760px;margin:0 auto}
.k-sr-line{position:absolute;left:0;right:0;top:92.5px;height:3px;border-radius:2px;background:linear-gradient(90deg,var(--coral-500),var(--yellow-500),var(--teal-500))}
.k-sr-stop{position:absolute;top:0;width:110px;transform:translateX(-50%);display:grid;grid-template-areas:"day" "dot" "lbl";justify-items:center;text-align:center}
.k-sr-stop.is-first{transform:none;justify-items:start;text-align:left}.k-sr-stop.is-last{transform:translateX(-100%);justify-items:end;text-align:right}
.k-sr-day{grid-area:day;height:84px;display:flex;flex-direction:column;justify-content:flex-end;font:800 52px/.9 var(--font-display);letter-spacing:-.05em;color:#fff}
.k-sr-day small{font:600 11px/1 var(--font-body);letter-spacing:.12em;text-transform:uppercase;color:var(--mist-300);margin-bottom:6px}
.k-sr-dot{grid-area:dot;width:22px;height:22px;margin:-1px 0 0;border-radius:50%;background:var(--navy);border:3px solid var(--yellow-500);box-sizing:border-box}
.k-sr-stop.is-first .k-sr-dot{background:var(--coral-500);border-color:var(--coral-500)}.k-sr-stop.is-last .k-sr-dot{border-color:var(--teal-500)}
.k-sr-lbl{grid-area:lbl;margin-top:14px;font:400 13.5px/1.35 var(--font-body);color:var(--mist-200)}
.k-sr-gap{position:absolute;top:97px;transform:translate(-50%,-50%);background:var(--navy);box-shadow:inset 0 0 0 1px var(--border-on-dark-strong);border-radius:999px;padding:5px 10px;font:600 11px/1 var(--font-body);color:var(--mist-200);white-space:nowrap}

.k-mem-note{text-wrap:balance;text-align:center;font-size:13px;color:var(--mist-400);margin:28px auto 0;max-width:70ch}
.k-boost{padding-block:120px}
.k-boost-h{font:800 clamp(52px,9vw,128px)/.92 var(--font-display);letter-spacing:-.055em;margin:0;max-width:13ch;text-wrap:balance}
.k-boost-lead{font:500 clamp(19px,2vw,23px)/1.45 var(--font-body);letter-spacing:-.01em;color:var(--mist-200);margin:40px 0 0;max-width:52ch;text-wrap:pretty}
.k-boost-ref{margin:16px 0 0;font:400 13px/1.5 var(--font-body);color:var(--mist-400);max-width:70ch}
.k-boost-more{margin-top:32px;color:#fff}
.k-chev{display:inline-block;transition:transform var(--dur-base) var(--ease-out)}.k-chev.is-open{transform:rotate(180deg)}
.k-boost .k-sci{max-width:none;margin-top:32px}
.k-sci{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:44px auto 0;max-width:900px}
@media (max-width:640px){.k-sci{grid-template-columns:minmax(0,1fr)}}
.k-billing{display:flex;justify-content:center;margin-top:32px}
.k-plans{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:32px;align-items:stretch}
@media (max-width:980px){.k-plans{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:560px){.k-plans{grid-template-columns:minmax(0,1fr)}}
.k-fine{text-align:center;color:var(--mist-300);font-size:14px;margin-top:24px}
.k-final{text-align:center}.k-final .k-wrap{display:grid;justify-items:center;gap:14px}.k-final .lm-lead{color:var(--slate-700)}.k-final .lm-btn{margin-top:12px}
.k-footer{background:var(--navy-deep);padding-block:28px;text-align:center;font-size:14px;color:var(--mist-300)}.k-footer a{color:var(--mist-300)}

/* Small additions */
[hidden]{display:none!important}
#step-ask,#step-done{display:grid;gap:14px}
.k-sci[hidden]{display:none}
.lm-plan{container-type:inline-size}
.lm-plan__amt{white-space:nowrap;font-size:clamp(30px,19cqi,40px)}
.k-shot img{height:auto}
/* Step titles must fit their column: 3 titles (longest "Save words" = 5.27em) + 2 arrows (.6em) + 4 gaps of 28px */
@media (min-width:821px){.k-flow{--ts:clamp(36px,calc((min(100vw - 40px,1040px) - 112px) / 17.4),84px)}}
/* A1 beginner example: "With English subtitles" flag on the level tile and the player cover; English parts of a transcript line are quieter than the German */
.k-lvl-tile{position:relative}
.k-flag{position:absolute;top:12px;right:12px;display:inline-flex;align-items:center;gap:5px;font:700 10.5px/1 var(--font-body);letter-spacing:.02em;color:#fff;background:var(--navy);border-radius:999px;padding:5px 9px 5px 7px;white-space:nowrap}
.k-flag::before{content:"CC";font:800 8.5px/1 var(--font-body);letter-spacing:.04em;color:var(--navy);background:#fff;border-radius:3px;padding:2px 3px}
.k-flag--cover{position:relative;top:auto;right:auto;align-self:flex-start;margin:8px 0 auto}
.k-tx-en{color:var(--mist-300,#b9c3d4);font-style:italic}
.k-tx-row.is-now .k-tx-en{color:var(--mist-200)}
/* speed button between the two times under the scrub bar */
.k-a-rate{appearance:none;border:0;cursor:pointer;min-width:44px;padding:5px 9px;border-radius:999px;font:700 11.5px/1 var(--font-body);font-variant-numeric:tabular-nums;color:var(--navy);background:var(--mist-200);transition:background .15s ease,transform .12s ease}
.k-a-rate:hover{background:#fff}.k-a-rate:active{transform:scale(.95)}.k-a-rate:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px}
.k-a-rate.is-changed{background:var(--yellow-500)}
/* timeline stops: short title + optional learning-step tag */
.k-sr-lbl{display:grid;gap:7px;justify-items:inherit}
.k-sr-lbl b{font:700 15px/1.2 var(--font-display);letter-spacing:-.01em;color:#fff}
.k-sr-tag{display:inline-block;max-width:118px;font:600 11px/1.25 var(--font-body);padding:4px 8px;border-radius:8px;text-wrap:balance}
.k-sr-tag--ex{color:var(--yellow-500);background:rgba(255,210,63,.12);box-shadow:inset 0 0 0 1px rgba(255,210,63,.35)}
.k-sr-tag--ai{color:var(--teal-300);background:rgba(94,196,182,.12);box-shadow:inset 0 0 0 1px rgba(94,196,182,.4)}
/* four stops: the timeline fits narrower screens without scrolling */
.k-sr{min-width:540px}
/* every stop centred on its dot, the line runs from the first dot to the last */
.k-sr-stop.is-first,.k-sr-stop.is-last{transform:translateX(-50%);justify-items:center;text-align:center}
.k-sr-line{left:55px;right:55px}
/* waitlist error + consent link */
.k-wl-err{margin:10px 0 0;font:500 13px/1.4 var(--font-body);color:var(--coral-500)}
.lm-dialog__consent a{color:inherit;text-decoration:underline;text-underline-offset:2px}
/* phones: the timeline turns vertical (day | dot | title + tag), no sideways scrolling */
@media (max-width:600px){
  .k-sr-scroll{overflow:visible;margin:40px 0 0;padding:0}
  .k-sr{min-width:0;max-width:none;width:fit-content;margin-inline:auto;height:auto;display:grid;gap:26px}
  .k-sr-line{display:none}
  .k-sr-stop,.k-sr-stop.is-first,.k-sr-stop.is-last{position:relative;left:auto!important;top:auto;width:auto;transform:none!important;display:grid;grid-template-columns:58px 22px 1fr;grid-template-areas:"day dot lbl";column-gap:14px;align-items:center;justify-items:start;text-align:left}
  .k-sr-day{height:auto;justify-self:end;align-items:flex-end;text-align:right;font-size:40px}
  .k-sr-day small{margin-bottom:4px}
  .k-sr-dot{position:relative;z-index:1;margin:0}
  .k-sr-lbl{margin-top:0;justify-items:start;text-align:left}
  /* line segment from each dot down to the next one */
  .k-sr-stop:not(.is-last)::after{content:"";position:absolute;left:calc(58px + 14px + 9.5px);top:50%;width:3px;height:calc(100% + 26px);border-radius:2px;background:var(--yellow-500)}
  .k-sr-stop.is-first::after{background:linear-gradient(180deg,var(--coral-500),var(--yellow-500))}
  .k-sr-stop:nth-last-child(2)::after{background:linear-gradient(180deg,var(--yellow-500),var(--teal-500))}
}
/* Founder voice note in the hero: glowing orb player (handoff orb-player.md, exploration 5a) */
.k-hero-head{display:grid;grid-template-columns:minmax(0,1fr);gap:40px;align-items:center}
@media (min-width:1000px){.k-hero-head{grid-template-columns:minmax(0,1fr) 250px;gap:28px}.k-orb-wrap{padding-top:0}}
.k-orb-wrap{justify-self:center}
@media (max-width:999px){.k-hero-head{gap:28px}.k-orb-wrap{order:-1;padding-top:24px}}
/* laptop: the orb grows into the free margin right of the wrap, the headline keeps its three lines */
@media (min-width:1000px) and (max-width:1199px){.orb-player{scale:1.2}}
@media (min-width:1200px){.orb-player{scale:1.45;translate:44px 0}}
.orb-player{position:relative;width:250px;height:250px;margin-inline:auto}
.orb-glow{position:absolute;border-radius:50%;pointer-events:none}
.orb-glow--halo{inset:-30px;background:var(--teal-500);filter:blur(60px);opacity:.35}
.orb-glow--coral{left:10px;top:20px;width:160px;height:160px;background:var(--coral-500);filter:blur(36px);opacity:.9}
.orb-glow--teal{right:0;top:50px;width:160px;height:160px;background:var(--teal-500);filter:blur(36px);opacity:.95}
.orb-glow--yellow{left:60px;bottom:0;width:150px;height:150px;background:var(--yellow-500);filter:blur(36px);opacity:.85}
.orb-play{position:absolute;left:50%;top:50%;translate:-50% -50%;width:76px;height:76px;padding:0;border-radius:50%;background:rgba(255,255,255,.18);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.4);display:grid;place-items:center;cursor:pointer;transition:scale var(--dur-base) var(--ease-out)}
.orb-play:hover{scale:1.05}.orb-play:active{scale:.95}
.orb-play:focus-visible{outline:3px solid var(--teal-500);outline-offset:3px}
.orb-play__tri{border-left:20px solid #fff;border-top:12px solid transparent;border-bottom:12px solid transparent;margin-left:6px}
.orb-play__pause{display:none;gap:6px}.orb-play__pause i{width:6px;height:22px;border-radius:2px;background:#fff}
.orb-player.is-playing .orb-play__tri{display:none}.orb-player.is-playing .orb-play__pause{display:flex}
@keyframes orb-a{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(24px,-14px) scale(1.12)}66%{transform:translate(-10px,18px) scale(.92)}}
@keyframes orb-b{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(-22px,16px) scale(.9)}66%{transform:translate(14px,-20px) scale(1.1)}}
@keyframes orb-c{0%,100%{transform:translate(0,0) scale(1)}33%{transform:translate(18px,20px) scale(1.08)}66%{transform:translate(-24px,-8px) scale(.94)}}
@keyframes orb-hue{0%,100%{background-color:#F26B5B}33%{background-color:#FFD23F}66%{background-color:#25B3AA}}
@keyframes orb-pulse{to{opacity:.55}}
/* all animations attached at all times, only running while playing, so pausing freezes the current state */
.orb-glow--coral{animation:orb-a 7s ease-in-out infinite,orb-hue 9s linear infinite}
.orb-glow--teal{animation:orb-b 9s ease-in-out -2s infinite,orb-hue 11s linear -7s infinite}
.orb-glow--yellow{animation:orb-c 8s ease-in-out -4s infinite,orb-hue 12s linear -4s infinite}
.orb-glow--halo{animation:orb-pulse 4s ease-in-out infinite alternate,orb-hue 10s linear -6.6s infinite}
.orb-glow{animation-play-state:paused}
.orb-player.is-playing .orb-glow{animation-play-state:running}
@media (prefers-reduced-motion:reduce){.orb-player .orb-glow{animation:none!important}}
/* phone hero: centred like the orb mock (orb, headline, lead, button) */
@media (max-width:640px){
  .k-hero-copy{justify-items:center;text-align:center;gap:18px}
  .k-hero-copy>.lm-eyebrow{display:none}
  .k-hero .lm-display{font-size:min(38px,calc((100vw - 40px) / 8.8));font-weight:600;letter-spacing:-.04em;line-height:1.04}
  .k-hero .k-soft{max-width:30ch;font-size:16px;line-height:1.55;color:#B9C2D6}
  .k-hero .k-logo{font-weight:600;font-size:19px;letter-spacing:-.02em}
  .k-hero .k-top .lm-btn--link{font-weight:500;font-size:14px;color:var(--mist-300)}
  .k-cta-row{flex-direction:column;justify-content:center;gap:12px}
  .k-price-note{text-align:center}
}
.lm-dialog:focus{outline:none}
