html,body{margin:0;background:#000;color:#fff}
html{scroll-behavior:smooth}
@font-face{font-family:"Inter Tight";src:url("./assets/inter-tight-cyrillic.woff2") format("woff2");font-style:normal;font-weight:100 900;font-display:swap;unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Inter Tight";src:url("./assets/inter-tight-latin.woff2") format("woff2");font-style:normal;font-weight:100 900;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}


@font-face{font-family:"KBebas";src:url("./assets/bebas-neue-bold.woff") format("woff");font-weight:400;font-display:swap}




.kk{display:block;margin:0;--y:#C6FC04;--w:#fff;--g:#9a9a9a;--d:#1a1a1a;--line:#2b2b2b;background:#000;color:#fff;font-family:"Inter Tight",system-ui,-apple-system,sans-serif;font-weight:500;line-height:1.45;-webkit-font-smoothing:antialiased;overflow:hidden;width:100%}

.kk *{box-sizing:border-box;margin:0;padding:0}

.kk .wrap{max-width:1040px;margin:0 auto;padding:0 20px}

.kk .h{font-family:"KBebas","Inter Tight",sans-serif;font-weight:400;text-transform:uppercase;line-height:.98;letter-spacing:-.01em}

.kk .y{color:var(--y)}

.kk p{font-size:17px;color:#dcdcdc;max-width:680px}

.kk b{color:#fff;font-weight:700}

.kk section{padding:72px 0;border-top:1px solid var(--line)}

.kk .hero{padding:56px 20px 64px;border:0;position:relative}

.kk .logo{display:flex;align-items:center;gap:10px;font:800 20px "Inter Tight",sans-serif;color:var(--y);letter-spacing:.01em;margin-bottom:46px}

.kk .kicker{font:600 13px/1 "Inter Tight",sans-serif;letter-spacing:.22em;text-transform:uppercase;color:var(--g);margin-bottom:16px}

.kk .hero .h{font-size:clamp(54px,11vw,120px)}


.kk .hero p{margin-top:22px;font-size:19px}

.kk .toc{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px;margin-top:40px}

.kk .toc a{display:block;border:1.5px solid var(--line);border-radius:14px;padding:12px 14px;color:#fff;text-decoration:none;font-size:14px;transition:border-color .2s}

.kk .toc a:hover{border-color:var(--y)}

.kk .toc a span{display:block;font:400 26px/1 "KBebas",sans-serif;color:var(--y);margin-bottom:4px}

.kk .chap{display:flex;align-items:center;gap:16px;margin-bottom:22px}

.kk .chap .num{flex:none;width:58px;height:58px;border:3px solid var(--y);border-radius:50%;display:flex;align-items:center;justify-content:center;font:400 34px/1 "KBebas",sans-serif;color:var(--y)}

.kk .chap .tag{font:600 12px/1 "Inter Tight",sans-serif;letter-spacing:.22em;text-transform:uppercase;color:var(--g)}

.kk h2.h{font-size:clamp(40px,7vw,72px);margin-bottom:18px}

.kk h3.h{font-size:clamp(28px,4.4vw,40px);margin:46px 0 14px}

.kk .lead{font-size:19px;margin-bottom:26px}

.kk .art{width:100%;height:auto;display:block;margin:26px 0 8px;overflow:visible}

.kk .art .s{fill:none;stroke:#fff;stroke-width:4;stroke-linecap:round;stroke-linejoin:round}

.kk .art .sy{fill:none;stroke:var(--y);stroke-width:4;stroke-linecap:round;stroke-linejoin:round}

.kk .art .fy{fill:var(--y);stroke:var(--y);stroke-width:3}

.kk .art .fd{fill:#333;stroke:#fff;stroke-width:3}

.kk .art text{font-family:"KBebas","Inter Tight",sans-serif;fill:#fff}

.kk .art .t{font-family:"Inter Tight",sans-serif;font-weight:600}

.kk .grid{display:grid;gap:12px}

.kk .g2{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}

.kk .g3{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}

.kk .card{background:var(--d);border-radius:22px;padding:22px 22px 20px;position:relative}

.kk .card.w{background:#fff;color:#111}

.kk .card.w p,.kk .card.w b{color:#111}

.kk .card.yb{background:var(--y);color:#000}

.kk .card.yb p,.kk .card.yb b{color:#000}

.kk .card .h{font-size:30px;margin-bottom:8px}

.kk .card p{font-size:15.5px}

.kk .card .em{font-size:34px;line-height:1;margin-bottom:12px;display:block}

.kk .badge{display:inline-flex;align-items:center;justify-content:center;min-width:34px;height:34px;padding:0 8px;border-radius:17px;background:var(--y);color:#000;font:400 22px/1 "KBebas",sans-serif;margin-bottom:12px}

.kk .msg{background:#fff;color:#111;border-radius:22px;padding:20px 22px;font-style:italic;font-size:16.5px;line-height:1.55;max-width:760px}

.kk .msg i.v{font-style:italic;font-weight:700;background:var(--y);padding:0 4px;border-radius:4px}

.kk .pills{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}

.kk .pill{background:var(--y);color:#000;border-radius:999px;padding:6px 12px;font-size:13px;font-weight:700}

.kk .pill.o{background:none;color:#fff;border:1.5px solid #444}

.kk .quote{border-left:4px solid var(--y);padding:4px 0 4px 18px;margin:20px 0;font-size:19px;color:#fff;max-width:720px}

.kk .steps{counter-reset:s;display:grid;gap:10px}

.kk .step{display:flex;gap:16px;align-items:flex-start;background:var(--d);border-radius:18px;padding:16px 18px}

.kk .step .n{flex:none;width:40px;height:40px;border-radius:50%;background:var(--y);color:#000;display:flex;align-items:center;justify-content:center;font:400 26px/1 "KBebas",sans-serif}

.kk .step b{display:block;font-size:17px;margin-bottom:2px}

.kk .step span{color:#bdbdbd;font-size:15px}

.kk .road{position:relative;display:grid;gap:0;margin-top:10px}

.kk .road .st{display:flex;gap:16px;align-items:center;padding:10px 0;position:relative}

.kk .road .st:before{content:"";position:absolute;left:21px;top:0;bottom:0;border-left:3px dashed var(--y);opacity:.6}

.kk .road .st:first-child:before{top:50%}

.kk .road .st:last-child:before{bottom:50%}

.kk .road .n{position:relative;z-index:1;flex:none;width:44px;height:44px;border-radius:50%;background:var(--y);color:#000;display:flex;align-items:center;justify-content:center;font:400 28px/1 "KBebas",sans-serif}

.kk .road b{font-size:18px}

.kk .road span{color:#bdbdbd;font-size:15px;display:block}

.kk table.kt{width:100%;border-collapse:separate;border-spacing:0;font-size:15px;background:#fff;color:#111;border-radius:18px;overflow:hidden}

.kk table.kt th{background:#111;color:var(--y);text-align:left;font:600 12px "Inter Tight",sans-serif;letter-spacing:.14em;text-transform:uppercase;padding:12px 14px}

.kk table.kt td{padding:11px 14px;border-top:1px solid #e8e8e8;vertical-align:top}

.kk table.kt td:first-child{font-weight:700;width:38%}

.kk .bars{display:flex;align-items:flex-end;gap:14px;height:260px;margin:30px 0 8px;border-bottom:3px solid #fff;padding:0 6px}

.kk .bar{flex:1;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;height:100%}

.kk .bar .col{flex:none;width:72%;max-width:150px;background:#333;border:3px solid #fff;border-bottom:0;border-radius:10px 10px 0 0}

.kk .bar.hl .col{background:var(--y);border-color:var(--y)}

.kk .bar .v{font:400 clamp(26px,4vw,44px)/1 "KBebas",sans-serif;margin-bottom:8px}

.kk .bar.hl .v{color:var(--y)}

.kk .barlbl{display:flex;gap:14px;padding:10px 6px 0}

.kk .barlbl div{flex:1;text-align:center;font-size:13px;color:#bdbdbd}

.kk .barlbl b{display:block;font:400 22px/1.1 "KBebas",sans-serif;color:#fff}

.kk .big{font:400 clamp(60px,13vw,150px)/.95 "KBebas","Inter Tight",sans-serif;color:var(--y);margin:10px 0 6px;white-space:nowrap}

.kk .hbar{margin:12px 0}

.kk .hbar .lbl{display:flex;justify-content:space-between;font-size:14px;color:#bdbdbd;margin-bottom:6px}

.kk .hbar .lbl b{font:400 24px/1 "KBebas",sans-serif;color:#fff}

.kk .hbar .tr{height:34px;border-radius:9px;background:#1d1d1d;overflow:hidden}

.kk .hbar .fill{height:100%;border-radius:9px;background:#fff;transform-origin:left}

.kk .hbar.hl .fill{background:var(--y)}

.kk .funnel{display:grid;gap:6px;justify-items:center;margin:24px 0}

.kk .funnel div{height:62px;display:flex;align-items:center;justify-content:center;gap:8px;border-radius:12px;background:#222;border:2px solid #fff;font:400 32px/1 "KBebas",sans-serif}

.kk .funnel div small{font:500 14px "Inter Tight",sans-serif;color:#cfcfcf}

.kk .funnel div.hl{background:var(--y);border-color:var(--y);color:#000}

.kk .funnel div.hl small{color:#000}

.kk .cal{display:grid;grid-template-columns:repeat(7,1fr);gap:6px;margin-top:18px}

.kk .cal div{border:2px solid #444;border-radius:12px;padding:10px 8px;min-height:120px;font-size:13px;color:#cfcfcf}

.kk .cal div b{display:block;font:400 26px/1 "KBebas",sans-serif;color:var(--y);margin-bottom:6px}

.kk .cal div.hl{background:var(--y);border-color:var(--y);color:#000}

.kk .cal div.hl b{color:#000}

.kk .task{background:#fff;color:#111;border-radius:26px;padding:28px 26px;margin-top:30px}

.kk .task .tg{display:inline-block;border:2px solid var(--y);background:var(--y);color:#000;border-radius:10px;padding:4px 12px;font:400 22px/1 "KBebas",sans-serif;margin-bottom:12px}

.kk .task .h{font-size:clamp(30px,5vw,46px);color:#111}

.kk .task .h .a{color:#111}

.kk .checks{display:grid;gap:10px;margin-top:8px}

.kk .ck{display:flex;gap:14px;align-items:flex-start;background:var(--d);border-radius:16px;padding:14px 16px}

.kk .ck i{flex:none;width:26px;height:26px;border-radius:7px;border:2.5px solid var(--y);margin-top:1px}

.kk .ck b{display:block}

.kk .ck span{color:#bdbdbd;font-size:15px}

.kk .foot{padding:56px 0 70px;border-top:1px solid var(--line);text-align:center}

.kk .foot p{margin:12px auto 0;color:var(--g);font-size:14px}

@media (max-width:640px){.kk section{padding:54px 0}
.kk .cal{grid-template-columns:repeat(2,1fr)}
.kk .cal div{min-height:0}
.kk p,.kk .lead{font-size:16px}
.kk .bars{height:200px}
}

.kk .mx{margin:22px 0 6px;padding:34px 0 34px}

.kk .mx .q{position:relative;display:grid;grid-template-columns:1fr 1fr}

.kk .mx .cell{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:24px 10px;min-height:190px}

.kk .mx .ic{display:flex;align-items:center;gap:8px;margin-bottom:8px;font-size:34px;line-height:1}

.kk .mx .ic .badge{margin:0}

.kk .mx .cell .h{font-size:clamp(24px,3.4vw,40px)}

.kk .mx .cell p{font-size:14px;color:#bdbdbd;margin-top:4px}

.kk .mx .ax{position:absolute;background:#fff;border-radius:2px}

.kk .mx .ax.hx{left:0;right:0;top:50%;height:3px;margin-top:-1.5px}

.kk .mx .ax.vy{top:0;bottom:0;left:50%;width:3px;margin-left:-1.5px}

.kk .mx .ax:before,.kk .mx .ax:after{content:"";position:absolute;width:13px;height:13px;border:solid #fff;border-width:3px 3px 0 0}

.kk .mx .hx:before{left:1px;top:-6.5px;transform:rotate(-135deg)}
.kk .mx .hx:after{right:1px;top:-6.5px;transform:rotate(45deg)}

.kk .mx .vy:before{top:1px;left:-6.5px;transform:rotate(-45deg)}
.kk .mx .vy:after{bottom:1px;left:-6.5px;transform:rotate(135deg)}

.kk .mx .lb{position:absolute;font-size:13px;font-weight:700;color:var(--y);line-height:1.15;white-space:nowrap}

.kk .mx .lb.l{left:0;top:calc(50% + 12px)}
.kk .mx .lb.r{right:0;top:calc(50% + 12px);text-align:right}

.kk .mx .lb.t{left:calc(50% + 12px);top:-30px}
.kk .mx .lb.b{left:calc(50% + 12px);bottom:-30px}

.kk .mx-pair{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:30px}

.kk .mx-pair .mx{padding-top:30px}

.kk .mx-pair .mx .cell{min-height:150px;padding:18px 8px}

.kk .mx-pair .ttl{font:400 clamp(34px,5vw,52px)/1 "KBebas",sans-serif;text-align:center;text-transform:uppercase}

.kk .shots{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;margin:20px 0 6px}

.kk .shot{background:#1a1a1a;border-radius:16px;overflow:hidden;border:3px solid #fff}

.kk .shot img{display:block;width:100%;height:auto}

.kk .shot div{padding:10px 14px 12px;font-size:14px;color:#cfcfcf}

.kk .shot div b{display:block;color:#fff;font-size:16px}

.kk.kk-js .mx .hx{transform:scaleX(0);transition:transform .9s cubic-bezier(.22,.8,.26,1)}

.kk.kk-js .mx .vy{transform:scaleY(0);transition:transform .9s cubic-bezier(.22,.8,.26,1) .15s}

.kk.kk-js .in .mx .hx,.kk.kk-js .in .mx .vy,.kk.kk-js .mx.in .hx,.kk.kk-js .mx.in .vy{transform:none}

.kk.kk-js .mx .cell,.kk.kk-js .mx .lb{opacity:0;transform:translateY(10px);transition:opacity .6s,transform .6s cubic-bezier(.22,.8,.26,1)}

.kk.kk-js .in .mx .cell,.kk.kk-js .in .mx .lb{opacity:1;transform:none}

@media (max-width:640px){.kk .mx .cell{min-height:150px;padding:18px 4px}
.kk .mx .lb{font-size:11px}
}

/* анимация: только когда есть JS (класс kk-js), иначе всё видно сразу */
.kk.kk-js [data-a]{opacity:0;transform:translateY(18px);transition:opacity .7s cubic-bezier(.22,.8,.26,1),transform .7s cubic-bezier(.22,.8,.26,1)}

.kk.kk-js [data-a].in{opacity:1;transform:none}

.kk.kk-js .bars .col{transform:scaleY(0);transform-origin:bottom;transition:transform 1s cubic-bezier(.22,.8,.26,1)}

.kk.kk-js .in .bars .col,.kk.kk-js .bars.in .col{transform:none}

.kk.kk-js .hbar .fill{transform:scaleX(0);transition:transform 1.2s cubic-bezier(.22,.8,.26,1) .2s}

.kk.kk-js .in .hbar .fill{transform:none}

.kk.kk-js .funnel div{transform:scaleX(.2);opacity:0;transition:transform .8s cubic-bezier(.22,.8,.26,1),opacity .5s}

.kk.kk-js .in .funnel div{transform:none;opacity:1}

.kk.kk-js .stagger > *{opacity:0;transform:translateY(14px);transition:opacity .6s,transform .6s cubic-bezier(.22,.8,.26,1)}

.kk.kk-js .in .stagger > *,.kk.kk-js .stagger.in > *{opacity:1;transform:none}

.kk.kk-js .art .pop{transform-box:fill-box;transform-origin:center;transform:scale(0);transition:transform .6s cubic-bezier(.3,1.4,.5,1)}

.kk.kk-js .in .art .pop{transform:none}

.kk.kk-js .art .grow{transform-box:fill-box;transform-origin:bottom;transform:scaleY(0);transition:transform 1s cubic-bezier(.22,.8,.26,1)}

.kk.kk-js .in .art .grow{transform:none}

@media (prefers-reduced-motion:reduce){.kk.kk-js:not([data-motion="on"]) [data-a],.kk.kk-js:not([data-motion="on"]) .stagger>*,.kk.kk-js:not([data-motion="on"]) .bars .col,.kk.kk-js:not([data-motion="on"]) .hbar .fill,.kk.kk-js:not([data-motion="on"]) .funnel div,.kk.kk-js:not([data-motion="on"]) .art .pop,.kk.kk-js:not([data-motion="on"]) .art .grow{opacity:1!important;transform:none!important;transition:none!important}
}


/* ── v2.0: связки, истории, больше рисунков */
.kk .art .sk{fill:none;stroke:#000;stroke-width:4;stroke-linecap:round;stroke-linejoin:round}

.kk .bridge{font-size:18px;color:#cfcfcf;max-width:720px;margin:22px 0 0;padding-left:18px;border-left:3px solid #333}

.kk .bridge b{color:var(--y)}

.kk h4.h{font-size:clamp(24px,3.4vw,30px);margin:30px 0 10px}

.kk .sub{margin-top:12px}

.kk .bel{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}

.kk .bel .w2{grid-column:span 2}

.kk .bel .card p{margin-top:2px}

.kk .split{display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:center}

.kk .story{display:grid;grid-template-columns:1.15fr .85fr;gap:26px;align-items:center;margin-top:8px}

.kk .story.rev{grid-template-columns:.85fr 1.15fr}

.kk .ph{display:grid;gap:12px;margin:18px 0}

.kk .ph.two{grid-template-columns:1fr 1fr}

.kk .ph.three{grid-template-columns:repeat(3,1fr)}

.kk .ph img{display:block;width:100%;height:auto;border-radius:18px;border:3px solid #fff;background:#111}

.kk .ph .tl{transform:rotate(-2deg)}
.kk .ph .tr{transform:rotate(2deg)}

.kk .ph figcaption{font-size:14px;color:#9a9a9a;grid-column:1/-1}

.kk .chat{display:grid;gap:10px;max-width:660px;margin:18px 0}

.kk .chat .m{max-width:86%;padding:12px 16px;border-radius:20px;font-size:16px;line-height:1.45}

.kk .chat .me{justify-self:end;background:#fff;color:#111;border-bottom-right-radius:6px}

.kk .chat .they{justify-self:start;background:#2a2a2a;color:#eee;border-bottom-left-radius:6px}

.kk .chat .who{display:block;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#888;margin-bottom:4px}

.kk .srch{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:14px 16px;margin:18px 0}

.kk .srch .q{border:2.5px solid #fff;border-radius:999px;padding:11px 18px;font-style:italic;font-size:16px}

.kk .srch small{display:block;color:var(--y);font-weight:700;font-size:13px;margin:7px 0 0 20px}

.kk .vs{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:16px 0}

.kk .vs .card{padding-top:58px}

.kk .vs .mk{position:absolute;top:16px;left:18px;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:17px}

.kk .vs .bad .mk{background:#ff5a5a;color:#fff}
.kk .vs .good .mk{background:#111;color:var(--y)}

.kk .vs .card p{font-style:italic;font-size:16px}

.kk .split3{display:flex;gap:8px;margin:18px 0 8px}

.kk .split3 div{border-radius:16px;padding:14px 10px;text-align:center;font:400 clamp(34px,6vw,54px)/1 "KBebas",sans-serif}

.kk .split3 small{display:block;font:600 13px "Inter Tight",sans-serif;margin-bottom:6px}

.kk .warn{display:grid;grid-template-columns:120px 1fr;gap:22px;align-items:center;margin-top:22px}

.kk .lst{display:grid;gap:8px}

.kk .lst div{display:flex;gap:12px;align-items:flex-start;font-size:16px;color:#ddd}

.kk .lst div:before{content:"";flex:none;width:10px;height:10px;border-radius:50%;background:var(--y);margin-top:7px}

.kk .eq{font:400 clamp(56px,10vw,110px)/.95 "KBebas",sans-serif;color:var(--y)}

.kk .g2x{grid-template-columns:1fr 1fr}
.kk .g3x{grid-template-columns:repeat(3,1fr)}

.kk .story .ph img{max-height:440px;object-fit:cover}

.kk .two-lv{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}

.kk .two-lv .card .lst div{color:#111}

.kk.kk-js .art .fade{opacity:0;transition:opacity .9s ease .5s}

.kk.kk-js .in .art .fade,.kk.kk-js .art.in .fade{opacity:1}

.kk.kk-js .art .growx{transform-box:fill-box;transform-origin:left;transform:scaleX(0);transition:transform 1.2s cubic-bezier(.22,.8,.26,1) .3s}

.kk.kk-js .in .art .growx{transform:none}

@media (max-width:900px){.kk .g3x{grid-template-columns:1fr 1fr}
.kk .bel{grid-template-columns:1fr 1fr}
.kk .bel .w2{grid-column:1/-1}
}

@media (max-width:640px){.kk .g2x,.kk .g3x,.kk .bel,.kk .split,.kk .story,.kk .story.rev,.kk .vs,.kk .two-lv{grid-template-columns:1fr}
.kk .ph.three{grid-template-columns:1fr 1fr}
.kk .warn{grid-template-columns:70px 1fr;gap:14px}
.kk .bridge{font-size:16px}
}

@media (prefers-reduced-motion:reduce){.kk.kk-js:not([data-motion="on"]) .art .fade,.kk.kk-js:not([data-motion="on"]) .art .growx{opacity:1!important;transform:none!important;transition:none!important}
}

/* отступы между абзацем и блоком после него (и наоборот), чтобы текст не слипался со вставкой */
.kk [data-a] > p + *:not(p):not(h3):not(h4):not(svg):not(.chap){margin-top:20px}

.kk [data-a] > *:not(p):not(h2):not(h3):not(h4):not(.chap) + p{margin-top:18px}

.kk [data-a] > p.lead + *:not(p):not(h3):not(h4):not(svg){margin-top:0}


/* ── 22.10.2026: мобильные версии рисунков. ART = both(десктоп, телефон) → на ≤640 px показывается .mob */
.kk .mob{display:none}

@media (max-width:640px){.kk .dsk{display:none}
.kk .mob{display:block}
}

@media (max-width:640px){.kk .mx .lb{font-size:13.5px}
}


/* ── 27.10.2026: место под скрин, который не нашли (правило Кристины) */
.kk .need{border:2px dashed var(--y);border-radius:18px;padding:22px 20px;margin:18px 0;color:var(--y);font-weight:700;font-size:16px;text-align:center;line-height:1.4;background:rgba(198,252,4,.05)}

.kk .need small{display:block;color:#bdbdbd;font-weight:500;font-size:14px;margin-top:6px}


/* ── эфир 7 */
.kk .prompt{background:#111;border:2px solid #333;border-radius:18px;padding:18px 20px;font:500 15px/1.6 "Inter Tight",sans-serif;color:#e8e8e8;max-width:760px}

.kk .prompt b{color:var(--y)}

.kk p + p{margin-top:12px}

.kk .ph + p,.kk .ph + .bridge,.kk .grid + p,.kk .vs + p,.kk .chat + p,.kk .story + p,.kk .quote + p{margin-top:18px}

.kk .amp{display:flex;align-items:center;gap:18px;margin:60px 0 14px}

.kk .amp .ic{flex:none;width:76px;height:76px;border-radius:50%;background:var(--y);display:flex;align-items:center;justify-content:center;font:400 44px/1 "KBebas",sans-serif;color:#000}

.kk .amp .tg{font:600 12px/1 "Inter Tight",sans-serif;letter-spacing:.22em;text-transform:uppercase;color:var(--g);margin-bottom:8px}

.kk .amp h3.h{margin:0}

.kk .story.vert{grid-template-columns:minmax(200px,280px) 1fr;gap:34px}

.kk .story.vert .ph img{max-height:none}

.kk .story.wide{grid-template-columns:1fr 1.1fr}

.kk .bigsub{font-size:18px;color:#cfcfcf;margin-top:0}

.kk .card p small{display:block;margin-top:8px;color:#666;font-size:13px}

.kk .card.yb p small,.kk .card.w p small{color:#333}

.kk .ref{display:flex;gap:18px;align-items:center;background:#141414;border:1.5px solid #2a2a2a;border-radius:18px;padding:16px 20px;margin-top:18px}

.kk .ref .em{font-size:34px;flex:none}

.kk .ref p{margin:0;font-size:15px;color:#ddd}

.kk .ref b{color:var(--y)}

.kk .term{background:#141414;border-left:4px solid var(--y);border-radius:0 14px 14px 0;padding:12px 16px;margin:14px 0;font-size:15px;line-height:1.55;color:#ddd;max-width:680px}

.kk .term b{color:#fff}

.kk .task p{color:#222}

.kk .task p+p{margin-top:8px}

@media (max-width:640px){.kk .amp .ic{width:60px;height:60px;font-size:34px}
.kk .story.wide{grid-template-columns:1fr}
.kk .story.vert{grid-template-columns:1fr}
}



.kk section.cont{border-top:0}

/* New material only. The measured type, spacing, palette and motion above are retained. */
.kk .logo{height:36px}
.kk .logo svg{width:40px;height:36px;flex:none}
.kk .source-note{font-size:12px;color:#9a9a9a;margin-top:12px;max-width:680px}
.kk a{color:var(--y);text-underline-offset:4px}
.kk .source-note a{color:#bdbdbd}
.kk .diagram-caption{font-size:14px;color:#9a9a9a;max-width:600px;margin:14px auto 0}
.kk .source-list{display:grid;gap:14px;margin-top:24px}
.kk .references{padding:72px 0;border-top:1px solid var(--line)}
.kk .source-list a{display:block;padding:18px 20px;border:1px solid #333;border-radius:14px;text-decoration:none}
.kk .source-list span{display:block;color:#9a9a9a;font-size:13px;margin-top:6px}
.kk .research-count .big{font-size:clamp(74px,13vw,150px)}
.kk .diagram-title{margin-top:46px}
.kk .story>*{min-width:0}
.kk .story .diagram-title{margin-top:0}
.kk [data-a] > .grid{margin-top:20px}
.kk .filter-defs{position:absolute;overflow:hidden;pointer-events:none}
.kk .hero .intro-note{font-size:13px;color:#9a9a9a;margin-top:22px}
.kk a:focus-visible{outline:2px solid var(--y);outline-offset:5px}
.skip-link{position:fixed;z-index:10;left:20px;top:12px;padding:12px 16px;background:#C6FC04;color:#000;transform:translateY(-150%);font:600 15px "Inter Tight",sans-serif}
.skip-link:focus{transform:none}
@media(max-width:640px){.kk .references{padding:54px 0}.kk .source-list a{font-size:15px}.kk .source-list span{font-size:12px}.kk .toc a{min-height:72px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Design-income lesson: the approved type and palette are unchanged. */
.kk .hero .h{font-size:clamp(50px,8.3vw,94px);max-width:1000px}
.kk .hero-intro{max-width:760px}
.kk .hero-intro p{max-width:760px}
.kk .chapter-content>*+*{margin-top:26px}
.kk .case-shot{max-width:760px;margin:30px 0}
.kk .case-shot a{display:block;border:1px solid #333;border-radius:16px;overflow:hidden;background:#111}
.kk .case-shot img{display:block;width:100%;height:auto;max-height:none;object-fit:contain}
.kk .case-shot figcaption{font-size:14px;color:#ccc;margin-top:12px;max-width:680px}
.kk .case-shot figcaption span{display:block;font-size:12px;color:#9a9a9a;margin-top:5px}
.kk .prompt-card{max-width:760px;background:#111;border:1px solid #363636;border-radius:18px;overflow:hidden}
.kk .prompt-card summary{position:relative;cursor:pointer;list-style:none;padding:23px 58px 23px 24px;min-height:100px}
.kk .prompt-card summary::-webkit-details-marker{display:none}
.kk .prompt-eyebrow{display:block;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--y);margin-bottom:8px}
.kk .prompt-title{display:block;font-size:21px;line-height:1.2;font-weight:650;color:#fff}
.kk .prompt-card summary svg{position:absolute;right:22px;top:38px;width:24px;height:24px;fill:none;stroke:var(--y);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.kk .prompt-card[open] summary svg{transform:rotate(180deg)}
.kk .prompt-card summary:focus-visible,.kk button:focus-visible{outline:2px solid var(--y);outline-offset:-5px}
.kk .prompt-body{padding:0 24px 24px}
.kk .prompt-text{font:500 16px/1.6 "Inter Tight",sans-serif;white-space:pre-wrap;overflow-wrap:anywhere;color:#ddd;border-top:1px solid #333;padding-top:22px;max-width:100%;user-select:text}
.kk .prompt-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:24px}
.kk .prompt-copy{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:12px 18px;border:0;border-radius:8px;background:var(--y);color:#000;font:650 14px/1.2 "Inter Tight",sans-serif;cursor:pointer}
.kk .prompt-copy[hidden]{display:none}
.kk .copy-status{font-size:13px;color:var(--y)}
.kk .article-example{max-width:760px;padding:clamp(14px,3vw,24px);background:#111;border:1px solid #363636;border-radius:18px}
.kk .article-example figure{margin:0}
.kk .article-example h3{margin:0 0 14px;font-size:clamp(20px,3vw,25px);line-height:1.15}
.kk .article-example figure svg{display:block;width:100%;height:auto;border-radius:10px;overflow:hidden}
.kk .article-example .example-wb{max-width:260px}
.kk .article-example .example-vk{max-width:620px}
.kk .article-example .prompt-actions{margin:16px 0 0}
.kk .article-example .prompt-card{margin-top:8px;border:0;border-radius:0}
.kk .article-example .prompt-card summary{display:flex;align-items:center;gap:8px;padding:8px 0;min-height:44px;color:#ccc;font-size:14px}
.kk .article-example summary svg{position:static;width:18px;height:18px}
.kk .article-example .prompt-body{padding:0}
.kk .prereg-offer{max-width:760px;margin:0 auto 36px;text-align:left}
.kk .prereg-offer .h{font-size:clamp(36px,7vw,72px);margin:0 0 16px}
.kk .prereg-offer p,.kk .prereg-offer dd{margin:0;color:#ddd;font-size:17px;line-height:1.5}
.kk .prereg-offer dl{margin:22px 0}
.kk .prereg-offer dl div{padding:14px 0;border-top:1px solid var(--line)}
.kk .prereg-offer dl div:last-child{border-bottom:1px solid var(--line)}
.kk .prereg-offer dt{margin-bottom:4px;color:var(--y);font-weight:700}
.kk .prereg-offer small{display:block;color:var(--g)}
.kk .prereg-outcomes{list-style:none;counter-reset:offer;margin:26px 0 30px}
.kk .prereg-outcomes li{counter-increment:offer;position:relative;padding:20px 0 20px 48px;border-top:1px solid var(--line)}
.kk .prereg-outcomes li:last-child{border-bottom:1px solid var(--line)}
.kk .prereg-outcomes li::before{content:"0" counter(offer);position:absolute;left:0;top:19px;color:var(--y);font:400 28px/1 "KBebas",sans-serif}
.kk .prereg-outcomes h3,.kk .prereg-bonus-title{margin:0 0 8px;font-size:21px;line-height:1.25;font-weight:650}
.kk .prereg-outcomes p{font-size:16px;line-height:1.5}
.kk .prereg-cta{display:inline-flex;align-items:center;justify-content:space-between;gap:22px;width:min(100%,760px);min-height:76px;margin:30px auto 12px;padding:20px 24px;border:2px solid var(--y);border-radius:12px;background:var(--y);color:#000;text-align:left;text-decoration:none;font:650 19px/1.35 "Inter Tight",sans-serif}
.kk .prereg-cta span{min-width:0}
.kk .prereg-cta svg{flex:none;width:26px;height:26px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:640px){.kk .prereg-cta{gap:14px;padding:18px;font-size:17px}.kk .prereg-cta svg{width:22px;height:22px}}
.kk .art.design-art .pop{transform:scale(.96);opacity:0;transition:opacity .45s cubic-bezier(.22,.8,.26,1),transform .6s cubic-bezier(.22,.8,.26,1)}
.kk .in .art.design-art .pop,.kk:not(.kk-js) .art.design-art .pop{transform:none;opacity:1}
@media(max-width:640px){.kk .kicker{font-size:11px;line-height:1.3;letter-spacing:.15em}.kk .hero .h{font-size:clamp(43px,11.6vw,64px)}.kk .hero p{font-size:18px}.kk .hero .intro-note{font-size:13px}.kk .prompt-card summary{padding-left:18px}.kk .prompt-body{padding:0 18px 20px}.kk .prompt-title{font-size:20px}.kk .prompt-text{font-size:15px}.kk .case-shot figcaption{font-size:13px}}
@media(prefers-reduced-motion:reduce){.kk:not([data-motion="on"]) .art.design-art .pop{transform:none;opacity:1;transition:none}}