/* ==========================================================================
   АНОМАЛИЯ — лендинг входа · надстройка над style.css
   Те же токены и та же грамматика: SONGER + Гельветика, hairline .5,
   радиусы 28/9999, ритм 4px. Здесь только то, чего нет в базовом дизайн-коде:
   единственная сплошная кнопка (вход), превью бота, чек-лист, карточки
   «что внутри», липкая кнопка на телефоне.
   ========================================================================== */

/* страховка для окружений, где атрибуты <html> недоступны (превью) */
body{color-scheme:dark;
  /* кнопки неподвижны: отклик на курсор — только подсветка ободка */
  --button-motion:static;
  --lvl:var(--an-l);--lvl-t:var(--an);--lvl-deep:var(--an-10);
  --bg:var(--bg-an);--gr:var(--gr-an);--ln:var(--ln-an)}

/* без скрипта всё видно сразу */
html:not(.js) .rv,html:not(.js) .rvx{opacity:1;transform:none}
html:not(.js) .wsplit>span>i{transform:none}

/* Пилюля меряется по тексту: оболочка едет за длиной названия раздела.
   Матовое стекло лёгкое — фон читается сквозь него, но не спорит с текстом. */
#island .isl-shell{
  background:linear-gradient(135deg,#ffffff08,transparent 65%),#202832d6;
  backdrop-filter:blur(18px) saturate(150%);
  -webkit-backdrop-filter:blur(18px) saturate(150%);
  transition:width .42s cubic-bezier(.22,.68,.18,1),
    height .42s cubic-bezier(.22,.68,.18,1),border-radius .38s ease;
  will-change:auto;
}
#island .isl-rest,#island .isl-compact,#island .mega{
  transform:none;filter:none;transition:opacity .18s ease;
}
/* ширина по содержимому; слишком длинное название ужимается многоточием,
   а не выталкивает пилюлю за край экрана */
#island .isl-compact{width:max-content;max-width:calc(100vw - 24px)}
#island .isl-compact .lv{flex:none}
#island .isl-compact .sec{flex:0 1 auto;min-width:0;max-width:34ch;animation:none}
/* название сменилось — короткое проявление, пока оболочка меняет ширину */
#island .isl-compact .sec.sec-in{animation:secin 340ms cubic-bezier(.22,.68,.18,1) both}
#island .isl-compact .dot{animation:none;box-shadow:none}
@media(max-width:900px){#island .isl-compact .sec{max-width:20ch}}
/* Retain the blue glass palette without sampling the page behind each layer. */
.tgm{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
#stick{background:linear-gradient(135deg,#ffffff08,transparent 65%),#202832f5;
  backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.atm img,.wm{will-change:auto}
.marq .tk{animation-play-state:paused;will-change:auto}
.marq.is-running:not(:hover) .tk{animation-play-state:running}
@media(prefers-reduced-motion:reduce){
  #island .isl-shell,#island .isl-rest,#island .isl-compact,#island .mega{transition:none}
}

/* ---------- сплошная кнопка: одна заливка на странице, только для входа ---------- */
.btn.solid{background:var(--ink-hi);color:var(--canvas);border-color:var(--ink-hi)}
.btn.solid::before{background:var(--lvl-t)}
.btn.solid:hover{color:var(--canvas);border-color:var(--ink-hi)}
.btn.solid:hover::before{opacity:.22}
.btn.solid .ar,.btn.solid:hover .ar{color:var(--canvas)}
.btn .tg{width:17px;height:17px;flex:none;margin-left:-4px;fill:#fff;color:#fff}
.nav .enter{background:var(--ink-hi);color:var(--canvas);border-color:var(--ink-hi)}
.nav .enter:hover{background:var(--an);border-color:var(--an);color:#fff}

/* ---------- герой: размер по содержимому, кнопка в первом экране ---------- */
.lvhero{min-height:0;align-items:center;
  padding-top:clamp(112px,14vh,150px);padding-bottom:clamp(36px,6vh,64px)}
.lvgrid{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:center;margin-top:0}
.lvhero .wm{right:-10%;top:-4%;opacity:.07}
.lvhero .lead{margin-top:clamp(18px,2.4vh,26px);max-width:50ch}
.lvhero .acts{margin-top:clamp(22px,3vh,30px)}
.micro{margin-top:14px;display:flex;flex-wrap:wrap;gap:6px 16px;font-size:13px;color:var(--ash)}
.micro i{font-style:normal;color:var(--lvl-t);font-family:var(--f-d);font-weight:500;letter-spacing:.04em}
.lvhero .hstat{margin-top:clamp(26px,4vh,40px);padding-top:20px;border-top:.5px solid var(--hair);max-width:540px}
@media(max-width:900px){
  .lvgrid{grid-template-columns:1fr;gap:34px}
  .lvhero .wm{width:64vw;right:-14%;top:auto;bottom:40%}
}

/* ---------- превью бота: как выглядит первый шаг ---------- */
.tgwrap{position:relative;padding-top:26px}
.tgwrap .cap{position:absolute;top:0;left:2px;font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--ash)}
.tgm{display:block;position:relative;border:.5px solid var(--hair);border-radius:28px;overflow:hidden;
  background:color-mix(in srgb,var(--an-10) 62%,transparent);
  backdrop-filter:blur(22px) saturate(140%);-webkit-backdrop-filter:blur(22px) saturate(140%);
  box-shadow:inset 0 .5px 0 rgba(255,255,255,.06);
  transition:border-color var(--base) var(--ease),transform var(--base) var(--spring)}
.tgm:hover{border-color:var(--lvl-t)}
.tgm .hd{display:flex;align-items:center;gap:12px;padding:14px 18px;border-bottom:.5px solid var(--hair-2)}
.tgm .av{width:36px;height:36px;border-radius:50%;flex:none;display:grid;place-items:center;
  background:var(--an-l);color:#fff;font-family:var(--f-d);font-weight:500;font-size:15px}
.tgm .nm{display:flex;flex-direction:column;gap:2px;min-width:0}
.tgm .nm b{font-size:14px;color:var(--ink-hi);font-weight:400}
.tgm .nm span{font-size:11.5px;color:var(--ash);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tgm .st{margin-left:auto;font-size:11px;color:var(--lvl-t);display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.tgm .st::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--lvl-t)}
.tgm .bd{display:flex;flex-direction:column;gap:8px;padding:16px 16px 12px}
.tgm .m{max-width:88%;padding:10px 14px;border-radius:18px;font-size:14px;line-height:1.45;color:var(--ink)}
.tgm .m.bot{align-self:flex-start;background:rgba(212,212,212,.08);border-bottom-left-radius:6px}
.tgm .m.me{align-self:flex-end;background:color-mix(in srgb,var(--an-l) 60%,transparent);color:#fff;border-bottom-right-radius:6px}
.tgm .chips{display:flex;flex-wrap:wrap;gap:6px;padding-top:2px}
.tgm .chip{border:.5px solid color-mix(in srgb,var(--lvl-t) 45%,transparent);border-radius:var(--r-pill);
  padding:6px 11px;font-size:12px;color:var(--muted)}
.tgm .ft{display:flex;align-items:center;gap:8px;padding:12px 16px 16px;border-top:.5px solid var(--hair-2)}
.tgm .ft .in{flex:1;min-width:0;height:42px;display:flex;align-items:center;padding:0 16px;
  border:.5px solid var(--hair);border-radius:var(--r-pill);font-size:13px;color:var(--ash)}
.tgm .ft .go{height:42px;padding:0 18px;border-radius:var(--r-pill);background:var(--ink-hi);color:var(--canvas);
  display:inline-flex;align-items:center;gap:8px;font-size:13.5px;white-space:nowrap}
.tgm .ft .go i{font-style:normal;transition:transform var(--base) var(--spring)}
.tgm:hover .ft .go i{transform:translateX(4px)}
/* сообщения приходят по очереди — как в живом чате */
.tgm .m,.tgm .chips{animation:tgin 520ms var(--e-smooth) both}
.tgm .m:nth-child(1){animation-delay:.15s}
.tgm .m:nth-child(2){animation-delay:.55s}
.tgm .m:nth-child(3){animation-delay:.95s}
.tgm .m:nth-child(4){animation-delay:1.35s}
.tgm .chips{animation-delay:1.7s}
@keyframes tgin{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.tgm .m,.tgm .chips{animation:none}}

/* ---------- чек-лист «это ваш уровень, если» ---------- */
.chk{list-style:none;margin:var(--s-6) 0 0;padding:0;border-top:.5px solid var(--hair)}
.chk li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:16px;align-items:start;
  padding:18px 0;border-bottom:.5px solid var(--hair-2);
  font-size:clamp(15px,1.5vw,18px);line-height:1.45;color:var(--ink);max-width:62ch}
.chk .ck{width:22px;height:22px;margin-top:2px;border:.5px solid var(--lvl-t);border-radius:50%;
  display:grid;place-items:center;color:var(--lvl-t)}
.chk .ck svg{width:13px;height:13px}

/* ---------- строка действия внутри раздела ---------- */
.cta-line{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;
  margin-top:var(--s-7);padding-top:var(--s-5);border-top:.5px solid var(--hair)}
.cta-line .hint{font-size:13px;color:var(--ash);max-width:46ch;line-height:1.5}
@media(max-width:560px){.cta-line .btn{width:100%;justify-content:space-between}}

/* ---------- что внутри: шесть карточек ---------- */
.gets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:var(--s-6)}
.get{position:relative;display:flex;flex-direction:column;min-height:228px;
  padding:clamp(20px,2.4vw,28px);border-radius:28px;border:.5px solid var(--hair);background:var(--plate);
  transition:border-color var(--base) var(--ease),background var(--base) var(--ease),
             transform var(--base) var(--spring),opacity 720ms var(--ease)}
.get:hover{border-color:var(--lvl-t);background:var(--plate-hi)}
.get .n{font-size:11px;letter-spacing:.14em;color:var(--ash);font-variant-numeric:tabular-nums}
.get .h{margin-top:14px;font-family:var(--f-d);font-weight:500;font-size:clamp(15px,1.4vw,18px);
  letter-spacing:.05em;text-transform:uppercase;color:var(--ink-hi);line-height:1.22;text-wrap:balance}
.get .d{margin-top:10px;font-size:14px;line-height:1.55;color:var(--muted);text-wrap:pretty}
.get .m{margin-top:auto;padding-top:14px;font-size:12px;color:var(--lvl-t);border-top:.5px solid var(--hair-2)}
@media(max-width:900px){.gets{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.gets{grid-template-columns:1fr}.get{min-height:0}}

/* ---------- шаги входа: цвет номера шага ---------- */
.entry{--el:var(--lvl-t)}
/* Keep the upcoming-content cards stationary, including reveal and hover. */
#seychas :is(.fbig,.fs,.rc){
  transform:none!important;translate:none!important;scale:none!important;
  animation:none!important;opacity:1;
  transition:border-color 350ms ease,background 350ms ease}
#seychas .fbig img{transform:none!important;transition:opacity 500ms ease}
#seychas .fbig:hover img{opacity:.55}
#seychas .fbig.glow-c::before{
  background:linear-gradient(135deg,#b8d4f009,transparent 65%);
}
#seychas .fbig .tag.live::before{animation:none;box-shadow:none}
/* Reveal a separate content region; keep the text's geometry and rendering stable. */
:is(#vyzovy,#faq) .acc{overflow-anchor:none}
html:has(.acc-smooth[data-animating]){overflow-anchor:none}
:is(#vyzovy,#faq) .acc .acc-smooth{
  transform:none!important;translate:none!important;scale:none!important;
  opacity:1;transition:none!important}
:is(#vyzovy,#faq) .acc .acc-smooth .bd{animation:none}
.acc-smooth .acc-reveal{display:grid;grid-template-rows:0fr;transition:grid-template-rows 520ms cubic-bezier(.45,0,.2,1)}
.acc-smooth[data-expanded="true"] .acc-reveal{grid-template-rows:1fr}
.acc-reveal-inner{min-height:0;overflow:hidden}
@media(prefers-reduced-motion:reduce){.acc-smooth .acc-reveal{transition:none}}
:is(#vyzovy,#faq) .acc .acc-smooth summary .pl::before,
:is(#vyzovy,#faq) .acc .acc-smooth summary .pl::after{transition:transform 420ms ease,background 420ms ease}
:is(#vyzovy,#faq) .acc .acc-smooth[data-expanded="false"] summary .pl::after{transform:scaleY(1)}
:is(#vyzovy,#faq) .acc .acc-smooth[data-expanded="false"] summary .pl::before{background:var(--muted)}
@media(prefers-reduced-motion:reduce){:is(#vyzovy,#faq) .acc .acc-smooth summary .pl::before,:is(#vyzovy,#faq) .acc .acc-smooth summary .pl::after{transition:none}}
#kak .entry{display:grid;gap:8px;border-top:0}
#kak .entry .e{position:relative;isolation:isolate;padding:18px 22px;
  border:1px solid #ffffff08;border-radius:16px;background:transparent;
  transition:border-color 350ms ease}
#kak .entry .e,#kak .entry .e:hover,#kak .entry .e:focus-within{
  transform:none!important;translate:none!important;scale:none!important;animation:none!important;opacity:1}
#kak .entry .e::before{content:"";position:absolute;inset:0;z-index:-1;
  border-radius:inherit;pointer-events:none;opacity:0;
  background:linear-gradient(90deg,#ffffff01,#ffffff06 18%,#ffffff06 82%,#ffffff01);
  transition:opacity 350ms ease}
#kak .entry .e:hover,#kak .entry .e:focus-within{background:transparent;border-color:#ffffff18}
#kak .entry .e:hover::before,#kak .entry .e:focus-within::before{opacity:1}
@media(max-width:720px){#kak .entry .e{padding:16px;border-radius:14px}}
@media(prefers-reduced-motion:reduce){#kak .entry .e,#kak .entry .e::before{transition:none}}

/* ---------- подписка: цена рядом с тем, что за неё дают ---------- */
.price{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(22px,4vw,56px);
  margin-top:var(--s-7);padding:clamp(24px,3.4vw,40px);border-radius:28px;
  border:.5px solid var(--hair);background:var(--plate);position:relative;overflow:hidden}
.price::before{content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(60% 80% at 0% 100%,color-mix(in srgb,var(--an-l) 22%,transparent),transparent 70%)}
.price>*{position:relative;z-index:1;min-width:0}
.price .k{display:block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ash)}
.price .amt{margin-top:14px;font-family:var(--f-d);font-weight:500;font-size:clamp(36px,4.8vw,58px);
  letter-spacing:.02em;line-height:1;color:var(--ink-hi);font-variant-numeric:tabular-nums;white-space:nowrap}
.price .amt small{display:block;font-family:var(--f-ui);font-weight:350;font-size:13.5px;
  letter-spacing:-.01em;color:var(--ash);margin-top:12px;white-space:normal;line-height:1.45}
.inc{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:11px}
.inc li{display:grid;grid-template-columns:20px minmax(0,1fr);gap:12px;align-items:start;
  font-size:14.5px;line-height:1.45;color:var(--ink)}
.inc li i{width:20px;height:20px;margin-top:1px;border:.5px solid var(--lvl-t);border-radius:50%;
  display:grid;place-items:center;color:var(--lvl-t)}
.inc li i svg{width:12px;height:12px}
.price .acts{margin-top:var(--s-5)}
@media(max-width:760px){
  .price{grid-template-columns:1fr;gap:var(--s-5)}
  .price .acts .btn{width:100%;justify-content:space-between}
}

/* ---------- капитанам: три ритма в колонку, цифра слева от подписи ---------- */
.cap-figs{grid-template-columns:1fr;gap:0;margin-top:0;border-top:.5px solid var(--hair);padding-top:0}
.cap-figs .f{display:grid;grid-template-columns:minmax(0,auto) minmax(0,1fr);gap:16px;align-items:baseline;
  padding:16px 0;border-bottom:.5px solid var(--hair-2)}
.cap-figs .v{font-size:clamp(24px,2.6vw,34px);white-space:nowrap}
.cap-figs .l{margin-top:0;max-width:none}
@media(max-width:820px){.cap-figs{grid-template-columns:1fr;gap:0}}
@media(max-width:480px){.cap-figs .f{grid-template-columns:1fr;gap:6px}}
#kapitan .two{align-items:start}
#kapitan .crit{margin-top:var(--s-5)}

/* ---------- живой эфир: пульс перед меткой ---------- */
.tag.live{gap:8px}
.tag.live::before{content:'';width:6px;height:6px;border-radius:50%;background:var(--lvl-t);
  box-shadow:0 0 0 0 color-mix(in srgb,var(--lvl-t) 55%,transparent);animation:pulse 4.6s var(--e-fade) infinite}
@media(prefers-reduced-motion:reduce){.tag.live::before{animation:none}}
.fbig .mt{flex-wrap:wrap}

/* ---------- лента статусов: карточки без ссылки не должны прыгать ---------- */
.rail .rc:not(a):hover{transform:none;border-color:var(--hair)}

/* ---------- панель «кто ведёт» ---------- */
.gpanel .acts{margin-top:var(--s-5)}

/* ---------- финальный вход ---------- */
#vhod .acts{margin-top:var(--s-6)}

/* ---------- подвал без рассылки: только правовой ярус ---------- */
footer{margin-top:0}

/* ---------- липкая кнопка на телефоне ---------- */
/* iOS Safari 26 (PROJECT_ARCHITECTURE §6): fixed-элемент с фоном вплотную к нижнему краю
   Safari берёт как подложку нижней панели — появляется сплошная полоса, контент
   не заходит под URL-пилюлю. Поэтому плашка — плавающая капсула с отступом от края,
   а скрытое состояние — visibility:hidden, чтобы Safari её вообще не учитывал. */
.stick{position:fixed;left:12px;right:12px;bottom:calc(12px + var(--safe-b));z-index:38;display:none;
  align-items:center;gap:14px;padding:8px 8px 8px 20px;border-radius:9999px;
  background:color-mix(in srgb,var(--canvas) 84%,transparent);
  backdrop-filter:blur(24px) saturate(150%);-webkit-backdrop-filter:blur(24px) saturate(150%);
  border:.5px solid var(--hair);
  opacity:0;visibility:hidden;transform:translateY(12px);
  transition:transform var(--t-snappy) var(--e-snappy),opacity var(--t-snappy) var(--e-snappy),visibility 0s linear var(--t-snappy)}
.stick.on{opacity:1;visibility:visible;transform:none;
  transition:transform var(--t-snappy) var(--e-snappy),opacity var(--t-snappy) var(--e-snappy),visibility 0s}
.stick .st-txt{display:flex;flex-direction:column;gap:3px;min-width:0;flex:1}
.stick .st-txt b{font-family:var(--f-d);font-weight:500;font-size:12px;letter-spacing:.18em;
  text-transform:uppercase;color:var(--ink-hi)}
.stick .st-txt span{font-size:11.5px;color:var(--ash);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.stick .btn{flex:none;--px:22px}
@media(max-width:900px){
  .stick{display:flex}
  /* липкая кнопка не должна закрывать правовой текст в самом низу */
  .f-legal{padding-bottom:calc(96px + var(--safe-b))}
}
@media(prefers-reduced-motion:reduce){.stick{transition:none}}

/* аватар бота — логотип вместо буквы (Слои/IMG_0669.PNG, 14.09) */
.tgm img.av{object-fit:cover;background:none;padding:0}

/* Quiet editorial finish. No extra animated background; native blue artwork stays. */
body{
  --canvas:#202124;
  --ink:#e0e3e7;--muted:#b3b8c0;--ash:#929ba7;
  --plate:rgba(16,20,26,.3);--plate-hi:rgba(23,29,37,.45);
  --hair:rgba(201,213,228,.18);--hair-2:rgba(201,213,228,.09);
}
.field::after{background:linear-gradient(180deg,#20212424 0%,#20212470 52%,#202124db 100%)}
.gets{gap:14px}
.gets .get,#seychas .fs,#seychas .rc{
  border:1px solid #c7d5e31a;border-top-color:#dce7f02e;
  background:linear-gradient(145deg,#ffffff04,transparent 65%),#11151b42;
  box-shadow:inset 0 1px 0 #ffffff03;
  border-radius:20px;
}
.gets .get:hover,#seychas :is(.fs,.rc):hover{
  border-color:#a9c3df40;background:linear-gradient(145deg,#ffffff06,transparent 65%),#11151b55;
}
.gets .get .n{color:#91abc8;font-size:11px;letter-spacing:.18em}
.gets .get .d{color:#bcc3cc}
.gets .get .m{color:#b0c5dd;border-top-color:#c7d5e31a;padding-top:16px}
#seychas .fs .mt,#seychas .rc .meta{color:#9ca6b2}
#kak .entry .e{border-color:#c7d5e318;background:#11151b1c}
#kak .entry .e:hover,#kak .entry .e:focus-within{border-color:#a9c3df38;background:#11151b2b}
:is(#vyzovy,#faq) .acc summary .t{color:#e0e3e7}
:is(#vyzovy,#faq) .acc .bd{color:#b3bbc5}

/* One continuous, document-bound color wash, not separate section backdrops.
   Low-chroma slate links the native blue scenes to the quieter editorial sections. */
main#top{
  position:relative;z-index:1;
  background:linear-gradient(180deg,
    #20212400 0%,#20212400 7%,
    #26313d80 16%,#253549b3 28%,
    #2b3541a6 39%,#242a3280 49%,
    #28374899 63%,#26323f99 76%,
    #222a3580 87%,#20212400 98%);
}
/* Fade the existing blue artwork into that shared wash instead of a solid gray edge. */
main#top>section[data-atm]::before{
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 18%,#000 80%,transparent);
  mask-image:linear-gradient(180deg,transparent,#000 18%,#000 80%,transparent);
}
main#top>section[data-atm]::after{
  background:linear-gradient(90deg,#202124a6 0%,#20212470 46%,#20212426 100%);
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 18%,#000 80%,transparent);
  mask-image:linear-gradient(180deg,transparent,#000 18%,#000 80%,transparent);
}
main#top>section[data-atm]>.lnx{
  /* Paint a bounded line image directly; only the section edge needs fading. */
  background:var(--web-image) center/100% 100% no-repeat;
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 12%,#000 85%,transparent);
  mask-image:linear-gradient(180deg,transparent,#000 12%,#000 85%,transparent);
  -webkit-mask-size:100% 100%;mask-size:100% 100%;
  -webkit-mask-composite:source-over;mask-composite:add;
}
main#top> :is(.cms-block--declaration,.cms-block--events){border-top-color:transparent}

/* Blend the blue scene in before its heading, without a visible section edge. */
main#top>#vnutri{
  --web-image:url('./ambient-inside.svg');
  --inside-feather:clamp(180px,18vw,280px);
  --inside-fade:linear-gradient(180deg,transparent 0px,#00000006 80px,
    #0000001a 170px,#00000047 290px,#0000008c 420px,
    #000000cc 560px,#000 700px,#000 80%,transparent 100%);
}
main#top>#vnutri::before,main#top>#vnutri::after{
  top:calc(-1 * var(--inside-feather));
  -webkit-mask-image:var(--inside-fade);mask-image:var(--inside-fade);
}
main#top>#vnutri>.lnx{
  top:calc(-1 * var(--inside-feather));
  -webkit-mask-image:var(--inside-fade);mask-image:var(--inside-fade);
}

/* Spread the final blue scene across the FAQ gap, with no abrupt opacity ramp. */
main#top>#vhod{--entry-feather:clamp(260px,26vw,440px);
  --web-image:url('./ambient-entry.svg');
  --entry-fade:linear-gradient(180deg,transparent 0%,#00000005 12%,
    #00000014 25%,#00000038 39%,#00000073 53%,#000000b8 67%,
    #000000eb 78%,#000 85%,transparent 100%)}
main#top>#vhod::before,main#top>#vhod::after{
  top:calc(-1 * var(--entry-feather));
  -webkit-mask-image:var(--entry-fade);mask-image:var(--entry-fade);
}
main#top>#vhod>.lnx{
  top:calc(-1 * var(--entry-feather));
  -webkit-mask-image:var(--entry-fade);mask-image:var(--entry-fade);
}

/* Document-bound web: never fixed/sticky and never translated with scroll. */
main#top::before{
  content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;
  /* Five different slices of one continuous drawing, not a repeating tile.
     Alpha lives in the strokes: no page-sized opacity group or SVG mask.
     Each raster is 1/5 of the document height, including on long mobile pages. */
  background-image:url('./ambient-web-1.svg'),url('./ambient-web-2.svg'),
    url('./ambient-web-3.svg'),url('./ambient-web-4.svg'),url('./ambient-web-5.svg');
  background-size:100% 20%;
  background-position:center 0%,center 25%,center 50%,center 75%,center 100%;
  background-repeat:no-repeat;
}

/* ---------- заголовки разделов — по одному левому краю ----------
   Подписи-номера в CMS убраны, а сетка .pair держала под них колонку, и заголовок
   уезжал вправо от карточек. Колонку схлопываем, как у section.wide; оставшаяся
   подпись встаёт над заголовком. Шапки блоков CMS садятся на ту же линию, что .wrap. */
#top .pair{grid-template-columns:1fr;row-gap:var(--s-3)}
#top .pair>.k{padding-top:0;margin-bottom:0}
#top .pair>.k:empty{display:none}
#top :is(.slc-head,.srm-head,.scc-heading){box-sizing:border-box;width:100%;max-width:var(--maxw);
  margin-left:auto;margin-right:auto;padding-left:var(--pad);padding-right:var(--pad)}
#top .scc-heading{text-align:left}
/* у «Декларации» обёртка сама даёт 24px (на телефоне 22px) по бокам — вычитаем их */
#top .dc-head{box-sizing:border-box;max-width:calc(var(--maxw) - 48px);
  padding-left:max(0px,calc(var(--pad) - 24px));padding-right:max(0px,calc(var(--pad) - 24px))}
@media(max-width:600px){#top .dc-head{padding-left:max(0px,calc(var(--pad) - 22px));padding-right:max(0px,calc(var(--pad) - 22px))}}