/* ===== Токены: docs/canonical/tokens.css (Brand Book v1.1) ===== */
:root{
  --on-dark:#ffffff;               /* текст на тёмных блоках (итог, данные) в обеих темах */
  --stroke:var(--acid);            /* кислотный штрих под акцентным словом — один акцент на экран */
  --header-bg:rgba(241,243,238,.88);
  --ink:#08110f; --ink-surface:#0c1713;
  --paper:#f1f3ee; --paper-2:#e4e8e1; --white:#ffffff;
  --mint:#24d8bc; --mint-dark:#0b8876; --mint-soft:#dffbf4;
  --acid:#d9ff43; --blue:#465cff; --orange:#ff754a;
  --muted:#63716d; --muted-strong:#446059;
  --line:rgba(8,17,15,.16); --line-dark:rgba(255,255,255,.18);
  --font-display:"Unbounded",system-ui,sans-serif;
  --font-body:"Onest",system-ui,sans-serif;
  --font-mono:"IBM Plex Mono",monospace;
  --r-s:12px; --r-m:18px; --r-l:24px; --r-xl:32px; --r-pill:999px;
  /* страница на всю ширину экрана: боковое поле растёт с экраном, без max-width */
  --gutter:clamp(20px,4.2vw,80px);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.46 var(--font-body);-webkit-font-smoothing:antialiased}
::selection{background:var(--acid)}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
.wrap{width:100%;padding:0 var(--gutter)}
.mono{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:.12em;font-size:12px}
:focus-visible{outline:none;box-shadow:0 0 0 3px var(--paper),0 0 0 5px var(--ink)}

/* ===== Пометки черновика
/* ===== Тёмная тема (черновик, проверяем на странице продукта) =====
   Перекладываем те же роли токенов: «бумага» становится тёмной, «чернила» светлыми.
   Тёмные блоки-итоги остаются тёмными, но приподнимаются над фоном. */
:root[data-theme="dark"]{
  color-scheme:dark;
  --paper:#0b1311; --paper-2:#131d1a; --white:#121c19;
  --ink:#e6ede8; --ink-surface:#18261f;
  --mint-dark:#3fe0c5; --mint-soft:#103029;
  --muted:#93a39d; --muted-strong:#b3c2bc;
  --line:rgba(230,237,232,.14); --line-dark:rgba(255,255,255,.14);
  --stroke:rgba(217,255,67,.75);
  --header-bg:rgba(11,19,17,.85);
}
:root[data-theme="dark"] .summary,:root[data-theme="dark"] .statbar,:root[data-theme="dark"] .lead-sum{box-shadow:inset 0 0 0 1px var(--line-dark)}
:root[data-theme="dark"] .hero-media img{filter:brightness(.9)}
:root[data-theme="dark"] .node-img::after{background:rgba(0,0,0,.45)}
:root[data-theme="dark"] .tag.s3{background:var(--mint-soft);border-color:var(--mint-soft);color:var(--ink)}
:root[data-theme="dark"] .tag.s3 .tag-cat{color:var(--mint)}
:root[data-theme="dark"] .st-temp{background:#3a2117;color:#ffb39a}
.theme-btn{flex:none;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--white);color:var(--ink);display:grid;place-items:center;cursor:pointer;transition:transform .3s}
.theme-btn:hover{transform:rotate(-20deg)}
.theme-btn svg{width:20px;height:20px}
.theme-btn .moon{display:none}
:root[data-theme="dark"] .theme-btn .sun{display:none}
:root[data-theme="dark"] .theme-btn .moon{display:block}

/* ===== Пометки черновика REAL / TEMP / MISSING (по умолчанию скрыты) ===== */
.st{display:inline-flex;align-items:center;font:600 12px/1 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;padding:4px 7px;border-radius:var(--r-pill);vertical-align:middle;white-space:nowrap;cursor:help}
.st-real{background:rgba(36,216,188,.16);color:var(--mint)}
.st-temp{background:#ffe3d8;color:#8a3416}
.st-missing{background:var(--ink);color:var(--acid)}
.hide-marks .st,.hide-marks .draft-note{display:none!important}
.draftbar.away{opacity:0;pointer-events:none;transform:translateY(20px)}
.draftbar{transition:opacity .3s,transform .3s;position:fixed;right:16px;bottom:16px;z-index:60;display:flex;align-items:center;gap:10px;background:var(--white);border:1px solid var(--line);border-radius:var(--r-pill);padding:6px 6px 6px 14px;box-shadow:0 22px 26px rgba(10,15,14,.1);font-size:13px}
.draftbar button{font:700 12px var(--font-body);border:0;border-radius:var(--r-pill);background:var(--ink);color:var(--white);padding:8px 12px;cursor:pointer}

/* ===== Header ===== */
.site-header{position:sticky;top:0;z-index:50;background:var(--header-bg);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.site-header .wrap{display:flex;align-items:center;gap:24px;height:72px}
.brand{font:800 21px/1 var(--font-display);letter-spacing:-.06em;white-space:nowrap}
.brand span{color:var(--mint-dark)}
.nav{display:flex;gap:6px;margin:0 auto}
.nav a{font:600 13px/1 var(--font-body);padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-pill);background:color-mix(in srgb,var(--white) 55%,transparent);white-space:nowrap}
.lab{display:inline-flex;align-items:center;gap:10px;background:var(--ink);color:var(--white);border-radius:var(--r-pill);padding:6px 18px 6px 6px;font:800 14px/1 var(--font-body);white-space:nowrap}
.lab i{font:600 12px/1 var(--font-mono);font-style:normal;letter-spacing:.06em;background:var(--acid);color:#08110f;border-radius:50%;width:36px;height:36px;display:grid;place-items:center}
.nav a:hover{background:var(--white);border-color:var(--ink)}
.lab:hover i{transform:rotate(-12deg)}
.lab i{transition:transform .2s}
.menu-btn{display:none;font:700 14px var(--font-body);border:1px solid var(--line);border-radius:var(--r-pill);background:var(--white);padding:0 18px;height:44px;align-items:center}

/* ===== Block 01 · ProductHero ===== */
.hero{padding:clamp(32px,4.5vw,72px) 0 clamp(40px,4.5vw,72px);border-bottom:1px solid var(--line)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.95fr);gap:clamp(28px,3.4vw,64px);align-items:stretch}
.hero-copy{display:flex;flex-direction:column;justify-content:center;min-width:0;container-type:inline-size}
.kicker{display:flex;align-items:flex-start;gap:12px;color:var(--muted-strong);margin:0 0 clamp(18px,2vw,28px);line-height:1.5}
.kicker::before{content:"";flex:none;width:10px;height:10px;border-radius:50%;background:var(--mint);box-shadow:0 0 10px rgba(36,216,188,.6);margin-top:.42em}

/* Сменяемый заголовок.
   Все фразы лежат в одной ячейке grid: высота блока = самой высокой фразе,
   поэтому смена текста ничего не двигает и не наезжает ни на текст ниже, ни на фото.
   Размер шрифта считается от ширины колонки (cqi): самая длинная фраза — максимум 3 строки. */
.rotator{display:grid;margin:0;font:900 clamp(38px,9.2cqi,104px)/.98 var(--font-display);letter-spacing:-.055em}
.rotator .ph{grid-area:1/1;align-self:end;overflow-wrap:normal;hyphens:none;text-wrap:balance;opacity:0;transform:translateY(.22em);transition:opacity .45s ease,transform .45s cubic-bezier(.2,.7,.2,1);pointer-events:none}
.rotator .ph.on{opacity:1;transform:none;pointer-events:auto}
.rotator .ph.out{opacity:0;transform:translateY(-.22em)}
.rotator em{font-style:normal;color:var(--mint-dark);background:linear-gradient(var(--stroke),var(--stroke)) 0 94%/100% .13em no-repeat}

.lead{font-size:clamp(17px,1.25vw,21px);line-height:1.45;max-width:46em;margin:clamp(20px,2vw,30px) 0 0}
.lead strong{font-weight:800;background:var(--mint-soft);padding:0 .2em;border-radius:4px;white-space:nowrap}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:clamp(24px,2.4vw,36px)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:54px;padding:0 26px;border-radius:var(--r-pill);font:800 15px/1 var(--font-body);border:1px solid var(--line);background:transparent;color:var(--ink);cursor:pointer;white-space:nowrap;transition:transform .2s,background .2s,border-color .2s}
.btn:hover{transform:translateY(-2px);border-color:var(--ink)}
.btn-main{background:var(--ink);color:var(--white);border-color:var(--ink)}
.btn-main .arr{color:var(--mint)}
.btn-about{background:var(--white);font:800 17px/1 var(--font-display);letter-spacing:-.04em;padding:0 34px}
.btn-about .plus{display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--ink);color:var(--mint);font:700 15px/1 var(--font-body);letter-spacing:0}

.hero-media{position:relative;margin:0;border-radius:var(--r-xl);overflow:hidden;background:var(--white);border:1px solid var(--line);min-height:420px}
.hero-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}

/* stat bar — тёмный блок: данные */
.statbar{margin-top:clamp(28px,2.6vw,44px);display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) minmax(0,1.5fr);background:var(--ink-surface);color:var(--on-dark);border-radius:var(--r-l);overflow:hidden}
.stat{padding:22px 24px;border-right:1px solid var(--line-dark);display:flex;flex-direction:column;gap:10px;min-width:0}
.stat small{font:500 12px/1.2 var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.62);display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.stat b{font:800 clamp(22px,1.75vw,32px)/1 var(--font-display);letter-spacing:-.055em;white-space:nowrap}
.stat .sub{font-size:13px;color:rgba(255,255,255,.62)}
.stat.price b{color:var(--mint)}
.stat-acid{background:var(--mint-soft);color:var(--ink);border-right:0}
.stat-acid small{color:var(--muted-strong)}
.stat-acid{color:var(--ink)}
.removes{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.removes li{font:700 13px/1 var(--font-body);background:rgba(8,17,15,.08);border-radius:var(--r-pill);padding:8px 11px}
.removes li span{font-weight:500;color:var(--muted-strong)}
.draft-note{margin-top:14px;font-size:13px;color:var(--muted-strong);display:flex;gap:8px;flex-wrap:wrap;align-items:center}

/* ===== Окно «О системе» ===== */
.about-dialog{width:min(720px,calc(100vw - 32px));max-height:calc(100dvh - 48px);padding:0;border:0;border-radius:var(--r-xl);background:var(--paper);color:var(--ink);box-shadow:0 30px 80px rgba(8,17,15,.35)}
.about-dialog::backdrop{background:rgba(8,17,15,.55);backdrop-filter:blur(4px)}
.about-dialog[open]{animation:pop .3s cubic-bezier(.2,.7,.2,1)}
@keyframes pop{from{opacity:0;transform:translateY(16px) scale(.98)}}
.about-head{position:sticky;top:0;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px 24px 18px 32px;background:var(--paper);border-bottom:1px solid var(--line)}
.about-head h2{margin:0;font:900 clamp(26px,3vw,36px)/1 var(--font-display);letter-spacing:-.06em}
.about-head h2 em{font-style:normal;color:var(--mint-dark)}
.close{flex:none;width:48px;height:48px;border-radius:50%;border:1px solid var(--line);background:var(--white);font:400 26px/1 var(--font-body);cursor:pointer;display:grid;place-items:center}
.close:hover{background:var(--ink);color:var(--white)}
.about-body{padding:8px 32px 32px}
.about-body p{margin:18px 0 0;font-size:17px;line-height:1.5}
.about-body p:first-child{font-size:20px;font-weight:600;line-height:1.4}
.about-body .fine{margin-top:24px;padding:16px 18px;background:var(--mint-soft);border-radius:var(--r-m);font-size:16px}

/* ===== Адаптив: 1120 / 900 / 620 ===== */
@media (max-width:1120px){
  .nav{display:none}
  .nav a:hover{background:var(--white);border-color:var(--ink)}
.lab:hover i{transform:rotate(-12deg)}
.lab i{transition:transform .2s}
.menu-btn{display:inline-flex;margin-left:auto}
  .site-header .wrap{gap:10px}
  .statbar{grid-template-columns:repeat(4,minmax(0,1fr))}
  .stat-acid{grid-column:1/-1}
}
@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr}
  .hero-media{min-height:0;aspect-ratio:5/4}
  .rotator{font-size:clamp(34px,10.4cqi,84px)}
  .statbar{grid-template-columns:1fr 1fr}
  .stat{border-bottom:1px solid var(--line-dark)}
  .stat:nth-child(2n){border-right:0}
}
@media (max-width:620px){
  .site-header .wrap{height:64px}
  .lab b{display:none}
  .lab{padding:4px}
  .actions .btn{flex:1 1 100%}
  .stat{padding:18px 16px}
  .stat b{font-size:20px;letter-spacing:-.06em}
  .stat small{letter-spacing:.06em}
  .about-head{padding:18px 16px 14px 20px}
  .about-body{padding:4px 20px 24px}
  .about-body p{font-size:16px}
  .about-body p:first-child{font-size:18px}
  .draftbar{left:8px;right:8px;bottom:8px;border-radius:var(--r-m);justify-content:space-between}
}

/* ===== Мобильное меню ===== */
.mmenu{display:none;position:relative;margin-left:auto}
.mmenu summary{list-style:none;display:inline-flex;align-items:center;gap:8px;font:700 14px var(--font-body);border:1px solid var(--line);border-radius:var(--r-pill);background:var(--white);padding:0 18px;height:44px;cursor:pointer}
.mmenu summary::-webkit-details-marker{display:none}
.mmenu .burger{display:grid;gap:4px;width:16px}
.mmenu .burger i{display:block;height:2px;background:var(--ink);border-radius:2px;transition:transform .25s,opacity .2s}
.mmenu[open] .burger i:nth-child(1){transform:translateY(6px) rotate(45deg)}
.mmenu[open] .burger i:nth-child(2){opacity:0}
.mmenu[open] .burger i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.mmenu-panel{position:absolute;right:0;top:calc(100% + 10px);width:min(320px,calc(100vw - 40px));background:var(--white);border:1px solid var(--line);border-radius:var(--r-l);padding:8px;box-shadow:0 22px 26px rgba(10,15,14,.1);display:grid;animation:drop .22s ease}
@keyframes drop{from{opacity:0;transform:translateY(-6px)}}
.mmenu-panel a{display:flex;align-items:center;justify-content:space-between;min-height:48px;padding:0 14px;border-radius:var(--r-s);font:600 16px var(--font-body)}
.mmenu-panel a::after{content:"→";color:var(--muted)}
.mmenu-panel a:hover{background:var(--paper)}
.mmenu-panel a.lab-link{margin-top:6px;background:var(--ink);color:var(--white);font-weight:800}
.mmenu-panel a.lab-link::after{color:var(--mint)}

/* ===== Block 02 · ProductArchitecture ===== */
.arch{padding:clamp(64px,7vw,104px) 0;border-bottom:1px solid var(--line)}
.sec-head{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(24px,4vw,60px);align-items:end;margin-bottom:clamp(28px,3vw,44px)}
.sec-head h2{margin:0;font:800 clamp(40px,5vw,82px)/.98 var(--font-display);letter-spacing:-.065em}
.sec-head h2 em{font-style:normal;color:var(--mint-dark);background:linear-gradient(var(--stroke),var(--stroke)) 0 94%/100% .12em no-repeat}
.sec-head p{margin:0;font-size:clamp(16px,1.15vw,19px);line-height:1.45;color:var(--muted-strong);max-width:34em}

.arch-grid{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:14px;align-items:stretch}
.arch-panel{background:var(--white);border:1px solid var(--line);border-radius:var(--r-xl);padding:14px;min-width:0;display:flex;flex-direction:column}
.arch-bar .route-btn{margin-left:auto}
.arch-bar{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;padding:4px 4px 14px}
.tabs{display:flex;gap:6px;flex-wrap:wrap}
.tab{font:600 12px/1 var(--font-mono);letter-spacing:.1em;text-transform:uppercase;border:1px solid var(--line);background:var(--paper);color:var(--ink);border-radius:var(--r-pill);height:40px;padding:0 16px;cursor:pointer;transition:background .2s,border-color .2s}
.tab:hover{border-color:var(--ink)}
.tab[aria-selected="true"]{background:var(--ink);border-color:var(--ink);color:var(--white)}
.tab .cnt{display:inline-grid;place-items:center;min-width:18px;height:18px;margin-left:6px;border-radius:9px;background:var(--mint);color:var(--ink);font-size:12px;letter-spacing:0;padding:0 5px}
.arch-hint{font-size:13px;color:var(--muted);display:flex;align-items:center;gap:6px}
.arch-hint i{font-style:normal;color:var(--mint-dark);animation:bob 1.8s ease-in-out infinite}
@keyframes bob{50%{transform:translateY(3px)}}

/* лента узлов: каждый узел — отдельная карточка */
.nodes{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;flex:1}
.node{position:relative;display:flex;flex-direction:column;background:var(--paper);border:1px solid transparent;border-radius:var(--r-l);padding:16px 16px 14px;min-width:0;transition:transform .35s cubic-bezier(.2,.7,.2,1),background .3s,border-color .3s,box-shadow .35s}
.node:hover,.node:focus-within{transform:translateY(-6px);background:var(--white);border-color:var(--ink);box-shadow:0 22px 26px rgba(10,15,14,.1)}
.node-top{display:flex;justify-content:space-between;align-items:center;gap:8px}
.node-num{font:800 15px/1 var(--font-display);letter-spacing:-.04em;color:var(--mint-dark)}
.node-code{font:500 12px/1.2 var(--font-mono);letter-spacing:.06em;color:var(--muted);text-align:right;opacity:.8;transition:opacity .3s,color .3s}
.node:hover .node-code{opacity:1;color:var(--ink)}
.node h3{margin:12px 0 0;font:850 clamp(19px,1.45vw,26px)/1 var(--font-display);letter-spacing:-.055em}
.node-img{position:relative;height:clamp(180px,15vw,260px);margin:12px 0}
.node-img::after{content:"";position:absolute;left:18%;right:18%;bottom:2px;height:10px;border-radius:50%;background:rgba(8,17,15,.10);filter:blur(5px);transition:transform .45s,opacity .45s}
.node-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transition:transform .45s cubic-bezier(.2,.7,.2,1);z-index:1}
.node:hover .node-img img{transform:translateY(-8px) scale(1.04)}
.node:hover .node-img::after{transform:scaleX(.82);opacity:.6}
.node-desc{margin:0;font-size:14px;line-height:1.4;color:var(--muted-strong)}
.node-foot{margin-top:auto;padding-top:14px;display:flex;flex-wrap:wrap;gap:6px;align-items:center;justify-content:space-between}
.chip-val{font:600 12px/1 var(--font-mono);letter-spacing:.04em;border:1px solid var(--line);background:var(--white);border-radius:var(--r-pill);padding:10px 12px;white-space:nowrap}
.alt{font:800 13px/1 var(--font-body);border:1px solid transparent;background:var(--mint-soft);color:var(--ink);border-radius:var(--r-pill);height:38px;padding:0 14px;cursor:pointer;white-space:nowrap;transition:transform .2s}
.alt:hover{transform:scale(1.04);border-color:var(--mint-dark)}
.alt:active{transform:scale(.97)}
.node-vars{display:none;margin-top:auto;padding-top:14px;gap:6px;flex-direction:column}
.node-vars button{display:flex;justify-content:space-between;align-items:center;gap:8px;text-align:left;font:700 13px/1.2 var(--font-body);border:1px solid var(--line);background:var(--white);border-radius:var(--r-s);padding:10px 12px;min-height:44px;cursor:pointer;color:var(--ink)}
.node-vars button small{font:500 12px/1.25 var(--font-body);color:var(--muted)}
.node-vars button[aria-pressed="true"]{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.node-vars button[aria-pressed="true"]::after{content:"✓";color:var(--mint-dark);font-weight:800}
.mode-vars .node-foot{display:none}
.mode-vars .node-vars{display:flex}
.node.changed{animation:flash .9s ease}
@keyframes flash{0%{box-shadow:0 0 0 0 var(--mint)}30%{box-shadow:0 0 0 5px var(--mint)}100%{box-shadow:0 0 0 0 rgba(36,216,188,0)}}

/* стрелка-переход между узлами: вода идёт дальше */
.node:not(:last-child)::after{content:"";position:absolute;right:-12px;top:calc(50% - 5px);width:10px;height:10px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 4px var(--white);z-index:2;animation:flow 2.4s ease-in-out infinite}
@keyframes flow{0%,100%{transform:translateX(-3px);opacity:.5}50%{transform:translateX(3px);opacity:1}}

/* допы */
.addons{display:none;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;flex:1;align-content:start}
.mode-addons .nodes{display:none}
.mode-addons .addons{display:grid}
.addon{display:flex;flex-direction:column;gap:8px;text-align:left;font:inherit;color:var(--ink);background:var(--paper);border:1px solid transparent;border-radius:var(--r-l);padding:18px;min-height:150px;cursor:pointer;transition:transform .3s,background .3s,border-color .3s}
.addon:hover{transform:translateY(-4px);background:var(--white);border-color:var(--ink)}
.addon .a-code{font:500 12px/1 var(--font-mono);letter-spacing:.1em;color:var(--muted)}
.addon b{font:850 19px/1.05 var(--font-display);letter-spacing:-.05em}
.a-own{font:600 12px/1 var(--font-mono);font-style:normal;letter-spacing:.06em;text-transform:uppercase;background:var(--ink);color:var(--mint);border-radius:var(--r-pill);padding:4px 8px;margin-left:8px;vertical-align:1px}
.addon.own{border-color:var(--line)}
.addon .a-code{display:flex;align-items:center;flex-wrap:wrap;gap:4px}
.addon span.a-desc{font-size:14px;color:var(--muted-strong);line-height:1.4}
.addon .a-foot{margin-top:auto;display:flex;justify-content:space-between;align-items:center;font:600 12px var(--font-mono);color:var(--muted)}
.addon .a-plus{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:var(--mint);font:700 20px/1 var(--font-body);transition:transform .3s}
.addon[aria-pressed="true"]{background:var(--mint-soft);border-color:var(--mint-dark)}
.addon[aria-pressed="true"] .a-plus{transform:rotate(45deg);background:var(--mint-dark);color:var(--white)}

/* сводка — тёмный блок: итог */
.summary{background:var(--ink-surface);color:var(--on-dark);border-radius:var(--r-xl);padding:26px 22px 22px;display:flex;flex-direction:column;position:sticky;top:88px;align-self:start}
.summary h3{margin:0;font:850 26px/1 var(--font-display);letter-spacing:-.055em}
.summary .s-sub{margin:6px 0 14px;font:500 12px var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.55)}
.s-rows{list-style:none;margin:0;padding:0}
.s-rows li{display:flex;justify-content:space-between;gap:12px;padding:13px 0;border-bottom:1px solid var(--line-dark);font-size:14px;color:rgba(255,255,255,.7)}
.s-rows li b{color:var(--on-dark);font-weight:700;text-align:right;transition:color .3s}
.s-rows li.flash b{color:var(--mint)}
.s-total{margin:18px 0 4px;display:flex;flex-direction:column;gap:4px}
.s-total small{font:500 12px var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.55)}
.s-total b{font:900 clamp(28px,2vw,40px)/1 var(--font-display);letter-spacing:-.06em;color:var(--mint);white-space:nowrap}
.s-note{font-size:13px;color:rgba(255,255,255,.6);margin:6px 0 0;min-height:1.4em}
.s-actions{display:grid;gap:8px;margin-top:18px}
.s-btn{display:flex;align-items:center;justify-content:center;gap:8px;height:52px;border-radius:var(--r-pill);font:800 15px/1 var(--font-body);border:1px solid var(--line-dark);background:transparent;color:var(--on-dark);cursor:pointer;transition:transform .2s,background .2s}
.s-btn:hover{transform:translateY(-2px)}
.s-btn.main{background:var(--mint);border-color:var(--mint);color:#08110f}
.s-btn.taste{border-color:rgba(36,216,188,.5);color:var(--mint)}
.s-btn.taste[aria-pressed="true"]{background:rgba(36,216,188,.16);border-color:var(--mint)}
.summary .st{margin-left:6px}

@media (max-width:1500px){
  .arch-grid{grid-template-columns:1fr}
  .summary{position:static;display:grid;grid-template-columns:1.2fr .8fr;column-gap:40px;padding:28px}
  .summary .s-head{grid-column:1/-1}
  .summary .s-rows{grid-row:2/5}
  .s-total{margin-top:0}
}
@media (max-width:1120px){
  .mmenu{display:block}
  .menu-btn{display:none!important}
  .nodes{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding:8px 2px 14px;margin:-8px -2px 0;scrollbar-width:thin}
  .node{flex:0 0 clamp(240px,34vw,300px);scroll-snap-align:start}
  .addons{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sec-head{grid-template-columns:1fr}
}
@media (max-width:620px){
  .summary{display:flex;padding:24px 20px}
  .node{flex-basis:78vw}
  .addons{grid-template-columns:1fr}
  .arch-panel{padding:10px;border-radius:var(--r-l)}
  .arch-hint{display:none}
}


/* подсказка не нужна в режиме допов */
.mode-addons .arch-hint{visibility:hidden}
.v-price{font:600 12px/1.2 var(--font-mono);font-style:normal;color:var(--mint-dark);white-space:nowrap;margin-left:auto}
[hidden]{display:none!important}
.node-vars button{display:grid!important;grid-template-columns:1fr auto;align-items:baseline;row-gap:3px}
.node-vars button small{grid-column:1/-1;grid-row:2}
.node-vars button .v-price{grid-column:2;grid-row:1;margin:0}
.node-vars button[aria-pressed="true"]::after{display:none}
.node-vars button[aria-pressed="true"] .v-price::before{content:"✓ ";color:var(--mint-dark)}
.s-total b{font-variant-numeric:tabular-nums}

/* ===== Окно заявки на КП ===== */
.lead-dialog{width:min(640px,calc(100vw - 32px));max-height:calc(100dvh - 32px);padding:0;border:0;border-radius:var(--r-xl);background:var(--paper);color:var(--ink);box-shadow:0 30px 80px rgba(8,17,15,.35)}
.lead-dialog::backdrop{background:rgba(8,17,15,.55);backdrop-filter:blur(4px)}
.lead-dialog[open]{animation:pop .3s cubic-bezier(.2,.7,.2,1)}
.lead-sum{margin-top:16px;background:var(--ink-surface);color:var(--on-dark);border-radius:var(--r-l);padding:16px 18px}
.lead-sum ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:4px 18px}
.lead-sum li{display:flex;justify-content:space-between;gap:8px;font-size:13px;color:rgba(255,255,255,.65)}
.lead-sum li b{color:var(--on-dark);font-weight:700;text-align:right}
.lead-sum p{margin:12px 0 0;font-size:14px;color:rgba(255,255,255,.7)}
.lead-sum p b{font:900 22px/1 var(--font-display);letter-spacing:-.05em;color:var(--mint)}
#leadForm{display:grid;gap:12px;margin-top:18px}
.fld{display:grid;gap:6px}
.fld span{font:600 12px var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted-strong)}
.fld i,.fld-hint i{font-style:normal;color:var(--mint-dark)}
.fld input,.fld textarea{font:400 16px/1.4 var(--font-body);color:var(--ink);background:var(--white);border:1px solid var(--line);border-radius:var(--r-s);padding:13px 14px;min-height:48px;width:100%;resize:vertical}
.fld input:focus,.fld textarea:focus{outline:none;border-color:var(--ink);box-shadow:0 0 0 1px var(--ink)}
.fld input:user-invalid{border-color:var(--orange);box-shadow:0 0 0 1px var(--orange)}
.fld-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fld-hint{margin:-4px 0 0;font-size:13px;color:var(--muted-strong)}
.fld-err{color:#a8401c;font-weight:700}
.lead-submit{width:100%;margin-top:4px}
.fld-legal{margin:0;font-size:12px;color:var(--muted)}
.lead-ok{padding:24px 0 4px;display:grid;gap:10px;justify-items:start}
.lead-ok b{font:900 28px/1 var(--font-display);letter-spacing:-.05em}
.lead-ok p{margin:0}
@media (max-width:620px){.fld-row,.lead-sum ul{grid-template-columns:1fr}}


/* ===== Block 03 · Benefits (облако выгод) ===== */
.benefits{padding:clamp(64px,7vw,104px) 0;border-bottom:1px solid var(--line)}
.bn-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,.42fr);gap:14px;align-items:stretch}
.bn-stage{background:var(--white);border:1px solid var(--line);border-radius:var(--r-xl);padding:14px 18px;min-width:0;display:flex;flex-direction:column;justify-content:center}
.bn-bar{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;padding:4px 4px 10px}
.flts{display:flex;gap:6px;flex-wrap:wrap}
.flt{font:600 12px/1 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--line);background:var(--paper);color:var(--ink);border-radius:var(--r-pill);height:36px;padding:0 13px;cursor:pointer}
.flt:hover{border-color:var(--ink)}
.flt[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--white)}
.bn-shuffle{font:700 13px var(--font-body);border:1px solid var(--line);background:transparent;border-radius:var(--r-pill);height:36px;padding:0 14px;cursor:pointer;color:var(--ink)}
.bn-shuffle span{display:inline-block;transition:transform .5s}
.bn-shuffle:hover span{transform:rotate(180deg)}
.cloud{position:relative;list-style:none;margin:10px 0 18px;padding:0;flex:none}
.cloud li{position:absolute;left:0;top:0;will-change:transform;transition:transform 1.1s cubic-bezier(.45,.05,.2,1),opacity .5s}
.cloud.static li{transition:none}
.tag{display:flex;flex-direction:column;align-items:flex-start;gap:6px;text-align:left;border:1px solid var(--line);background:var(--paper);color:var(--ink);border-radius:var(--r-pill);padding:10px 18px 11px;cursor:pointer;white-space:nowrap;transition:background .25s,border-color .25s,transform .25s,box-shadow .25s;animation:bob-tag var(--d,7s) ease-in-out var(--dl,0s) infinite}
.tag-cat{font:500 12px/1 var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.tag-t{font:800 15px/1.05 var(--font-body);letter-spacing:-.02em}
.tag.s2{padding:13px 22px 14px}
.tag.s2 .tag-t{font:850 clamp(18px,1.35vw,24px)/1 var(--font-display);letter-spacing:-.05em}
.tag.s3{padding:16px 26px 18px;background:var(--ink);border-color:var(--ink);color:var(--white)}
.tag.s3 .tag-cat{color:var(--mint)}
.tag.s3 .tag-t{font:900 clamp(22px,1.9vw,34px)/1 var(--font-display);letter-spacing:-.06em}
.tag[data-cat="Честно"]{border-style:dashed}
.tag[data-cat="Партнёрам"]{background:transparent}
.tag:hover{transform:scale(1.05);border-color:var(--ink);box-shadow:0 22px 26px rgba(10,15,14,.1)}
.tag[aria-pressed="true"]{background:var(--acid);border-color:var(--acid);color:#08110f;transform:scale(1.06)}
.tag[aria-pressed="true"] .tag-cat{color:#446059}
.cloud li.dim{opacity:.18}
.cloud:hover .tag,.cloud:focus-within .tag{animation-play-state:paused}
@keyframes bob-tag{0%,100%{translate:0 0}50%{translate:0 -6px}}
.bn-card{container-type:inline-size;background:var(--mint-soft);border-radius:var(--r-xl);padding:clamp(24px,2.4vw,36px);display:flex;flex-direction:column;gap:14px;min-height:320px}
.bn-cat{color:var(--mint-dark)}
.bn-card h3{margin:0;font:900 clamp(24px,8.4cqi,52px)/.98 var(--font-display);letter-spacing:-.06em;transition:opacity .25s;overflow-wrap:anywhere;hyphens:manual}
.bn-card p{margin:0;font-size:clamp(16px,1.2vw,19px);line-height:1.45;color:var(--muted-strong);transition:opacity .25s}
.bn-card.swap h3,.bn-card.swap p{opacity:0}
.bn-more{display:grid;gap:8px;margin-top:6px}
.bn-more .mono{color:var(--muted-strong)}
.bn-more-list{display:grid;gap:6px}
.bn-more-list button{display:flex;justify-content:space-between;align-items:center;gap:10px;text-align:left;font:700 15px/1.25 var(--font-body);color:var(--ink);background:var(--white);border:1px solid transparent;border-radius:var(--r-m);padding:12px 14px;min-height:48px;cursor:pointer;transition:border-color .2s,transform .2s}
.bn-more-list button:hover{border-color:var(--ink);transform:translateX(4px)}
.bn-more-list button span{color:var(--mint-dark)}
.bn-nav{margin-top:auto;display:flex;align-items:center;gap:12px}
.bn-nav button{width:48px;height:48px;border-radius:50%;border:1px solid var(--line);background:var(--white);font:700 18px var(--font-body);cursor:pointer;color:var(--ink)}
.bn-nav button:hover{background:var(--ink);color:var(--white)}
.bn-nav .mono{color:var(--muted-strong)}
@media (max-width:1120px){.bn-grid{grid-template-columns:minmax(0,1fr)}.bn-card{min-height:0}}
.flts{min-width:0;max-width:100%}
@media (max-width:620px){
  .cloud{min-height:0}
  .tag{padding:8px 13px 9px}.tag.s2{padding:10px 15px}.tag.s3{padding:12px 17px 13px}
  .tag{white-space:normal;max-width:100%}
  .tag-cat{font-size:12px}
  .tag-t{font-size:14px}
  .tag.s2 .tag-t{font-size:16px}
  .tag.s3 .tag-t{font-size:19px}
  .tag[aria-pressed="true"],.tag:hover{transform:none}
  .bn-stage{padding:10px;border-radius:var(--r-l)}
  .bn-card{order:-1;position:sticky;top:72px;z-index:3;min-height:0;padding:18px 20px;gap:8px;box-shadow:0 12px 20px rgba(10,15,14,.08)}
  .bn-card h3{font-size:clamp(22px,7.6cqi,28px)}
  .bn-card p{font-size:15px}
  .bn-nav button{width:40px;height:40px}
  .flts{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin:0 -4px;padding:0 4px}
  .flt{flex:none}
}
/* без анимации: обычный перенос строк */
.cloud.flow{display:flex;flex-wrap:wrap;gap:8px;height:auto!important}
.cloud.flow li{position:static;transform:none!important}
.msgr{border:0;padding:0;margin:0}
.msgr legend{padding:0;margin-bottom:6px}
.msgr-row{display:flex;flex-wrap:wrap;gap:6px}
.msgr-row label{position:relative;cursor:pointer}
.msgr-row input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.msgr-row b{display:inline-flex;align-items:center;height:44px;padding:0 16px;border:1px solid var(--line);border-radius:var(--r-pill);background:var(--white);font:700 14px var(--font-body);transition:background .2s,border-color .2s}
.msgr-row input:checked+b{background:var(--ink);color:var(--white);border-color:var(--ink)}
.msgr-row input:focus-visible+b{box-shadow:0 0 0 2px var(--paper),0 0 0 4px var(--ink)}


/* ===== Путь воды (порт с главной, #how) ===== */
.route-btn{display:inline-flex;align-items:center;gap:8px;font:700 13px var(--font-body);border:1px solid var(--line);background:transparent;color:var(--ink);border-radius:var(--r-pill);height:40px;padding:0 14px 0 6px;cursor:pointer;transition:border-color .2s}
.route-btn:hover{border-color:var(--ink)}
.route-btn i{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--mint);color:#08110f;font-style:normal;font-size:12px}
.water-journey{width:min(1160px,calc(100% - 24px));height:min(780px,calc(100% - 24px));border:0;border-radius:var(--r-xl);padding:0;background:var(--paper);color:var(--ink);box-shadow:0 50px 120px rgba(0,0,0,.35);overflow:hidden}
.water-journey::backdrop{background:rgba(3,8,6,.8);backdrop-filter:blur(8px)}
.water-journey[open]{animation:pop .35s cubic-bezier(.2,.7,.2,1)}
.journey-close{position:absolute;right:16px;top:16px;z-index:10;width:44px;height:44px;border:0;border-radius:50%;background:var(--ink);color:var(--paper);font-size:26px;cursor:pointer}
.journey-progress{position:absolute;top:0;left:0;right:0;display:grid;grid-template-columns:repeat(7,1fr);gap:3px;padding:10px 70px 0 10px;z-index:4}
.journey-progress i{height:5px;background:var(--line);border-radius:99px;transition:background .3s}
.journey-progress i.active{background:var(--mint)}
.journey-stage{height:100%;display:grid;grid-template-columns:1.06fr .94fr}
.journey-visual{position:relative;background:#0b1512;overflow:hidden;display:grid;place-items:center}
.journey-water{width:300px;height:450px;border:5px solid #fff;border-radius:54px;position:relative;overflow:hidden;background:linear-gradient(#776c4c,#a2976f);transition:background .55s,box-shadow .55s}
.journey-water::after{content:"";position:absolute;left:-10%;right:-10%;bottom:-10%;height:74%;background:rgba(186,156,86,.65);border-radius:45% 45% 0 0;animation:jwave 3s ease-in-out infinite;transition:background .55s,height .55s}
@keyframes jwave{0%,100%{transform:translateX(-4%) rotate(0)}50%{transform:translateX(5%) rotate(2deg)}}
.journey-water span{position:absolute;z-index:2;background:#fff;color:#08110f;border:2px solid #08110f;border-radius:50%;width:50px;height:50px;display:grid;place-items:center;font:600 12px var(--font-mono);transition:.5s}
.journey-water span:nth-child(1){left:28px;top:100px}
.journey-water span:nth-child(2){right:38px;top:180px}
.journey-water span:nth-child(3){left:70px;bottom:120px}
.journey-water span:nth-child(4){right:50px;bottom:70px}
.journey-water b{position:absolute;z-index:3;left:50%;top:50%;transform:translate(-50%,-50%) scale(.4);font:900 64px var(--font-display);color:#fff;opacity:0;transition:.55s}
.journey-water.stage-2 span:nth-child(1),.journey-water.stage-3 span:nth-child(3){transform:translateX(-180px);opacity:.2}
.journey-water.stage-4 span{transform:translateX(260px);opacity:0}
.journey-water.stage-4::after,.journey-water.stage-5::after{background:rgba(39,217,188,.8);height:82%}
.journey-water.stage-4{background:linear-gradient(#6fe8d6,#1ab69e)}
.journey-water.stage-5{background:linear-gradient(#a5fbef,#21caae);box-shadow:0 0 90px rgba(37,217,189,.28)}
.journey-water.stage-5 b{opacity:1;transform:translate(-50%,-50%) scale(1)}
.journey-node{position:absolute;left:24px;bottom:24px;color:#fff;border:1px solid rgba(255,255,255,.25);padding:10px 14px;border-radius:var(--r-pill);font:600 12px var(--font-mono);letter-spacing:.08em}
.journey-copy{padding:64px 48px 32px;display:flex;flex-direction:column;overflow-y:auto;overscroll-behavior:contain}
.journey-copy .mono{color:var(--muted-strong)}
.journey-copy h2{font:900 clamp(28px,2.7vw,46px)/.98 var(--font-display);letter-spacing:-.06em;margin:12px 0 0;overflow-wrap:anywhere;hyphens:auto}
#journey-body{font-size:17px;line-height:1.5;margin:20px 0 12px}
#journey-body p{margin:0}
.journey-diff{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:16px}
.journey-diff>div{border-radius:var(--r-m);padding:14px;background:var(--white);border:1px solid var(--line)}
.journey-diff>div:last-child{background:var(--mint-soft);border-color:transparent}
.journey-diff small{font:600 12px var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted-strong)}
.journey-diff b{display:block;margin-top:6px;font-size:16px;line-height:1.2}
.journey-diff p{font-size:14px!important;margin:6px 0 0!important;color:var(--muted-strong)}
.journey-question{background:var(--mint-soft);border-radius:var(--r-m);padding:14px 16px;margin-top:10px;font-size:15px}
.journey-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:auto;position:sticky;bottom:-32px;padding:20px 0 0;background:linear-gradient(transparent,var(--paper) 30%)}
.journey-actions .btn{height:48px}
@media (max-width:900px){
  .journey-stage{grid-template-columns:1fr;grid-template-rows:auto 1fr;overflow:auto}
  .journey-visual{min-height:250px}
  .journey-water{height:210px;width:160px;border-radius:38px}
  .journey-water span{width:40px;height:40px;font-size:12px}
  .journey-water span:nth-child(1){left:12px;top:40px}.journey-water span:nth-child(2){right:12px;top:80px}
  .journey-water span:nth-child(3){left:30px;bottom:50px}.journey-water span:nth-child(4){right:20px;bottom:24px}
  .journey-copy{padding:28px 20px 20px;overflow:visible}
  .journey-diff{grid-template-columns:1fr}
  .water-journey{width:calc(100% - 12px);height:calc(100% - 12px);border-radius:var(--r-l)}
  .journey-actions .btn{flex:1 1 auto}
}

/* ===== Иглобрюх-проводник ===== */
.puffer-guide{position:fixed;right:clamp(16px,3vw,48px);bottom:96px;z-index:55;display:flex;align-items:flex-end;gap:14px;pointer-events:none;transform:translateX(calc(100% + 80px));transition:transform 1.4s cubic-bezier(.25,.8,.25,1)}
.puffer-guide.in{transform:translateX(0)}
.puffer-guide.away{transform:translate(calc(100% + 120px),-40px);transition:transform 1.6s cubic-bezier(.6,0,.8,.4)}
.puffer-guide.shy{transform:translate(-30px,40px);opacity:0;transition:transform 1.2s ease-in,opacity 1.2s ease-in}
.pg-bubble{pointer-events:auto;position:relative;background:var(--white);color:var(--ink);border:2px solid var(--ink);border-radius:22px 22px 6px 22px;padding:16px 18px 14px;max-width:270px;box-shadow:6px 7px 0 var(--ink);transform-origin:100% 100%;transform:scale(0);transition:transform .35s cubic-bezier(.3,1.6,.5,1) .9s}
.puffer-guide.in .pg-bubble{transform:scale(1)}
.puffer-guide.away .pg-bubble,.puffer-guide.shy .pg-bubble{transform:scale(0);transition-delay:0s}
.pg-bubble::after{content:"";position:absolute;right:-14px;bottom:10px;width:16px;height:16px;background:var(--white);border-right:2px solid var(--ink);border-bottom:2px solid var(--ink);transform:rotate(-45deg) skew(10deg,10deg)}
.pg-bubble b{display:block;font:850 20px/1.05 var(--font-display);letter-spacing:-.05em}
.pg-bubble p{margin:6px 0 12px;font-size:14px;color:var(--muted-strong)}
.pg-actions{display:flex;gap:6px}
.pg-actions button{font:800 14px var(--font-body);height:40px;padding:0 16px;border-radius:var(--r-pill);border:1px solid var(--ink);background:transparent;color:var(--ink);cursor:pointer}
.pg-actions .yes{background:var(--ink);color:var(--white)}
.pg-fish{position:relative;width:82px;height:62px;flex:none;animation:pg-swim 2.6s ease-in-out infinite}
@keyframes pg-swim{0%,100%{translate:0 0;rotate:-3deg}50%{translate:0 -8px;rotate:3deg}}
.pg-body{position:absolute;inset:0;border:4px solid #08110f;border-radius:48% 52% 52% 48%;background:var(--acid);transition:all .35s cubic-bezier(.3,1.6,.5,1)}
.pg-eye{position:absolute;width:10px;height:10px;background:#08110f;border-radius:50%;left:14px;top:13px}
.pg-mouth{position:absolute;width:11px;height:6px;border-bottom:3px solid #08110f;border-radius:50%;left:-6px;top:27px}
.pg-tail{position:absolute;right:-24px;top:16px;width:24px;height:25px;background:var(--mint-dark);clip-path:polygon(0 50%,100% 0,100% 100%)}
.pg-body i{position:absolute;width:3px;height:14px;background:#08110f;border-radius:2px;opacity:0;transition:opacity .2s}
.pg-body i:nth-of-type(1){left:50%;top:-18px}.pg-body i:nth-of-type(2){left:50%;bottom:-18px}
.pg-body i:nth-of-type(3){left:12%;top:-6px;rotate:-40deg}.pg-body i:nth-of-type(4){right:12%;top:-6px;rotate:40deg}
.pg-body i:nth-of-type(5){left:12%;bottom:-6px;rotate:40deg}.pg-body i:nth-of-type(6){right:12%;bottom:-6px;rotate:-40deg}
.puffer-guide.puffed .pg-fish{animation:none}
.puffer-guide.puffed .pg-body{inset:-24px -12px;border-radius:50%;background:var(--orange)}
.puffer-guide.puffed .pg-body i{opacity:1}
.puffer-guide.happy .pg-mouth{height:9px;border-bottom-width:4px}
@media (max-width:620px){
  .puffer-guide{right:34px;left:12px;bottom:84px;justify-content:flex-end}
  .bn-more{display:none!important}
  .pg-bubble{max-width:none;flex:1}
  .pg-fish{width:64px;height:50px}
}


/* ===== Раздел выгод: свёрнут по умолчанию ===== */
.benefits .sec-head,.svc .sec-head,.req .sec-head{margin-bottom:0}
.bn-body .svc-grid,.bn-body .req-grid{margin-top:clamp(28px,3vw,44px)}
.bn-toggle-wrap{display:flex;justify-content:center;margin:clamp(28px,3vw,44px) 0 0}
.bn-toggle{display:flex;flex-direction:column;align-items:center;gap:14px;background:none;border:0;color:var(--ink);cursor:pointer;padding:8px;font:inherit}
.bn-orb{position:relative;display:grid;place-items:center;width:96px;height:96px;border-radius:50%;background:var(--ink);color:var(--acid);transition:transform .35s cubic-bezier(.3,1.6,.5,1);animation:orb-bob 2.4s ease-in-out infinite}
.bn-orb svg{width:34px;height:34px;position:relative;z-index:1;transition:transform .45s cubic-bezier(.3,1.4,.5,1)}
.bn-orb .ring{position:absolute;inset:0;border-radius:50%;border:2px solid var(--mint);animation:orb-ring 2.4s ease-out infinite}
.bn-orb .r2{animation-delay:1.2s}
@keyframes orb-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(7px)}}
@keyframes orb-ring{0%{transform:scale(1);opacity:.9}100%{transform:scale(1.7);opacity:0}}
.bn-toggle:hover .bn-orb{transform:scale(1.08);animation-play-state:paused}
.bn-toggle:focus-visible{box-shadow:none}
.bn-toggle:focus-visible .bn-orb{box-shadow:0 0 0 3px var(--paper),0 0 0 5px var(--ink)}
.bn-toggle-t{display:flex;flex-direction:column;align-items:center;gap:2px}
.bn-toggle-t b{font:850 20px/1 var(--font-display);letter-spacing:-.05em}
.bn-toggle-t small{font:500 12px var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted-strong)}
.bn-toggle[aria-expanded="true"] .bn-orb{animation:none}
.bn-toggle[aria-expanded="true"] .bn-orb .ring{display:none}
.bn-toggle[aria-expanded="true"] .bn-orb svg{transform:rotate(180deg)}
.bn-body{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:0fr;transition:grid-template-rows .7s cubic-bezier(.2,.7,.2,1)}
.bn-body.open{grid-template-rows:1fr}
.bn-body-in{overflow:hidden;min-height:0;min-width:0}
.bn-body.open .bn-body-in{overflow:visible;animation:bn-unclip .7s step-end}
@keyframes bn-unclip{from{overflow:hidden}}
.bn-body .bn-grid{margin-top:clamp(28px,3vw,44px)}

/* ===== Калькулятор выгоды ===== */
.calc{margin-top:clamp(48px,5vw,80px)}
.calc-head{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(24px,4vw,60px);align-items:end;margin-bottom:clamp(20px,2.4vw,32px)}
.calc-head h3{margin:0;font:850 clamp(32px,3.6vw,58px)/.98 var(--font-display);letter-spacing:-.065em}
.calc-head h3 em{font-style:normal;color:var(--mint-dark)}
.calc-head p{margin:0;font-size:clamp(16px,1.15vw,19px);color:var(--muted-strong)}
.calc-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:stretch}
.calc-in{background:var(--white);border:1px solid var(--line);border-radius:var(--r-xl);padding:clamp(20px,2vw,30px);display:flex;flex-direction:column}
.calc-out{background:var(--ink-surface);color:var(--on-dark);border-radius:var(--r-xl);padding:clamp(20px,2vw,30px);display:flex;flex-direction:column}
.calc-ph{display:flex;flex-direction:column;gap:6px;padding-bottom:18px;border-bottom:1px solid var(--line);margin-bottom:6px}
.calc-out .calc-ph{border-color:var(--line-dark)}
.calc-ph .mono{color:var(--muted-strong)}
.calc-out .calc-ph .mono{color:var(--mint)}
.calc-ph b{font:850 clamp(22px,1.7vw,28px)/1.05 var(--font-display);letter-spacing:-.05em}
.calc-rows label{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:10px 0;border-bottom:1px solid var(--line);font-weight:600;font-size:15px}
.inp{display:flex;align-items:center;flex:none;width:min(200px,46%);background:var(--paper);border:1px solid var(--line);border-radius:var(--r-s);padding:0 12px;transition:border-color .2s}
.inp:focus-within{border-color:var(--ink);box-shadow:0 0 0 1px var(--ink)}
.inp input:focus-visible{box-shadow:none}
.inp input{flex:1;min-width:0;border:0;background:none;font:700 17px var(--font-body);color:var(--ink);height:46px;outline:none;text-align:right;-moz-appearance:textfield}
.inp input::-webkit-outer-spin-button,.inp input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.inp i{font:500 12px var(--font-mono);font-style:normal;color:var(--muted);margin-left:8px;white-space:nowrap}
.calc-now{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin:20px 0 0}
.calc-now span{font-weight:700}
.calc-now b{font:900 clamp(28px,2.4vw,40px)/1 var(--font-display);letter-spacing:-.06em;font-variant-numeric:tabular-nums}
.calc-now small{font:500 12px var(--font-mono);color:var(--muted);text-transform:uppercase;letter-spacing:.1em}
.calc-note{margin:auto 0 0;padding-top:18px;font-size:14px;color:var(--muted-strong);line-height:1.45}
.calc-note b{color:var(--ink)}
.calc-sel{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:12px 0;border-bottom:1px solid var(--line-dark);font-weight:600}
.calc-sel select{font:700 15px var(--font-body);color:var(--on-dark);background:rgba(255,255,255,.06);border:1px solid var(--line-dark);border-radius:var(--r-s);height:46px;padding:0 12px;max-width:62%;cursor:pointer}
.calc-sel select option{color:#08110f}
.calc-list{list-style:none;margin:0;padding:0}
.calc-list li{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:12px 0;border-bottom:1px solid var(--line-dark);font-weight:700;font-size:15px}
.calc-list small{display:block;font-weight:400;font-size:13px;color:rgba(255,255,255,.55);margin-top:2px}
.calc-list b{font:600 13px var(--font-mono);letter-spacing:.04em;white-space:nowrap}
.calc-list li.gone b{color:var(--mint)}
.calc-list b.tbd{color:rgba(255,255,255,.4)}
.calc-res{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}
.calc-res div{background:rgba(255,255,255,.05);border:1px solid var(--line-dark);border-radius:var(--r-m);padding:14px 16px}
.calc-res small{display:block;font:500 12px var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.55)}
.calc-res b{display:block;margin-top:6px;font:900 clamp(26px,2.2vw,36px)/1 var(--font-display);letter-spacing:-.06em;color:var(--mint)}
.calc-why{font-size:13px;color:rgba(255,255,255,.55);margin:14px 0 0;line-height:1.45}
.calc-cta{margin-top:18px}
@media (max-width:900px){.calc-grid,.calc-head{grid-template-columns:minmax(0,1fr)}}
.calc-in,.calc-out{min-width:0}
.calc-sel select{min-width:0;width:100%}
@media (max-width:620px){
  .calc-rows label{flex-direction:column;align-items:stretch;gap:6px}
  .inp{width:100%}
  .calc-sel{flex-direction:column;align-items:stretch}
  .calc-sel select{max-width:none}
  .bn-orb{width:84px;height:84px}
}


/* калькулятор v2: период, столбики, тёмные подписи */
.calc-years{display:flex;align-items:center;justify-content:center;gap:14px;flex-wrap:wrap;margin:0 0 18px}
.calc-years .mono{color:var(--muted-strong)}
.yr-seg{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));background:var(--white);border:1px solid var(--line);border-radius:var(--r-pill);padding:4px;min-width:min(520px,100%)}
.yr-seg button{position:relative;z-index:1;border:0;background:none;font:700 14px var(--font-body);color:var(--ink);height:44px;padding:0 10px;border-radius:var(--r-pill);cursor:pointer;transition:color .3s;white-space:nowrap}
.yr-seg button[aria-checked="true"]{color:var(--white)}
.yr-thumb{position:absolute;top:4px;bottom:4px;left:4px;width:calc((100% - 8px)/5);border-radius:var(--r-pill);background:var(--ink);transition:transform .45s cubic-bezier(.3,1.3,.5,1)}
.calc-rows label>span:first-child small{display:block;font-weight:400;font-size:13px;color:var(--muted);margin-top:2px}
.calc-now.dark{margin-top:18px}
.calc-in .calc-now{margin-top:auto;padding-top:20px}
.tag[aria-pressed="true"],:root[data-theme="dark"] .tag.s3[aria-pressed="true"]{background:var(--acid)!important;border-color:var(--acid)!important;color:#08110f!important}
.tag[aria-pressed="true"] .tag-cat,:root[data-theme="dark"] .tag.s3[aria-pressed="true"] .tag-cat{color:#446059!important}
.calc-now.dark span{color:var(--on-dark)}
.calc-now.dark small{color:rgba(255,255,255,.55)}
.calc-now.dark b{color:var(--mint)}
.calc-bars{display:grid;gap:8px;margin-top:16px}
.calc-bars .bar{display:grid;grid-template-columns:110px 1fr;align-items:center;gap:10px;font:500 12px var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.6)}
.calc-bars i{display:block;height:14px;border-radius:7px;background:rgba(255,255,255,.28);width:0;transition:width .7s cubic-bezier(.2,.7,.2,1)}
.calc-bars .osmos i{background:var(--mint)}
.calc-res em{display:block;font:500 12px var(--font-body);font-style:normal;color:rgba(255,255,255,.55);margin-top:6px}
.calc-note.dark{color:rgba(255,255,255,.65);margin-top:16px;padding-top:0}
.calc-note.dark b{color:var(--on-dark)}
.calc-res b{font-variant-numeric:tabular-nums}
@media (max-width:620px){.yr-seg button{font-size:12px;padding:0 4px}.calc-bars .bar{grid-template-columns:90px 1fr}}


/* калькулятор v3: плотная компоновка, помещается в один экран */
.calc-top{display:flex;justify-content:space-between;align-items:center;gap:16px 24px;flex-wrap:wrap;margin-bottom:14px}
.calc-top h3{margin:0;font:850 clamp(28px,2.6vw,44px)/1 var(--font-display);letter-spacing:-.06em}
.calc-top h3 em{font-style:normal;color:var(--mint-dark)}
.calc-top .calc-years{margin:0;flex-wrap:nowrap;flex:none}
.calc-top h3{flex:1 1 300px;min-width:0}
.calc-years .mono{white-space:nowrap}
.calc-top .yr-seg{min-width:460px}
@media (max-width:620px){.calc-top .yr-seg{min-width:0;width:100%}.calc-top .calc-years{flex:1 1 100%}}
.calc .calc-grid{gap:12px}
.calc .calc-in,.calc .calc-out{padding:20px 22px;border-radius:var(--r-l)}
.calc .calc-ph{padding-bottom:12px;margin-bottom:12px;gap:4px}
.calc .calc-ph b{font-size:clamp(18px,1.3vw,22px)}
.calc-ph.row{flex-direction:row;justify-content:space-between;align-items:center;gap:12px}
.calc-ph.row>div{display:flex;flex-direction:column;gap:4px}
.calc-ph.row select{font:700 14px var(--font-body);color:var(--on-dark);background:rgba(255,255,255,.06);border:1px solid var(--line-dark);border-radius:var(--r-s);height:40px;padding:0 10px;cursor:pointer}
.calc-ph.row select option{color:#08110f}
.cf-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 12px}
.cf-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.cf{display:flex;flex-direction:column;gap:5px;min-width:0}
.cf>span:first-child{font:600 13px/1.2 var(--font-body);min-height:2.4em;display:flex;flex-direction:column;justify-content:flex-end}
.cf small{font-weight:400;font-size:12px;color:var(--muted)}
.cf .inp{width:100%;padding:0 10px}
.cf .inp input{height:40px;font-size:16px}
.cf .inp i{font-size:12px;margin-left:6px}
.cf-once{margin-top:14px;padding:12px 14px 14px;background:var(--paper);border:1px dashed var(--line);border-radius:var(--r-m)}
.cf-once>.mono{display:block;color:var(--muted-strong);margin-bottom:8px}
.cf-once .inp{background:var(--white)}
.calc .calc-in .calc-now{padding-top:14px;margin-top:auto}
.calc .calc-now{margin-top:12px}
.calc .calc-now b{font-size:clamp(26px,2vw,34px)}
.calc .calc-list li{padding:8px 0;font-size:14px}
.calc .calc-bars{margin-top:10px;gap:6px}
.calc .calc-bars i{height:10px}
.calc .calc-res{margin-top:12px;grid-template-columns:1.3fr 1fr}
.calc .calc-res div{padding:12px 14px}
.calc .calc-res b{font-size:clamp(24px,1.9vw,32px)}
.calc .calc-res .big b{font-size:clamp(28px,2.3vw,38px)}
.calc .calc-note.dark{font-size:13px;margin-top:10px}
.calc .calc-cta{margin-top:12px;height:48px}
.calc>.draft-note{margin-top:10px}
@media (max-width:1120px){.cf-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-height:820px) and (min-width:900px){.calc .calc-note.dark{display:none}.calc .calc-bars{margin-top:6px}.calc .calc-in,.calc .calc-out{padding:16px 20px}}
@media (max-width:620px){.calc-top .calc-years{flex-wrap:wrap;justify-content:center}.cf-grid,.cf-grid.two{grid-template-columns:1fr 1fr}.calc-top{justify-content:center}.calc-ph.row{flex-direction:column;align-items:stretch}}


/* ===== Block 04 · Сервис без сюрпризов ===== */
.svc,.req{padding:clamp(64px,7vw,104px) 0;border-bottom:1px solid var(--line)}
.svc-grid,.req-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.svc-card,.req-card{display:flex;flex-direction:column;background:var(--white);border:1px solid var(--line);border-radius:var(--r-l);padding:20px 22px;min-height:200px;transition:transform .3s,border-color .3s}
.svc-card:hover,.req-card:hover{transform:translateY(-4px);border-color:var(--ink)}
.svc-top{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}
.svc-top .mono,.req-card>.mono{color:var(--muted-strong)}
.diy{font:700 12px/1 var(--font-body);background:var(--mint-soft);color:var(--mint-dark);border-radius:var(--r-pill);padding:6px 10px;white-space:nowrap}
.diy::before{content:"✓ "}
.svc-card h3,.req-card h3{margin:auto 0 0;padding-top:24px;font:850 clamp(20px,1.5vw,26px)/1.05 var(--font-display);letter-spacing:-.05em}
.svc-card p,.req-card p{margin:8px 0 0;font-size:14px;line-height:1.45;color:var(--muted-strong)}
.svc-stats{margin-top:12px;grid-template-columns:repeat(4,minmax(0,1fr))!important}
.svc-stats .stat:last-child{border-right:0}
/* ===== Block 05 · Что нужно до заказа ===== */
.req-card.accent{background:var(--mint-soft);border-color:transparent}
.req-links{display:flex;gap:14px;flex-wrap:wrap;margin-top:14px}
.req-links a,.req-alt{font:700 14px var(--font-body);color:var(--mint-dark);border-bottom:1px solid currentColor;padding-bottom:1px}
.req-alt{display:inline-flex;align-self:flex-start;gap:6px;margin-top:14px;border:1px solid var(--ink);border-radius:var(--r-pill);padding:10px 14px;color:var(--ink);transition:background .2s,color .2s}
.req-alt:hover{background:var(--ink);color:var(--white)}
.req-alt span{transition:transform .2s}
.req-alt:hover span{transform:translateX(3px)}
@media (max-width:1120px){.svc-grid,.req-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.svc-stats{grid-template-columns:repeat(2,minmax(0,1fr))!important}.svc-stats .stat:nth-child(2n){border-right:0}}
@media (max-width:620px){.svc-grid,.req-grid{grid-template-columns:1fr}.svc-card,.req-card{min-height:0}.svc-card h3,.req-card h3{padding-top:16px}}


/* ===== Block 06 · Собственные разработки, объекты, блог ===== */
.proof{padding:clamp(64px,7vw,104px) 0;border-bottom:1px solid var(--line)}
.pr-dev{display:grid;grid-template-columns:minmax(0,1.9fr) minmax(0,.8fr) minmax(0,1fr);gap:12px;margin-bottom:clamp(32px,3.4vw,52px)}
.pr-promo{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);background:#08110f;color:#fff;border-radius:var(--r-xl);overflow:hidden;min-height:320px}
:root[data-theme="dark"] .pr-promo{box-shadow:inset 0 0 0 1px var(--line-dark)}
.pr-promo-img{position:relative;overflow:hidden}
.pr-promo-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.pr-promo:hover .pr-promo-img img{transform:scale(1.06) rotate(-1deg)}
.pr-promo-img::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 60%,#08110f)}
.pr-promo-copy{padding:clamp(22px,2.2vw,34px);display:flex;flex-direction:column;gap:10px}
.pr-badge{align-self:flex-start;font:700 12px/1 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;background:var(--acid);color:#08110f;border-radius:var(--r-pill);padding:7px 11px}
.pr-badge.light{background:var(--ink);color:var(--mint)}
.pr-promo h3{margin:0;font:900 clamp(26px,2.3vw,40px)/.98 var(--font-display);letter-spacing:-.06em}
.pr-promo p{margin:0;font-size:15px;line-height:1.45;color:rgba(255,255,255,.7)}
.pr-points{list-style:none;margin:2px 0 0;padding:0;display:grid;gap:6px}
.pr-points li{font-size:14px;color:rgba(255,255,255,.85);display:flex;gap:8px}
.pr-points li::before{content:"";flex:none;width:8px;height:8px;margin-top:6px;border-radius:50%;background:var(--mint)}
.pr-promo-act{margin-top:auto;padding-top:8px;display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.pr-add{font:800 14px var(--font-body);height:46px;padding:0 18px;border-radius:var(--r-pill);border:0;background:#fff;color:#08110f;cursor:pointer;transition:transform .2s,background .2s}
.pr-add:hover{transform:translateY(-2px)}
.pr-add[aria-pressed="true"]{background:var(--mint)}
.pr-add.light{align-self:flex-start;margin-top:auto;background:var(--ink);color:var(--white)}
.pr-add.light[aria-pressed="true"]{background:var(--mint-dark);color:#fff}
.pr-price{font:600 13px var(--font-mono);color:rgba(255,255,255,.6)}
.pr-warranty{background:var(--mint-soft);border-radius:var(--r-xl);padding:clamp(22px,2.2vw,32px);display:flex;flex-direction:column;justify-content:center;gap:6px}
.pr-warranty b{font:900 clamp(48px,4.6vw,80px)/.9 var(--font-display);letter-spacing:-.07em;color:var(--mint-dark)}
.pr-warranty span{font:850 clamp(18px,1.4vw,24px)/1.05 var(--font-display);letter-spacing:-.05em}
.pr-warranty small{margin-top:8px;font-size:14px;color:var(--muted-strong)}
.pr-dev2{background:var(--white);border:1px solid var(--line);border-radius:var(--r-xl);padding:clamp(22px,2.2vw,30px);display:flex;flex-direction:column;gap:10px;transition:transform .3s,border-color .3s}
.pr-dev2:hover{transform:translateY(-4px);border-color:var(--ink)}
.pr-dev2 h3{margin:4px 0 0;font:850 clamp(20px,1.6vw,28px)/1.02 var(--font-display);letter-spacing:-.05em}
.pr-dev2 p{margin:0;font-size:15px;color:var(--muted-strong)}
.pr-row-head{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin:0 0 14px}
.pr-row-head h3{margin:0;font:850 clamp(24px,2vw,34px)/1 var(--font-display);letter-spacing:-.055em}
.pr-row-head .mono{color:var(--muted-strong)}
.pr-all{color:var(--mint-dark)!important;border-bottom:1px solid currentColor}
.pr-cases{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:clamp(32px,3.4vw,52px)}
.pr-case{display:flex;flex-direction:column;background:var(--white);border:1px solid var(--line);border-radius:var(--r-l);overflow:hidden;transition:transform .3s,border-color .3s}
.pr-case:hover{transform:translateY(-4px);border-color:var(--ink)}
.pr-case-img{aspect-ratio:4/3;overflow:hidden;background:var(--paper-2)}
.pr-case-img img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.2,1)}
.pr-case:hover .pr-case-img img{transform:scale(1.06)}
.pr-case-t{position:relative;padding:14px 16px 16px;display:grid;gap:3px}
.pr-case-t b{font-size:16px}
.pr-case-t small{font-size:13px;color:var(--muted)}
.pr-case-t i{position:absolute;right:14px;top:50%;translate:0 -50%;width:40px;height:40px;border-radius:50%;background:var(--paper);display:grid;place-items:center;font-style:normal;font-weight:800;transition:background .2s,color .2s}
.pr-case:hover .pr-case-t i{background:var(--ink);color:var(--white)}
.pr-case.more{justify-content:flex-end;gap:8px;padding:22px;background:var(--ink-surface);color:var(--on-dark);border-color:transparent}
.pr-case.more b{font:850 clamp(20px,1.6vw,26px)/1.05 var(--font-display);letter-spacing:-.05em}
.pr-case.more small{font-size:14px;color:rgba(255,255,255,.65)}
.pr-case.more a{margin-top:8px;font-weight:800;color:var(--mint)}
.pr-blog{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.pr-post{display:flex;flex-direction:column;gap:8px;background:var(--white);border:1px solid var(--line);border-radius:var(--r-l);padding:20px 22px;min-height:190px;transition:transform .3s,border-color .3s}
.pr-post:hover{transform:translateY(-4px);border-color:var(--ink)}
.pr-post .mono{color:var(--mint-dark)}
.pr-post b{font:850 clamp(17px,1.25vw,21px)/1.15 var(--font-display);letter-spacing:-.04em}
.pr-post small{font-size:14px;line-height:1.45;color:var(--muted-strong)}
.pr-post i{margin-top:auto;font-style:normal;font-weight:800;color:var(--mint-dark)}
.pr-post.all{background:var(--mint-soft);border-color:transparent}
@media (max-width:1120px){.pr-dev{grid-template-columns:1fr 1fr}.pr-promo{grid-column:1/-1}.pr-cases{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.pr-dev{grid-template-columns:1fr}.pr-promo{grid-template-columns:1fr}.pr-promo-img{height:200px}.pr-promo-img::after{background:linear-gradient(180deg,transparent 50%,#08110f)}
  .pr-cases{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;margin-left:-20px;margin-right:-20px;padding:4px 20px 8px}.pr-case{flex:0 0 78%;scroll-snap-align:start}
  .pr-blog{grid-template-columns:1fr}.pr-row-head{flex-wrap:wrap}}


/* ===== Хаб: три превью → выпадающий раздел ===== */
.hub{padding:clamp(56px,6vw,96px) 0;border-bottom:1px solid var(--line)}
.hub-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.hub-tile{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:12px;text-align:left;font:inherit;color:var(--ink);background:var(--white);border:1px solid var(--line);border-radius:var(--r-xl);padding:clamp(22px,2.2vw,32px);cursor:pointer;min-height:280px;transition:transform .35s cubic-bezier(.2,.7,.2,1),background .35s,border-color .35s,opacity .35s,box-shadow .35s}
.hub-tile h2{margin:0;font:850 clamp(26px,2.3vw,40px)/1 var(--font-display);letter-spacing:-.06em}
.hub-tile h2 em{font-style:normal;color:var(--mint-dark);background:linear-gradient(var(--stroke),var(--stroke)) 0 94%/100% .12em no-repeat}
.hub-tile p{margin:0;font-size:15px;line-height:1.45;color:var(--muted-strong);max-width:34em}
.hub-orb{position:relative;display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--ink);color:var(--acid);margin-top:auto;animation:orb-bob 2.4s ease-in-out infinite}
.hub-tile:nth-child(2) .hub-orb{animation-delay:.4s}.hub-tile:nth-child(3) .hub-orb{animation-delay:.8s}
.hub-orb svg{width:26px;height:26px;position:relative;z-index:1;transition:transform .5s cubic-bezier(.3,1.4,.5,1)}
.hub-orb .ring{position:absolute;inset:0;border-radius:50%;border:2px solid var(--mint);animation:orb-ring 2.4s ease-out infinite}
.hub-orb .r2{animation-delay:1.2s}
.hub-cta{position:absolute;left:calc(clamp(22px,2.2vw,32px) + 78px);bottom:calc(clamp(22px,2.2vw,32px) + 20px);font:500 12px var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted-strong)}
.hub-cta b{font-weight:600}
.hub-tile:hover{transform:translateY(-6px);border-color:var(--ink);box-shadow:0 22px 26px rgba(10,15,14,.1)}
.hub-tile:hover .hub-orb{animation-play-state:paused;transform:scale(1.08)}
.hub-tile:focus-visible{box-shadow:0 0 0 3px var(--paper),0 0 0 5px var(--ink)}
.hub.has-open .hub-tile{opacity:.55}
.hub.has-open .hub-tile:hover{opacity:1}
.hub-tile[aria-selected="true"]{opacity:1!important;background:var(--ink-surface);color:var(--on-dark);border-color:var(--ink-surface);transform:translateY(-6px)}
.hub-tile[aria-selected="true"] p{color:rgba(255,255,255,.7)}
.hub-tile[aria-selected="true"] h2 em{color:var(--mint)}
.hub-tile[aria-selected="true"] .hub-cta{color:rgba(255,255,255,.6)}
.hub-tile[aria-selected="true"] .hub-orb{background:var(--mint);color:#08110f;animation:none}
.hub-tile[aria-selected="true"] .hub-orb .ring{display:none}
.hub-tile[aria-selected="true"] .hub-orb svg{transform:rotate(180deg)}

.hub-stage{position:relative;display:grid;height:0;overflow:hidden;transition:height .6s cubic-bezier(.2,.8,.2,1);perspective:1600px}
.hub-stage.open{overflow:visible}
.hub-notch{position:absolute;top:8px;left:0;width:18px;height:18px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 5px var(--paper),0 0 18px 4px rgba(36,216,188,.55);transform:translateX(var(--nx,0));opacity:0;transition:transform .7s cubic-bezier(.3,1.25,.5,1),opacity .3s;z-index:2}
.hub-notch::after{content:"";position:absolute;inset:0;border-radius:50%;background:inherit;animation:dot-float 3s ease-in-out infinite}
.hub-notch.moving::after{animation:dot-squash .7s cubic-bezier(.3,1.4,.5,1)}
@keyframes dot-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px) scale(1.06,.94)}}
@keyframes dot-squash{0%{transform:none}30%{transform:scale(1.6,.6)}60%{transform:scale(.85,1.2)}100%{transform:none}}
.hub-stage.open .hub-notch{opacity:1}
.hub-panel{grid-area:1/1;align-self:start;padding-top:14px;transform-origin:50% 0;opacity:0;pointer-events:none;transform:rotateX(-70deg) translateY(-30px)}
.hub-panel-in{background:var(--paper);border-top:6px solid var(--ink-surface);border-radius:var(--r-xl);padding:clamp(4px,1vw,12px) 0 0}
.hub-panel:not(.on):not(.off){display:none}
.hub-panel.off{position:absolute;left:0;right:0;top:0}
.hub-panel.on{pointer-events:auto;animation:hub-drop .9s cubic-bezier(.2,1.25,.35,1) forwards}
.hub-panel.off{animation:hub-fold .38s cubic-bezier(.6,0,.8,.3) forwards}
@keyframes hub-drop{0%{opacity:0;transform:rotateX(-70deg) translateY(-30px)}35%{opacity:1}100%{opacity:1;transform:none}}
@keyframes hub-fold{0%{opacity:1;transform:none}100%{opacity:0;transform:rotateX(60deg) translateY(-20px) scale(.97)}}
/* содержимое выпадает каскадом */
.hub-panel.on .svc-card,.hub-panel.on .req-card,.hub-panel.on .bn-stage,.hub-panel.on .bn-card,.hub-panel.on .calc,.hub-panel.on .svc-stats{animation:hub-item .7s cubic-bezier(.2,1.3,.4,1) both}
.hub-panel.on .svc-card:nth-child(2),.hub-panel.on .req-card:nth-child(2),.hub-panel.on .bn-card{animation-delay:.08s}
.hub-panel.on .svc-card:nth-child(3),.hub-panel.on .req-card:nth-child(3){animation-delay:.16s}
.hub-panel.on .svc-card:nth-child(4),.hub-panel.on .req-card:nth-child(4){animation-delay:.24s}
.hub-panel.on .svc-stats,.hub-panel.on .calc{animation-delay:.3s}
@keyframes hub-item{0%{opacity:0;transform:translateY(-40px) rotate(-2deg)}100%{opacity:1;transform:none}}
.hub-panel .bn-grid,.hub-panel .svc-grid,.hub-panel .req-grid{margin-top:14px}
.hub-close{display:none;margin:18px auto 0;font:700 14px var(--font-body);border:1px solid var(--line);background:var(--white);color:var(--ink);border-radius:var(--r-pill);height:44px;padding:0 20px;cursor:pointer;grid-area:2/1;justify-self:center}
.hub-stage.open .hub-close{display:inline-flex;align-items:center;gap:8px}
.hub-close:hover{border-color:var(--ink)}
@media (max-width:1120px){.hub-tiles{grid-template-columns:1fr}.hub-tile{min-height:0;flex-direction:row;flex-wrap:wrap;align-items:center}.hub-tile h2{flex:1 1 100%}.hub-tile p{flex:1 1 60%}.hub-orb{margin:0 0 0 auto;order:3}.hub-cta{position:static;order:4;flex:1 1 100%}.hub-notch{display:none}}


/* ===== Хаб: 4 плитки, плитка калькулятора ===== */
.hub-tiles{grid-template-columns:repeat(4,minmax(0,1fr))!important}
.hub-tile h2{font-size:clamp(22px,1.75vw,34px)!important}
.hub-tile p{font-size:14px}
.calc-tile{background:var(--mint-soft);border-color:transparent}
.calc-tile-num{display:flex;flex-direction:column;gap:2px}
.calc-tile-num b{font:900 clamp(28px,2.3vw,42px)/1 var(--font-display);letter-spacing:-.06em;color:var(--mint-dark);font-variant-numeric:tabular-nums}
.calc-tile-num small{font:500 12px var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted-strong)}
.calc-tile[aria-selected="true"] .calc-tile-num b{color:var(--mint)}
.calc-tile[aria-selected="true"] .calc-tile-num small{color:rgba(255,255,255,.6)}
.hub-panel .calc{margin-top:14px}
.bn-to-calc{display:flex;justify-content:center;margin-top:18px}
.bn-to-calc button{font:800 16px var(--font-body);height:52px;padding:0 26px;border-radius:var(--r-pill);border:0;background:var(--ink);color:var(--white);cursor:pointer;transition:transform .2s}
.bn-to-calc button span{color:var(--mint)}
.bn-to-calc button:hover{transform:translateY(-2px)}
@media (max-width:1500px){.hub-tiles{grid-template-columns:repeat(2,minmax(0,1fr))!important}.hub-tile{min-height:230px}}
@media (max-width:1120px){.hub-tiles{grid-template-columns:1fr!important}.calc-tile-num{flex:1 1 100%;flex-direction:row;align-items:baseline;gap:8px}}

/* ===== Block 10 · FAQ ===== */
.faq{padding:clamp(64px,7vw,104px) 0;border-bottom:1px solid var(--line)}
.faq-grid{display:grid;grid-template-columns:minmax(280px,.75fr) minmax(0,1.6fr);gap:clamp(28px,4vw,72px);align-items:start}
.faq-side{position:sticky;top:96px;display:flex;flex-direction:column;gap:16px}
.faq-side h2{margin:0;font:800 clamp(40px,4.4vw,72px)/.98 var(--font-display);letter-spacing:-.065em}
.faq-side h2 em{font-style:normal;color:var(--mint-dark);background:linear-gradient(var(--stroke),var(--stroke)) 0 94%/100% .12em no-repeat}
.faq-side>p{margin:0;font-size:16px;color:var(--muted-strong)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.faq-search{display:flex;align-items:center;gap:10px;background:var(--white);border:1px solid var(--line);border-radius:var(--r-pill);padding:0 16px;height:52px;transition:border-color .2s}
.faq-search:focus-within{border-color:var(--ink)}
.faq-search svg{width:20px;height:20px;color:var(--muted);flex:none}
.faq-search input{flex:1;min-width:0;border:0;background:none;font:500 16px var(--font-body);color:var(--ink);outline:none}
.faq-search input:focus-visible{box-shadow:none}
.faq-cats{display:flex;flex-wrap:wrap;gap:6px}
.faq-cat{display:inline-flex;align-items:center;gap:8px;font:700 14px var(--font-body);border:1px solid var(--line);background:transparent;color:var(--ink);border-radius:var(--r-pill);height:42px;padding:0 8px 0 16px;cursor:pointer;transition:background .2s,border-color .2s}
.faq-cat i{font:600 12px/1 var(--font-mono);font-style:normal;display:grid;place-items:center;min-width:26px;height:26px;border-radius:13px;background:var(--paper-2)}
.faq-cat:hover{border-color:var(--ink)}
.faq-cat[aria-pressed="true"]{background:var(--ink);color:var(--white);border-color:var(--ink)}
.faq-cat[aria-pressed="true"] i{background:var(--mint);color:#08110f}
.faq-fish{position:relative;height:110px;margin-top:6px;overflow:hidden;pointer-events:none}
.faq-fish .pg-fish{position:absolute;left:0;top:30px;animation:faq-swim 16s ease-in-out infinite alternate}
@keyframes faq-swim{0%{transform:translate(0,0) scaleX(-1)}45%{transform:translate(200px,-14px) scaleX(-1)}50%{transform:translate(210px,-8px) scaleX(1)}95%{transform:translate(10px,10px) scaleX(1)}100%{transform:translate(0,0) scaleX(-1)}}
.faq-list{display:flex;flex-direction:column}
.faq-item{border-top:1px solid var(--line)}
.faq-item:last-of-type{border-bottom:1px solid var(--line)}
.faq-item h3{margin:0}
.faq-q{width:100%;display:grid;grid-template-columns:18px 1fr 36px;align-items:center;gap:14px;text-align:left;background:none;border:0;padding:20px 0;cursor:pointer;color:var(--ink);font:850 clamp(17px,1.35vw,22px)/1.2 var(--font-display);letter-spacing:-.04em}
.faq-q:focus-visible{box-shadow:none;outline:2px solid var(--ink);outline-offset:4px;border-radius:8px}
.faq-dot{width:10px;height:10px;border-radius:50%;background:var(--line);justify-self:center;transition:background .3s,transform .4s cubic-bezier(.3,1.5,.5,1),box-shadow .3s}
.faq-q:hover .faq-dot{background:var(--mint);transform:scale(1.3)}
.faq-q[aria-expanded="true"] .faq-dot{background:var(--mint);box-shadow:0 0 12px rgba(36,216,188,.7);transform:translateY(6px) scale(1.2)}
.faq-pm{position:relative;width:36px;height:36px;border-radius:50%;border:1px solid var(--line);transition:background .3s,border-color .3s,transform .4s}
.faq-pm::before,.faq-pm::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:2px;margin:-1px 0 0 -6px;background:currentColor;border-radius:1px;transition:transform .35s}
.faq-pm::after{transform:rotate(90deg)}
.faq-q:hover .faq-pm{border-color:var(--ink)}
.faq-q[aria-expanded="true"] .faq-pm{background:var(--ink);color:var(--white);border-color:var(--ink);transform:rotate(180deg)}
.faq-q[aria-expanded="true"] .faq-pm::after{transform:rotate(0)}
.faq-a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .45s cubic-bezier(.2,.7,.2,1)}
.faq-a.open{grid-template-rows:1fr}
.faq-a-in{overflow:hidden;padding-left:32px;padding-right:50px}
.faq-a-in>p{margin:0 0 6px;font-size:16px;line-height:1.55;color:var(--muted-strong);max-width:44em}
.faq-a.open .faq-a-in{padding-bottom:20px}
.faq-links{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.faq-link{font:700 14px var(--font-body);color:var(--ink);background:var(--mint-soft);border:0;border-radius:var(--r-pill);padding:9px 14px;cursor:pointer;transition:background .2s}
.faq-link:hover{background:var(--mint)}
.faq-item.hide{display:none}
.faq-missing{font-size:14px!important}
.faq-empty{margin:20px 0;color:var(--muted-strong)}
.faq-more{margin-top:28px;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;background:var(--ink-surface);color:var(--on-dark);border-radius:var(--r-l);padding:22px 24px}
.faq-more b{display:block;font:850 22px/1.05 var(--font-display);letter-spacing:-.05em}
.faq-more small{display:block;margin-top:6px;font-size:14px;color:rgba(255,255,255,.65)}
.faq-more-act{display:flex;gap:8px;flex-wrap:wrap}
.faq-more .btn-main{background:var(--mint);color:#08110f;border-color:var(--mint)}
.faq-more .btn-main .arr{color:#08110f}
.faq-more .btn:not(.btn-main){color:var(--on-dark);border-color:var(--line-dark)}
mark.hl{background:var(--mint-soft);color:inherit;border-radius:3px;padding:0 2px}
@media (max-width:900px){.faq-grid{grid-template-columns:1fr}.faq-side{position:static}.faq-fish{display:none}}
@media (max-width:620px){.faq-a-in{padding-left:0;padding-right:0}.faq-q{grid-template-columns:14px 1fr 32px;gap:10px}.faq-pm{width:32px;height:32px}}


/* ===== Оголовок: сравнение и лайтбокс ===== */
.pr-cmp{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:12px;align-items:stretch;margin:-20px 0 clamp(32px,3.4vw,52px)}
.pr-cmp-side{border-radius:var(--r-xl);padding:clamp(18px,1.8vw,26px);display:flex;flex-direction:column;gap:14px}
.pr-cmp-side.bad{background:var(--white);border:1px dashed var(--line)}
.pr-cmp-side.good{background:var(--mint-soft)}
.pr-cmp-tag{display:inline-block;font:600 12px/1 var(--font-mono);letter-spacing:.08em;text-transform:uppercase;border-radius:var(--r-pill);padding:7px 11px}
.bad .pr-cmp-tag{background:#ffe3d8;color:#8a3416}
.good .pr-cmp-tag{background:var(--ink);color:var(--mint)}
.pr-cmp-h p{margin:10px 0 0;font-size:15px;color:var(--muted-strong)}
.pr-cmp-ph{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.pr-ph{padding:0;border:0;border-radius:var(--r-m);overflow:hidden;aspect-ratio:4/5;cursor:zoom-in;background:var(--paper-2)}
.pr-ph img{width:100%;height:100%;object-fit:cover;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.pr-ph:hover img{transform:scale(1.07)}
.bad .pr-ph img{filter:saturate(.8)}
.pr-cmp-vs{align-self:center;display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--ink);color:var(--acid);font:900 18px var(--font-display);letter-spacing:-.04em}
.lightbox{padding:0;border:0;background:transparent;max-width:min(92vw,720px);max-height:92dvh}
.lightbox::backdrop{background:rgba(8,17,15,.85);backdrop-filter:blur(6px)}
.lightbox img{display:block;max-width:100%;max-height:92dvh;border-radius:var(--r-l)}
.lightbox .close{position:absolute;right:10px;top:10px}
@media (max-width:900px){.pr-cmp{grid-template-columns:1fr;margin-top:0}.pr-cmp-vs{justify-self:center;margin:-22px 0;z-index:1}}

/* ===== Иглобрюх в FAQ: нажатие — надувается ===== */
.faq-fish{pointer-events:auto;height:190px}
.faq-fish .pg-fish{cursor:pointer;width:82px;height:62px;top:44px}
.faq-fish .pg-body{background:var(--fish,var(--acid));transition:inset .35s cubic-bezier(.3,1.6,.5,1),border-radius .35s,background .35s}
.faq-fish .pg-fish.puffed .pg-body{inset:-26px -14px;border-radius:50%}
.faq-fish .pg-fish.puffed .pg-body i{opacity:1}
.faq-fish .pg-fish.puffed{animation-play-state:paused}
.faq-fish-hint{position:absolute;left:0;bottom:0;font:500 12px var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
@media (max-width:900px){.faq-fish{display:block!important;height:120px}}

/* ===== Подвал-ёмкость ===== */
.tank-footer{padding:clamp(24px,3vw,48px) var(--gutter) clamp(20px,2vw,32px)}
.tank-footer .wrap{padding:0}
.tank{position:relative;overflow:hidden;border:3px solid var(--ink);border-radius:clamp(28px,3vw,48px);background:#0a1411;color:#fff;isolation:isolate}
:root[data-theme="dark"] .tank{border-color:var(--line)}
.tank-water{position:absolute;left:0;right:0;bottom:0;height:var(--lvl,8%);background:linear-gradient(180deg,rgba(36,216,188,.38) 0%,rgba(18,140,120,.42) 40%,rgba(8,70,60,.55) 100%);transition:height 1.4s cubic-bezier(.2,.7,.2,1);z-index:-1}
.tank-wave{position:absolute;left:0;width:200%;height:34px;top:-28px;fill:rgba(36,216,188,.38);animation:tank-wave 7s linear infinite}
.tank-wave.w2{fill:rgba(36,216,188,.22);top:-22px;animation-duration:11s;animation-direction:reverse}
.tank-water::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:var(--mint);box-shadow:0 0 18px 2px rgba(36,216,188,.6);opacity:.8}
@keyframes tank-wave{to{transform:translateX(-50%)}}
.bub{position:absolute;bottom:0;left:var(--x);width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.55);animation:bub var(--d) linear var(--dl) infinite;opacity:0}
@keyframes bub{0%{transform:translateY(0) scale(.6);opacity:0}15%{opacity:.8}100%{transform:translateY(-320px) scale(1.2);opacity:0}}
.tank-scale{position:absolute;right:clamp(14px,1.6vw,26px);top:0;bottom:0;margin:0;padding:0;list-style:none;display:flex;flex-direction:column;justify-content:space-around;pointer-events:none;z-index:0}
.tank-scale li{display:flex;align-items:center;gap:8px;font:500 12px var(--font-mono);color:rgba(255,255,255,.45)}
.tank-scale li::before{content:"";width:22px;height:1px;background:rgba(255,255,255,.35)}
.tank-in{position:relative;padding:clamp(32px,3.6vw,56px) clamp(72px,7vw,120px) clamp(22px,2.4vw,32px) clamp(24px,3.6vw,56px);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2.2fr);gap:clamp(24px,4vw,72px)}
.tank-footer .brand{color:#fff;font-size:clamp(26px,2.3vw,36px)}
.tank-footer .brand span{color:var(--mint)}
.footer-brand p{margin:18px 0 0;font:850 clamp(18px,1.5vw,24px)/1.1 var(--font-display);letter-spacing:-.05em;color:rgba(255,255,255,.75);max-width:16em}
.footer-columns{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.footer-columns>div{display:flex;flex-direction:column;gap:9px}
.footer-columns b{font-weight:800;margin-bottom:6px}
.footer-columns a,.footer-columns span{font-size:15px;color:rgba(255,255,255,.75);transition:color .2s}
.footer-columns span{color:rgba(255,255,255,.5);font-size:13px;margin-top:4px}
.footer-columns a:hover{color:var(--mint)}
.footer-socials{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.footer-socials a{border:1px solid var(--line-dark);border-radius:var(--r-pill);padding:9px 14px;font-size:14px}
.footer-socials a:hover{border-color:var(--mint)}
.footer-bottom{grid-column:1/-1;display:flex;align-items:center;gap:10px 24px;flex-wrap:wrap;padding-top:22px;border-top:1px solid var(--line-dark);font-size:13px;color:rgba(255,255,255,.55)}
.footer-bottom a{color:rgba(255,255,255,.75)}
.footer-bottom a:hover{color:var(--mint)}
.to-top{margin-left:auto;display:inline-flex;align-items:center;gap:10px;height:52px;padding:0 20px 0 6px;border-radius:var(--r-pill);border:0;background:#fff;color:#08110f;font:800 15px var(--font-body);cursor:pointer;transition:transform .25s}
.to-top svg{width:40px;height:40px;padding:9px;border-radius:50%;background:var(--mint);transition:transform .35s cubic-bezier(.3,1.6,.5,1)}
.to-top:hover{transform:translateY(-3px)}
.to-top:hover svg{transform:translateY(-3px)}
.to-top:focus-visible{box-shadow:0 0 0 3px #0a1411,0 0 0 5px var(--mint)}
@media (max-width:1120px){.tank-in{grid-template-columns:1fr}}
@media (max-width:620px){.footer-columns{grid-template-columns:1fr 1fr}.footer-columns>div:last-child{grid-column:1/-1}.tank-in{padding:28px 56px 22px 22px}.to-top{margin-left:0;width:100%;justify-content:center}.tank-scale li{font-size:12px}.tank-scale li::before{width:12px}}


/* ===== Block 11 · Следующий шаг ===== */
.next{padding:clamp(56px,6vw,96px) 0 clamp(24px,3vw,40px)}
.next-box{background:var(--ink-surface);color:var(--on-dark);border-radius:var(--r-xl);padding:clamp(28px,3.4vw,56px)}
:root[data-theme="dark"] .next-box{box-shadow:inset 0 0 0 1px var(--line-dark)}
.next-head{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(20px,4vw,60px);align-items:end}
.next-head h2{margin:0;font:800 clamp(38px,4.6vw,76px)/.98 var(--font-display);letter-spacing:-.065em}
.next-head h2 em{font-style:normal;color:var(--mint)}
.next-head p{margin:0;font-size:clamp(16px,1.15vw,19px);color:rgba(255,255,255,.7)}
.next-path{list-style:none;margin:clamp(28px,3vw,44px) 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));position:relative}
.next-path::before{content:"";position:absolute;left:9px;right:9px;top:8px;height:2px;background:linear-gradient(90deg,var(--mint),rgba(36,216,188,.2))}
.next-path li{position:relative;display:flex;flex-direction:column;gap:4px;padding-right:12px}
.next-path i{width:18px;height:18px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 5px var(--ink-surface),0 0 16px 3px rgba(36,216,188,.5);margin-bottom:14px}
.next-path li:last-child i{background:var(--acid);box-shadow:0 0 0 5px var(--ink-surface),0 0 18px 4px rgba(217,255,67,.5)}
.next-path b{font:850 clamp(18px,1.5vw,24px)/1 var(--font-display);letter-spacing:-.05em}
.next-path small{font-size:14px;color:rgba(255,255,255,.6)}
.next-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.next-card{position:relative;display:flex;flex-direction:column;gap:8px;text-align:left;font:inherit;color:var(--on-dark);background:rgba(255,255,255,.04);border:1px solid var(--line-dark);border-radius:var(--r-l);padding:22px 64px 22px 22px;cursor:pointer;min-height:160px;transition:transform .3s,border-color .3s,background .3s}
.next-card:hover{transform:translateY(-4px);border-color:var(--mint)}
.next-card .mono{color:rgba(255,255,255,.55)}
.next-card b{font:850 clamp(19px,1.5vw,24px)/1.05 var(--font-display);letter-spacing:-.05em}
.next-card small{font-size:14px;line-height:1.45;color:rgba(255,255,255,.65)}
.next-card i{position:absolute;right:18px;bottom:18px;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font-style:normal;font-weight:800;background:rgba(255,255,255,.08);transition:transform .3s,background .3s}
.next-card:hover i{transform:translateX(3px);background:var(--mint);color:#08110f}
.next-card.main{background:var(--acid);border-color:var(--acid);color:#08110f}
.next-card.main .mono,.next-card.main small{color:#2c3b36}
.next-card.main i{background:#08110f;color:var(--acid)}
.next-card.main:hover i{background:#08110f;color:var(--acid)}
.next-card:focus-visible{box-shadow:0 0 0 3px var(--ink-surface),0 0 0 5px var(--mint)}
.next-more{display:flex;flex-wrap:wrap;align-items:center;gap:8px 18px;margin-top:22px;padding-top:18px;border-top:1px solid var(--line-dark)}
.next-more .mono{color:rgba(255,255,255,.5)}
.next-more a{display:inline-flex;align-items:center;min-height:44px;font-weight:700;color:var(--on-dark);border-bottom:1px solid rgba(255,255,255,.25)}
.next-more a:hover{color:var(--mint);border-color:var(--mint)}
@media (max-width:900px){.next-head{grid-template-columns:1fr}.next-cards{grid-template-columns:1fr}.next-path{grid-template-columns:1fr 1fr;row-gap:22px}.next-path::before{display:none}}

/* ===== FAQ «Показать ещё» ===== */
.faq-more-btn{margin:16px 0 0;align-self:flex-start;font:700 15px var(--font-body);min-height:48px;padding:0 20px;border-radius:var(--r-pill);border:1px solid var(--ink);background:transparent;color:var(--ink);cursor:pointer}
.faq-more-btn:hover{background:var(--ink);color:var(--white)}
.faq-more-btn[hidden]{display:none}

/* ===== Форма: согласие и результат ===== */
.fld-consent{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--muted-strong);cursor:pointer}
.fld-consent input{width:22px;height:22px;flex:none;margin:0;accent-color:#08110f}
.fld-consent a{color:var(--ink);text-decoration:underline}
.lead-ok-act{display:flex;flex-wrap:wrap;gap:8px}
.lead-submit:disabled{opacity:.6;cursor:progress}

/* ===== Доступность: цели нажатия от 44 px, мелкий мятный текст — тёмный ===== */
.alt{height:44px}.flt,.bn-shuffle{height:44px}.tab{height:44px}.route-btn{height:44px}
.faq-link{min-height:44px;display:inline-flex;align-items:center}
.req-links a{display:inline-flex;align-items:center;min-height:44px;border-bottom:0;text-decoration:underline;text-underline-offset:4px}
.brand{display:inline-flex;align-items:center;min-height:44px}
.nav a{display:inline-flex;align-items:center;min-height:44px;padding-top:0;padding-bottom:0}
.pr-case.more a{display:inline-flex;align-items:center;min-height:44px}
.node-num{color:var(--ink)}
.v-price,.node-vars button[aria-pressed="true"] .v-price::before{color:var(--ink)}
.diy{color:var(--ink)}
.bn-cat,.pr-post .mono{color:var(--muted-strong)}
.req-links a,.req-alt{color:var(--ink)}
.pr-post i{color:var(--ink)}
.fld i,.fld-hint i{color:var(--ink)}
:root[data-theme="dark"] .node-num{color:var(--mint)}

/* ===== Спокойнее: фоновые анимации только когда блок на экране и не бесконечно ===== */
.hub-orb,.hub-orb .ring{animation-iteration-count:3!important;animation-play-state:paused}
.hub.play .hub-orb,.hub.play .hub-orb .ring{animation-play-state:running}
.node:not(:last-child)::after{animation:none}
.arch-panel:hover .node:not(:last-child)::after{animation:flow 2.4s ease-in-out infinite}
.arch-hint i{animation:none}
.cloud .tag{animation-play-state:paused}
.cloud.live .tag{animation-play-state:running}
.faq-fish .pg-fish{animation-play-state:paused}
.faq.live .faq-fish .pg-fish{animation-play-state:running}
.tank-wave,.bub{animation-play-state:paused}
.tank.live .tank-wave,.tank.live .bub{animation-play-state:running}

@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ===== Общие правки главной и страниц систем (08.10): видимость без анимации, синяя LAB, вода в подвале ===== */
/* ===== Плитки-раскрывашки: панель видна и без анимации (на iPhone с «Уменьшением движения» была пустой), плавное 2D-появление ===== */
.hub-stage{perspective:none}
.hub-panel.on{opacity:1;transform:none;animation:hubIn .5s cubic-bezier(.2,.8,.2,1) both}
.hub-panel.off{animation:hubOut .25s ease-in forwards}
@keyframes hubIn{from{opacity:0;transform:translateY(-14px)}to{opacity:1;transform:none}}
@keyframes hubOut{from{opacity:1;transform:none}to{opacity:0;transform:translateY(-10px)}}
.hub-panel.on .svc-card,.hub-panel.on .req-card,.hub-panel.on .bn-stage,.hub-panel.on .bn-card,.hub-panel.on .calc,.hub-panel.on .svc-stats{animation-name:hubIn}

/* ===== Подвал-ёмкость: волна всегда движется — медленно, в том числе при «Уменьшении движения» ===== */
@media (prefers-reduced-motion:reduce){
  .tank.live .tank-wave{animation:tank-wave 26s linear infinite!important}
  .tank.live .tank-wave.w2{animation:tank-wave 38s linear infinite reverse!important}
  .tank-water{transition:height 2.4s ease!important}
}

/* ===== LAB в шапке — синяя (Иван 08.10) ===== */
.site-header .lab{background:var(--blue);color:#fff}
.site-header .lab i{background:#fff;color:var(--blue)}
.site-header .lab:hover{background:color-mix(in srgb,var(--blue) 86%,#000)}
.mmenu-panel a.lab-link{background:var(--blue);color:#fff}
.mmenu-panel a.lab-link::after{color:#fff}
@media (max-width:620px){.site-header .lab i{background:var(--blue);color:#fff}}

/* ===== Общие шапка (телефон) и подвал с LAB / ATLAS / CTRL — для всех страниц ===== */
/* ===== Телефон: шапка и меню не выходят за экран ===== */
@media (max-width:620px){
  .mmenu-panel{position:fixed;left:12px;right:12px;top:calc(64px + env(safe-area-inset-top,0px));width:auto;max-height:calc(100dvh - 90px);overflow-y:auto}
}
@media (max-width:400px){
  .site-header .wrap{gap:8px}
  .brand{font-size:19px}
  .mmenu summary{padding:0 12px;gap:6px}
  .theme-btn{width:40px;height:40px}
}
/* ===== Подвал: свои цвета у лаборатории (синий) и Атласа воды (тёмный + зелёный градиент + сталь) ===== */
:is(.footer-columns,.footer-services) a.f-lab,:is(.footer-columns,.footer-services) a.f-atlas{align-self:flex-start;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px 0 6px;border-radius:999px;font-weight:800;color:#fff}
:is(.footer-columns,.footer-services) a.f-lab i,:is(.footer-columns,.footer-services) a.f-atlas i{font:600 11.5px/1 var(--font-mono);font-style:normal;letter-spacing:.08em;display:grid;place-items:center;height:32px;padding:0 9px;border-radius:999px}
:is(.footer-columns,.footer-services) a.f-lab{background:var(--blue);box-shadow:0 8px 24px color-mix(in srgb,var(--blue) 40%,transparent)}
:is(.footer-columns,.footer-services) a.f-lab i{background:#fff;color:var(--blue)}
:is(.footer-columns,.footer-services) a.f-lab:hover{color:#fff;background:color-mix(in srgb,var(--blue) 85%,#fff)}
:is(.footer-columns,.footer-services) a.f-atlas{position:relative;overflow:hidden;border:1.5px solid transparent;background:linear-gradient(#0a1311,#0a1311) padding-box,linear-gradient(100deg,var(--mint),var(--acid) 55%,#c9d2d8) border-box}
:is(.footer-columns,.footer-services) a.f-atlas i{background:linear-gradient(100deg,var(--mint),var(--acid));color:#08110f}
:is(.footer-columns,.footer-services) a.f-atlas::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(220,230,236,.35) 48%,transparent 60%);transform:translateX(-120%);animation:fAtlas 4.5s ease-in-out infinite;pointer-events:none}
:is(.footer-columns,.footer-services) a.f-atlas:hover{color:#fff;box-shadow:0 8px 24px rgba(36,216,188,.25)}
@keyframes fAtlas{0%,55%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
@media (prefers-reduced-motion:reduce){:is(.footer-columns,.footer-services) a.f-atlas::after{animation:none}}
/* Control: пока только кнопка на портал (Иван 08.10 13:07, вариант «Тумблер»); свой дизайн — потом */
:is(.footer-columns,.footer-services) a.f-ctrl{align-self:flex-start;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px 0 6px;border-radius:999px;font-weight:800;background:#e9ebe6;color:#13201c}
:is(.footer-columns,.footer-services) a.f-ctrl i{font:600 11.5px/1 var(--font-mono);font-style:normal;letter-spacing:.08em;display:grid;place-items:center;height:32px;padding:0 9px;border-radius:999px;background:#13201c;color:var(--mint)}
:is(.footer-columns,.footer-services) a.f-ctrl:hover{color:#13201c;background:#fff}
:is(.footer-columns,.footer-services) a.f-lab,:is(.footer-columns,.footer-services) a.f-atlas,:is(.footer-columns,.footer-services) a.f-ctrl{white-space:nowrap}
@media (max-width:620px){.footer-columns>div:first-child{grid-column:1/-1}}

/* ===== Разделы osmos.guru — LAB, ATLAS, JOURNAL, CTRL (+ конструктор КП): у ссылок на них везде свои цвета и метка (Иван 10.10).
   Цвет определяется адресом ссылки, классы не нужны: новая ссылка на /analiz-vody/ сама станет «LAB». Свои ссылки блога не помечаются (body.osmos-blog). */
a:where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"]){--sec:var(--blue);--sec-bg:var(--blue);--sec-ink:#fff;--sec-chip:#fff;--sec-chip-ink:var(--blue);--sec-tag:"LAB"}
a:where([href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"]){--sec:#14b89e;--sec-bg:linear-gradient(100deg,var(--mint),var(--acid));--sec-ink:#08110f;--sec-chip:#0a1311;--sec-chip-ink:var(--acid);--sec-tag:"ATLAS"}
a:where([href^="https://blog.osmos.guru"]:not(.osmos-blog *)){--sec:var(--orange);--sec-bg:var(--orange);--sec-ink:#08110f;--sec-chip:#08110f;--sec-chip-ink:var(--orange);--sec-tag:"JOURNAL"}
a:where([href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"]){--sec:#13201c;--sec-bg:#13201c;--sec-ink:#fff;--sec-chip:var(--mint);--sec-chip-ink:#13201c;--sec-tag:"CTRL"}
a:where([href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"]){--sec:#8aa800;--sec-bg:var(--acid);--sec-ink:#08110f;--sec-chip:#08110f;--sec-chip-ink:var(--acid);--sec-tag:"OFFER"}
[data-theme="dark"] a:where([href^="https://control.osmos.guru"]){--sec:var(--mint);--sec-bg:#e9ebe6;--sec-ink:#13201c;--sec-chip:#13201c;--sec-chip-ink:var(--mint)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) a:where([href^="https://control.osmos.guru"]){--sec:var(--mint);--sec-bg:#e9ebe6;--sec-ink:#13201c;--sec-chip:#13201c;--sec-chip-ink:var(--mint)}}
/* текст: подчёркивание цветом раздела и метка */
:is(p,li,td,dd,figcaption,blockquote,.jr-prose) a:not([class]):where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"],[href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"],[href^="https://blog.osmos.guru"]:not(.osmos-blog *),[href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"]){color:color-mix(in srgb,var(--sec) 78%,var(--ink));text-decoration:underline;text-decoration-color:var(--sec);text-decoration-thickness:2px;text-underline-offset:3px}
:is(p,li,td,dd,figcaption,blockquote,.jr-prose) a:not([class]):where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"],[href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"],[href^="https://blog.osmos.guru"]:not(.osmos-blog *),[href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"]):hover{text-decoration-thickness:3px}
:is(p,li,td,dd,figcaption,blockquote,.jr-prose) a:not([class]):where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"],[href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"],[href^="https://blog.osmos.guru"]:not(.osmos-blog *),[href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"])::before,.btn:where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"],[href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"],[href^="https://blog.osmos.guru"]:not(.osmos-blog *),[href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"])::before,.s-btn:where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"],[href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"],[href^="https://blog.osmos.guru"]:not(.osmos-blog *),[href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"])::before,.faq-link:where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"],[href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"],[href^="https://blog.osmos.guru"]:not(.osmos-blog *),[href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"])::before,.btn-text:where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"],[href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"],[href^="https://blog.osmos.guru"]:not(.osmos-blog *),[href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"])::before{content:var(--sec-tag);display:inline-block;flex:none;font:600 10px/1 var(--font-mono);font-style:normal;letter-spacing:.07em;text-decoration:none;padding:4px 7px;margin-right:6px;border-radius:999px;background:var(--sec-bg);color:var(--sec-ink);vertical-align:2px}
/* навигация и подвал: точка цвета раздела */
.nav a:where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"],[href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"],[href^="https://blog.osmos.guru"]:not(.osmos-blog *),[href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"])::before,.mmenu-panel a:not(.lab-link):where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"],[href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"],[href^="https://blog.osmos.guru"]:not(.osmos-blog *),[href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"])::before,:is(.footer-columns,.footer-services) a:not([class]):where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"],[href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"],[href^="https://blog.osmos.guru"]:not(.osmos-blog *),[href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"])::before,.footer-links a:where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"],[href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"],[href^="https://blog.osmos.guru"]:not(.osmos-blog *),[href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"])::before{content:"";display:inline-block;flex:none;width:9px;height:9px;margin-right:7px;border-radius:50%;background:var(--sec-bg);vertical-align:1px}
.mmenu-panel a:not(.lab-link):where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"],[href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"],[href^="https://blog.osmos.guru"]:not(.osmos-blog *),[href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"]){justify-content:flex-start}
.mmenu-panel a:not(.lab-link):where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"],[href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"],[href^="https://blog.osmos.guru"]:not(.osmos-blog *),[href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"])::after{margin-left:auto}
/* главная кнопка — заливка цветом раздела, обычная — обводка */
.btn-main:where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"],[href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"],[href^="https://blog.osmos.guru"]:not(.osmos-blog *),[href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"]){background:var(--sec-bg);color:var(--sec-ink);border-color:transparent}
.btn-main:where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"],[href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"],[href^="https://blog.osmos.guru"]:not(.osmos-blog *),[href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"]) .arr{color:inherit}
.btn-main:where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"],[href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"],[href^="https://blog.osmos.guru"]:not(.osmos-blog *),[href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"])::before{background:var(--sec-chip);color:var(--sec-chip-ink)}
.btn:not(.btn-main):where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"],[href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"],[href^="https://blog.osmos.guru"]:not(.osmos-blog *),[href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"]),.s-btn:where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"],[href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"],[href^="https://blog.osmos.guru"]:not(.osmos-blog *),[href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"]){border-color:var(--sec);box-shadow:inset 0 0 0 .5px var(--sec)}
.faq-link:where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"],[href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"],[href^="https://blog.osmos.guru"]:not(.osmos-blog *),[href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"]){background:color-mix(in srgb,var(--sec) 14%,transparent)}
.faq-link:where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"],[href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"],[href^="https://blog.osmos.guru"]:not(.osmos-blog *),[href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"]):hover{background:color-mix(in srgb,var(--sec) 26%,transparent)}
/* карточки: метка в углу, при наведении — цвет раздела */
.next-card:where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"],[href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"],[href^="https://blog.osmos.guru"]:not(.osmos-blog *),[href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"])::after,.pr-post:where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"],[href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"],[href^="https://blog.osmos.guru"]:not(.osmos-blog *),[href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"])::after{content:var(--sec-tag);position:absolute;top:16px;right:16px;font:600 10px/1 var(--font-mono);letter-spacing:.07em;padding:5px 8px;border-radius:999px;background:var(--sec-bg);color:var(--sec-ink)}
.pr-post:where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"],[href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"],[href^="https://blog.osmos.guru"]:not(.osmos-blog *),[href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"]){position:relative}
.next-card:where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"],[href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"],[href^="https://blog.osmos.guru"]:not(.osmos-blog *),[href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"]):hover,.pr-post:where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"],[href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"],[href^="https://blog.osmos.guru"]:not(.osmos-blog *),[href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"]):hover,.kb-post:where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"],[href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"],[href^="https://blog.osmos.guru"]:not(.osmos-blog *),[href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"]):hover{border-color:var(--sec)}
.next-card:where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"],[href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"],[href^="https://blog.osmos.guru"]:not(.osmos-blog *),[href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"]):hover i{background:var(--sec-bg);color:var(--sec-ink)}
.pr-post:where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"],[href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"],[href^="https://blog.osmos.guru"]:not(.osmos-blog *),[href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"]) .mono,.pr-post:where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"],[href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"],[href^="https://blog.osmos.guru"]:not(.osmos-blog *),[href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"]) i,.kb-post:where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"],[href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"],[href^="https://blog.osmos.guru"]:not(.osmos-blog *),[href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"]) i{color:var(--sec)}
/* подвал: «Сервисы» — LAB, ATLAS, CTRL и конструктор КП отдельной группой под логотипом (Иван 10.10) */
.footer-services{display:flex;flex-direction:column;gap:9px;margin-top:clamp(22px,2.6vw,34px)}
.footer-services b{font-weight:800;margin-bottom:6px}
.footer-services a{font-size:15px;color:rgba(255,255,255,.75);transition:color .2s}
.footer-services a:hover{color:var(--mint)}
.footer-services a:not([class]){margin-top:2px}
/* подвал: блог и конструктор КП — спокойно: жирный шрифт и точка цвета раздела (Иван 10.10: без «ёлки») */
:is(.footer-columns,.footer-services) a:not([class]):where([href^="/analiz-vody"],[href^="https://osmos.guru/analiz-vody"],[href^="/karta-vody"],[href^="https://osmos.guru/karta-vody"],[href^="https://blog.osmos.guru"]:not(.osmos-blog *),[href^="https://control.osmos.guru"],[href^="/konstruktor-kp"],[href^="https://osmos.guru/konstruktor-kp"]){font-weight:700;color:#fff}
:is(.footer-columns,.footer-services) a:not([class]):where([href^="https://control.osmos.guru"])::before{background:var(--mint)}

/* ссылка «К содержимому» для клавиатуры — общая */
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--ink);color:var(--white);padding:12px 16px;border-radius:var(--r-pill);font-weight:800}
.skip:focus{top:12px}
.footer-bottom .f-legal{flex-basis:100%;order:5;font-size:12.5px;line-height:1.45;color:rgba(255,255,255,.5);max-width:72em}

/* ===== Страницы 02–07 на этом же шаблоне: метки незаполненного (08.10, решение Ивана; с 09.10 с префиксом gap-, чтобы не ломать .need на главной) =====
   .gap-need  — индивидуальный текст/данные: «требует заполнения»
   .gap-stars — нужна цифра: «***»
   .gap-chk   — значение есть, но источники расходятся или его надо подтвердить: «сверить»
   .gap-stub  — заглушка вместо фото */
.gap-need{display:inline-flex;align-items:center;padding:2px 9px;border-radius:999px;border:1px dashed var(--orange);color:#a8401c;background:color-mix(in srgb,var(--orange) 10%,transparent);font:600 12px/1.6 var(--font-mono);letter-spacing:.02em;text-transform:none;white-space:nowrap;vertical-align:middle}
.gap-stars{display:inline-block;padding:0 6px;border-radius:6px;border:1px dashed var(--orange);color:#a8401c;background:color-mix(in srgb,var(--orange) 10%,transparent);font-family:var(--font-mono);letter-spacing:.12em;line-height:1.15}
.gap-chk{display:inline-flex;align-items:center;margin-left:6px;padding:1px 8px;border-radius:999px;border:1px dashed var(--blue);color:var(--blue);background:color-mix(in srgb,var(--blue) 8%,transparent);font:600 11px/1.6 var(--font-mono);font-style:normal;letter-spacing:.02em;white-space:nowrap;vertical-align:middle;cursor:help}
:root[data-theme="dark"] .gap-need,:root[data-theme="dark"] .gap-stars{color:#ffb08f}
:root[data-theme="dark"] .gap-chk{color:#9aa8ff;border-color:#9aa8ff}
.gap-stub{position:absolute;inset:0;display:grid;place-content:center;gap:4px;text-align:center;border:1.5px dashed var(--line);border-radius:var(--r-l,18px);background:repeating-linear-gradient(135deg,transparent 0 10px,color-mix(in srgb,var(--ink) 4%,transparent) 10px 11px);color:var(--muted-strong);z-index:1}
.gap-stub b{font:700 12px var(--font-mono);letter-spacing:.08em;text-transform:uppercase;color:#a8401c}
:root[data-theme="dark"] .gap-stub b{color:#ffb08f}
.gap-stub small{font-size:13px}
.hero-media .gap-stub{position:relative;min-height:320px;height:100%}
.node-vars-need{margin:8px 0 0;font-size:13px;color:var(--muted-strong)}
.svc-stats .stat b .gap-stars,.stat b .gap-stars{font-size:.8em}
@media (min-width:1121px){.hub-tiles.n3{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
.hero-media.is-map{background:#fff}
.hero-media.is-map img{object-fit:contain;padding:10px}
@media (max-width:900px){.hero-media.is-map{aspect-ratio:16/10}}
.hero-media figcaption{position:absolute;left:12px;bottom:12px;z-index:2;padding:6px 12px;border-radius:999px;background:rgba(8,17,15,.72);color:#fff;font:600 12.5px var(--font-body)}
.pp-svc-note{margin:0 0 14px;max-width:62ch;font-size:15px;line-height:1.45;color:var(--muted-strong)}

/* ===== Шапка: четыре инструмента osmos.guru — LAB, ATLAS, OFFER, CTRL (Иван 11.10, вариант A) =====
   ≥1520 px — метка + название; 901–1519 — только метки (название в подсказке); ≤900 — только LAB, остальные в меню. */
.tools{display:flex;gap:6px;flex:none}
.tl{display:inline-flex;align-items:center;gap:8px;height:44px;border-radius:var(--r-pill);padding:0 14px 0 5px;font:800 13px/1 var(--font-body);white-space:nowrap;transition:transform .2s}
.tl:hover{transform:translateY(-1px)}
.tl i{font:600 10.5px/1 var(--font-mono);font-style:normal;letter-spacing:.07em;border-radius:var(--r-pill);height:34px;padding:0 9px;display:grid;place-items:center}
.tl-lab{background:var(--blue);color:#fff}.tl-lab i{background:#fff;color:var(--blue)}
.tl-atlas{border:1.5px solid transparent;background:linear-gradient(#0a1311,#0a1311) padding-box,linear-gradient(100deg,var(--mint),var(--acid)) border-box;color:#fff}.tl-atlas i{background:linear-gradient(100deg,var(--mint),var(--acid));color:#08110f}
.tl-offer{background:var(--acid);color:#08110f}.tl-offer i{background:#08110f;color:var(--acid)}
.tl-ctrl{background:#e9ebe6;color:#13201c;border:1px solid rgba(8,17,15,.12)}.tl-ctrl i{background:#13201c;color:var(--mint)}
.tl[aria-current] {box-shadow:0 0 0 2px var(--paper),0 0 0 4px var(--ink)}
.site-header .lab{display:none}
@media (max-width:1519px){.tools .tl b{display:none}.tools .tl{padding:0 5px}}
@media (max-width:1120px){.tools{margin-left:auto}.site-header .mmenu{margin-left:0}}
@media (max-width:900px){.tools{display:none}.site-header .lab{display:inline-flex}}
.mm-tools{display:grid;grid-template-columns:1fr 1fr;gap:6px;padding:4px 4px 8px;border-bottom:1px solid var(--line);margin-bottom:6px}
.mmenu-panel .mm-tools a{display:flex;justify-content:flex-start;min-height:44px;padding:0 10px 0 5px;font:800 13px/1.15 var(--font-body);border-radius:var(--r-pill)}
.mmenu-panel .mm-tools a::after,.mmenu-panel .mm-tools a::before{content:none!important}
.mmenu-panel .mm-tools a.tl-lab:hover{background:var(--blue)}.mmenu-panel .mm-tools a.tl-offer:hover{background:var(--acid)}.mmenu-panel .mm-tools a.tl-ctrl:hover{background:#e9ebe6}
.mmenu-panel .mm-tools a.tl-atlas:hover{background:linear-gradient(#0a1311,#0a1311) padding-box,linear-gradient(100deg,var(--mint),var(--acid)) border-box}

/* подвал: OFFER — конструктор КП, как остальные инструменты */
:is(.footer-columns,.footer-services) a.f-offer{align-self:flex-start;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px 0 6px;border-radius:999px;font-weight:800;white-space:nowrap;background:var(--acid);color:#08110f}
:is(.footer-columns,.footer-services) a.f-offer i{font:600 11.5px/1 var(--font-mono);font-style:normal;letter-spacing:.08em;display:grid;place-items:center;height:32px;padding:0 9px;border-radius:999px;background:#08110f;color:var(--acid)}
:is(.footer-columns,.footer-services) a.f-offer:hover{color:#08110f;background:color-mix(in srgb,var(--acid) 82%,#fff)}

/* главная, блок партнёров: кнопка конструктора с меткой OFFER не шире экрана телефона */
.pt-links{flex-wrap:wrap}
@media (max-width:620px){.pt-links .btn{flex:1 1 100%;padding:0 16px}}