@font-face{font-family:'Onest';font-style:normal;font-weight:400 600;font-display:swap;src:url('/assets/fonts/onest-cyrillic.woff2') format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Onest';font-style:normal;font-weight:400 600;font-display:swap;src:url('/assets/fonts/onest-latin.woff2') format('woff2');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:'Source Serif 4';font-style:normal;font-weight:300;font-display:swap;src:url('/assets/fonts/source-serif-4-cyrillic-300.woff2') format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Source Serif 4';font-style:normal;font-weight:300;font-display:swap;src:url('/assets/fonts/source-serif-4-latin-300.woff2') format('woff2');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}

/* Раскладка по tempo.xyz: светло-серое поле, плавающее меню-пилюля, центрованный герой,
   большая скруглённая медиа-карточка, дальше секции «надпись — заголовок — сетка». Одна тема. */
:root{
  color-scheme: light;
  --ground:#f4f4f3;
  --paper:#ffffff;
  --ink:#0b0c0c;
  --ink-2:#55585a;
  --ink-3:rgba(11,12,12,.42);
  --line:rgba(11,12,12,.12);
  --pill:#e6e6e4;
  --night:#0e1519;
  --night-2:#16232a;
  --ok:#2f8f5b;
  --bad:#c4442f;
  --f-sans:"Onest", "Helvetica Neue", Arial, sans-serif;
  --f-serif:"Source Serif 4", Georgia, "Times New Roman", serif;
  --r-l:22px; --r-m:16px;
  --wrap:1180px;
}
*{box-sizing:border-box}
body{margin:0;background:var(--ground);color:var(--ink);font:400 16px/1.5 var(--f-sans);-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--ground)}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--wrap);margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
h1,h2,h3{font-weight:500;margin:0;text-wrap:balance}
.eyebrow{font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3);font-weight:500}
.btn{display:inline-flex;align-items:center;height:46px;padding:0 24px;border-radius:999px;font-size:15px;font-weight:500;transition:transform .2s,background .2s}
.btn:hover{transform:translateY(-1px)}
.btn:focus-visible,.acc button:focus-visible,.nav a:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.btn-dark{background:var(--ink);color:var(--paper)}
.btn-soft{background:var(--pill);color:var(--ink)}
.more{font-size:14px;color:var(--ink-2);display:inline-flex;gap:6px;align-items:center}
.more::after{content:"›";font-size:17px;line-height:1}

/* меню */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;padding-top:16px}
.nav{display:flex;align-items:center;gap:6px;background:rgba(232,232,230,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-radius:14px;padding:5px 5px 5px 18px;max-width:860px;margin:0 auto}
.logo{font-weight:600;font-size:19px;letter-spacing:-.03em;margin-right:auto;white-space:nowrap}
.logo b{font-weight:600;color:var(--ink-3)}
.nav .links{display:flex;gap:2px}
.nav .links a{font-size:14px;padding:9px 14px;border-radius:9px}
.nav .links a:hover{background:rgba(255,255,255,.6)}
.nav .cta{background:var(--ink);color:var(--paper);font-size:14px;padding:10px 18px;border-radius:10px;white-space:nowrap}

/* герой */
.hero{text-align:center;padding-block:96px 44px}
.hero h1{font-size:clamp(38px,5.6vw,62px);line-height:1;letter-spacing:-.045em;max-width:15ch;margin:0 auto}
.hero p{margin:22px auto 0;max-width:52ch;color:var(--ink-2);font-size:17px}
.hero .actions{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:30px}
.platforms{display:flex;justify-content:center;flex-wrap:wrap;gap:14px 46px;padding-block:34px 40px;color:rgba(11,12,12,.32);font-weight:600;font-size:19px;letter-spacing:-.02em}

/* медиа-карточка с живой проверкой */
.stage{border-radius:var(--r-l);background:radial-gradient(120% 90% at 20% 0%,#24343c 0%,var(--night) 55%,#090d10 100%);padding:clamp(18px,4vw,56px);display:grid;grid-template-columns:1.25fr 1fr;gap:clamp(18px,3vw,40px);align-items:center;overflow:hidden;position:relative}
.browser{background:var(--paper);border-radius:12px;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.45);position:relative;min-width:0}
.browser .bar{display:flex;align-items:center;gap:6px;padding:10px 12px;background:#eeeeec;border-bottom:1px solid var(--line)}
.browser .bar i{width:10px;height:10px;border-radius:50%;background:#d3d3d0}
.browser .bar span{margin-left:10px;font-size:12px;color:var(--ink-2);background:var(--paper);border-radius:6px;padding:3px 10px;flex:1;max-width:260px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.site{padding:26px 26px 92px}
.site h4{margin:0 0 4px;font-size:20px;font-weight:500;letter-spacing:-.02em}
.site .sub{font-size:13px;color:var(--ink-2);margin-bottom:16px}
.mfield{height:38px;border:1px solid var(--line);border-radius:8px;margin-bottom:8px;padding:0 12px;display:flex;align-items:center;font-size:13px;color:var(--ink-3)}
.mconsent{display:flex;gap:9px;align-items:flex-start;font-size:12px;color:var(--ink-2);margin:12px 0 14px;line-height:1.35}
.box{flex:none;width:16px;height:16px;border:1.5px solid #b9b9b6;border-radius:4px;margin-top:1px;position:relative;transition:border-color .3s,background .3s}
.box::after{content:"";position:absolute;left:4px;top:1px;width:4px;height:8px;border:solid var(--paper);border-width:0 2px 2px 0;transform:rotate(45deg);opacity:0;transition:opacity .3s}
.mconsent u{text-decoration-color:rgba(11,12,12,.3)}
.send{height:40px;border-radius:8px;background:var(--ink);color:var(--paper);display:flex;align-items:center;justify-content:center;font-size:13px}
.mock-cookie{position:absolute;left:12px;right:12px;bottom:12px;background:var(--ink);color:var(--paper);border-radius:10px;padding:11px 12px;display:flex;gap:10px;align-items:center;font-size:12px;line-height:1.3;transition:transform .5s cubic-bezier(.2,.8,.2,1),opacity .5s}
.mock-cookie b{flex:none;background:var(--paper);color:var(--ink);border-radius:6px;padding:6px 9px;font-weight:500}
.mock-cookie em{flex:none;font-style:normal;opacity:.6}
.report{color:#e8eef0;min-width:0}
.report .eyebrow{color:rgba(232,238,240,.5)}
.report h3{font-size:24px;letter-spacing:-.02em;margin:8px 0 18px;line-height:1.15}
.row{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-top:1px solid rgba(232,238,240,.12);font-size:14px}
.row .st{flex:none;font-variant-numeric:tabular-nums;color:#7fd3a3;transition:color .3s}
.row .st::before{content:attr(data-ok)}
.row:not(.done) .st::before{content:attr(data-bad)}
.row:not(.done) .st{color:#ff8a73}
/* привязка формы к строкам отчёта */
.stage:not(.f-consent) .box{border-color:var(--bad)}
.stage.f-consent .box{background:var(--ink);border-color:var(--ink)}
.stage.f-consent .box::after{opacity:1}
.stage:not(.f-cookie) .mock-cookie{transform:translateY(130%);opacity:0}
.stage:not(.f-policy) .mconsent u{text-decoration:line-through;text-decoration-color:var(--bad)}

/* секции */
.sec{padding-block:110px 0}
.sec-head{display:grid;gap:14px;margin-bottom:40px;max-width:640px}
.sec-head h2{font-size:clamp(28px,3.4vw,38px);line-height:1.08;letter-spacing:-.025em}

.cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.card{background:var(--paper);border-radius:var(--r-m);padding:26px 26px 30px;display:grid;gap:10px;align-content:start;min-height:250px;transition:transform .25s}
.card:hover{transform:translateY(-2px)}
.card h3{font-size:19px;letter-spacing:-.015em;display:flex;gap:7px;align-items:baseline}
.card h3::after{content:"›";font-size:20px}
.card p{margin:0;color:var(--ink-2);font-size:15px}
.price{margin-top:auto;padding-top:18px;font-size:30px;letter-spacing:-.03em;font-weight:500;font-variant-numeric:tabular-nums}
.price small{font-size:14px;color:var(--ink-3);font-weight:400;letter-spacing:0}
.card.hit{background:var(--ink);color:var(--paper)}
.card.hit p{color:rgba(255,255,255,.62)}
.card.hit .price small{color:rgba(255,255,255,.45)}

/* модули: блок закрепляется, вкладки листаются прокруткой */
.pin-wrap{height:calc(100vh + 5 * 62vh);position:relative}
.pin{position:sticky;top:0;height:100vh;height:100svh;display:flex;flex-direction:column;justify-content:center;padding-top:72px}
.pin .sec-head{margin-bottom:34px}
.split{display:grid;grid-template-columns:400px 1fr;gap:28px;align-items:stretch}
.acc{border-top:1px solid var(--line);align-self:start}
.acc>div{border-bottom:1px solid var(--line)}
.acc button{all:unset;cursor:pointer;display:block;width:100%;padding:24px 0;font:500 34px/1.05 var(--f-sans);letter-spacing:-.03em;color:rgba(11,12,12,.5);transition:color .35s}
.acc .open button,.acc button:hover{color:var(--ink)}
.acc .body{display:grid;grid-template-rows:0fr;transition:grid-template-rows .45s cubic-bezier(.2,.8,.2,1)}
.acc .body>div{overflow:hidden;display:grid;gap:12px;color:var(--ink-2);font-size:15px;max-width:30ch}
.acc .open .body{grid-template-rows:1fr}
.acc .open .body>div{padding-bottom:28px;margin-top:-6px}
.panel{background:#ececea;border-radius:var(--r-l);min-height:min(560px,62vh);display:grid;place-items:center;padding:28px;overflow:hidden}
.doc{grid-area:1/1;background:var(--paper);border-radius:22px;width:min(400px,100%);padding:28px 30px 30px;box-shadow:0 1px 0 rgba(11,12,12,.04),0 24px 60px rgba(11,12,12,.06);display:grid;gap:12px;opacity:0;transform:translateY(26px) scale(.98);transition:opacity .45s,transform .6s cubic-bezier(.2,.8,.2,1);pointer-events:none}
.doc.on{opacity:1;transform:none;pointer-events:auto}
.doc.out{opacity:0;transform:translateY(-26px) scale(.98)}
/* сцены внутри карточки: кусок настоящего сайта + курсор */
.doc{position:relative;gap:10px}
.doc .lbl{font-size:13px;color:var(--ink-3);margin-bottom:4px}
.doc .ttl{font-size:19px;font-weight:500;letter-spacing:-.02em;margin-bottom:6px}
.doc .cap{font-size:12.5px;color:var(--ink-3);margin-top:6px;line-height:1.4}
.fld{height:44px;border:1px solid var(--line);border-radius:10px;padding:0 14px;display:flex;align-items:center;font-size:15px}
.fld small{font-size:11px;color:var(--ink-3);margin-right:auto}
.cb{display:grid;grid-template-rows:0fr;opacity:0;transition:grid-template-rows .5s cubic-bezier(.2,.8,.2,1),opacity .4s}
.cb>span{overflow:hidden;display:flex;gap:10px;align-items:flex-start;font-size:13px;color:var(--ink-2);line-height:1.35}
.cb u{text-decoration-color:rgba(11,12,12,.3)}
.sq{flex:none;width:18px;height:18px;border:1.5px solid #b5b5b2;border-radius:5px;position:relative;transition:background .2s,border-color .2s;margin:2px 0 4px}
.sq::after{content:"";position:absolute;left:5px;top:1.5px;width:4px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg) scale(.4);opacity:0;transition:.25s}
.go{height:46px;border-radius:10px;background:#e4e4e2;color:#a3a5a6;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:500;transition:background .3s,color .3s}
.s1 .cb{grid-template-rows:1fr;opacity:1}
.s3 .sq{background:var(--ink);border-color:var(--ink)}
.s3 .sq::after{opacity:1;transform:rotate(45deg) scale(1)}
.s3 .go{background:var(--ink);color:var(--paper)}

.skel{display:grid;gap:8px;padding:4px 0 10px}
.skel i{height:10px;border-radius:5px;background:#efefed}
.skel i:nth-child(1){width:55%;height:16px}
.skel i:nth-child(3){width:80%}
.ban{border:1px solid var(--line);border-radius:14px;padding:14px;display:grid;gap:10px;font-size:13px;color:var(--ink-2);line-height:1.35;transform:translateY(16px);opacity:0;transition:transform .5s cubic-bezier(.2,.8,.2,1),opacity .4s}
.tg{display:flex;justify-content:space-between;align-items:center;color:var(--ink);font-size:13.5px}
.tg small{color:var(--ink-3);font-size:12px;margin-left:6px}
.sw{flex:none;width:34px;height:20px;border-radius:999px;background:var(--ink);position:relative;transition:background .25s}
.sw::after{content:"";position:absolute;top:2px;left:16px;width:16px;height:16px;border-radius:50%;background:#fff;transition:left .25s}
.sw.lock{opacity:.35}
.ban .row2{display:flex;gap:8px}
.ban .row2 span{flex:1;height:36px;border-radius:9px;display:flex;align-items:center;justify-content:center;font-weight:500;font-size:13px}
.ban .a{background:var(--ink);color:var(--paper)}
.ban .b{background:#ececea;color:var(--ink)}
.note{font-size:12.5px;color:var(--ink-2);display:flex;gap:8px;align-items:center;opacity:0;transition:opacity .4s;height:0}
.s1 .ban{transform:none;opacity:1}
.s3 .sw.an{background:#d6d6d3}
.s3 .sw.an::after{left:2px}
.s4 .ban{transform:translateY(10px);opacity:0}
.s4 .note{opacity:1;height:auto}

.auth{display:grid;gap:8px}
.ab{height:44px;border:1px solid var(--line);border-radius:10px;display:flex;align-items:center;gap:12px;padding:0 14px;font-size:14.5px;transition:opacity .35s,transform .45s,height .45s,margin .45s,border-color .3s;overflow:hidden}
.ab em{flex:none;width:22px;height:22px;border-radius:6px;background:#efefed;font-style:normal;font-size:11px;font-weight:600;display:grid;place-items:center;color:var(--ink-2)}
.ab.old{position:relative}
.ab.old::after{content:"";position:absolute;left:14px;right:14px;top:50%;height:1.5px;background:var(--ink);transform:scaleX(0);transform-origin:left;transition:transform .45s}
.ab.new{height:0;opacity:0;border-color:transparent;margin-top:-8px}
.s1 .ab.old{color:var(--ink-3)}
.s1 .ab.old::after{transform:scaleX(1)}
.s2 .ab.old{height:0;opacity:0;border-color:transparent;margin-top:-8px}
.s3 .ab.new{height:44px;opacity:1;border-color:var(--line);margin-top:0}

.prod{display:grid;grid-template-columns:120px 1fr;gap:16px;align-items:start}
.pic{aspect-ratio:1;border-radius:12px;background:linear-gradient(160deg,#efeee9,#e2e1dc);position:relative;display:grid;place-items:center;max-width:100%}
.pic svg{width:70%;height:auto}
.badge{position:absolute;top:8px;left:8px;font-size:11px;font-weight:600;letter-spacing:.04em;background:var(--ink);color:var(--paper);border-radius:6px;padding:3px 7px}
.flip{display:inline-grid;vertical-align:bottom}
.flip>span{grid-area:1/1;transition:transform .45s cubic-bezier(.2,.8,.2,1),opacity .3s;backface-visibility:hidden}
.flip>span+span{transform:translateY(60%);opacity:0}
.prod .nm{font-size:16px;font-weight:500;letter-spacing:-.01em}
.prod .pr{font-size:18px;font-weight:500;margin:4px 0 10px;font-variant-numeric:tabular-nums}
.prod .pr s{font-size:13px;color:var(--ink-3);font-weight:400;margin-left:6px}
.sz{font-size:12px;color:var(--ink-3);margin-bottom:10px}
.cart{height:38px;border-radius:9px;background:var(--ink);color:var(--paper);font-size:13.5px;font-weight:500;display:flex;align-items:center;justify-content:center}
.s1 .f1>span:first-child,.s2 .f2>span:first-child,.s3 .f3>span:first-child{transform:translateY(-60%);opacity:0}
.s1 .f1>span+span,.s2 .f2>span+span,.s3 .f3>span+span{transform:none;opacity:1}

.tabs{display:flex;gap:18px;border-bottom:1px solid var(--line);font-size:13.5px;color:var(--ink-3)}
.tabs span{padding:10px 0;margin-bottom:-1px;border-bottom:1.5px solid transparent;transition:color .3s,border-color .3s,opacity .4s,max-width .5s;white-space:nowrap}
.tabs .on0{color:var(--ink);border-color:var(--ink)}
.tabs .dc{max-width:0;opacity:0;overflow:hidden}
.tp{position:relative;min-height:128px}
.tp>div{position:absolute;inset:0;transition:opacity .4s,transform .45s}
.tp .desc{display:grid;gap:8px;padding-top:12px}
.tp .desc i{height:9px;border-radius:5px;background:#efefed}
.tp .desc i:nth-child(2){width:88%}.tp .desc i:nth-child(3){width:70%}
.tp .docs{opacity:0;transform:translateY(10px);padding-top:12px;display:grid;gap:4px;font-size:13px}
.docs b{font-weight:500;font-size:14px}
.docs .num{font-size:14px;color:var(--ink);letter-spacing:-.01em}
.docs .till{color:var(--ink-3)}
.docs .lnk{margin-top:6px;color:var(--ink);text-decoration:underline;text-decoration-color:rgba(11,12,12,.3);text-underline-offset:3px}
.s1 .tabs .dc{max-width:120px;opacity:1}
.s3 .tabs .on0{color:var(--ink-3);border-color:transparent}
.s3 .tabs .dc{color:var(--ink);border-color:var(--ink)}
.s3 .tp .desc{opacity:0}
.s3 .tp .docs{opacity:1;transform:none}

.cur{position:absolute;left:0;top:0;width:22px;height:22px;pointer-events:none;opacity:0;transition:transform .8s cubic-bezier(.45,0,.2,1),opacity .3s;z-index:3;filter:drop-shadow(0 2px 3px rgba(0,0,0,.25))}
.cur.on{opacity:1}
.cur::after{content:"";position:absolute;left:-10px;top:-10px;width:22px;height:22px;border-radius:50%;background:rgba(11,12,12,.18);transform:scale(0);opacity:0}
.cur.tap::after{animation:tap .45s ease-out}
@keyframes tap{0%{transform:scale(.3);opacity:1}100%{transform:scale(1.6);opacity:0}}
.dots{display:flex;gap:6px;justify-content:center;margin-top:18px}
.dots i{width:22px;height:3px;border-radius:2px;background:var(--line);overflow:hidden;position:relative}
.dots i b{position:absolute;inset:0;background:var(--ink);transform-origin:left;transform:scaleX(var(--p,0))}
.tag{font-size:11px;border-radius:999px;padding:3px 9px;background:#e3f2e9;color:var(--ok);font-weight:500}

/* штрафы: вертикальный скролл везёт ленту вбок */
.h-wrap{height:250vh}
.h-wrap .pin{padding-top:72px}
.h-wrap .pin>.wrap{width:100%;max-width:var(--wrap)}
.h-wrap .sec-head h2{max-width:640px}
.fine-card>div:nth-child(2){margin-top:auto}
.fine-card .what{margin-top:auto;min-height:2.6em;display:flex;align-items:flex-end}
.hview{overflow:hidden;padding-left:max(16px,calc((100vw - var(--wrap)) / 2 + 16px))}
.track{display:flex;gap:14px;width:max-content;will-change:transform;padding-right:max(16px,calc((100vw - var(--wrap)) / 2 + 16px))}
.fine-card{flex:none;width:min(420px,82vw);height:min(400px,52vh);background:var(--night);color:#eef2f3;border-radius:var(--r-l);padding:28px;display:flex;flex-direction:column;justify-content:space-between;position:relative;overflow:hidden;transition:background .6s}
.fine-card.big{width:min(560px,86vw);background:#141c20}
.fine-card .law{font-size:13px;color:rgba(238,242,243,.5)}
.fine-card .sum{font-size:clamp(40px,4.4vw,60px);letter-spacing:-.045em;font-weight:500;font-variant-numeric:tabular-nums;line-height:1;white-space:nowrap}
.range{position:relative;margin-top:22px;height:30px;font-size:12px;color:rgba(238,242,243,.5)}
.range::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:rgba(238,242,243,.12);border-radius:2px}
.range i{position:absolute;top:0;height:2px;left:var(--a);right:0;background:#eef2f3;border-radius:2px;transform-origin:left;transform:scaleX(var(--k,0));transition:transform 1.1s cubic-bezier(.2,.8,.2,1)}
.range span{position:absolute;top:10px;white-space:nowrap}
.range span:first-of-type{left:var(--a);transform:translateX(-50%)}
.range span:last-of-type{right:0}
.fine-card .what{font-size:17px;line-height:1.3;max-width:30ch}
.hint{margin-top:22px;font-size:13px;color:var(--ink-3)}

.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:40px}
.stat{border-top:1px solid var(--line);padding-top:18px}
.stat b{display:block;font-size:clamp(32px,4vw,48px);font-weight:500;letter-spacing:-.04em;line-height:1;font-variant-numeric:tabular-nums}
.stat span{display:block;margin-top:10px;color:var(--ink-2);font-size:15px}

/* цитата закона */
.law-band{margin-top:120px;background:linear-gradient(160deg,#1c2a31 0%,var(--night) 60%,#0a1013 100%);color:#eef2f3}
.law-band .wrap{padding-block:120px;text-align:center}
.law-band blockquote{margin:22px auto 0;max-width:24ch;font:300 clamp(30px,4.6vw,62px)/1.06 var(--f-serif);letter-spacing:-.015em;text-wrap:balance}
.law-band cite{display:block;margin-top:28px;font:400 14px/1.4 var(--f-sans);font-style:normal;color:rgba(238,242,243,.55)}
.law-band .eyebrow{color:rgba(238,242,243,.5)}

/* как это работает: шаги + схема */
.flow{display:grid;grid-template-columns:330px 1fr;gap:40px;align-items:center}
.steps{border-top:1px solid var(--line)}
.how-wrap{height:300vh;margin-top:60px}
.steps div{border-bottom:1px solid var(--line);padding:18px 0;display:grid;gap:4px;color:rgba(11,12,12,.38);transition:color .35s}
.steps b{font-weight:500;font-size:22px;letter-spacing:-.02em}
.steps span{font-size:14px}
.steps .on{color:var(--ink)}
.steps .on span{color:var(--ink-2)}
.scheme{background:var(--paper);border-radius:var(--r-l);padding:20px}
.scheme svg{display:block;width:100%;height:auto}
.scheme text{font-family:var(--f-sans);font-size:14px}
.scheme .src{opacity:0;transform:translateX(-8px);transition:opacity .4s,transform .4s}
.scheme .src.on{opacity:1;transform:none}
.scheme .ring{transition:fill .3s,stroke .3s}
.scheme .src.ok .ring{fill:var(--ink)}
.scheme .hubbg{transition:fill .4s}
.scheme .done .reg{fill:#e3f2e9}
@keyframes run{to{stroke-dashoffset:-200}}
.pulse{stroke-dasharray:6 194;animation:run 3.2s linear infinite}

/* текст о законе: заголовок слева, ответы справа */
.about{display:grid;grid-template-columns:1fr 1.3fr;gap:clamp(32px,6vw,90px);align-items:start}
.about .side{position:sticky;top:110px;display:grid;gap:18px}
.about .side h2{font-size:clamp(30px,3.6vw,44px);line-height:1.05;letter-spacing:-.03em}
.about .about-lead{font-size:clamp(18px,1.6vw,21px);line-height:1.5;color:var(--ink);max-width:34ch;letter-spacing:-.005em}
.facts{display:grid}
.facts article{border-top:1px solid var(--line);padding-block:28px 30px;display:grid;gap:10px}
.facts h3{font-size:21px;letter-spacing:-.02em;line-height:1.2}
.facts p{margin:0;color:var(--ink-2);font-size:16px;line-height:1.7;max-width:62ch}
.facts p b{color:var(--ink);font-weight:500}
.facts .src{font-size:12.5px;color:var(--ink-3)}

/* карусель статей */
.arts-head{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:36px}
.arts-head .sec-head{margin:0}
.arrows{display:flex;gap:8px;flex:none}
.arrows button{all:unset;cursor:pointer;width:46px;height:46px;border-radius:50%;background:var(--pill);display:grid;place-items:center;font-size:20px;transition:background .2s,opacity .2s}
.arrows button:hover{background:#dcdcd9}
.arrows button:disabled{opacity:.35;cursor:default}
.arrows button:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.arts{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 48px) / 3);gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;scroll-behavior:smooth;padding-bottom:4px}
.arts::-webkit-scrollbar{display:none}
.art{scroll-snap-align:start;display:grid;gap:12px;align-content:start;min-width:0}
.cover{aspect-ratio:16/9;max-width:100%;border-radius:14px;overflow:hidden;position:relative;background:var(--c0)}
.cover i{position:absolute;inset:-20%;filter:blur(22px);transition:transform 1.2s cubic-bezier(.2,.8,.2,1)}
.cover i:nth-child(1){background:linear-gradient(100deg,transparent 10%,var(--c1) 30%,transparent 46%,var(--c2) 62%,transparent 80%);transform:skewY(-6deg)}
.cover i:nth-child(2){background:linear-gradient(90deg,transparent 0 20%,rgba(255,255,255,.22) 34%,transparent 40%,transparent 66%,rgba(255,255,255,.12) 72%,transparent 78%);filter:blur(10px);transform:scaleY(.35) translateY(20%)}
.cover i:nth-child(3){background:radial-gradient(60% 50% at var(--x,30%) 70%,var(--c3),transparent 70%)}
.art:hover .cover i:nth-child(1){transform:skewY(-6deg) translateX(8%)}
.art:hover .cover i:nth-child(2){transform:scaleY(.35) translateY(20%) translateX(-10%)}
.art h3{font-size:19px;line-height:1.25;letter-spacing:-.015em;margin-top:8px}
.art p{margin:0;color:var(--ink-2);font-size:14.5px;line-height:1.55}
.art .eyebrow{margin-top:2px}

/* вопросы */
.faq{display:grid;grid-template-columns:1fr 1.3fr;gap:clamp(32px,6vw,90px);align-items:start}
.faq .sec-head{position:sticky;top:110px}
.qa{border-top:1px solid var(--line)}
.qa details{border-bottom:1px solid var(--line)}
.qa summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;gap:24px;padding:24px 0;font-size:19px;font-weight:500;letter-spacing:-.015em;line-height:1.3}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:"+";flex:none;font-weight:400;font-size:24px;line-height:1;color:var(--ink-3);transition:transform .3s}
.qa details[open] summary::after{transform:rotate(45deg)}
.qa summary:focus-visible{outline:2px solid var(--ink);outline-offset:4px}
.qa p{margin:0 0 26px;color:var(--ink-2);font-size:16px;line-height:1.7;max-width:64ch}

/* финальные карточки */
.cta2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.cta2 .card{min-height:300px;padding:34px;gap:14px}
.cta2 .card h3::after{content:none}
.cta2 h3{font-size:24px}
.cta2 .btn{margin-top:auto;justify-self:start}

footer{margin-top:120px;background:var(--ink);color:#d6d8d9}
footer .wrap{padding-block:56px 40px;display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:32px}
footer .mark{font-weight:600;font-size:22px;letter-spacing:-.03em;color:var(--paper)}
footer h5{margin:0 0 12px;font-size:13px;font-weight:500;color:rgba(214,216,217,.5)}
footer ul{list-style:none;margin:0;padding:0;display:grid;gap:8px;font-size:14px}
footer .legal{grid-column:1/-1;border-top:1px solid rgba(214,216,217,.14);padding-top:22px;font-size:12px;color:rgba(214,216,217,.5);max-width:90ch}

@media (max-width:900px){
  .nav .links{display:none}
  .stage{grid-template-columns:1fr}
  .cards3{grid-template-columns:1fr}
  .split,.flow{grid-template-columns:1fr}
  .pin-wrap{height:calc(100svh + 5 * 55svh)}
  .pin{padding-top:64px}
  .pin .sec-head{margin-bottom:20px}
  .split{gap:14px}
  .acc{display:flex;flex-wrap:wrap;gap:6px;border:0}
  .acc>div{border:0}
  .acc button{font-size:14px;padding:8px 14px;border-radius:999px;background:var(--pill);color:var(--ink-2)}
  .acc .open button{background:var(--ink);color:var(--paper)}
  .acc .body{display:none}
  .dots{display:none}
  .h-wrap{height:300svh}
  .steps{display:flex;flex-wrap:wrap;gap:6px;border:0}
  .steps div{border:0;padding:8px 14px;border-radius:999px;background:var(--pill)}
  .steps div.on{background:var(--ink)}
  .steps .on b{color:var(--paper)}
  .steps b{font-size:14px}
  .steps span{display:none}
  .scheme{padding:10px}
  .scheme text{font-size:22px}
  .how-wrap .flow{gap:14px}
  .how-wrap{height:300svh}
  .about,.faq{grid-template-columns:1fr}
  .about .side,.faq .sec-head{position:static}
  .arts{grid-auto-columns:82%;gap:16px}
  .arts-head{align-items:flex-start;flex-direction:column}
  .panel{min-height:340px;padding:16px}
  .doc{padding:20px}
  .stats{grid-template-columns:1fr}
  .cta2{grid-template-columns:1fr}
  footer .wrap{grid-template-columns:1fr 1fr}
  .hero{padding-block:64px 32px}
  .sec{padding-block:80px 0}
}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* ===== боевые добавки к демо ===== */
.skip{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--ink);color:var(--paper);padding:10px 16px;border-radius:10px}
.skip:focus{left:16px}
html{scroll-behavior:smooth}
.nav{max-width:1020px}
.nav .links a{white-space:nowrap}
.hero h1{max-width:18ch}
@media (max-width:1100px){.nav .links a:nth-child(4){display:none}}
.nav .ghost{font-size:14px;padding:10px 14px;border-radius:10px;white-space:nowrap}
.nav .ghost:hover{background:rgba(255,255,255,.6)}
button.btn,.btn{border:0;font-family:inherit;cursor:pointer;text-decoration:none}
.btn--primary,.btn--accent{background:var(--ink);color:var(--paper)}
.btn--ghost{background:var(--pill);color:var(--ink)}
.btn--lg{height:52px;padding:0 28px;font-size:16px}
.btn--sm{height:38px;padding:0 16px;font-size:14px}
.btn:disabled{opacity:.5;cursor:default;transform:none}
.price-note{margin:22px 0 0;font-size:14px;color:var(--ink-2);max-width:80ch;line-height:1.6}
.trust{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:34px}
.trust p{margin:0;border-top:1px solid var(--line);padding-top:16px;font-size:14.5px;color:var(--ink-2);line-height:1.55}
.trust b{display:block;color:var(--ink);font-weight:500;margin-bottom:4px}

/* квиз */
.quiz-sec .sec-head p{margin:0;color:var(--ink-2);font-size:16px;max-width:52ch}
.quiz-grid{display:grid;grid-template-columns:1fr 1.5fr;gap:clamp(28px,5vw,80px);align-items:start}
.quiz{background:var(--paper);border-radius:var(--r-l);padding:clamp(22px,3.4vw,40px);box-shadow:0 1px 0 rgba(11,12,12,.04),0 24px 60px rgba(11,12,12,.06);min-width:0}
.quiz__bar{height:3px;background:var(--line);border-radius:3px;overflow:hidden;margin-bottom:26px}
.quiz__bar>i{display:block;height:100%;width:0;background:var(--ink);transition:width .35s ease}
.quiz__step{color:var(--ink-3);font-size:13px;margin-bottom:8px}
.quiz__q{font-size:clamp(20px,2vw,24px);font-weight:500;letter-spacing:-.02em;line-height:1.25;margin-bottom:18px}
.opt{display:flex;align-items:center;gap:12px;width:100%;text-align:left;border:1px solid var(--line);background:var(--paper);border-radius:12px;padding:15px 18px;margin:8px 0;cursor:pointer;font:inherit;font-size:15.5px;color:var(--ink);transition:border-color .2s,background .2s}
.opt:hover{border-color:rgba(11,12,12,.35)}
.opt.sel{border-color:var(--ink);background:#f1f1ef;font-weight:500}
.quiz__nav{display:flex;justify-content:space-between;margin-top:20px;gap:10px}
.result{background:#f3f3f1;border-radius:16px;padding:24px}
.result.is-stop{background:#f7f1e6}
.result__eyebrow{font-size:11px;letter-spacing:.07em;text-transform:uppercase;color:var(--ink-3);font-weight:500}
.result__pkg{font-size:22px;font-weight:500;letter-spacing:-.02em;margin:6px 0 10px}
.result__price{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.result__price b{font-size:36px;font-weight:500;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.result__hint,.result__urgent{color:var(--ink-2);font-size:14px}
.result__urgent{margin-top:10px}
.found{margin-top:18px;border-top:1px solid var(--line);padding-top:16px}
.found__t{font-weight:500;font-size:14px;margin-bottom:10px}
.found__i{font-size:15px;margin:8px 0;display:flex;gap:10px;align-items:flex-start;line-height:1.45}
.found__i .dot{flex:none;width:20px;height:20px;border-radius:50%;background:#f6e3df;color:var(--bad);font-weight:600;font-size:12px;display:inline-flex;align-items:center;justify-content:center;margin-top:1px}
.lead{margin-top:22px;border-top:1px solid var(--line);padding-top:22px}
.lead__t{font-weight:500;font-size:18px;letter-spacing:-.015em;margin-bottom:14px}
.field{margin-bottom:10px}
.field input{width:100%;border:1px solid var(--line);border-radius:10px;padding:13px 16px;font:inherit;font-size:16px;background:var(--paper);color:var(--ink)}
.field input:focus{outline:none;border-color:var(--ink)}
.consent{display:flex;gap:11px;align-items:flex-start;font-size:13.5px;color:var(--ink-2);margin:10px 0 16px;line-height:1.45}
.consent input{margin-top:2px;width:18px;height:18px;flex:none;accent-color:var(--ink)}
.consent a,.fbm__consent a,.cookie a{color:var(--ink);text-decoration:underline;text-decoration-color:rgba(11,12,12,.3);text-underline-offset:2px}
.hp,.fbm__hp{position:absolute;left:-9999px;top:-9999px}
.lead__ok{background:#e3f2e9;border-radius:12px;padding:20px;font-weight:500}
.lead__err{color:var(--bad);font-size:14px;margin:6px 0}

/* модалка и cookie */
.fbm{position:fixed;inset:0;z-index:1200;display:flex;align-items:center;justify-content:center;padding:16px}
.fbm[hidden]{display:none}
.fbm__overlay{position:absolute;inset:0;background:rgba(11,12,12,.45);backdrop-filter:blur(3px)}
.fbm__card{position:relative;background:var(--paper);border-radius:var(--r-l);box-shadow:0 30px 80px rgba(0,0,0,.25);width:min(460px,100%);max-height:calc(100vh - 32px);overflow:auto;padding:30px 28px 26px}
.fbm__card h3{font-size:22px;letter-spacing:-.02em;margin:0 0 4px}
.fbm__sub{color:var(--ink-2);font-size:14px;margin:0 0 16px}
.fbm__x{position:absolute;top:10px;right:12px;border:0;background:none;font-size:26px;line-height:1;cursor:pointer;color:var(--ink-3)}
.fbm__field{display:block;font-size:13px;color:var(--ink-2);margin-bottom:11px}
.fbm__field input,.fbm__field textarea,.fbm__field select{display:block;width:100%;margin-top:5px;border:1px solid var(--line);border-radius:10px;padding:11px 14px;font:inherit;font-size:15px;color:var(--ink);background:var(--paper)}
.fbm__field input:focus,.fbm__field textarea:focus,.fbm__field select:focus{outline:none;border-color:var(--ink)}
.fbm__field textarea{resize:vertical;min-height:84px}
.fbm__consent{display:flex;gap:9px;align-items:flex-start;font-size:13px;color:var(--ink-2);margin:4px 0 14px;line-height:1.45}
.fbm__consent input{width:17px;height:17px;margin-top:1px;accent-color:var(--ink);flex:none}
.fbm__err{background:#f6e3df;color:var(--bad);border-radius:10px;padding:9px 12px;font-size:13.5px;margin-bottom:12px}
.fbm__submit{width:100%;justify-content:center}
.cookie{position:fixed;left:max(16px,env(safe-area-inset-left,0px));right:max(16px,env(safe-area-inset-right,0px));bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:60;max-width:760px;margin:0 auto;background:var(--ink);color:#e8eaeb;border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,.3);padding:16px 18px;display:none;gap:16px;align-items:center;flex-wrap:wrap}
.cookie.show{display:flex}
.cookie__text{flex:1;min-width:240px;font-size:14px;line-height:1.5}
.cookie a{color:#fff;text-decoration-color:rgba(255,255,255,.4)}
.cookie__btns{display:flex;gap:8px}
.cookie .btn--primary{background:var(--paper);color:var(--ink)}
.cookie .btn--ghost{background:rgba(255,255,255,.12);color:#fff}
.cookie .btn{height:40px;padding:0 18px;font-size:14px}

/* подвал */
footer a:hover{color:#fff}
.ftr-pay{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;color:rgba(214,216,217,.55);font-size:12px}
.ftr-pay .icons{display:flex;flex-wrap:wrap;gap:14px;align-items:center;color:rgba(214,216,217,.7)}
@media (max-width:900px){
  .quiz-grid,.trust{grid-template-columns:1fr}
  .nav .ghost{display:none}
}

/* ===== страница «Законный сайт» ===== */
.hero>.eyebrow{margin-bottom:18px}
.badges{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 22px;margin-top:26px;font-size:14px;color:var(--ink-2)}
.badges span{display:inline-flex;align-items:center;gap:8px}
.badges span::before{content:"";width:5px;height:9px;border:solid var(--ink);border-width:0 1.6px 1.6px 0;transform:rotate(45deg) translateY(-2px)}
.laws{font-size:clamp(17px,1.8vw,22px)}
.fine-line{font-size:13px;color:var(--ink)}
.plans .card{min-height:0;gap:12px}
.plans .card h3::after{content:none}
.plans .price{margin:0;padding:0 0 6px;border-bottom:1px solid var(--line)}
.plans .card.hit .price{border-color:rgba(255,255,255,.14)}
.plans ul{list-style:none;margin:6px 0 10px;padding:0;display:grid;gap:9px;font-size:14.5px;color:var(--ink-2);line-height:1.45}
.plans .hit ul{color:rgba(255,255,255,.72)}
.plans li{display:flex;gap:10px}
.plans li::before{content:"";flex:none;width:5px;height:9px;margin-top:4px;border:solid currentColor;border-width:0 1.5px 1.5px 0;transform:rotate(45deg)}
.plans .btn{margin-top:auto;justify-self:start}
.btn-light{background:var(--paper);color:var(--ink)}
.steps4{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.steps4 .card{min-height:0}
.steps4 .card h3::after{content:none}
.partners .wrap{text-align:left;display:grid;gap:18px;justify-items:start}
.partners h2{font-size:clamp(30px,3.8vw,46px);letter-spacing:-.03em;line-height:1.05;max-width:16ch;color:#eef2f3}
.partners p{margin:0;max-width:58ch;color:rgba(238,242,243,.72);font-size:17px;line-height:1.6}
.pnums{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;width:100%;margin:22px 0 12px}
.pnums div{border-top:1px solid rgba(238,242,243,.18);padding-top:16px}
.pnums b{display:block;font-size:clamp(32px,4vw,48px);font-weight:500;letter-spacing:-.04em;line-height:1;color:#fff;font-variant-numeric:tabular-nums}
.pnums span{display:block;margin-top:8px;color:rgba(238,242,243,.6);font-size:14px}
@media (max-width:900px){.steps4,.pnums{grid-template-columns:1fr}}
@media (min-width:901px) and (max-width:1100px){.steps4{grid-template-columns:repeat(2,1fr)}}
.plans .card{display:flex;flex-direction:column}
.card.hit .eyebrow{color:rgba(255,255,255,.5)}
.plans .btn{align-self:flex-start}
.ab em.lg{background:none;width:22px;height:22px;border-radius:0}
.ab em.lg svg{display:block;width:100%;height:100%}
.ab.old em.lg{transition:opacity .3s}
.s1 .ab.old em.lg{opacity:.45}

/* ===== блог ===== */
.post{padding-block:40px 0}
.crumbs{font-size:13px;color:var(--ink-3);display:flex;flex-wrap:wrap;gap:8px;margin-bottom:34px}
.crumbs a:hover{color:var(--ink)}
.crumbs .sep{color:var(--line)}
.crumbs span:last-child{color:var(--ink-2)}
.post-head{display:grid;gap:16px;max-width:860px;margin-bottom:46px}
.post-head h1{font-size:clamp(32px,4.6vw,56px);line-height:1.03;letter-spacing:-.04em}
.post-meta{font-size:13.5px;color:var(--ink-3);max-width:70ch}
.hub-head p{margin:0;color:var(--ink-2);font-size:18px;line-height:1.6;max-width:62ch}
.post-grid{display:grid;grid-template-columns:240px minmax(0,720px);gap:clamp(32px,6vw,90px);align-items:start}
.toc{position:sticky;top:100px;display:grid;gap:12px;max-height:calc(100vh - 120px);overflow:auto}
.toc ol{list-style:none;margin:0;padding:0;display:grid;gap:2px;border-left:1px solid var(--line)}
.toc a{display:block;padding:6px 0 6px 14px;margin-left:-1px;border-left:1.5px solid transparent;font-size:13.5px;line-height:1.35;color:var(--ink-2);transition:color .2s,border-color .2s}
.toc a:hover,.toc a.on{color:var(--ink);border-color:var(--ink)}
.article{min-width:0}
.article>h2{font-size:clamp(24px,2.6vw,30px);letter-spacing:-.025em;line-height:1.15;margin:56px 0 16px;scroll-margin-top:100px}
.article h3{font-size:20px;letter-spacing:-.015em;margin:32px 0 10px}
.article h4{font-size:17px;margin:24px 0 8px}
.article p,.article li{font-size:17px;line-height:1.75;color:#24272a}
.article p{margin:0 0 18px}
.article ul,.article ol{margin:0 0 20px;padding-left:22px}
.article li{margin-bottom:8px}
.article li::marker{color:var(--ink-3)}
.article a{color:var(--ink);text-decoration:underline;text-decoration-color:rgba(11,12,12,.28);text-underline-offset:3px}
.article a:hover{text-decoration-color:var(--ink)}
.article code{background:#ececea;border-radius:6px;padding:1px 6px;font-size:.88em}
.article strong{font-weight:600}
.tldr{background:var(--paper);border-radius:var(--r-m);padding:24px 26px;display:grid;gap:10px;box-shadow:0 1px 0 rgba(11,12,12,.04),0 18px 50px rgba(11,12,12,.05)}
.tldr p{margin:0;font-size:18px;line-height:1.6;color:var(--ink)}
.tbl-wrap{overflow-x:auto;margin:6px 0 24px;background:var(--paper);border-radius:var(--r-m)}
.article table{border-collapse:collapse;width:100%;font-size:14.5px;min-width:520px}
.article th{text-align:left;font-weight:500;color:var(--ink-3);font-size:12px;letter-spacing:.05em;text-transform:uppercase;padding:14px 16px;border-bottom:1px solid var(--line)}
.article td{padding:13px 16px;border-top:1px solid var(--line);vertical-align:top;line-height:1.5}
.article tbody tr:first-child td{border-top:0}
.howto{counter-reset:ho;list-style:none;padding:0!important;margin:0 0 24px;border-top:1px solid var(--line)}
.howto li{position:relative;padding:16px 0 16px 48px;margin:0;border-bottom:1px solid var(--line)}
.howto li::before{counter-increment:ho;content:counter(ho);position:absolute;left:0;top:17px;width:28px;height:28px;border-radius:50%;background:var(--ink);color:var(--paper);font-size:13px;font-weight:500;display:grid;place-items:center}
.takeaways{border-top:1px solid var(--ink);padding-top:18px;margin:44px 0 0;display:grid;gap:12px}
.takeaways ul{margin:0}
.post-cta{margin:48px 0;background:linear-gradient(160deg,#1c2a31 0%,var(--night) 60%,#0a1013 100%);color:#eef2f3;border-radius:var(--r-l);padding:clamp(26px,4vw,44px);display:grid;gap:14px;justify-items:start}
.post-cta .eyebrow{color:rgba(238,242,243,.5)}
.post-cta h2{font-size:clamp(24px,2.8vw,32px);letter-spacing:-.025em;color:#fff;margin:0}
.post-cta p{margin:0;color:rgba(238,242,243,.72);font-size:16px;max-width:52ch}
.post-cta .btns{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.btn-ghost-dark,.article .post-cta .btn-ghost-dark{background:rgba(255,255,255,.1);color:#fff}
.article .post-cta .btn{text-decoration:none}
.faq-sec{margin-top:56px}
.faq-sec>h2{font-size:clamp(24px,2.6vw,30px);letter-spacing:-.025em;margin:0 0 18px;scroll-margin-top:100px}
.faq-sec .qa summary{font-size:17px}
.faq-sec .qa p{font-size:16px}
.disclaimer{font-size:13px!important;color:var(--ink-3)!important;margin-top:36px!important}
.related{margin-top:100px}
.rel-grid,.hub-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px 24px}
.hub-grid{margin-bottom:20px}
@media (max-width:900px){
  .post-grid{grid-template-columns:1fr}
  .toc{position:static;max-height:none;background:var(--paper);border-radius:var(--r-m);padding:18px}
  .rel-grid,.hub-grid{grid-template-columns:1fr}
}
@media (min-width:901px) and (max-width:1100px){.rel-grid,.hub-grid{grid-template-columns:repeat(2,1fr)}}

/* законы на «Законном сайте» */
.lawsec{padding-block:30px 0;display:grid;gap:22px}
.lawsec>.eyebrow{text-align:center}
.lawgrid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.lawgrid .law{background:var(--paper);border-radius:var(--r-m);padding:22px 20px 20px;display:flex;flex-direction:column;gap:10px;min-height:200px;transition:background .3s,color .3s,transform .3s}
.lawgrid .law b{font-size:clamp(22px,2vw,28px);font-weight:500;letter-spacing:-.035em;line-height:1.05}
.lawgrid .law .what{font-size:14.5px;line-height:1.45;color:var(--ink-2);transition:color .3s}
.lawgrid .law .when{margin-top:auto;align-self:flex-start;font-size:12px;font-weight:500;border-radius:999px;padding:5px 10px;background:#ececea;color:var(--ink);transition:background .3s,color .3s}
.lawgrid .law:hover,.lawgrid .law:focus-visible{background:var(--ink);color:var(--paper);transform:translateY(-3px)}
.lawgrid .law:hover .what,.lawgrid .law:focus-visible .what{color:rgba(255,255,255,.7)}
.lawgrid .law:hover .when,.lawgrid .law:focus-visible .when{background:rgba(255,255,255,.14);color:#fff}
.lawsec .stats{margin-top:28px}
@media (max-width:1100px){.lawgrid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:700px){.lawgrid{grid-template-columns:1fr 1fr}.lawgrid .law{min-height:170px}}
@media (max-width:420px){.lawgrid{grid-template-columns:1fr}.lawgrid .law{min-height:0}}
.lawgrid .law b{white-space:nowrap}
.lawgrid .law .when{white-space:nowrap}

/* обложки статей: заголовок и пиктограмма поверх размытия */
.cover::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 35%,rgba(0,0,0,.42) 100%);pointer-events:none}
.cv-ic{position:absolute;top:18px;right:18px;width:clamp(30px,3vw,40px);height:auto;fill:none;stroke:rgba(255,255,255,.92);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;z-index:1;transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.cv-t{position:absolute;left:20px;right:70px;bottom:16px;z-index:1;color:#fff;font-weight:500;font-size:clamp(20px,1.9vw,26px);line-height:1.05;letter-spacing:-.03em;text-wrap:balance}
.art:hover .cv-ic{transform:translateY(-3px) rotate(-4deg)}
.cv-ic{top:50%;right:clamp(18px,2.4vw,30px);width:clamp(58px,6.4vw,92px);transform:translateY(-62%);stroke-width:1.05;stroke:rgba(255,255,255,.88)}
.art:hover .cv-ic{transform:translateY(-66%) rotate(-4deg)}
.cv-t{right:clamp(90px,9vw,130px)}

/* российские атрибуты: флаг (ФКЗ о флаге разрешает изображение), реестр РКН текстом, без герба и эмблем */
.ru-flag{display:inline-block;flex:none;width:18px;height:12px;border-radius:2px;background:linear-gradient(#fff 0 33.4%,#0039a6 33.4% 66.7%,#d52b1e 66.7%);box-shadow:0 0 0 1px rgba(11,12,12,.14)}
.ru-chip{display:inline-flex;align-items:center;gap:9px;font-size:13px;font-weight:500;color:var(--ink-2);background:var(--paper);border-radius:999px;padding:7px 14px 7px 12px;margin-bottom:22px;box-shadow:0 1px 0 rgba(11,12,12,.04),0 8px 24px rgba(11,12,12,.05)}
.ic-gov{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.trust p b{display:flex;align-items:center;gap:8px}
.trust .ic-gov{width:18px;height:18px}
.ftr-ru{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:12px 28px;align-items:center;font-size:13px;color:rgba(214,216,217,.75);border-top:1px solid rgba(214,216,217,.14);padding-top:20px}
.ftr-ru span,.ftr-ru a{display:inline-flex;align-items:center;gap:9px}
.ftr-ru a{text-decoration:underline;text-decoration-color:rgba(214,216,217,.3);text-underline-offset:3px}
.ftr-ru .ru-flag{box-shadow:none}

/* юрстраницы и 404 */
.legal-page .article{max-width:760px;margin:0 auto}
.legal-page h1{font-size:clamp(30px,4.2vw,50px);line-height:1.05;letter-spacing:-.04em;font-weight:500;margin:10px 0 14px;text-wrap:balance}
.legal-page .upd{color:var(--ink-3)!important;font-size:14px!important;margin-bottom:34px!important}
.legal-page .article h2{font-size:clamp(20px,2.2vw,25px);margin:44px 0 12px;letter-spacing:-.02em;line-height:1.2}
.legal-page .article table{display:block;overflow-x:auto;background:var(--paper);border-radius:var(--r-m);margin:6px 0 22px}
.legal-page .back{display:inline-block;margin-top:44px;text-decoration:none!important;color:var(--ink-2)!important}
.nf-page{min-height:62vh;display:grid;align-content:center;justify-items:center;text-align:center;gap:16px;padding-block:80px 40px}
.nf-page h1{font-size:clamp(40px,7vw,88px);line-height:1;letter-spacing:-.05em;font-weight:500;margin:0}
.nf-page p{margin:0;color:var(--ink-2);font-size:17px;max-width:46ch}
.nf-page .actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin-top:12px}

/* меню на телефоне */
.nav{position:relative}
.nav .m-only,.burger{display:none}
.burger{width:42px;height:42px;border:0;border-radius:10px;background:transparent;color:var(--ink);cursor:pointer;align-items:center;justify-content:center;flex:none}
.burger:hover{background:rgba(255,255,255,.6)}
.burger span,.burger span::before,.burger span::after{display:block;width:18px;height:1.6px;background:currentColor;border-radius:2px;transition:transform .2s,background .2s}
.burger span{position:relative}
.burger span::before,.burger span::after{content:"";position:absolute;left:0}
.burger span::before{top:-6px}
.burger span::after{top:6px}
.nav.open .burger span{background:transparent}
.nav.open .burger span::before{transform:translateY(6px) rotate(45deg)}
.nav.open .burger span::after{transform:translateY(-6px) rotate(-45deg)}
@media (max-width:900px){
  .burger{display:inline-flex}
  .nav.open .links{display:flex;flex-direction:column;position:absolute;left:0;right:0;top:calc(100% + 8px);background:#efefed;border-radius:14px;padding:8px;box-shadow:0 18px 40px rgba(11,12,12,.12)}
  .nav.open .links a{display:block;font-size:17px;padding:14px 14px}
  .nav.open .links .m-only{display:block;border-top:1px solid rgba(11,12,12,.08);margin-top:4px}
}
@media (max-width:420px){.nav .cta{padding:10px 14px}.nav{gap:2px}}

/* преимущества: крупные заголовки */
.trust{gap:28px;margin-top:44px}
.trust p{font-size:15.5px;padding-top:20px}
.trust p b{font-size:20px;line-height:1.25;letter-spacing:-.015em;margin-bottom:8px;gap:10px}
.trust .ic-gov{width:22px;height:22px}
@media (max-width:900px){.trust{gap:30px}.trust p b{font-size:22px}}

/* «Законный сайт»: касается ли вас, кто мы, что получите */
.sec-head p{margin:0;color:var(--ink-2);font-size:16.5px;line-height:1.55}
.fit-sec{padding-top:70px}
.fit{display:grid;border-top:1px solid var(--line)}
.fit__row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr) minmax(0,.8fr);gap:10px 36px;padding:24px 0;border-bottom:1px solid var(--line);color:inherit;transition:background .2s}
.fit__row:hover{background:rgba(255,255,255,.55)}
.fit__has{font-size:20px;line-height:1.25;letter-spacing:-.015em;font-weight:500;color:var(--ink)}
.fit__need{font-size:15.5px;line-height:1.55;color:var(--ink-2)}
.fit__law{font-size:13.5px;line-height:1.45;color:var(--ink-3)}
.fit__cta{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px;margin-top:30px;font-size:14.5px;color:var(--ink-2)}
.who .card{min-height:0}
.who .card h3{font-size:22px}
.who .card h3::after{content:none}
#who .stats{margin-top:34px}
.got{margin-top:34px;background:var(--paper);border-radius:var(--r-m);padding:30px 30px 32px}
.got h3{font-size:22px;letter-spacing:-.015em;margin:0 0 16px}
.got ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 32px}
.got li{position:relative;padding-left:26px;font-size:15.5px;line-height:1.5;color:var(--ink-2)}
.got li::before{content:"";position:absolute;left:4px;top:5px;width:6px;height:11px;border:solid var(--ink);border-width:0 1.8px 1.8px 0;transform:rotate(45deg)}
@media (max-width:900px){
  .fit__row{grid-template-columns:1fr;padding:22px 0}
  .fit__has{font-size:21px}
  .who{grid-template-columns:1fr}
  .got ul{grid-template-columns:1fr}
  .got{padding:24px 22px 26px}
}
.fit__row{padding:26px 22px;border-radius:14px}
.fit__row:hover{background:var(--paper)}
@media (max-width:900px){.fit__row{padding:22px 14px}}
.fit__row{border-radius:0}
.fit__row:hover{background:var(--paper)}
#who .stats{grid-template-columns:repeat(4,1fr)}
@media (max-width:900px){#who .stats{grid-template-columns:repeat(2,1fr)}}

/* телефон: без горизонтальной прокрутки */
.acc button{box-sizing:border-box}
.qa summary{display:grid;grid-template-columns:minmax(0,1fr) auto;overflow-wrap:break-word;hyphens:auto}
.faq,.faq>*{min-width:0}
@media (max-width:900px){
  .acc button{width:auto}
  .qa summary{gap:16px}
}
html,body{overflow-x:clip}
@media (max-width:600px){.mock-cookie{flex-wrap:wrap}.mock-cookie span{flex:1 1 100%}}
.fine-card.big{width:min(420px,82vw)}
.fine-card.big .sum{font-size:clamp(36px,3.9vw,52px)}

/* бегущая строка платформ: лого только у WordPress и Drupal (их правила разрешают), остальные текстом */
.platforms{display:block;padding-block:34px 40px;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.marquee{display:flex;width:max-content;animation:marquee 38s linear infinite}
.marquee__row{display:flex;align-items:center;gap:64px;padding-right:64px;flex:none}
.marquee__row span{white-space:nowrap}
.marquee__row img{display:block;height:26px;width:auto;opacity:.36}
.marquee__row img.wp{height:30px}
.marquee__row img.dr{height:30px}
@keyframes marquee{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.marquee{animation:none}}
html[data-a11y-scheme] .marquee{animation:none}
.marquee__row .code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-weight:500;letter-spacing:0}
.cookie__btns .btn{white-space:nowrap}
@media (max-width:600px){.cookie{flex-wrap:wrap}.cookie__text{flex:1 1 100%}.cookie__btns{flex-wrap:wrap}}
@media (max-width:600px){.cookie__btns{flex-wrap:nowrap;gap:8px;width:100%}.cookie__btns .btn{flex:1 1 auto;padding:0 12px}}
.plans2{grid-template-columns:repeat(2,minmax(0,1fr));margin-top:12px}
@media (max-width:900px){.plans2{grid-template-columns:1fr}}

/* Модули отдельно: прайс под тарифами */
.mlist{margin-top:12px;background:var(--paper);padding:30px 32px 26px}
.mlist__t{font-size:22px;margin:0 0 14px}
.mrow{display:grid;grid-template-columns:minmax(0,230px) minmax(0,1fr) auto;gap:8px 28px;align-items:baseline;padding:18px 0;border-top:1px solid var(--line)}
.mrow__h b{display:block;font-size:17px}
.mrow__h span{font-size:13px;color:var(--ink-2)}
.mrow p{margin:0;font-size:15px;line-height:1.55;color:var(--ink-2)}
.mrow__p{font-family:var(--f-serif);font-weight:300;font-size:28px;white-space:nowrap;text-align:right}
.mrow__p small{font-family:var(--f-sans);font-size:15px;color:var(--ink-2)}
.mlist__n{margin:6px 0 0;padding-top:16px;border-top:1px solid var(--line);font-size:14px;color:var(--ink-2)}
.mprice{display:block;margin-top:8px;font-weight:600;color:var(--ink)}
@media (max-width:900px){.mlist{padding:22px 18px 18px}.mrow{grid-template-columns:minmax(0,1fr) auto}.mrow p{grid-column:1/-1;grid-row:2}.mrow__p{font-size:24px}}

/* Знак [§] в шапке и подвале */
.logo,footer .mark{display:inline-flex;align-items:center;gap:9px}
.logo__mark{height:28px;width:auto;flex:none}

/* Обложки статей картинкой (build_covers.py) */
.cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;border-radius:inherit;transition:transform 1.2s cubic-bezier(.2,.8,.2,1)}
.art:hover .cover img{transform:scale(1.025)}
.cover:has(>img)::after{display:block;background:none;border-radius:inherit;box-shadow:inset 0 0 0 1px rgba(11,12,12,.08);z-index:1}
.cover:has(>img){background:none}

/* «Касается ли это вас» на телефоне: крупнее, текст по словам вслед за прокруткой, штраф итогом */
@media (max-width:900px){
  .fit__has{font-size:24px;line-height:1.2}
  .fit__need{font-size:20px;line-height:1.5;color:var(--ink)}
  .fit__law{font-size:18px;line-height:1.4;font-weight:600;color:var(--bad);margin-top:4px}
  .fit-type .fit__need .fw{opacity:.16;transition:opacity .35s ease}
  .fit-type .fit__need .fw.on{opacity:1}
  .fit-type .fit__law{opacity:0;transform:translateY(12px);transition:opacity .5s ease,transform .5s ease}
  .fit-type .fit-done .fit__law{opacity:1;transform:none}
}

/* Штрафы на телефоне: карусель со свайпом */
@media (max-width:900px){
  .h-swipe{height:auto!important}
  .h-swipe .pin{position:static;height:auto;padding:76px 0 30px}
  .h-swipe .hview{overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;scroll-padding-left:16px;overscroll-behavior-x:contain}
  .h-swipe .hview::-webkit-scrollbar{display:none}
  .h-swipe .track{transform:none!important}
  .h-swipe .fine-card{scroll-snap-align:start;height:auto;min-height:310px;width:80vw}
  .h-swipe .fine-card.big{width:84vw}
  .fdots{margin-top:16px}
  .h-swipe .hint{margin-top:14px}
}
/* Подсказка «Листайте вниз» и полоса хода закреплённого блока */
.scroll-hint{position:absolute;left:50%;bottom:calc(18px + env(safe-area-inset-bottom));transform:translate(-50%,8px);display:flex;align-items:center;gap:10px;padding:8px 14px 8px 10px;border-radius:999px;background:rgba(255,255,255,.86);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 1px 0 rgba(11,12,12,.06),0 6px 20px rgba(11,12,12,.08);font-size:13.5px;font-weight:500;color:var(--ink);opacity:0;pointer-events:none;transition:opacity .4s ease,transform .4s ease;z-index:5}
.scroll-hint.on{opacity:1;transform:translate(-50%,0)}
.sh-ic{width:16px;height:24px;border:1.6px solid var(--ink);border-radius:9px;position:relative;flex:none}
.sh-ic i{position:absolute;left:50%;top:5px;width:4px;height:4px;margin-left:-2px;border-radius:50%;background:var(--ok);animation:shDot 1.6s cubic-bezier(.4,0,.2,1) infinite}
@keyframes shDot{0%{transform:translateY(0);opacity:0}20%{opacity:1}70%{transform:translateY(9px);opacity:1}100%{transform:translateY(11px);opacity:0}}
.pin-progress{position:absolute;left:0;right:0;bottom:0;height:2px;background:rgba(11,12,12,.06);opacity:0;transition:opacity .3s;pointer-events:none}
.pin-progress.on{opacity:1}
.pin-progress b{display:block;height:100%;background:var(--ok);transform-origin:left;transform:scaleX(0)}
@media (prefers-reduced-motion:reduce){.sh-ic i{animation:none;top:8px;opacity:1}}
html.a11y .scroll-hint,html.a11y .pin-progress{display:none}
/* Подсказка справа, между серединой и верхом экрана; на телефоне палец тянет вверх */
.scroll-hint{left:auto;right:16px;bottom:auto;top:34%;transform:translateX(8px);flex-direction:column;gap:6px;padding:12px 10px 10px;border-radius:18px;font-size:12px;line-height:1.15;text-align:center;width:76px}
.scroll-hint.on{transform:none}
.sh-hand{position:relative;width:30px;height:40px;color:var(--ink)}
.sh-hand svg{position:absolute;left:3px;bottom:0;width:26px;height:26px;animation:shHand 1.8s cubic-bezier(.4,0,.2,1) infinite}
.sh-hand i{position:absolute;left:8px;top:2px;width:2px;height:16px;border-radius:2px;background:linear-gradient(var(--ok),rgba(47,143,91,0));opacity:0;animation:shTrail 1.8s cubic-bezier(.4,0,.2,1) infinite}
@keyframes shHand{0%{transform:translateY(6px);opacity:0}15%{opacity:1}65%{transform:translateY(-10px);opacity:1}100%{transform:translateY(-12px);opacity:0}}
@keyframes shTrail{0%,25%{opacity:0;transform:translateY(8px)}55%{opacity:1}85%,100%{opacity:0;transform:translateY(-4px)}}
@media (prefers-reduced-motion:reduce){.sh-hand svg,.sh-hand i{animation:none;opacity:1}}
/* Без плашки: иконка и подпись прямо на фоне, только в начале закреплённого блока */
.scroll-hint{background:none;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;padding:0;color:var(--ink-2)}
.scroll-hint.on{opacity:.75}
.scroll-hint .sh-ic{border-color:var(--ink-2)}
.scroll-hint.touch{width:auto;right:14px}
.scroll-hint.touch .sh-t{display:none}
.scroll-hint.touch.on{opacity:.45}
.scroll-hint.touch .sh-hand{width:34px;height:48px}
.scroll-hint.touch .sh-hand svg{width:32px;height:32px}
.mkt-hint{font-size:13px;color:var(--ink-2);margin:-8px 0 12px;line-height:1.45}
/* Кнопка «Наверх» (nav.js) */
.totop{position:fixed;right:20px;bottom:20px;z-index:55;width:48px;height:48px;border:0;border-radius:999px;background:var(--ink);color:var(--paper);display:grid;place-items:center;cursor:pointer;opacity:0;transform:translateY(12px);pointer-events:none;transition:opacity .25s,transform .25s;box-shadow:0 6px 20px rgba(11,12,12,.18)}
.totop.on{opacity:1;transform:none;pointer-events:auto}
.totop:hover{transform:translateY(-2px)}
.totop:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.totop svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
@media (max-width:600px){.totop{right:16px;bottom:16px;width:44px;height:44px}}
/* Кнопки заказа (01.11): тарифы, модули, поля заказа в модалке */
.fbm__field[hidden]{display:none}
.fbm__field select{appearance:none;-webkit-appearance:none;padding-right:38px;background:var(--paper) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b0c0c' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center/16px}
#tariffs .cards3 .card{display:flex;flex-direction:column;gap:10px}
#tariffs .cards3 .card .price{margin-bottom:18px}
#tariffs .cards3 .card .btn{margin-top:0;align-self:flex-start}
.btn-light:hover,.btn-dark:hover{transform:translateY(-1px)}
.mrow__order{display:block;margin-top:6px;text-align:right;line-height:1.3;font-family:var(--f-sans);font-size:14px;font-weight:500;color:var(--ink);text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}
.mrow__order:hover{text-decoration-thickness:2px}
.quiz__pre{background:var(--ground);border-radius:12px;padding:10px 14px;font-size:14px;color:var(--ink-2);margin-bottom:14px}
/* Статьи: время чтения и полоса прочтения (build_blog.py) */
.read-bar{position:fixed;left:0;right:0;top:0;height:3px;z-index:30;pointer-events:none}
.read-bar i{display:block;height:100%;background:var(--ok);transform:scaleX(0);transform-origin:0 50%;will-change:transform}
.read-time{display:inline-block;font-weight:500;color:var(--ink);background:var(--pill);border-radius:999px;padding:2px 10px;margin-right:8px;font-size:.92em}
#tariffs .cards3 .card h3::after{content:none}
/* Корзина в форме заказа (index.html, #fbSvcF) */
.ocart{display:grid;gap:2px;margin-bottom:14px}
.ocart[hidden]{display:none}
.ocart__h{font-size:13px;color:var(--ink-2);margin:10px 0 4px}
.ocart__h:first-child{margin-top:0}
.ocart__h small{color:var(--ink-3);font-size:12px;margin-left:4px}
.ocart__row{display:grid;grid-template-columns:18px 1fr auto;gap:10px;align-items:center;padding:8px 10px;border-radius:10px;cursor:pointer;font-size:14.5px;line-height:1.35}
.ocart__row:hover{background:var(--ground)}
.fbm__field .ocart__row input{display:inline-block;margin:0;padding:0;border:0;width:16px;height:16px;accent-color:var(--ink)}
.ocart__row b{font-weight:500;white-space:nowrap;font-variant-numeric:tabular-nums}
.ocart__row:has(input:checked){background:var(--ground)}
.ocart__sum{margin-top:8px;padding:10px 10px 0;border-top:1px solid var(--line);font-size:15px}
.ocart__sum:empty{display:none}
.ocart__sum small{display:block;margin-top:2px;color:var(--ink-2);font-size:12.5px}
.ocart__all[hidden],.ocart__picked[hidden],.ocart__more[hidden]{display:none}
.ocart__pick{display:grid;grid-template-columns:1fr auto 28px;gap:10px;align-items:center;padding:10px 4px 10px 12px;border-radius:12px;background:var(--ground);font-size:15px;line-height:1.35;margin-bottom:4px}
.ocart__pick b{font-weight:500;white-space:nowrap;font-variant-numeric:tabular-nums}
.ocart__pick button{border:0;background:none;width:28px;height:28px;border-radius:50%;font-size:18px;line-height:1;color:var(--ink-3);cursor:pointer}
.ocart__pick button:hover{background:rgba(11,12,12,.06);color:var(--ink)}
.ocart__more{justify-self:start;border:0;background:none;padding:6px 2px;font:inherit;font-size:14px;color:var(--ink-2);text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:3px;cursor:pointer}
.ocart__more:hover{color:var(--ink)}
.fbm__msgbtn{display:block;margin:-4px 0 12px}
.ocart__extra[hidden]{display:none}
#cartExtraBtn{margin-top:4px}
