/* 1. первый экран: заголовок + радар списка поддержки */
.h-hero{min-height:100svh;display:flex;align-items:center;padding:120px 0 60px}
.h-hero .wrap{display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center;width:100%}
.h-hero h1{margin:22px 0 24px}
.h-hero h1.d1{font-size:clamp(76px,9.4vw,152px)}
.h-hero h1 .kisl{display:block}
.h-hero .ryad{display:flex;gap:12px;flex-wrap:wrap;margin-top:34px}
.radar{position:relative;aspect-ratio:1;width:100%;max-width:600px;margin-left:auto}
.radar canvas{width:100%;height:100%;display:block}
.radar figcaption{position:absolute;left:0;right:0;bottom:-34px;text-align:center;font-size:13px;color:var(--mute)}
@media (max-width:860px){.h-hero{min-height:auto;padding:104px 0 70px}.h-hero .wrap{grid-template-columns:1fr}.radar{order:-1;max-width:420px;margin:0 auto 30px}}

/* 2. две двери */
.dveri{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-top:52px;position:relative;border-radius:var(--r);overflow:hidden;border:1px solid var(--line);min-height:600px}
.dveri>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.55;transition:transform 1.4s var(--ease)}
.dveri:hover>img{transform:scale(1.04)}
.dver{position:relative;z-index:1;padding:44px;display:flex;flex-direction:column;justify-content:flex-end;gap:16px;background:linear-gradient(to top,rgba(8,8,10,.94) 30%,rgba(8,8,10,.25));transition:background .6s var(--ease)}
.dver+.dver{border-left:1px solid var(--line)}
.dver .metka{margin-bottom:auto}
.dver h3{font:800 clamp(44px,5vw,84px)/.86 var(--zag);text-transform:uppercase}
.dver p{color:#d3d1cc;max-width:36ch}
.dver .str{font:800 64px/1 var(--zag);transition:transform .5s var(--ease)}
.dver:hover{background:linear-gradient(to top,rgba(8,8,10,.97) 45%,rgba(8,8,10,.55))}
.dver:hover .str{transform:translateX(16px)}
.dver.l .str{color:var(--viol)}.dver.p .str{color:var(--acid)}
.dver .ceny{font:700 22px var(--zag);color:var(--acid)}
@media (max-width:760px){.dveri{grid-template-columns:1fr;min-height:0}.dver{min-height:340px;padding:28px}.dver+.dver{border-left:0;border-top:1px solid var(--line)}}

/* 3. сито трёх правил */
.sito{display:grid;grid-template-columns:.8fr 1.2fr;gap:48px;margin-top:48px;align-items:stretch}
.sito .holst{position:relative;min-height:560px;border-radius:var(--r);border:1px solid var(--line);background:rgba(8,8,10,.55);overflow:hidden}
.sito canvas{position:absolute;inset:0;width:100%;height:100%}
.sito .yarlyk{position:absolute;left:18px;font:600 13px var(--tekst);letter-spacing:.12em;text-transform:uppercase;color:var(--bone);background:rgba(8,8,10,.8);padding:6px 10px;border-radius:8px;transform:translateY(-130%)}
.pravila{display:flex;flex-direction:column;justify-content:space-between;gap:26px}
.pravila li{list-style:none;border-top:1px solid var(--line);padding-top:18px}
.pravila h3{display:block;font:800 30px/1 var(--zag);margin-bottom:8px}
.pravila p{color:#cfcdc8;max-width:46ch}
@media (max-width:860px){.sito{grid-template-columns:1fr}.sito .holst{min-height:420px;order:2}}

/* 4. 185 и одна линия на три ветки */
.odin{display:grid;grid-template-columns:auto 1fr;gap:56px;align-items:center;margin-top:40px}
.odin .chislo{font-size:clamp(150px,20vw,320px);color:var(--acid);line-height:.78}
.odin .chislo small{display:block;font:600 15px var(--tekst);color:var(--mute);letter-spacing:.14em;text-transform:uppercase;margin-top:14px}
.vetki{width:100%;height:auto}
.vetki .tr{fill:none;stroke:var(--acid);stroke-width:3;stroke-linecap:round}
.vetki text{fill:var(--bone);font:700 30px var(--zag)}
.vetki .ml{fill:var(--mute);font:500 15px var(--tekst)}
.vetki.mob{display:none}
@media (max-width:760px){.odin{grid-template-columns:1fr;gap:20px}#vetki{display:none}.vetki.mob{display:block}}

/* 5. чего не делаем — вычёркивание прокруткой */
.ne-delaem{margin-top:42px;border-top:1px solid var(--line)}
.ne-delaem li{list-style:none;display:grid;grid-template-columns:1fr auto;gap:24px;align-items:baseline;padding:22px 0;border-bottom:1px solid var(--line)}
.ne-delaem .s{position:relative;font:800 clamp(34px,4.6vw,72px)/.95 var(--zag);text-transform:uppercase;width:fit-content}
.ne-delaem .s::after{content:"";position:absolute;left:-.05em;right:-.05em;top:52%;height:.09em;background:var(--acid);transform:scaleX(var(--p,0));transform-origin:left;box-shadow:0 0 14px rgba(204,255,0,.5)}
.ne-delaem .z{color:var(--mute);font-size:15px;max-width:30ch;text-align:right}
@media (max-width:760px){.ne-delaem li{grid-template-columns:1fr;gap:8px}.ne-delaem .z{text-align:left}}

/* 6. лента дат сверки */
.daty{margin-top:44px;position:relative}
.daty svg{width:100%;height:auto;overflow:visible}
.daty .os{stroke:var(--line);stroke-width:2}
.daty .tch{fill:var(--ink);stroke:var(--acid);stroke-width:3}
.daty .tch.svezh{fill:var(--acid)}
.daty .nt{fill:var(--bone);font:700 20px var(--zag)}
.daty .dt{fill:var(--mute);font:500 13px var(--tekst)}
.daty .ns{stroke:rgba(237,235,230,.25);stroke-width:1}
.daty .mes{fill:var(--mute);font:600 12px var(--tekst);letter-spacing:.12em}

/* 7. быстрая проверка */
.bystro{display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:end;padding:56px;border-radius:var(--r);background:var(--acid);color:var(--ink);margin-top:20px}
.bystro h2{font:900 clamp(56px,7vw,120px)/.82 var(--zag);text-transform:uppercase}
.bystro label{display:block;font-weight:700;margin-bottom:10px}
.bystro select{width:100%;min-height:58px;border-radius:14px;border:2px solid var(--ink);background:transparent;padding:0 16px;font-size:18px;font-weight:600;color:var(--ink)}
.bystro .knopka{background:var(--ink);color:var(--acid);margin-top:14px;width:100%}
.bystro .melko{color:rgba(8,8,10,.7);margin-top:12px}
@media (max-width:760px){.bystro{grid-template-columns:1fr;padding:28px 22px}}

/* заголовок: разрез без дубля текста в DOM — половинки рисуют псевдоэлементы */
.rz{position:relative;display:inline-block;-webkit-text-fill-color:transparent}
.rz::before,.rz::after{content:attr(data-t);position:absolute;inset:0;-webkit-text-fill-color:currentColor}
.rz::before{clip-path:inset(0 0 50% 0)}
.rz::after{clip-path:inset(50% 0 0 0);transform:translateX(.06em);transition:transform 1s var(--ease)}
.rz.vidno::after,.rz:hover::after{transform:none}
.h1-pod{display:block;font:700 clamp(24px,2.3vw,34px)/1.12 var(--zag);text-transform:none;letter-spacing:0;color:var(--bone);margin-top:18px;max-width:34ch}
@media (prefers-reduced-motion:reduce){.rz::after{transform:none}}
/* таблица дат под лентой */
.tab-raskr{margin-top:26px;border-top:1px solid var(--line)}
.tab-raskr summary{cursor:pointer;padding:16px 0;font-weight:600;min-height:44px;list-style:none;color:var(--bone)}
.tab-raskr summary::after{content:" +";color:var(--acid)}
.tab-raskr[open] summary::after{content:" −"}
.tab-obl{overflow-x:auto}
.tab{width:100%;border-collapse:collapse;font-size:15px}
.tab th,.tab td{text-align:left;padding:10px 12px 10px 0;border-bottom:1px solid var(--line);vertical-align:top}
.tab th{font-weight:700;color:var(--mute);font-size:13px;letter-spacing:.08em;text-transform:uppercase}
.tab td a{color:#cfcdc8;word-break:break-all;text-decoration:underline;text-decoration-color:rgba(204,255,0,.5);text-underline-offset:3px}
@media (max-width:760px){.tab{font-size:14px}.tab thead{display:none}.tab tr{display:grid;grid-template-columns:1fr auto;gap:2px 12px;padding:10px 0;border-bottom:1px solid var(--line)}.tab td{border:0;padding:0}.tab td:nth-child(2){grid-column:1/-1;order:3}}
