@layer основа{
  *{box-sizing:border-box}
  html{-webkit-text-size-adjust:var(--sz64);scroll-behavior:smooth}
  @media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}
    *,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
  body{margin:0;font-family:var(--ff);font-size:var(--t14);line-height:1.6;color:var(--tx-2);background:var(--bg);
    -webkit-font-smoothing:antialiased}
  h1,h2,h3,h4{font-family:var(--ff);color:var(--tx);margin:0;line-height:1.15;letter-spacing:var(--tr8);font-weight:700}
  h1{font-size:clamp(var(--t46),var(--t30),var(--t51));font-weight:800;letter-spacing:-.038em}
  h2{font-size:clamp(var(--t17),var(--t28),var(--t49));font-weight:800;letter-spacing:-.032em}
  h3{font-size:clamp(18px,1.5vw,22px)}
  p{margin:0}
  a{color:inherit}
  img,svg{max-width:var(--sz64);display:block}
  .wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
  section{padding:clamp(62px,7.5vw,112px) 0}
  .eyebrow{font-size:var(--t9);font-weight:700;letter-spacing:var(--tr19);text-transform:uppercase;color:var(--acc);margin-bottom:15px}
  .lead{font-size:clamp(var(--t14),var(--t18),var(--t37));color:var(--tx-2);line-height:1.58;max-width:64ch}
  .center{text-align:center}.center .lead{margin-inline:auto}
  .sec-head{max-width:var(--sz173);margin-bottom:clamp(36px,4vw,58px)}
  .sec-head.center{margin-inline:auto}

  /* ---------- buttons ---------- */
  .btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s12);min-height:var(--sz122);padding:0 var(--s23);
    border-radius:var(--r2);font-size:var(--t13);font-weight:700;text-decoration:none;border:var(--sz90) solid transparent;
    cursor:pointer;font-family:var(--ff);
    transition:background .2s,color .2s,border-color .2s,box-shadow .2s,transform .12s}
  .btn:focus-visible{outline:var(--sz94) solid var(--acc);outline-offset:3px}
  .btn:active{transform:translateY(1px)}
  .btn-primary{background:var(--acc);color:var(--card);box-shadow:0 6px 18px rgba(232,85,45,.28)}
  .btn-primary:hover{background:var(--acc-dark);box-shadow:0 8px 22px rgba(200,67,31,.32)}
  .btn-ghost{background:var(--card);color:var(--tx);border-color:var(--line-2)}
  .btn-ghost:hover{border-color:var(--tx);box-shadow:var(--sh-s)}
  .btn-onDark{background:var(--card);color:var(--tx)}
  .btn-onDark:hover{background:var(--ц-EDEFF1)}
  .btn-outDark{background:transparent;color:var(--card);border-color:var(--dark-line)}
  .btn-outDark:hover{background:var(--ц-rgba-255-255-255-07);border-color:rgba(255,255,255,.42)}
  .btn-sm{min-height:var(--sz118);padding:0 var(--s19);font-size:15px}

  /* ---------- header ---------- */
  .hdr{position:sticky;top:0;z-index:100;background:var(--ц-rgba-246-247-248-9);backdrop-filter:blur(var(--sz101));
    border-bottom:1px solid var(--line)}
  .hdr-in{position:relative;display:flex;align-items:center;gap:var(--s44);height:74px}
  .logo{display:flex;align-items:center;gap:var(--s13);font-weight:800;font-size:var(--t38);color:var(--tx);
    text-decoration:none;letter-spacing:-.03em}
  .logo-m{width:var(--sz45);height:var(--sz45);border-radius:var(--r4);background:var(--acc);display:grid;place-items:center;flex:none}
  .logo em{font-style:normal;color:var(--acc)}
  .nav{display:flex;gap:var(--s42);margin-left:auto}
  .nav a{font-size:var(--t12);font-weight:500;color:var(--tx-2);text-decoration:none;transition:color .18s;white-space:nowrap}
  .nav a:hover{color:var(--tx)}
  .hdr .btn{margin-left:var(--s10);white-space:nowrap}

  /* бургер-меню — только на узких экранах, чтобы кнопка в шапке не переносилась по словам */
  .menu-btn{display:none;align-items:center;justify-content:center;width:var(--sz118);height:var(--sz118);margin-left:auto;
    border:var(--sz90) solid var(--line);border-radius:var(--r);background:var(--card);cursor:pointer;flex:none;padding:0}
  .menu-btn:focus-visible{outline:var(--sz94) solid var(--acc);outline-offset:2px}
  .menu-btn svg{width:var(--sz40);height:var(--sz40);color:var(--tx)}
  .menu-btn .ic-close{display:none}
  .menu-btn[aria-expanded="true"] .ic-open{display:none}
  .menu-btn[aria-expanded="true"] .ic-close{display:block}

  .mobile-nav{position:absolute;top:var(--sz64);left:0;right:0;background:var(--card);border-bottom:var(--sz31) solid var(--line);
    box-shadow:var(--sh);padding:var(--s10) var(--s22) var(--s20);display:flex;flex-direction:column}
  .mobile-nav[hidden]{display:none}
  .mobile-nav>a{display:flex;align-items:center;min-height:var(--sz121);font-size:var(--t13);font-weight:600;color:var(--tx);
    text-decoration:none;border-bottom:1px solid var(--line)}
  .mobile-nav>a:last-of-type{border-bottom:none}
  .auth-row{display:flex;gap:var(--s12);margin-top:var(--s18);padding-top:var(--s19);border-top:1px solid var(--line)}
  .auth-row .btn{flex:1;min-height:52px}
  .auth-row .btn-ghost{color:var(--tx)}
  .auth-row .btn-primary{color:var(--card)}

  /* ноутбучный диапазон: полное меню + две кнопки не помещались и рвали строку.
     Поджимаем шаг и убираем оправу у «Войти» — бургер остаётся только для узких. */
  @media(max-width:1180px) and (min-width:1021px){
    .hdr-in{gap:16px}
    .nav{gap:14px}
    .nav a{font-size:14.5px}
    .hdr .btn{margin-left:var(--s6);padding:0 16px}
    .hdr-login{background:none;border-color:transparent;padding:0 var(--s8);box-shadow:none}
    .hdr-login:hover{background:none;border-color:transparent;color:var(--acc)}
  }
  @media(max-width:1020px){
    .nav{display:none}
    .hdr-in{gap:12px}
    .hdr>.wrap>.hdr-cta:not(.hdr-login){display:none}
    .hdr-login{margin-left:auto}
    .menu-btn{display:inline-flex;margin-left:0}
  }
  @media(min-width:1021px){.mobile-nav{display:none!important}}

  /* ---------- hero ---------- */
  .hero{padding-top:clamp(var(--s48),var(--s38),var(--s53));padding-bottom:clamp(var(--s50),var(--s39),var(--s54));background:var(--card);
    border-bottom:1px solid var(--line)}
  /* 03.08.2026: hero стал одноколоночным и идёт в порядке
     плашка → заголовок → анимация во всю ширину → лид → кнопки.
     Прежняя сетка 1.03fr/.97fr зажимала SVG 1600x900 в половину
     колонки, и подписи внутри него падали до 6px */
  /* 1000px, а не 880: при 880 «Рассчитайте стоимость опалубки» (930px на 60px кегле)
     разваливалось на три строки с сиротой «опалубки». На 1000px заголовок
     ложится в две: «…стоимость опалубки» / «за 2 минуты», без принудительного <br> */
  .hero-txt{max-width:var(--sz175);margin:0 auto;text-align:center}
  .hero-txt .lead{margin-inline:auto}
  .pill{display:inline-flex;align-items:center;gap:var(--s11);padding:var(--s10) var(--s17) var(--s10) var(--s13);border-radius:var(--r17);
    background:var(--ok-soft);border:var(--sz31) solid var(--ц-CFEADC);font-size:var(--t11);font-weight:600;color:var(--ц-0B6B3C);margin-bottom:24px}
  .pill .dot{width:var(--sz35);height:var(--sz35);border-radius:var(--r8);background:var(--ok);flex:none}
  .hero h1{margin-bottom:0}
  .hero h1 .hl{color:var(--acc)}
  .hero .lead{margin-bottom:30px}
  /* блок под анимацией: лид, кнопки, примечание */
  .hero-txt-low{margin-top:clamp(2px,0.6vw,8px)}
  .hero-cta{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--s15);margin-bottom:24px}
  .hero-note{font-size:var(--t12);color:var(--tx-3);display:flex;align-items:center;justify-content:center;gap:9px}
  .hero-note svg{flex:none;color:var(--ok)}

  /* ---------- mock ---------- */
  /* отступы малые: у самого SVG внутри ещё ~32px поля сверху и ~57px снизу — это тень окна */
  .mock{position:relative;margin-top:clamp(6px,0.9vw,12px)}
  .mock-body{position:relative}

  /* ---- сцена-анимация в герое: HERO RU.svg (1600x900), вставлена 03.08.2026.
         Классы и id внутри изолированы префиксом hs-: у файла свой <style>,
         без префикса он перехватил бы селектор text{} и классы .cta/.panel/.price.
         Пропорции родные 16:9, не растягиваем ---- */
  .mock-body svg{width:var(--sz64);height:auto;display:block}

  @media (prefers-reduced-motion:reduce){
    .hs-root *{animation:none!important}
    .hs-scene1,.hs-scene2,.hs-scene3{opacity:0!important}
    .hs-scene4{opacity:1!important}
    .hs-proposal-card,.hs-price,.hs-cta,
    .hs-check1,.hs-check2,.hs-check3{opacity:1!important;transform:none!important}
    .hs-plan-line,.hs-plan-thin,.hs-dimension{stroke-dashoffset:0!important}
    .hs-status1,.hs-status2{opacity:.34!important}
    .hs-status3{opacity:1!important}
    .hs-stageDot3{fill:var(--ц-FF4A18)!important}
  }

  /* ================= FLOW / STEPS ================= */
  .flow{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
  @media(max-width:1020px){.flow{grid-template-columns:repeat(2,1fr);gap:34px 20px}}
  @media(max-width:600px){.flow{grid-template-columns:1fr;gap:30px}}
  .fs{position:relative;display:flex;flex-direction:column}
  /* шкала шагов: кружок — линия — точка-подводка к карточке */
  .fs-head{display:flex;align-items:center;margin-bottom:var(--s24);position:relative}
  .fs-num{width:var(--sz45);height:var(--sz45);border-radius:var(--r8);flex:none;display:grid;place-items:center;
    background:var(--acc);color:var(--card);font-size:var(--t12);font-weight:800;letter-spacing:var(--tr1);
    position:relative;z-index:2;box-shadow:0 4px 12px rgba(232,85,45,.26)}
  .fs-line{flex:1;height:var(--sz31);background:var(--line-2)}
  .fs:last-child .fs-line{display:none}
  .fs-head::after{content:"";position:absolute;left:var(--sz102);bottom:var(--sz84);width:var(--sz95);height:var(--sz95);border-radius:var(--r8);
    background:var(--acc)}
  @media(max-width:1020px){.fs:nth-child(2) .fs-line{display:none}}
  @media(max-width:600px){.fs-line{display:none}}
  .fs-card{background:var(--card);border:var(--sz31) solid var(--line);border-radius:var(--r7);padding:var(--s19) var(--s19) var(--s21);
    flex:1;display:flex;flex-direction:column;box-shadow:0 var(--sz31) var(--sz33) var(--ц-rgba-20-24-28-04);
    transition:transform .22s,box-shadow .22s,border-color .22s}
  .fs-card:hover{transform:translateY(var(--sz87));box-shadow:var(--sh);border-color:var(--line-2)}
  .fs-vis{border-radius:var(--r5);background:var(--ц-F7F8FA);border:var(--sz31) solid var(--ц-EDEFF3);margin-bottom:var(--s20);overflow:hidden}
  .fs-vis svg{width:var(--sz64);height:auto;display:block}
  .fs-card h3{margin-bottom:var(--s11);font-size:var(--t35);letter-spacing:-.022em}
  .fs-card p{font-size:var(--t12);color:var(--tx-2);line-height:1.6;margin-bottom:20px}
  .fs-tag{display:inline-flex;align-items:center;gap:var(--s9);margin-top:auto;align-self:flex-start;
    font-size:var(--t8);font-weight:600;color:var(--acc);background:var(--acc-soft);border-radius:var(--r17);
    padding:7px 13px 7px 11px}
  .fs-tag svg{flex:none}

  /* ================= WAREHOUSE ================= */
  .wh{background:var(--dark);color:var(--card)}
  .wh h2,.wh h3{color:var(--card)}
  .wh .lead{color:var(--ц-9DA7B1)}
  .wh .eyebrow{color:var(--acc)}
  .wh-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(var(--s43),var(--s37),var(--s50));align-items:start}
  @media(max-width:940px){.wh-grid{grid-template-columns:1fr;gap:38px}}
  /* три шага: заголовок + одна строка + чипы конкретики (вместо стены текста) */
  .wh-steps{list-style:none;padding:0;margin:var(--s24) 0 0;display:grid;gap:12px}
  .wh-steps li{display:flex;gap:var(--s17);background:var(--dark-2);border:var(--sz31) solid var(--dark-line);
    border-radius:var(--r2);padding:var(--s40) var(--s19) var(--s18);transition:border-color .2s}
  .wh-steps li:hover{border-color:var(--ц-41505C)}
  .wh-steps .n{width:var(--sz110);height:var(--sz110);border-radius:var(--r3);background:var(--acc);color:var(--card);flex:none;
    display:grid;place-items:center;font-size:var(--t9);font-weight:800}
  .wh-steps b{display:block;color:var(--card);font-size:var(--t33);font-weight:700;margin-bottom:3px}
  .wh-steps p{font-size:var(--t31);color:var(--ц-9DA7B1);line-height:1.5}
  .wh-tags{display:flex;flex-wrap:wrap;gap:var(--s8);margin-top:11px}
  .wh-tags i{font-style:normal;font-size:var(--t8);line-height:1;color:var(--ц-A9B3BD);background:var(--ц-242C34);
    border:var(--sz31) solid var(--dark-line);border-radius:var(--r2);padding:6px 9px}
  .wh-steps li.out .wh-tags i{color:var(--ц-E9A78F);background:var(--ц-rgba-232-85-45-11);border-color:rgba(232,85,45,.28)}
  /* ---- панель склада: настоящий светлый экран продукта на тёмной секции ---- */
  .wh-panel{background:var(--card);border-radius:var(--r4);box-shadow:var(--sh-l);overflow:hidden;
    color:var(--tx)}
  /* под панелью — факты о переносе, чтобы короткий список не оставлял пустоту */
  .wh-side{display:grid;gap:var(--s18);align-content:start}
  .wh-quick{display:grid;gap:12px}
  .wh-q{display:flex;align-items:center;gap:var(--s16);background:var(--dark-2);border:var(--sz31) solid var(--dark-line);
    border-radius:var(--r2);padding:16px 18px}
  .wh-q .ic{width:var(--sz47);height:var(--sz47);border-radius:var(--r5);flex:none;display:grid;place-items:center;
    background:var(--ц-242C34);color:var(--acc)}
  .wh-q b{display:block;font-size:var(--t33);font-weight:700;color:var(--card);margin-bottom:2px}
  .wh-q span{font-size:var(--t11);color:var(--ц-9DA7B1);line-height:1.45}
  .wh-panel-h{display:flex;align-items:center;gap:var(--s13);padding:var(--s17) var(--s20);border-bottom:1px solid var(--line)}
  .wh-panel-h .mark{width:var(--sz42);height:var(--sz42);border-radius:var(--r2);background:var(--acc);color:var(--card);flex:none;
    display:grid;place-items:center;font-size:var(--t9);font-weight:800}
  .wh-panel-h b{font-size:var(--t12);font-weight:700;color:var(--tx)}
  .wh-panel-h em{font-style:normal;margin-left:auto;color:var(--ok);background:var(--ok-soft);
    border-radius:var(--r17);padding:var(--s7) var(--s13);font-size:var(--t7);font-weight:700}
  /* подписи колонок: смысл столбца не держится на одном цвете */
  .wh-cols,.wh-row{display:grid;grid-template-columns:minmax(0,1fr) var(--sz149) var(--sz140);gap:var(--s16);align-items:center}
  .wh-cols{padding:var(--s13) var(--s20);background:var(--soft);border-bottom:var(--sz31) solid var(--line);
    font-size:var(--t3);font-weight:700;letter-spacing:var(--tr15);text-transform:uppercase;color:var(--tx-3);white-space:nowrap}
  .wh-cols span:last-child{text-align:right}
  .wh-cols em{font-style:normal}
  /* список подрезан и растворяется книзу — панель не тянет секцию вниз */
  .wh-scroll{position:relative}
  .wh-rows{padding:0 var(--s20);max-height:var(--sz163);overflow:hidden}
  .wh-fade{position:absolute;left:0;right:0;bottom:0;height:var(--sz140);pointer-events:none;
    backdrop-filter:blur(var(--sz93));-webkit-backdrop-filter:blur(var(--sz93));
    background:linear-gradient(180deg,var(--ц-rgba-255-255-255-0),var(--ц-rgba-255-255-255-94));
    -webkit-mask-image:linear-gradient(180deg,transparent,var(--ц-000000) var(--sz55));
    mask-image:linear-gradient(180deg,transparent,var(--ц-000000) 58%)}
  .wh-more{padding:var(--s13) var(--s20) var(--s15);font-size:var(--t9);color:var(--tx-3);border-top:1px solid var(--line)}
  .wh-row{padding:var(--s14) 0;border-bottom:var(--sz31) solid var(--line);font-size:14px}
  .wh-row:last-child{border-bottom:0}
  /* появление: скрытое состояние включает только JS, без него список виден сразу */
  .wh-panel.reveal{opacity:0;transform:translateY(var(--sz101));
    transition:opacity .45s ease-out,transform .45s ease-out}
  .wh-panel.reveal .wh-row{opacity:0;transform:translateY(var(--sz35));
    transition:opacity .32s ease-out,transform .32s ease-out}
  .wh-panel.reveal.run{opacity:1;transform:none}
  .wh-panel.reveal.run .wh-row{opacity:1;transform:none}
  .wh-rows .wh-row:nth-child(1){transition-delay:.14s}
  .wh-rows .wh-row:nth-child(2){transition-delay:.18s}
  .wh-rows .wh-row:nth-child(3){transition-delay:.22s}
  .wh-rows .wh-row:nth-child(4){transition-delay:.26s}
  .wh-rows .wh-row:nth-child(5){transition-delay:.30s}
  .wh-rows .wh-row:nth-child(6){transition-delay:.34s}
  .wh-rows .wh-row:nth-child(7){transition-delay:.38s}
  .wh-rows .wh-row:nth-child(8){transition-delay:.42s}
  .wh-rows .wh-row:nth-child(9){transition-delay:.46s}
  .wh-row .nm{color:var(--tx);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  /* шкала загрузки — как в админке: трек --soft, заливка --blue (выход/erp.html:64) */
  .wh-row .ld{display:flex;align-items:center;gap:9px}
  .wh-row .ld i{flex:1;height:var(--sz97);border-radius:var(--r11);background:var(--soft);overflow:hidden}
  .wh-row .ld i b{display:block;height:var(--sz64);border-radius:var(--r11);background:var(--blue)}
  .wh-row .ld em{font-style:normal;font-size:var(--t8);font-weight:700;color:var(--tx-2);
    font-variant-numeric:tabular-nums;min-width:var(--sz43);text-align:right}
  .wh-row .q{text-align:right;font-size:var(--t9);color:var(--tx-3);font-variant-numeric:tabular-nums;white-space:nowrap}
  .wh-row .q b{color:var(--acc);font-size:var(--t31);font-weight:700}
  .wh-panel-f{display:flex;align-items:center;gap:var(--s10);padding:var(--s14) var(--s20);background:var(--soft);
    border-top:var(--sz31) solid var(--line);font-size:var(--t8);color:var(--tx-2)}
  .wh-panel-f svg{flex:none;color:var(--blue)}
  @media(max-width:520px){
    .wh-cols,.wh-row{grid-template-columns:minmax(0,1fr) 90px}
    .wh-cols span:nth-child(2),.wh-cols em,.wh-row .ld{display:none}
  }

  /* ================= ВИДЫ ОПАЛУБКИ — своя секция ================= */
  .types{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
  @media(max-width:760px){.types{grid-template-columns:repeat(2,1fr)}}
  @media(max-width:420px){.types{grid-template-columns:1fr}}
  .type{background:var(--card);border:var(--sz31) solid var(--line);border-radius:var(--r7);padding:var(--s21) var(--s20) var(--s20);
    display:flex;flex-direction:column;align-items:flex-start;box-shadow:0 var(--sz31) var(--sz33) var(--ц-rgba-20-24-28-04);
    transition:transform .22s,box-shadow .22s,border-color .22s}
  .type:hover{transform:translateY(var(--sz87));box-shadow:var(--sh);border-color:var(--line-2)}
  .type .ic{width:var(--sz118);height:var(--sz118);border-radius:var(--r6);display:grid;place-items:center;margin-bottom:var(--s18);
    background:var(--soft);color:var(--tx-2)}
  .type b{font-size:var(--t33);font-weight:700;color:var(--tx);display:block;margin-bottom:14px}
  .type.live{border-color:var(--ц-rgba-15-138-77-45);box-shadow:0 10px 28px rgba(15,138,77,.11)}
  .type.live .ic{background:var(--ok-soft);color:var(--ok)}
  .badge{display:inline-flex;align-items:center;gap:var(--s8);font-size:var(--t7);font-weight:700;border-radius:var(--r17);
    padding:var(--s7) var(--s13);margin-top:auto}
  .badge .d{width:var(--sz97);height:var(--sz97);border-radius:var(--r8);background:currentColor;flex:none}
  .badge.on{background:var(--ok-soft);color:var(--ok)}
  .badge.off{background:var(--soft);color:var(--tx-3)}

  /* ================= TABS ================= */
  .tabs{display:flex;gap:var(--s10);flex-wrap:wrap;margin-bottom:var(--s22);justify-content:center}
  .tab{appearance:none;background:var(--card);border:var(--sz90) solid var(--line);color:var(--tx-2);font-family:var(--ff);
    font-weight:600;font-size:var(--t12);min-height:var(--sz119);padding:0 var(--s20);border-radius:var(--r2);cursor:pointer;transition:all .2s}
  .tab:hover{border-color:var(--line-2);color:var(--tx)}
  .tab[aria-selected="true"]{background:var(--acc);border-color:var(--acc);color:var(--card)}
  .tab:focus-visible{outline:var(--sz94) solid var(--acc);outline-offset:3px}
  .panel{display:none;background:var(--card);border:var(--sz31) solid var(--line);border-radius:var(--r4);overflow:hidden;
    box-shadow:var(--sh)}
  .panel[data-active="true"]{display:block}
  .panel-in{display:grid;grid-template-columns:1.12fr .88fr}
  @media(max-width:920px){.panel-in{grid-template-columns:1fr}}
  .panel-vis{padding:var(--s22);background:var(--dark);display:grid;place-items:center;min-height:320px}
  .panel-txt{padding:clamp(26px,3vw,40px)}
  .panel-txt h3{margin-bottom:13px}
  .panel-txt p{color:var(--tx-2);font-size:var(--t13);line-height:1.6;margin-bottom:20px}
  .checks{list-style:none;padding:0;margin:0;display:grid;gap:11px}
  .checks li{display:flex;gap:var(--s13);font-size:var(--t32);color:var(--tx);line-height:1.5}
  .checks svg{flex:none;color:var(--acc);margin-top:3px}

  /* ================= FEATURES ================= */
  .feats{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
  @media(max-width:980px){.feats{grid-template-columns:repeat(2,1fr)}}
  @media(max-width:620px){.feats{grid-template-columns:1fr}}
  .feat{background:var(--card);border:var(--sz31) solid var(--line);border-radius:var(--r3);padding:var(--s23) var(--s22);
    transition:transform .22s,box-shadow .22s,border-color .22s}
  .feat:hover{transform:translateY(var(--sz88));box-shadow:var(--sh);border-color:var(--line-2)}
  .feat .ic{width:var(--sz118);height:var(--sz118);border-radius:var(--r5);background:var(--acc-soft);color:var(--acc);
    display:grid;place-items:center;margin-bottom:17px}
  .feat h3{font-size:var(--t35);margin-bottom:8px}
  .feat p{font-size:var(--t32);color:var(--tx-2);line-height:1.55}
  /* карточка экспорта — во всю ширину, чтобы форматы стояли в ряд */
  .feat-wide{grid-column:1/-1;display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(var(--s22),var(--s36),var(--s49));
    align-items:center}
  @media(max-width:900px){.feat-wide{grid-template-columns:1fr;gap:26px}}
  .feat-wide:hover{transform:none}
  .dl-files{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
  @media(max-width:520px){.dl-files{grid-template-columns:1fr}}
  .dl{background:var(--soft);border:var(--sz31) solid var(--line);border-radius:var(--r2);padding:var(--s18) var(--s17) var(--s17);
    display:flex;flex-direction:column;align-items:flex-start;transition:background .2s,border-color .2s}
  .dl:hover{background:var(--card);border-color:var(--line-2)}
  .dl svg{margin-bottom:11px}
  .dl b{font-size:var(--t12);font-weight:800;color:var(--tx);letter-spacing:var(--tr12);margin-bottom:3px}
  .dl i{font-style:normal;font-size:var(--t9);color:var(--tx-3);line-height:1.35}
  .files{display:flex;flex-wrap:wrap;gap:var(--s13);margin-top:var(--s22);justify-content:center}
  .file{display:inline-flex;align-items:center;gap:var(--s11);background:var(--card);border:var(--sz31) solid var(--line);
    border-radius:var(--r2);padding:var(--s14) var(--s40);font-weight:700;font-size:var(--t12);color:var(--tx)}
  .file span{font-weight:500;font-size:var(--t10);color:var(--tx-3)}

  /* ================= COMPARE ================= */
  /* три метрики «до → после»: сравнение читается за пару секунд */
  .dark-sec{background:var(--dark);color:var(--card)}
  .dark-sec h2,.dark-sec h3{color:var(--card)}
  .dark-sec .lead{color:var(--ц-9DA7B1)}
  .dark-sec .eyebrow{color:var(--acc)}
  .cmp-kpi{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s18);margin-bottom:22px}
  @media(max-width:820px){.cmp-kpi{grid-template-columns:1fr}}
  .ck{background:var(--dark-2);border:var(--sz31) solid var(--dark-line);border-radius:var(--r2);padding:20px 22px 18px}
  .ck-l{font-size:var(--t7);font-weight:700;letter-spacing:var(--tr4);text-transform:uppercase;color:var(--ц-7F8A95);
    margin-bottom:12px}
  .ck-v{display:flex;align-items:center;gap:var(--s12);flex-wrap:wrap}
  .ck-v s{font-size:var(--t36);font-weight:600;color:var(--ц-6E7A85);text-decoration-thickness:var(--sz90);
    font-variant-numeric:tabular-nums}
  .ck-v svg{color:var(--ц-3B4653);flex:none}
  .ck-v b{font-size:clamp(var(--t41),var(--t24),var(--t44));font-weight:800;letter-spacing:var(--tr7);color:var(--acc);
    font-variant-numeric:tabular-nums;line-height:1.05}
  .ck-d{display:inline-flex;align-items:center;margin-top:var(--s15);font-size:var(--t8);font-weight:700;
    color:var(--ц-4ADE80);background:var(--ц-rgba-74-222-128-12);border-radius:var(--r17);padding:5px 11px}

  /* две колонки-сценария: нумерованные шаги, итог в шапке справа */
  .cmp{display:grid;grid-template-columns:1fr 1fr;gap:var(--s19);align-items:stretch}
  @media(max-width:900px){.cmp{grid-template-columns:1fr}}
  .cw{background:var(--dark-2);border:var(--sz31) solid var(--dark-line);border-radius:var(--r4);
    padding:clamp(var(--s21),var(--s32),var(--s24));display:flex;flex-direction:column}
  .cw.pro{border-color:var(--acc);background:linear-gradient(180deg,rgba(232,85,45,.07),var(--dark-2) 55%)}
  .cw-h{display:flex;align-items:flex-start;gap:var(--s16);margin-bottom:20px}
  .cw-h .ic{width:var(--sz118);height:var(--sz118);border-radius:var(--r6);flex:none;display:grid;place-items:center}
  .cw.now .ic{background:var(--ц-242C34);color:var(--ц-8A96A1)}
  .cw.pro .ic{background:var(--acc);color:var(--card);box-shadow:0 6px 16px rgba(232,85,45,.3)}
  .cw-t{flex:1;min-width:0}
  .cw h3{font-size:clamp(var(--t15),var(--t19),var(--t16));color:var(--card);margin-bottom:3px}
  .cw .sub{font-size:var(--t11);color:var(--ц-7F8A95)}
  .cw-sum{text-align:right;flex:none}
  .cw-sum b{display:block;font-size:clamp(var(--t39),var(--t23),var(--t43));font-weight:800;letter-spacing:var(--tr2);line-height:1;
    font-variant-numeric:tabular-nums;white-space:nowrap}
  .cw.now .cw-sum b{color:var(--card)}
  .cw.pro .cw-sum b{color:var(--acc)}
  .cw-sum span{display:block;font-size:var(--t8);color:var(--ц-7F8A95);margin-top:5px}
  .steps{display:grid;gap:var(--s12);margin-bottom:20px}
  .st{display:flex;align-items:center;gap:var(--s15);background:var(--ц-161C22);border:var(--sz31) solid var(--dark-line);
    border-radius:var(--r);padding:var(--s15) var(--s17);opacity:0;transform:translateY(var(--sz35));
    transition:opacity .45s ease,transform .45s ease}
  .cmp-wrap.run .st{opacity:1;transform:none}
  .st:nth-child(2){transition-delay:.1s}
  .st:nth-child(3){transition-delay:.2s}
  .st:nth-child(4){transition-delay:.3s}
  .st .n{width:var(--sz42);height:var(--sz42);border-radius:var(--r2);flex:none;display:grid;place-items:center;
    font-size:var(--t8);font-weight:800}
  .cw.now .st .n{background:var(--ц-242C34);color:var(--ц-8A96A1)}
  .cw.pro .st .n{background:var(--ц-rgba-232-85-45-18);color:var(--acc)}
  .st .nm{flex:1;min-width:0;font-size:var(--t12);font-weight:600;color:var(--ц-EDF1F4);line-height:1.35}
  .st .v{font-size:var(--t11);color:var(--ц-7F8A95);font-variant-numeric:tabular-nums;white-space:nowrap;flex:none}
  .st .v.fast{color:var(--ц-4ADE80);font-weight:700}
  .cw-tot{margin-top:auto;padding-top:var(--s19);border-top:1px solid var(--dark-line)}
  .cw-tot .lbl{font-size:var(--t10);color:var(--ц-7F8A95);margin-bottom:7px}
  .cw-tot .big{font-size:clamp(var(--t42),var(--t25),var(--t46));font-weight:800;letter-spacing:var(--tr7);line-height:1;
    color:var(--card);font-variant-numeric:tabular-nums}
  .cw.pro .big{color:var(--acc)}
  .cw-tot .hint{font-size:var(--t11);color:var(--ц-9DA7B1);margin-top:var(--s11);line-height:1.5}

  .race{display:flex;align-items:center;gap:var(--s16);margin:0 0 var(--s19);padding:var(--s15) var(--s18);
    background:var(--dark-2);border:var(--sz31) solid var(--dark-line);border-radius:var(--r2)}
  .race b{font-size:var(--t11);color:var(--ц-EDF1F4);white-space:nowrap}
  .race-track{position:relative;flex:1;height:var(--sz35);border-radius:var(--r16);background:var(--ц-242C34)}
  .race-dot{position:absolute;top:var(--sz51);left:0;width:var(--sz38);height:var(--sz38);border-radius:var(--r8);
    transform:translate(var(--sz82),var(--sz82));background:var(--ц-8A96A1);box-shadow:0 0 0 var(--sz94) var(--dark-2);
    transition:left 2.6s cubic-bezier(.16,.84,.44,1)}
  .race-dot.acc{background:var(--acc);transition-duration:.7s}
  .cmp-wrap.run .race-dot{left:100%}
  .race-fin{font-size:var(--t9);color:var(--ц-7F8A95);white-space:nowrap;flex:none}

  /* открытая арифметика — свёрнута, разворачивается по клику */
  .cmp-math{margin-top:var(--s19);background:var(--dark-2);border:var(--sz31) solid var(--dark-line);
    border-radius:var(--r3);overflow:hidden}
  .cmp-math>summary{list-style:none;cursor:pointer;padding:var(--s20) var(--s22);display:flex;align-items:center;gap:var(--s14);
    font-size:var(--t33);font-weight:700;color:var(--card)}
  .cmp-math>summary::-webkit-details-marker{display:none}
  .cmp-math>summary:focus-visible{outline:var(--sz94) solid var(--acc);outline-offset:-3px}
  .cmp-math>summary .cnt{font-size:var(--t10);font-weight:500;color:var(--ц-7F8A95)}
  .cmp-math>summary svg{margin-left:auto;flex:none;color:var(--ц-7F8A95);transition:transform .22s}
  .cmp-math[open]>summary svg{transform:rotate(180deg)}
  .cmp-math ul{list-style:none;margin:0;padding:0 var(--s22) var(--s21);display:grid;gap:12px}
  .cmp-math li{display:grid;grid-template-columns:var(--sz158) 1fr;gap:var(--s19);align-items:baseline;
    padding-bottom:var(--s14);border-bottom:var(--sz31) solid var(--dark-line);font-size:15px}
  .cmp-math li:last-child{border-bottom:0;padding-bottom:0}
  .cmp-math li>span{color:var(--ц-9DA7B1)}
  .cmp-math li>em{font-style:normal;color:var(--ц-7F8A95);font-variant-numeric:tabular-nums}
  .cmp-math li>em b{color:var(--ц-EDF1F4);font-weight:700}
  .cmp-math li.sum>em b{color:var(--acc)}
  @media(max-width:680px){.cmp-math li{grid-template-columns:1fr;gap:3px}}

  .cmp-note{margin-top:var(--s19);background:var(--dark-2);border:var(--sz31) solid var(--dark-line);border-radius:var(--r3);
    padding:var(--s21) var(--s23);display:flex;gap:var(--s16);align-items:flex-start;font-size:var(--t12);color:var(--ц-9DA7B1);line-height:1.55}
  .cmp-note svg{flex:none;color:var(--acc);margin-top:2px}
  .cmp-note b{color:var(--card)}

  /* ================= КАЛЬКУЛЯТОР ПОТЕРЯННЫХ ЗАЯВОК =================
     Перенесён с соседнего лендинга 4mx (блок «Run it on your own numbers»):
     там та же вёрстка и те же токены, поэтому имена классов сохранены — правка
     одного блока переносится во второй без перевода. Цены калькулятор НЕ хранит:
     читает их из карточек #pricing, чтобы не было второго источника чисел. */
  .calc-sec .win{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(var(--s22),var(--s36),var(--s49));align-items:center;
    background:var(--dark);border:var(--sz31) solid var(--dark-line);border-radius:var(--r4);
    padding:clamp(var(--s22),var(--s35),var(--s45));color:var(--card)}
  @media(max-width:880px){.calc-sec .win{grid-template-columns:1fr;gap:26px}}
  .win-txt h3{color:var(--card);font-size:clamp(var(--t38),var(--t21),var(--t41));margin-bottom:11px}
  .win-txt p{font-size:var(--t32);color:var(--ц-9DA7B1);line-height:1.6}
  .win-fine{margin-top:var(--s14);font-size:var(--t10);color:var(--ц-7F8A95);line-height:1.55}
  .win-tbl{display:grid;gap:9px}
  .win-row,.win-sum{display:flex;align-items:baseline;gap:var(--s16);padding:var(--s15) var(--s19);border-radius:var(--r2);
    background:var(--ц-161C22);border:var(--sz31) solid var(--dark-line);flex-wrap:wrap}
  /* вторая строка карточки — из чего сложилось число. Без неё «+17,6 млн» верят на слово */
  .win-row em,.win-now i{flex-basis:var(--sz64);font-style:normal;font-size:var(--t8);color:var(--ц-7F8A95);
    line-height:1.45;margin-top:4px}
  .win-row span,.win-sum span{flex:1;font-size:var(--t12);color:var(--ц-9DA7B1)}
  .win-row b{font-size:clamp(var(--t36),var(--t20),var(--t40));font-weight:800;color:var(--ц-4ADE80);letter-spacing:var(--tr2);
    font-variant-numeric:tabular-nums;white-space:nowrap}
  .win-row b i,.win-sum b i{font-style:normal;font-size:var(--t9);font-weight:600;color:var(--ц-7F8A95)}
  .win-sum{background:var(--ц-rgba-232-85-45-1);border-color:var(--acc);flex-wrap:wrap}
  .win-sum b{font-size:clamp(var(--t36),var(--t20),var(--t40));font-weight:800;color:var(--acc);letter-spacing:var(--tr2);
    font-variant-numeric:tabular-nums;white-space:nowrap}
  .win-sum em{flex-basis:var(--sz64);font-style:normal;font-size:var(--t9);color:var(--ц-9DA7B1);margin-top:4px}
  /* главная плашка: во сколько раз больше сделок. Это то, ради чего блок стоит на
     странице, поэтому число крупнее заголовка секции и считается само */
  .win-hero{padding:var(--s20) var(--s21);border-radius:var(--r2);text-align:center;
    background:linear-gradient(180deg,var(--ц-rgba-74-222-128-16),var(--ц-rgba-74-222-128-06));
    border:1px solid rgba(74,222,128,.5)}
  .win-hero b{display:block;font-size:clamp(var(--t46),var(--t29),var(--t50));font-weight:800;color:var(--ц-4ADE80);
    letter-spacing:var(--tr6);line-height:1.05;font-variant-numeric:tabular-nums}
  .win-hero span{display:block;margin-top:var(--s8);font-size:var(--t31);color:var(--ц-C8D2DA)}
  .win-hero.flat{background:var(--ц-rgba-183-121-31-12);border-color:var(--ц-8A6520)}
  .win-hero.flat b{color:var(--ц-E0A94A);font-size:clamp(24px,3vw,34px)}
  .win-now{display:flex;align-items:baseline;gap:var(--s14);padding:var(--s17) var(--s19);border-radius:var(--r2);
    background:var(--ц-0F141A);border:var(--sz31) solid var(--dark-line);flex-wrap:wrap}
  .win-now span{flex:1;font-size:var(--t12);color:var(--ц-9DA7B1)}
  .win-now b{font-size:clamp(var(--t16),var(--t22),var(--t42));font-weight:800;color:var(--card);letter-spacing:var(--tr2);
    font-variant-numeric:tabular-nums}
  .win-now i{margin-top:4px}
  .c-plan-name{color:var(--card);font-weight:800}
  .win-plan{margin-top:var(--s12);font-size:var(--t10);color:var(--ц-9DA7B1);line-height:1.5;text-align:center}
  .win-plan a{color:var(--acc);text-decoration:underline;text-underline-offset:3px}
  .win-plan a:hover{color:var(--card)}
  .win-be{margin-top:var(--s8);font-size:var(--t10);color:var(--ц-7F8A95);line-height:1.5;text-align:center}
  .win-be b{color:var(--ц-EDF1F4);font-variant-numeric:tabular-nums}
  /* когда математика НЕ вытягивает — блок честно меняет цвет, а не молчит */
  .win-sum.thin{background:var(--ц-rgba-183-121-31-12);border-color:var(--ц-8A6520)}
  .win-sum.thin b{color:var(--ц-E0A94A)}

  /* ---- ползунки ----
     На тёмной карточке ползунок не виден, если трек лишь чуть светлее фона.
     Поэтому: трек 8px и заметно светлее, пройденная часть — акцентом,
     бегунок белый в акцентном кольце, под треком — границы диапазона. */
  .cf{margin:24px 0 6px}
  .cf-hint{display:flex;align-items:center;gap:var(--s11);font-size:var(--t10);font-weight:600;color:var(--acc);
    margin-bottom:16px}
  .cf-hint svg{flex:none}
  .cf-row{background:var(--ц-161C22);border:var(--sz31) solid var(--dark-line);border-radius:var(--r2);
    padding:var(--s17) var(--s19) var(--s14);margin-bottom:var(--s13);transition:border-color .2s}
  .cf-row:hover{border-color:var(--ц-48545F)}
  .cf-row:focus-within{border-color:var(--acc)}
  .cf-top{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s14);cursor:pointer}
  .cf-l{font-size:var(--t31);color:var(--ц-9DA7B1)}
  /* пояснение под названием ползунка: откуда цифра и что она значит */
  .cf-sub{display:block;font-style:normal;font-size:var(--t7);color:var(--ц-6E7A85);margin-top:var(--s5);line-height:1.4}
  .cf-v{font-size:var(--t16);font-weight:800;color:var(--card);font-variant-numeric:tabular-nums;letter-spacing:var(--tr9);
    white-space:nowrap}
  .cf-ends{display:flex;justify-content:space-between;margin-top:2px}
  .cf-ends i{font-style:normal;font-size:var(--t6);color:var(--ц-6E7A85);font-variant-numeric:tabular-nums}

  /* сброс общего input{min-height:50px;padding;border} — иначе трек станет плашкой во всё поле */
  .cf-row input[type=range]{-webkit-appearance:none;appearance:none;display:block;width:var(--sz64);
    height:var(--sz35);min-height:0;padding:0;border:none;box-shadow:none;margin:var(--s16) 0 0;
    border-radius:var(--r16);cursor:pointer;
    background:linear-gradient(90deg,var(--acc) 0 var(--pct,25%),var(--ц-39434E) var(--pct,25%) 100%)}
  .cf-row input[type=range]:focus{box-shadow:none}
  .cf-row input[type=range]:focus-visible{outline:var(--sz94) solid var(--acc);outline-offset:6px}
  .cf-row input[type=range]::-webkit-slider-runnable-track{height:var(--sz35);border-radius:var(--r16);background:transparent}
  .cf-row input[type=range]::-moz-range-track{height:var(--sz35);border-radius:var(--r16);background:transparent}
  .cf-row input[type=range]::-moz-range-progress{height:var(--sz35);border-radius:var(--r16);background:var(--acc)}
  .cf-row input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;margin-top:var(--s28);
    width:var(--sz42);height:var(--sz42);border-radius:var(--r8);background:var(--card);border:var(--sz97) solid var(--acc);
    box-shadow:0 var(--sz94) var(--sz98) var(--ц-rgba-0-0-0-5);cursor:grab;transition:transform .15s}
  .cf-row input[type=range]::-moz-range-thumb{width:var(--sz42);height:var(--sz42);border-radius:var(--r8);background:var(--card);
    border:var(--sz97) solid var(--acc);box-shadow:0 var(--sz94) var(--sz98) var(--ц-rgba-0-0-0-5);cursor:grab;transition:transform .15s}
  .cf-row input[type=range]:hover::-webkit-slider-thumb{transform:scale(1.12)}
  .cf-row input[type=range]:hover::-moz-range-thumb{transform:scale(1.12)}
  .cf-row input[type=range]:active::-webkit-slider-thumb{cursor:grabbing;transform:scale(1.05)}
  .cf-row input[type=range]:active::-moz-range-thumb{cursor:grabbing;transform:scale(1.05)}

  /* пульс на первом ползунке, пока по нему ни разу не двинули */
  @keyframes cf-pulse{0%,100%{box-shadow:0 3px 10px rgba(0,0,0,.5),0 0 0 0 rgba(232,85,45,.55)}
    50%{box-shadow:0 3px 10px rgba(0,0,0,.5),0 0 0 11px rgba(232,85,45,0)}}
  .cf-idle input[type=range]::-webkit-slider-thumb{animation:cf-pulse 2.1s ease-out infinite}
  .cf-idle input[type=range]::-moz-range-thumb{animation:cf-pulse 2.1s ease-out infinite}
  @media (prefers-reduced-motion:reduce){.cf-idle input[type=range]::-webkit-slider-thumb{animation:none}
    .cf-idle input[type=range]::-moz-range-thumb{animation:none}}

  /* значение мигает при пересчёте — видно, что цифры живые */
  @keyframes cf-flash{from{color:var(--acc)}to{color:inherit}}
  .cf-lit{animation:cf-flash .5s ease-out}

  /* ================= PRICING ================= */
  .prices{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s19);align-items:start}
  @media(max-width:980px){.prices{grid-template-columns:1fr;max-width:var(--sz169);margin-inline:auto}}
  .price{background:var(--card);border:var(--sz31) solid var(--line);border-radius:var(--r4);padding:var(--s43) var(--s23);
    display:flex;flex-direction:column;gap:var(--s41);position:relative}
  .price.best{border:var(--sz33) solid var(--acc);box-shadow:var(--sh)}
  .price-flag{position:absolute;top:var(--sz85);left:var(--sz42);background:var(--acc);color:var(--card);font-size:var(--t7);font-weight:800;
    letter-spacing:var(--tr3);text-transform:uppercase;padding:var(--s7) var(--s15);border-radius:999px}
  .price h3{font-size:21px}
  .price .desc{font-size:var(--t31);color:var(--tx-2);line-height:1.5;min-height:44px}
  .price-head{display:block}
  .price .amt{font-size:var(--t48);font-weight:800;color:var(--tx);letter-spacing:var(--tr6);line-height:1;
    font-variant-numeric:tabular-nums}
  .price.best .amt{color:var(--acc)}
  .price .per{font-size:var(--t31);color:var(--tx-3);margin-top:7px}
  .price-calc{margin-top:var(--s18);background:var(--soft);border-radius:var(--r2);display:flex}
  .price.best .price-calc{background:var(--acc-soft)}
  .calc-stat{flex:1;text-align:center;padding:12px 8px}
  .calc-stat+.calc-stat{border-left:1px solid var(--line-2)}
  .price.best .calc-stat+.calc-stat{border-left-color:var(--ц-F5CFC3)}
  .calc-num{display:block;font-size:var(--t39);font-weight:800;color:var(--tx);letter-spacing:var(--tr9);
    font-variant-numeric:tabular-nums;line-height:1.1}
  .calc-stat.accent .calc-num{color:var(--acc-ink)}
  .price.best .calc-stat.accent .calc-num{color:var(--acc)}
  .calc-lbl{display:block;font-size:var(--t6);font-weight:600;color:var(--tx-3);margin-top:3px}
  .price-over{margin-top:var(--s12);font-size:var(--t9);color:var(--tx-3);line-height:1.45}
  .price-over b{color:var(--acc-ink);font-variant-numeric:tabular-nums;white-space:nowrap}

  .p-calc-year{display:none}
  .per-tabs[data-period="year"] .p-calc-month{display:none}
  .per-tabs[data-period="year"] .p-calc-year{display:flex}
  .price-block{display:grid;gap:10px}
  .price-group{font-size:var(--t7);font-weight:800;letter-spacing:var(--tr3);text-transform:uppercase;color:var(--tx-3)}
  .type-chips{display:flex;flex-wrap:wrap;gap:8px}
  .type-chip{display:inline-flex;align-items:center;gap:var(--s9);padding:var(--s9) var(--s15) var(--s9) var(--s11);background:var(--acc-soft);
    border-radius:var(--r17);font-size:var(--t10);font-weight:700;color:var(--acc-ink)}
  .type-chip svg{flex:none;color:var(--acc)}
  .price.best .type-chip{background:var(--card);border:1px solid var(--ц-F5CFC3)}
  .price ul{list-style:none;padding:0;margin:0;display:grid;gap:10px}
  .price li{display:flex;gap:var(--s12);font-size:var(--t12);color:var(--tx);line-height:1.5}
  .price li svg{flex:none;color:var(--ok);margin-top:3px}
  .price .btn{width:100%}

  /* ---- две карты: разовый запуск и enterprise ---- */
  .plans2{display:grid;grid-template-columns:1fr 1fr;gap:var(--s19);margin-top:22px}
  @media(max-width:880px){.plans2{grid-template-columns:1fr}}
  .pl{border-radius:var(--r4);padding:clamp(var(--s22),var(--s33),var(--s44));display:flex;flex-direction:column}
  .pl.light{background:var(--soft);border:1px solid var(--line)}
  .pl.dark{background:var(--dark)}
  .pl-tag{font-size:var(--t6);font-weight:800;letter-spacing:var(--tr17);text-transform:uppercase;margin-bottom:12px}
  .pl.light .pl-tag{color:var(--acc)}
  .pl.dark .pl-tag{color:var(--ц-8A96A1)}
  .pl h3{font-size:clamp(var(--t36),var(--t20),var(--t40));margin-bottom:10px}
  .pl.dark h3{color:var(--card)}
  .pl>p{font-size:var(--t12);line-height:1.55;max-width:46ch}
  .pl.light>p{color:var(--tx-2)}
  .pl.dark>p{color:var(--ц-9DA7B1)}
  .pl-num{display:flex;align-items:flex-end;justify-content:space-between;gap:var(--s18);flex-wrap:wrap;
    margin:clamp(22px,2.6vw,32px) 0 18px}
  .pl-num b{font-size:clamp(var(--t17),var(--t26),var(--t47));font-weight:800;letter-spacing:var(--tr7);line-height:1;
    font-variant-numeric:tabular-nums}
  .pl.light .pl-num b{color:var(--tx)}
  .pl.dark .pl-num b{color:var(--card)}
  .pl-num span{font-size:var(--t9);line-height:1.45;text-align:right}
  .pl.light .pl-num span{color:var(--tx-3)}
  .pl.dark .pl-num span{color:var(--ц-7F8A95)}
  .pl-pills{display:flex;flex-wrap:wrap;gap:8px}
  .pl-pills i{font-style:normal;font-size:var(--t8);border-radius:var(--r17);padding:var(--s8) var(--s13);white-space:nowrap}
  .pl.light .pl-pills i{background:var(--card);border:var(--sz31) solid var(--line);color:var(--tx-2)}
  .pl.dark .pl-pills i{background:var(--ц-242C34);color:var(--ц-C3CBD3)}
  .pl-fine{margin-top:var(--s16);font-size:12.5px}
  .pl.light .pl-fine{color:var(--tx-3)}
  .pl.dark .pl-fine{color:var(--ц-7F8A95)}
  .pl .btn{align-self:flex-start;margin-top:auto;padding-top:0}
  .pl.dark .btn{margin-top:var(--s21);background:var(--card);color:var(--dark);border-color:var(--card)}
  .pl.dark .btn:hover{background:var(--line);border-color:var(--line)}

  /* ---- доп. работы: свёрнуты, чтобы не давить прайс ---- */
  .addons{margin-top:var(--s19);background:var(--card);border:var(--sz31) solid var(--line);border-radius:var(--r3);
    overflow:hidden}
  .addons>summary{list-style:none;cursor:pointer;padding:var(--s20) var(--s22);display:flex;align-items:center;gap:var(--s14);
    font-size:var(--t33);font-weight:700;color:var(--tx)}
  .addons>summary::-webkit-details-marker{display:none}
  .addons>summary:focus-visible{outline:var(--sz94) solid var(--acc);outline-offset:-3px}
  .addons>summary .cnt{font-size:var(--t9);font-weight:600;color:var(--tx-3)}
  .addons>summary svg{margin-left:auto;flex:none;color:var(--tx-3);transition:transform .22s}
  .addons[open]>summary svg{transform:rotate(180deg)}
  .addons-in{padding:0 var(--s22) var(--s21);display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
  @media(max-width:880px){.addons-in{grid-template-columns:1fr;gap:20px}}
  .ag-t{font-size:var(--t6);font-weight:800;letter-spacing:var(--tr17);text-transform:uppercase;color:var(--tx-3);
    padding-bottom:var(--s11);border-bottom:var(--sz31) solid var(--line);margin-bottom:4px}
  .ag-row{display:flex;align-items:baseline;justify-content:space-between;gap:var(--s16);padding:var(--s11) 0;
    border-bottom:var(--sz31) solid var(--line);font-size:var(--t31);color:var(--tx-2)}
  .ag-row:last-child{border-bottom:0}
  .ag-row b{color:var(--acc-ink);font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
  .addons-note{padding:0 var(--s22) var(--s21);font-size:var(--t10);color:var(--tx-3);line-height:1.5}

  /* ---- period toggle ---- */
  .ptabs{display:flex;justify-content:center;margin-bottom:clamp(30px,3.4vw,44px)}
  .ptabs-in{display:inline-flex;padding:var(--s6);background:var(--soft);border:var(--sz31) solid var(--line);border-radius:var(--r17);gap:2px}
  .ptab{appearance:none;border:none;background:transparent;font-family:var(--ff);font-weight:700;font-size:var(--t31);
    color:var(--tx-2);padding:var(--s12) var(--s20);border-radius:var(--r17);cursor:pointer;display:flex;align-items:center;gap:var(--s10);
    transition:background .2s,color .2s}
  .ptab:hover{color:var(--tx)}
  .ptab[aria-selected="true"]{background:var(--card);color:var(--tx);box-shadow:var(--sh-s)}
  .ptab em{font-style:normal;font-size:var(--t6);font-weight:800;color:var(--card);background:var(--ok);
    border-radius:var(--r17);padding:2px 8px}
  .p-amt-year,.p-per-year{display:none}
  .per-tabs[data-period="year"] .p-amt-month,.per-tabs[data-period="year"] .p-per-month{display:none}
  .per-tabs[data-period="year"] .p-amt-year{display:block}
  .per-tabs[data-period="year"] .p-per-year{display:block}

  /* ---- price card secondary CTA ---- */
  .price-cta{display:flex;flex-direction:column;gap:9px}
  .price-trial{display:block;text-align:center;font-size:var(--t11);font-weight:700;color:var(--acc-ink);
    text-decoration:none;padding:var(--s6);border-radius:var(--r);transition:background .18s,color .18s}
  .price-trial:hover{background:var(--acc-soft);color:var(--acc)}
  .price-trial:focus-visible{outline:var(--sz94) solid var(--acc);outline-offset:2px}

  /* ---- free trial banner ---- */
  .trial{background:var(--acc-soft);border:var(--sz90) solid var(--acc);border-radius:var(--r4);
    padding:clamp(var(--s22),var(--s34),var(--s44));display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(var(--s22),var(--s35),var(--s46));
    align-items:center;margin-bottom:clamp(var(--s20),var(--s32),var(--s24));scroll-margin-top:90px}
  @media(max-width:880px){.trial{grid-template-columns:1fr;gap:22px}}
  .trial-badge{display:inline-flex;align-items:center;gap:var(--s10);font-size:var(--t9);font-weight:800;color:var(--acc-ink);
    background:var(--card);border:var(--sz31) solid var(--ц-F5CFC3);border-radius:var(--r17);padding:var(--s8) var(--s15);margin-bottom:14px}
  .trial h3{font-size:clamp(var(--t16),var(--t22),var(--t42));margin-bottom:9px}
  .trial>div>p{font-size:var(--t32);color:var(--tx-2);line-height:1.55;max-width:58ch}
  .trial-facts{list-style:none;padding:0;margin:var(--s18) 0 0;display:flex;flex-wrap:wrap;gap:9px 26px}
  .trial-facts li{display:flex;align-items:center;gap:var(--s10);font-size:var(--t31);color:var(--tx);line-height:1.4}
  .trial-facts svg{flex:none;color:var(--ok)}
  .trial-cta{display:grid;gap:10px}
  .trial-cta .btn{width:100%}
  .trial-cta .btn-ghost{border-color:var(--ц-F0C9BC)}
  .trial-cta .fine{font-size:var(--t8);color:var(--tx-3);text-align:center;margin-top:var(--s4);line-height:1.4}
  .sr-only{position:absolute;width:var(--sz31);height:var(--sz31);overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}

  /* ================= FAQ ================= */
  .faq{max-width:var(--sz174);margin-inline:auto;display:grid;gap:11px}
  details{background:var(--card);border:var(--sz31) solid var(--line);border-radius:var(--r2);overflow:hidden;transition:border-color .2s}
  details[open]{border-color:var(--line-2);box-shadow:var(--sh-s)}
  summary{cursor:pointer;list-style:none;padding:var(--s20) var(--s51) var(--s20) var(--s22);font-weight:700;font-size:var(--t14);color:var(--tx);
    position:relative;transition:color .18s}
  summary::-webkit-details-marker{display:none}
  summary:hover{color:var(--acc)}
  summary:focus-visible{outline:var(--sz94) solid var(--acc);outline-offset:var(--sz88);border-radius:var(--r2)}
  summary::after{content:"";position:absolute;right:var(--sz41);top:var(--sz51);width:var(--sz98);height:var(--sz98);
    border-right:var(--sz92) solid var(--tx-3);border-bottom:var(--sz92) solid var(--tx-3);
    transform:translateY(var(--sz81)) rotate(45deg);transition:transform .22s}
  details[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
  details .ans{padding:0 var(--s22) var(--s21);font-size:var(--t13);color:var(--tx-2);line-height:1.62}
  details .ans b{color:var(--tx)}

  /* ================= CTA ================= */
  .cta{background:var(--dark);color:var(--card)}
  .cta h2{color:var(--card)}
  .cta .lead{color:var(--ц-9DA7B1)}
  .cta .eyebrow{color:var(--acc)}
  .cta-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(var(--s44),var(--s37),var(--s52));align-items:center}
  @media(max-width:920px){.cta-grid{grid-template-columns:1fr;gap:36px}}
  .cta-steps{list-style:none;padding:0;margin:var(--s43) 0 0;display:grid;gap:16px}
  .cta-steps li{display:flex;gap:var(--s17);align-items:flex-start}
  .cta-steps .n{width:var(--sz43);height:var(--sz43);border-radius:var(--r3);background:var(--acc);color:var(--card);flex:none;
    display:grid;place-items:center;font-size:var(--t10);font-weight:800}
  .cta-steps b{display:block;color:var(--card);font-size:var(--t33);font-weight:700;margin-bottom:3px}
  .cta-steps span{font-size:var(--t32);color:var(--ц-9DA7B1);line-height:1.5}
  form{background:var(--card);border-radius:var(--r4);padding:clamp(var(--s23),var(--s35),var(--s45));box-shadow:var(--sh-l)}
  form h3{margin-bottom:var(--s8);font-size:22px}
  form .sub{font-size:var(--t12);color:var(--tx-2);margin-bottom:23px}
  .field{margin-bottom:15px}
  label{display:block;font-size:var(--t11);font-weight:600;color:var(--tx);margin-bottom:7px}
  label .req{color:var(--acc)}
  input,textarea{width:var(--sz64);min-height:var(--sz121);padding:var(--s15) var(--s17);border:var(--sz90) solid var(--line);border-radius:var(--r);
    font-family:var(--ff);font-size:var(--t13);color:var(--tx);background:var(--card);transition:border-color .18s,box-shadow .18s}
  textarea{min-height:var(--sz133);resize:vertical;line-height:1.5}
  input::placeholder,textarea::placeholder{color:var(--ц-B3BAC1)}
  input:focus,textarea:focus{outline:none;border-color:var(--acc);box-shadow:0 0 0 3px rgba(232,85,45,.16)}
  .help{font-size:var(--t10);color:var(--tx-3);margin-top:var(--s9);line-height:1.45}
  form .btn{width:var(--sz64);margin-top:8px}
  .form-foot{font-size:var(--t9);color:var(--tx-3);text-align:center;margin-top:var(--s15);line-height:1.5}

  /* ================= FOOTER ================= */
  footer{background:var(--dark);color:var(--ц-7F8A95);border-top:var(--sz31) solid var(--dark-line);padding:42px 0}
  .ft{display:flex;flex-wrap:wrap;gap:var(--s21);align-items:center;justify-content:space-between;font-size:14.5px}
  .ft .logo{color:var(--card)}
  .ft-links{display:flex;gap:var(--s21);flex-wrap:wrap}
  .ft a{text-decoration:none;transition:color .18s}
  .ft a:hover{color:var(--card)}

  /* ================= МОБИЛЬНЫЙ СЛОЙ =================
     Три вещи: пальцем попадать (тач-цели ≥44px), не листать лишнего
     (плотность) и не оставлять осиротевших элементов от десктопной сетки. */
  @media(max-width:600px){
    /* плотность: страница на 390px была 20 640px — режем воздух между секциями */
    section{padding:52px 0}
    .sec-head{margin-bottom:30px}
    .wrap{padding:0 18px}

    /* тач-цели: логотип, переключатель периода, вторичные ссылки, подвал */
    .logo{min-height:44px}
    .ptab{min-height:var(--sz118);padding:10px 16px}
    .price-trial{min-height:var(--sz118);display:flex;align-items:center;justify-content:center;padding:8px}
    .ft-links{gap:4px 20px}
    .ft-links a{display:inline-flex;align-items:center;min-height:44px}

    /* шаги «как это работает»: номер уходит внутрь карточки, чтобы не висел сиротой */
    .fs-head{position:absolute;width:var(--sz31);height:var(--sz31);overflow:hidden;clip:rect(0,0,0,0)}
    .fs-card{position:relative;padding-top:20px}
    .fs-card::before{content:counter(fs-n);counter-increment:fs-n;position:absolute;top:var(--sz40);right:var(--sz103);
      width:var(--sz110);height:var(--sz110);border-radius:var(--r8);background:var(--acc);color:var(--card);font-size:var(--t9);font-weight:800;
      display:grid;place-items:center}
    .flow{counter-reset:fs-n}
    .fs-vis{margin-bottom:16px}

    /* герой: галочка не должна висеть слева от центрированного текста */
    .hero-note{align-items:flex-start;text-align:left;max-width:var(--sz112);margin-inline:auto}
    .hero-note svg{margin-top:3px}

    /* тарифы и склад: мелкий служебный текст крупнее порога читаемости */
    .wh-cols{font-size:11px}
    .ag-t,.pl-tag{font-size:12px}

    /* карточки-возможности: иконка в строку с заголовком вместо колонки */
    .feat:not(.feat-wide){display:grid;grid-template-columns:auto 1fr;gap:0 var(--s16);align-items:center;
      padding:20px 18px}
    .feat:not(.feat-wide) .ic{width:var(--sz116);height:var(--sz116);margin-bottom:0}
    .feat:not(.feat-wide) h3{margin-bottom:0}
    .feat:not(.feat-wide) p{grid-column:1/-1;margin-top:9px}
    .feat-wide{padding:20px 18px}
    .dl-files{grid-template-columns:repeat(3,1fr);gap:8px}
    .dl{padding:13px 10px 12px}
    .dl i{font-size:12px}

    /* самые узкие экраны: «Войти» остаётся в бургер-меню, шапке хватает места */
    @media(max-width:360px){
      .wrap{padding:0 14px}
      .hdr-login{display:none}
    }

    /* сравнение: не даём неразрывному содержимому распирать колонку (grid blowout) */
    .cmp{grid-template-columns:minmax(0,1fr)}
    .cw{min-width:0}
    .cw-h{flex-wrap:wrap}
    .cw-sum{margin-left:auto}
    .st{flex-wrap:wrap}
    .st .nm{flex:1 1 55%}

    /* виды опалубки: то же — иконка слева, бейдж под названием */
    .type{display:grid;grid-template-columns:auto 1fr;gap:0 var(--s16);align-items:center;padding:16px 18px}
    .type .ic{width:var(--sz47);height:var(--sz47);margin-bottom:0}
    .type b{margin-bottom:0}
    .type .badge{grid-column:2;justify-self:start;margin-top:9px}
  }
}