/* МБС · дизайн-система прототипа: база → компоненты → секции → эффекты.
   Подключение: tokens.css → system.css → mbs.css. Классы и варианты описаны на скрытой странице kit/. */

/* =========================================================================
   1. БАЗА
   ========================================================================= */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--header-h) + 16px)}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-stopped{overflow:clip}
body{margin:0;background:var(--bg);color:var(--fg-muted);font:400 var(--fs-body)/var(--lh-body) var(--font-sans);
  font-feature-settings:"cv11","ss01";-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:clip;min-height:100svh}
h1,h2,h3,h4,h5,h6,p,ul,ol,dl,dd,figure,blockquote,pre{margin:0}
ul[class],ol[class],nav ul,nav ol,.mobile-menu ul,.price-card ul,.cta-form__aside ul{list-style:none;padding:0}
img,svg,video,canvas{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:.22em}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
::selection{background:var(--accent-soft);color:var(--fg)}
:focus-visible{outline:2px solid var(--focus);outline-offset:3px;border-radius:4px}
[hidden]{display:none!important}
[data-theme="dark"]{background:var(--bg);color:var(--fg-muted)}
.mbs-sprite{position:absolute;width:0;height:0;overflow:hidden}
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.skip-link{position:absolute;left:12px;top:-60px;z-index:100;background:var(--fill-strong);color:var(--on-fill-strong);padding:10px 16px;border-radius:var(--r-pill);font-size:var(--fs-sm);text-decoration:none;transition:top var(--dur-2) var(--ease-out)}
.skip-link:focus{top:12px}
[id]{scroll-margin-top:calc(var(--header-h) + 16px)}

/* =========================================================================
   2. РАЗМЕТКА
   ========================================================================= */
.container{width:100%;max-width:calc(var(--container) + var(--gutter)*2);margin-inline:auto;padding-inline:max(var(--gutter),env(safe-area-inset-left,0px))}
.container--wide{max-width:calc(var(--container-wide) + var(--gutter)*2)}
.container--text{max-width:calc(var(--container-text) + var(--gutter)*2)}
.section{position:relative;padding-block:var(--section-y);isolation:isolate}
.section--alt{background:var(--bg-alt)}
/* тёмная секция со светлым содержимым (секция с формой): графитовый фон и коралловые свечения по краям, карточка остаётся светлой */
.section--ink{background:#121214}
/* блуждающее красное пятно тёмных секций (fx/glow.js кладёт .glow первым ребёнком секции, двигает пятна от прокрутки) */
.glow{position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none;border-radius:inherit}
.glow i{position:absolute;left:0;top:0;aspect-ratio:1;border-radius:50%;will-change:transform}
.glow__wide{width:min(170vh,190vw);background:radial-gradient(closest-side,rgba(142,31,20,.30),rgba(142,31,20,.16) 40%,rgba(142,31,20,.05) 70%,transparent)}
.glow__core{width:min(72vh,90vw);background:radial-gradient(closest-side,rgba(247,75,59,.42),rgba(192,48,31,.24) 38%,rgba(192,48,31,.08) 68%,transparent)}
.glow__two{width:min(120vh,140vw);background:radial-gradient(closest-side,rgba(192,48,31,.18),rgba(142,31,20,.08) 50%,transparent)}
.section--ink .cta-form{box-shadow:0 40px 100px -30px rgba(0,0,0,.6)}
.section--tight{padding-block:clamp(40px,3rem + 2vw,72px)}
.section--flush-top{padding-top:0}
.section + .section:not(.section--alt):not([data-theme]){padding-top:calc(var(--section-y)*.5)}
.stack{display:grid;gap:var(--stack,16px);align-content:start}
.row{display:flex;flex-wrap:wrap;align-items:center;gap:var(--row,12px)}
.grid{display:grid;gap:var(--grid-gap,clamp(16px,2vw,24px))}
.grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,80px);align-items:center}
.split--5-7{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}
.split--7-5{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
.split--top{align-items:start}
@media (max-width:1023px){.grid--4{grid-template-columns:repeat(2,minmax(0,1fr))}.grid--3{grid-template-columns:repeat(2,minmax(0,1fr))}.split,.split--5-7,.split--7-5{grid-template-columns:minmax(0,1fr)}}
@media (max-width:639px){.grid--2,.grid--3,.grid--4{grid-template-columns:minmax(0,1fr)}}

/* прожектор (коралловое пятно сверху секции). «Чертёжную» сетку .bg-grid убрали по слову Андрея 10.11 */
.bg-spot{position:relative;isolation:isolate}
.bg-spot::after{content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;
  background:radial-gradient(50% 45% at 50% 0%,rgba(247,75,59,.12),transparent 70%),radial-gradient(35% 30% at 85% 10%,rgba(255,138,107,.10),transparent 70%)}
[data-theme="dark"].bg-spot::after,[data-theme="dark"] .bg-spot::after{background:radial-gradient(50% 50% at 50% 0%,rgba(247,75,59,.22),transparent 70%),radial-gradient(40% 35% at 85% 15%,rgba(255,138,107,.08),transparent 70%)}
.hairline-top{border-top:1px solid var(--line)}

/* =========================================================================
   3. ТИПОГРАФИКА
   ========================================================================= */
.display,.h1,.h2,.h3,.h4,.h5,h1,h2,h3,h4{color:var(--fg);text-wrap:balance}
/* шрифт и жирность — как у meraclick.com: класс уровня (.h3 на <h2>) перекрывает тег */
.display,h1,.h1{font-family:var(--font-display);font-weight:var(--fw-h1)}
.display{font-size:var(--fs-display);line-height:var(--lh-tight);letter-spacing:var(--ls-display)}
h1,.h1{font-size:var(--fs-h1);line-height:var(--lh-tight);letter-spacing:var(--ls-h1)}
h2,.h2{font-family:var(--font-display);font-weight:var(--fw-heavy);font-size:var(--fs-h2);line-height:1.08;letter-spacing:var(--ls-head)}
h3,.h3{font-family:var(--font-sans);font-weight:var(--fw-semibold);font-size:var(--fs-h3);line-height:1.2;letter-spacing:var(--ls-snug)}
h4,.h4{font-family:var(--font-display);font-weight:var(--fw-heavy);font-size:var(--fs-h4);line-height:var(--lh-snug);letter-spacing:-.01em}
.h5{font-family:var(--font-sans);font-weight:var(--fw-semibold);font-size:var(--fs-h5);line-height:var(--lh-snug);letter-spacing:-.01em}
.display em,h1 em,.h1 em,.display .text-accent,h1 .text-accent,.h1 .text-accent{font-weight:var(--fw-h1-accent)}
p{text-wrap:pretty}
.lead{font-size:var(--fs-lead);line-height:1.6;color:var(--fg-muted);max-width:60ch;letter-spacing:-.005em}
.small{font-size:var(--fs-sm);line-height:1.55}
.xsmall{font-size:var(--fs-xs);line-height:1.5}
.muted{color:var(--fg-subtle)}
.fg{color:var(--fg)}
.accent{color:var(--accent-ink)}
.mono{font-family:var(--font-mono);font-variant-ligatures:none}
.tnum{font-variant-numeric:tabular-nums}
.center{text-align:center}
.measure{max-width:60ch}
/* eyebrow: моно-капс с разрядкой (AuthKit), вариант с линиями по бокам */
/* подпись над заголовком — обычный текст: без моноширинного шрифта, капса и разрядки (решение Андрея 10.11). Ставим, только если несёт смысл */
.eyebrow{display:inline-flex;align-items:center;gap:8px;font:600 var(--fs-sm)/1.4 var(--font-sans);color:var(--fg-muted)}
.eyebrow--accent{color:var(--accent-ink)}
/* kicker: акцентная строка над заголовком (WorkOS «The all-in-one solution») */
.kicker{display:block;color:var(--accent-ink);font-size:var(--fs-h4);font-weight:500;letter-spacing:-.02em;line-height:1.25;margin-bottom:6px}
.text-grad{background:var(--grad-type);-webkit-background-clip:text;background-clip:text;color:transparent}
.text-accent{color:var(--accent-ink)}
.ph,:is(span,b,small,em,strong) > .ph,.price-card__price span.ph,.quote__who span.ph{display:inline;padding:0 6px;border-radius:var(--r-xs);background:var(--accent-soft);color:var(--accent-ink);font:500 max(11px,.85em)/1.6 var(--font-mono);-webkit-box-decoration-break:clone;box-decoration-break:clone;overflow-wrap:anywhere}
.ph::before{content:"{{"}.ph::after{content:"}}"}
.section-head{display:grid;gap:16px;max-width:760px;margin-bottom:clamp(32px,4vw,56px)}
.section-head--center{margin-inline:auto;text-align:center;justify-items:center}
.section-head--center .lead{margin-inline:auto}
.section-head--split{max-width:none;grid-template-columns:minmax(0,7fr) minmax(0,5fr);align-items:first baseline;gap:24px clamp(32px,6vw,96px)}
@media (max-width:1023px){.section-head--split{grid-template-columns:minmax(0,1fr)}}
.note{font-size:var(--fs-xs);line-height:1.5;color:var(--fg-subtle)}
.note--ui{display:flex;gap:6px;align-items:center;margin-top:12px}

/* статья */
.prose{color:var(--fg-muted);font-size:1.0625rem;line-height:1.72;max-width:var(--container-text)}
.prose > * + *{margin-top:1.1em}
.prose h2{font-size:clamp(1.5rem,1.3rem + .8vw,2rem);margin-top:2em;letter-spacing:-.025em}
.prose h3{font-size:1.25rem;margin-top:1.6em}
.prose a{color:var(--accent-ink)}
.prose strong{color:var(--fg);font-weight:600}
.prose ul,.prose ol{padding-left:1.25em}
.prose li + li{margin-top:.4em}
.prose li::marker{color:var(--accent)}
.prose blockquote{border-left:2px solid var(--accent);padding:4px 0 4px 20px;color:var(--fg);font-size:1.125rem;line-height:1.6}
.prose code{font:.9em var(--font-mono);background:var(--surface-2);padding:.1em .4em;border-radius:var(--r-xs);box-shadow:var(--shadow-inset)}
.prose pre{font:14px/1.6 var(--font-mono);background:var(--code-bg);color:var(--code-fg);padding:18px 20px;border-radius:var(--r-md);overflow:auto}
.prose pre code{background:none;box-shadow:none;padding:0;color:inherit}
.prose figure figcaption{font-size:var(--fs-sm);color:var(--fg-subtle);margin-top:8px}
.prose hr{border:0;height:1px;background:var(--line);margin-block:2.4em}
.prose table{font-size:var(--fs-sm)}

/* =========================================================================
   4. КОМПОНЕНТЫ
   ========================================================================= */
/* --- иконки --- */
.ico{width:20px;height:20px;flex:none;fill:none}
.ico--xs{width:14px;height:14px}.ico--sm{width:16px;height:16px}.ico--lg{width:24px;height:24px}.ico--xl{width:32px;height:32px}
.icon-tile{--s:44px;display:inline-grid;place-items:center;flex:none;width:var(--s);height:var(--s);border-radius:12px;color:var(--accent-ink);
  background:linear-gradient(180deg,var(--surface),var(--surface-2));box-shadow:inset 0 1px 1px rgba(255,255,255,.9),inset 0 0 0 1px var(--line),0 1px 2px rgba(24,24,27,.06),0 4px 10px rgba(24,24,27,.05)}
.icon-tile .ico{width:calc(var(--s)*.5);height:calc(var(--s)*.5)}
.icon-tile--sm{--s:32px;border-radius:9px}
.icon-tile--lg{--s:56px;border-radius:16px}
.icon-tile--round{border-radius:50%}
.icon-tile--accent{color:#fff;background:linear-gradient(180deg,#FF6A5A,var(--mbs-accent-strong));box-shadow:inset 0 1px 1px rgba(255,255,255,.35),var(--shadow-btn)}
.icon-tile--ink{color:#fff;background:linear-gradient(180deg,#38383A,var(--mbs-graphite));box-shadow:inset 0 1px 1px rgba(255,255,255,.18),0 4px 10px rgba(24,24,27,.18)}
[data-theme="dark"] .icon-tile:not(.icon-tile--accent){background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.02));color:#FFB4A6;box-shadow:inset 0 1px 1px rgba(255,255,255,.12),inset 0 0 0 1px var(--line)}

/* --- кнопки: все pill (WorkOS/AuthKit) --- */
.btn{--h:48px;--px:24px;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:var(--h);padding:0 var(--px);border:0;border-radius:var(--r-pill);
  font:500 var(--fs-body)/1.2 var(--font-sans);letter-spacing:-.01em;text-decoration:none;white-space:nowrap;cursor:pointer;position:relative;isolation:isolate;
  transition:background-color var(--dur-2) var(--ease-out),color var(--dur-2) var(--ease-out),box-shadow var(--dur-2) var(--ease-out),transform var(--dur-2) var(--ease-out),background-position var(--dur-4) var(--ease-out)}
.btn .ico{width:16px;height:16px;transition:transform 420ms var(--ease-out)}
@media (max-width:639px){h1,h2,h3,.hero__title,.display{overflow-wrap:break-word}.btn{max-width:100%;white-space:normal;text-align:center;padding-block:10px}.btn .ico{flex:none}}
.btn:hover .ico--move{transform:translate(2px,-2px)}
.btn:hover .ico--next{transform:translateX(3px)}
.btn:active{transform:translateY(1px)}
.btn:focus-visible{outline:none;box-shadow:var(--shadow-focus),var(--btn-shadow,none)}
.btn--sm{--h:38px;--px:18px;font-size:var(--fs-sm)}
.btn--lg{--h:56px;--px:30px;font-size:1.0625rem}
.btn--block{width:100%}
/* блик — кромкой сверху, не заливкой: белый текст на --btn-bg держит 4.5:1 */
.btn--primary{--btn-shadow:inset 0 1px 0 rgba(255,255,255,.22),var(--shadow-btn);color:#fff;background-color:var(--btn-bg);box-shadow:var(--btn-shadow)}
.btn--primary:hover{background-color:var(--btn-bg-hover)}
.btn--secondary{color:var(--fg);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line-strong),var(--shadow-xs)}
.btn--secondary:hover{background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--fg-subtle),var(--shadow-xs)}
.btn--dark{color:#fff;background:var(--mbs-graphite);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 6px 16px rgba(24,24,27,.18)}
.btn--dark:hover{background:#303032}
[data-theme="dark"] .btn--dark{color:var(--mbs-graphite);background:#fff}
[data-theme="dark"] .btn--secondary{background:rgba(255,255,255,.06);color:#fff;box-shadow:inset 0 0 0 1px var(--line-strong)}
[data-theme="dark"] .btn--secondary:hover{background:rgba(255,255,255,.12)}
.btn--ghost{--px:12px;color:var(--fg);background:transparent}
.btn--ghost:hover{background:var(--surface-2)}
[data-theme="dark"] .btn--ghost:hover{background:rgba(255,255,255,.06)}
/* Переливающиеся кнопки — точный приём Auros: симметричный градиент, background-size 200% (shine) / 280% (flow),
   в покое background-position 100% 0, при наведении 0% 0, transition 0.6s; подпись капсом 14px с разрядкой 0.12em. */
.btn--shine,.btn--flow{--h:54px;--px:22px;border-radius:var(--r-sm);font-size:var(--fs-sm);letter-spacing:var(--ls-caps);text-transform:uppercase;gap:20px;
  background-position:100% 0;transition:background-position var(--dur-4) var(--ease-out),color var(--dur-2),box-shadow var(--dur-2)}
.btn--shine{color:var(--mbs-ink);background-image:var(--grad-shine);background-size:200% 100%;box-shadow:inset 0 0 0 1px rgba(247,75,59,.18),0 1px 2px rgba(24,24,27,.06),0 8px 20px rgba(247,75,59,.10)}
.btn--flow{color:#fff;background-image:var(--grad-flow);background-size:280% 100%}
.btn--shine:hover,.btn--flow:hover{background-position:0 0}
.btn--flow:hover{color:var(--mbs-ink)}
.btn--shine.btn--pill,.btn--flow.btn--pill{border-radius:var(--r-pill)}
.btn--shine .ico,.btn--flow .ico{width:12px;height:12px}
.btn[disabled],.btn[aria-disabled="true"]{opacity:.45;pointer-events:none;box-shadow:none}
.btn.is-loading{color:transparent!important;pointer-events:none}
.btn.is-loading::after{content:"";position:absolute;inset:0;margin:auto;width:18px;height:18px;border-radius:50%;border:2px solid currentColor;border-color:rgba(255,255,255,.9) rgba(255,255,255,.9) rgba(255,255,255,.25) rgba(255,255,255,.25);animation:spin .7s linear infinite}
.btn--secondary.is-loading::after,.btn--shine.is-loading::after,.btn--ghost.is-loading::after{border-color:var(--fg) var(--fg) var(--line-strong) var(--line-strong)}
@keyframes spin{to{transform:rotate(360deg)}}
/* кнопка-иконка: квадрат 32px со стрелкой (Auros) и круглая */
.btn-icon{--s:40px;display:inline-grid;place-items:center;flex:none;width:var(--s);height:var(--s);border:0;border-radius:var(--r-pill);background:var(--surface);color:var(--fg);
  box-shadow:inset 0 0 0 1px var(--line-strong);transition:background-color var(--dur-2),transform 420ms var(--ease-out),color var(--dur-2)}
.btn-icon:hover{background:var(--surface-2)}
.btn-icon--square{--s:32px;border-radius:var(--r-sm);background:var(--accent-soft);color:var(--accent-ink);box-shadow:none}
.btn-icon--square:hover{background:var(--accent);color:#fff}
.btn-icon .ico{width:16px;height:16px}
[data-theme="dark"] .btn-icon{background:rgba(255,255,255,.06);color:#fff}
[data-theme="dark"] .btn-icon--square{background:rgba(247,75,59,.22);color:#FFD3CA}
/* ссылка со стрелкой */
.link-arrow{display:inline-flex;align-items:center;gap:6px;color:var(--accent-ink);font-weight:500;text-decoration:none;font-size:var(--fs-sm)}
.link-arrow .ico{transition:transform var(--dur-3) var(--ease-out)}
.link-arrow:hover .ico{transform:translateX(3px)}
.link-arrow:hover{text-decoration:underline}
.link{color:var(--accent-ink);text-decoration:underline;text-decoration-color:var(--line-accent)}
.link:hover{text-decoration-color:currentColor}

/* --- бейджи, метки --- */
.badge{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px;border-radius:var(--r-sm);font:500 var(--fs-xs)/1 var(--font-sans);letter-spacing:.01em;
  color:var(--fg-muted);background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--line);white-space:nowrap}
.badge--accent{color:var(--accent-ink);background:var(--accent-soft);box-shadow:inset 0 0 0 1px var(--line-accent)}
.badge--success{color:#17734B;background:rgba(31,138,91,.1);box-shadow:inset 0 0 0 1px rgba(31,138,91,.25)}
.badge--ink{color:#fff;background:var(--mbs-graphite);box-shadow:none}
.badge--mono{font-variant-numeric:tabular-nums}
.badge .dot{width:6px;height:6px;border-radius:50%;background:currentColor}
[data-theme="dark"] .badge{background:rgba(255,255,255,.06);color:#E4E4E7}
[data-theme="dark"] .badge--accent{background:rgba(247,75,59,.18);color:#FFB4A6}
/* плашка-анонс над героем */
.announce-pill{display:inline-flex;align-items:center;gap:10px;padding:5px 12px 5px 5px;border-radius:var(--r-pill);background:var(--glass);box-shadow:var(--shadow-glass);
  -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);font-size:var(--fs-sm);color:var(--fg);text-decoration:none}
.announce-pill .badge{border-radius:var(--r-pill);height:22px}
.announce-pill .ico{width:14px;height:14px;transition:transform var(--dur-3) var(--ease-out)}
.announce-pill:hover .ico{transform:translateX(3px)}

/* --- мессенджеры: MAX первым --- */
.messengers{display:flex;flex-wrap:wrap;gap:8px}
.msg{--c:var(--fg);display:inline-flex;align-items:center;justify-content:center;gap:8px;min-width:40px;height:40px;padding:0 10px;border-radius:var(--r-pill);
  background:var(--surface);color:var(--fg);box-shadow:inset 0 0 0 1px var(--line-strong);text-decoration:none;font-size:var(--fs-sm);font-weight:500;
  transition:background-color var(--dur-2),color var(--dur-2),box-shadow var(--dur-2)}
.msg .ico{width:18px;height:18px;color:var(--c)}
.msg:hover .ico{color:#fff}
.msg--label{padding:0 16px 0 12px}
.msg--max{--c:#5A3CFF}.msg--wa{--c:#1DA851}.msg--tg{--c:#1E8FCB}
.msg:hover{color:#fff;box-shadow:none}
.msg--max:hover{background:linear-gradient(135deg,#00EAFF,#8419FF)}
.msg--wa:hover{background:#25D366}
.msg--tg:hover{background:#26A5E4}
.messengers--compact .msg{min-width:36px;height:36px;padding:0}
.messengers--compact .msg .ico{width:17px;height:17px}
[data-theme="dark"] .msg{background:rgba(255,255,255,.06)}
[data-theme="dark"] .badge--success{color:#6FD7A3;background:rgba(111,215,163,.12);box-shadow:inset 0 0 0 1px rgba(111,215,163,.3)}
[data-theme="dark"] .msg--max{--c:#A99BFF}[data-theme="dark"] .msg--wa{--c:#5BE38F}[data-theme="dark"] .msg--tg{--c:#6CC6F2}

/* --- формы --- */
.form{display:grid;gap:16px}
.form__row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
@media (max-width:639px){.form__row{grid-template-columns:minmax(0,1fr)}}
.field{display:grid;gap:7px;align-content:start}
.label{font-size:var(--fs-sm);font-weight:500;color:var(--fg)}
.label .opt{color:var(--fg-subtle);font-weight:400}
.input,.textarea,.select{width:100%;min-height:48px;padding:12px 14px;border:0;border-radius:var(--r-md);background:var(--surface);color:var(--fg);font-size:var(--fs-body);line-height:1.4;
  box-shadow:inset 0 0 0 1px var(--line-strong),var(--shadow-xs);transition:box-shadow var(--dur-2) var(--ease-out),background-color var(--dur-2)}
.input::placeholder,.textarea::placeholder{color:var(--fg-subtle);opacity:1}
.input:hover,.textarea:hover,.select:hover{box-shadow:inset 0 0 0 1px var(--fg-subtle),var(--shadow-xs)}
.input:focus,.textarea:focus,.select:focus{outline:none;box-shadow:inset 0 0 0 1.5px var(--focus),var(--shadow-focus)}
.textarea{min-height:120px;resize:vertical}
.select{appearance:none;padding-right:40px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 6L8 10.5 12.5 6' fill='none' stroke='%23515153' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:16px}
.input[aria-invalid="true"],.textarea[aria-invalid="true"],.select[aria-invalid="true"]{box-shadow:inset 0 0 0 1.5px var(--accent-ink);background:var(--mbs-blush)}
.input:disabled,.textarea:disabled,.select:disabled{opacity:.55;cursor:not-allowed;background:var(--surface-2)}
.field__hint{font-size:var(--fs-xs);color:var(--fg-subtle)}
.field__error{display:flex;gap:6px;align-items:flex-start;font-size:var(--fs-sm);color:var(--accent-ink)}
.field__error .ico{width:16px;height:16px;margin-top:2px}
[data-theme="dark"] .input,[data-theme="dark"] .textarea,[data-theme="dark"] .select{background:rgba(255,255,255,.04);color:#fff}
[data-theme="dark"] .input[aria-invalid="true"]{background:rgba(247,75,59,.08)}
.input-group{position:relative;display:flex;align-items:center}
.input-group > .ico{position:absolute;left:14px;color:var(--fg-subtle);pointer-events:none}
.input-group > .ico ~ .input{padding-left:42px}
.input-group--btn .input{padding-right:6px}
.input-group--btn .btn{position:absolute;right:5px;--h:38px}
.input-group--btn .input{padding-right:150px}
/* чекбокс, радио */
.check{display:flex;gap:10px;align-items:flex-start;font-size:var(--fs-sm);line-height:1.5;cursor:pointer;color:var(--fg-muted)}
.check input{appearance:none;flex:none;width:20px;height:20px;margin:1px 0 0;border-radius:6px;background:var(--surface);box-shadow:inset 0 0 0 1.5px var(--line-strong);display:grid;place-items:center;cursor:pointer;transition:background-color var(--dur-1),box-shadow var(--dur-1)}
.check input[type="radio"]{border-radius:50%}
.check input::after{content:"";width:10px;height:10px;transform:scale(0);transition:transform var(--dur-2) var(--ease-spring);background:#fff;
  clip-path:polygon(14% 52%,0 66%,38% 100%,100% 22%,86% 8%,38% 72%)}
.check input[type="radio"]::after{clip-path:circle(50%);width:8px;height:8px}
.check input:checked{background:var(--btn-bg);box-shadow:none}
.check input:checked::after{transform:scale(1)}
.check input:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.check input[aria-invalid="true"]{box-shadow:inset 0 0 0 1.5px var(--accent-ink)}
.check input:disabled{opacity:.5}
.check a{color:var(--accent-ink)}
/* переключатель (WorkOS «Enabled») */
.switch{display:inline-flex;align-items:center;gap:10px;cursor:pointer;font-size:var(--fs-sm);color:var(--fg)}
.switch input{appearance:none;width:40px;height:24px;margin:0;border-radius:var(--r-pill);background:var(--surface-sunken);box-shadow:inset 0 0 0 1px var(--line-strong);position:relative;cursor:pointer;transition:background-color var(--dur-2) var(--ease-out)}
.switch input::after{content:"";position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(24,24,27,.25);transition:transform var(--dur-3) var(--ease-spring)}
.switch input:checked{background:var(--btn-bg);box-shadow:none}
.switch input:checked::after{transform:translateX(16px)}
.switch input:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.switch input:disabled{opacity:.5;cursor:not-allowed}
/* ползунок (калькулятор) */
.range{--p:0%;appearance:none;width:100%;height:24px;background:transparent;cursor:pointer;margin:0}
.range::-webkit-slider-runnable-track{height:4px;border-radius:4px;background:linear-gradient(90deg,var(--accent) var(--p),var(--surface-sunken) var(--p))}
.range::-moz-range-track{height:4px;border-radius:4px;background:var(--surface-sunken)}
.range::-moz-range-progress{height:4px;border-radius:4px;background:var(--accent)}
.range::-webkit-slider-thumb{appearance:none;width:22px;height:22px;margin-top:-9px;border-radius:50%;background:#fff;box-shadow:0 0 0 1px var(--line-strong),0 2px 6px rgba(24,24,27,.2);transition:transform var(--dur-2) var(--ease-out)}
.range::-moz-range-thumb{width:22px;height:22px;border:0;border-radius:50%;background:#fff;box-shadow:0 0 0 1px var(--line-strong),0 2px 6px rgba(24,24,27,.2)}
.range:hover::-webkit-slider-thumb{transform:scale(1.1)}
.range:focus-visible{outline:none}
.range:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 1px var(--focus),var(--shadow-focus)}
.range-scale{display:flex;justify-content:space-between;font:400 var(--fs-xs)/1 var(--font-mono);color:var(--fg-subtle);margin-top:6px}
/* сегменты (Светлый/Тёмный, помесячно/годом) */
.segmented{display:inline-flex;padding:3px;gap:2px;border-radius:var(--r-pill);background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--line)}
.segmented button{border:0;background:transparent;height:32px;padding:0 14px;border-radius:var(--r-pill);font-size:var(--fs-sm);font-weight:500;color:var(--fg-muted);display:inline-flex;align-items:center;gap:6px;transition:background-color var(--dur-2),color var(--dur-2),box-shadow var(--dur-2)}
.segmented button[aria-pressed="true"],.segmented button[aria-selected="true"]{background:var(--surface);color:var(--fg);box-shadow:var(--shadow-sm),inset 0 0 0 1px var(--line)}
.segmented .ico{width:15px;height:15px}
[data-theme="dark"] .segmented{background:rgba(255,255,255,.05)}
[data-theme="dark"] .segmented button[aria-pressed="true"],[data-theme="dark"] .segmented button[aria-selected="true"]{background:rgba(255,255,255,.12);color:#fff}
/* юридическая строка у формы */
.form__legal{font-size:var(--fs-xs);line-height:1.55;color:var(--fg-subtle)}
.form__legal a{color:inherit;text-decoration:underline;text-decoration-color:var(--line-strong)}
.form__legal a:hover{color:var(--accent-ink)}
.form__alt{display:grid;gap:10px;padding-top:16px;border-top:1px solid var(--line)}
.form__alt > span{font-size:var(--fs-sm);color:var(--fg-subtle)}

/* --- оповещения, состояния --- */
.alert{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:var(--r-md);font-size:var(--fs-sm);line-height:1.5;background:var(--surface-2);color:var(--fg);box-shadow:inset 0 0 0 1px var(--line)}
.alert .ico{margin-top:1px;color:var(--fg-subtle)}
.alert--success{background:rgba(31,138,91,.08);box-shadow:inset 0 0 0 1px rgba(31,138,91,.22)}
.alert--success .ico{color:var(--mbs-success)}
.alert--error{background:var(--mbs-blush);box-shadow:inset 0 0 0 1px var(--line-accent)}
.alert--error .ico{color:var(--accent-ink)}
[data-theme="dark"] .alert--error{background:rgba(247,75,59,.1)}
.alert b{display:block;font-weight:600;margin-bottom:2px}
.toast{position:fixed;left:50%;bottom:calc(24px + env(safe-area-inset-bottom,0px));z-index:var(--z-toast);translate:-50% 0;display:flex;gap:10px;align-items:center;padding:12px 18px;border-radius:var(--r-pill);
  background:var(--tooltip-bg);color:var(--tooltip-fg);font-size:var(--fs-sm);box-shadow:var(--shadow-lg);animation:toast-in var(--dur-3) var(--ease-out)}
.toast--static{position:static;translate:none;animation:none;display:inline-flex}
@keyframes toast-in{from{opacity:0;transform:translateY(12px)}}
.skeleton{border-radius:var(--r-sm);background:linear-gradient(90deg,var(--surface-sunken) 25%,var(--surface-2) 50%,var(--surface-sunken) 75%);background-size:300% 100%;animation:shimmer 1.6s linear infinite}
@keyframes shimmer{from{background-position:100% 0}to{background-position:-200% 0}}
.empty{display:grid;justify-items:center;gap:12px;text-align:center;padding:48px 24px;border-radius:var(--r-lg);box-shadow:inset 0 0 0 1px var(--line);background:var(--surface-2)}
.empty p{max-width:40ch;font-size:var(--fs-sm)}
.spinner{width:20px;height:20px;border-radius:50%;border:2px solid var(--line-strong);border-top-color:var(--accent);animation:spin .7s linear infinite}
[data-tip]{position:relative}
[data-tip]::after{content:attr(data-tip);position:absolute;left:50%;bottom:calc(100% + 8px);translate:-50% 4px;opacity:0;pointer-events:none;white-space:nowrap;
  padding:6px 10px;border-radius:var(--r-sm);background:var(--tooltip-bg);color:var(--tooltip-fg);font:500 var(--fs-xs)/1.3 var(--font-sans);transition:opacity var(--dur-2),translate var(--dur-2) var(--ease-out);z-index:5}
[data-tip]:hover::after,[data-tip]:focus-visible::after{opacity:1;translate:-50% 0}

/* --- карточки --- */
.card{position:relative;display:grid;gap:12px;align-content:start;padding:clamp(20px,2vw,28px);border-radius:var(--r-lg);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line),var(--shadow-sm)}
.card--flat{box-shadow:inset 0 0 0 1px var(--line)}
.card--sunken{background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--line)}
.card--glass{background:var(--glass);-webkit-backdrop-filter:blur(18px) saturate(1.4);backdrop-filter:blur(18px) saturate(1.4);box-shadow:var(--shadow-glass)}
.card--raised{box-shadow:inset 0 0 0 1px var(--line),var(--shadow-lg)}
.card--ink{background:var(--mbs-graphite);color:#D4D4D8;box-shadow:inset 0 1px 1px rgba(255,255,255,.08),var(--shadow-lg)}
.card--ink h3,.card--ink h4,.card--ink .h4{color:#fff}
.card--ink .eyebrow{color:#A1A1A6}
.card--link{text-decoration:none;transition:transform var(--dur-3) var(--ease-out),box-shadow var(--dur-3) var(--ease-out)}
.card--link:hover{transform:translateY(-3px);box-shadow:inset 0 0 0 1px var(--line-strong),var(--shadow-lg)}
.card--link:hover .card__arrow{transform:translate(2px,-2px);background:var(--accent);color:#fff}
.card__arrow{position:absolute;top:20px;right:20px;transition:transform 420ms var(--ease-out),background-color var(--dur-2),color var(--dur-2)}
.card--link h3{padding-right:40px}
.card h3{font-size:var(--fs-h4);letter-spacing:-.018em;line-height:1.3}
.card p{font-size:var(--fs-sm);line-height:1.6}
/* карточка с маленькой копией фирменной иллюстрации слева (assets/illu-icons/, 224px); на телефоне — сверху */
.card--illu{grid-template-columns:clamp(72px,7vw,96px) minmax(0,1fr);column-gap:clamp(16px,2vw,28px)}
.card--illu > *{grid-column:2}
.card--illu > .card__illu{grid-column:1;grid-row:1 / span 4;width:100%;height:auto;aspect-ratio:1;object-fit:contain;filter:drop-shadow(0 10px 18px rgba(247,75,59,.16))}
@media (max-width:560px){.card--illu{grid-template-columns:minmax(0,1fr)}.card--illu > *{grid-column:1}.card--illu > .card__illu{grid-row:auto;width:80px}}
.card__foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;padding-top:8px}
[data-theme="dark"] .card:not(.card--glass){background:rgba(255,255,255,.035)}
/* фича: иконка + заголовок + текст (сетка WorkOS) */
.feature{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 16px;align-items:start}
.feature .icon-tile{grid-row:span 2}
.feature h3,.feature h4{font-family:var(--font-sans);font-size:var(--fs-h5);font-weight:var(--fw-semibold);letter-spacing:-.01em;line-height:1.35}
.feature p{font-size:var(--fs-sm);line-height:1.55;color:var(--fg-subtle)}
.feature--stack{grid-template-columns:minmax(0,1fr);gap:10px}
.feature--stack .icon-tile{grid-row:auto;margin-bottom:6px}
/* строка-ссылка со стрелкой (Auros Explore) */
.feature-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 20px;align-items:start;padding:clamp(18px,1.8vw,24px);border-radius:12px;text-decoration:none;
  transition:background-color var(--dur-3) var(--ease-out),box-shadow var(--dur-3)}
.feature-row h3{font-size:var(--fs-h4)}
.feature-row p{grid-column:1/-1;font-size:var(--fs-sm);max-width:52ch}
.feature-row:hover,.feature-row.is-active{background:var(--surface);box-shadow:inset 0 0 0 1px var(--line),var(--shadow-sm)}
.feature-row:hover .btn-icon,.feature-row.is-active .btn-icon{transform:translate(2px,-2px);background:var(--accent);color:#fff}
[data-theme="dark"] .feature-row:hover,[data-theme="dark"] .feature-row.is-active{background:rgba(255,255,255,.05)}
/* крупная цифра */
.stat{display:grid;gap:8px;align-content:start}
.stat__num{font:500 var(--fs-stat)/1 var(--font-display);letter-spacing:-.05em;color:var(--fg);font-variant-numeric:tabular-nums}
.stat__num--accent{color:var(--accent-ink)}
.stat__label{font:500 var(--fs-sm)/1.4 var(--font-sans);color:var(--fg-muted)}
.stat p{font-size:var(--fs-sm);max-width:34ch}
[data-theme="dark"] .stat__num--accent{color:#FFD3CA}
/* отзыв */
.quote{display:grid;gap:20px;align-content:space-between;padding:clamp(24px,3vw,36px);border-radius:var(--r-lg);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line),var(--shadow-md)}
.quote blockquote{color:var(--fg);font-size:clamp(1.0625rem,1rem + .4vw,1.375rem);line-height:1.45;letter-spacing:-.015em}
.quote__who{display:flex;gap:12px;align-items:center;font-size:var(--fs-sm)}
.quote__who b{display:block;color:var(--fg);font-weight:500}
.quote__who span{color:var(--fg-subtle)}
.avatar{--s:40px;width:var(--s);height:var(--s);border-radius:50%;flex:none;display:grid;place-items:center;background:linear-gradient(135deg,var(--accent-soft),var(--surface-2));color:var(--accent-ink);font-weight:600;font-size:14px;box-shadow:inset 0 0 0 1px var(--line)}
.quote__logo{font-weight:600;color:var(--fg);letter-spacing:-.02em;font-size:1.125rem}
.quote--accent-top{box-shadow:inset 0 3px 0 var(--fg),inset 0 0 0 1px var(--line),var(--shadow-lg)}
[data-theme="dark"] .quote{background:rgba(255,255,255,.04)}
/* карточка статьи */
.post-card{display:grid;gap:14px;align-content:start;text-decoration:none;color:inherit}
.post-card__cover{aspect-ratio:16/10;border-radius:var(--r-lg);overflow:hidden;background:linear-gradient(135deg,var(--accent-soft),var(--surface-2) 60%);box-shadow:inset 0 0 0 1px var(--line);display:grid;place-items:center;color:var(--accent-ink)}
.post-card__cover img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease-out)}
.post-card:hover .post-card__cover img{transform:scale(1.03)}
.post-card h3,.post-card h2{font-size:var(--fs-h5);line-height:1.35;letter-spacing:-.012em;transition:color var(--dur-2)}
.post-card:hover h3,.post-card:hover h2{color:var(--accent-ink)}
.post-card p{font-size:var(--fs-sm);color:var(--fg-subtle);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.post-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;font-size:var(--fs-xs);color:var(--fg-subtle)}
.post-meta .avatar{--s:24px;font-size:10px}
.post-card--featured{grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(24px,4vw,56px);align-items:center;padding:clamp(16px,2vw,24px);border-radius:var(--r-xl);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line),var(--shadow-lg)}
.post-card--featured h3,.post-card--featured h2{font-size:var(--fs-h3);line-height:1.15;letter-spacing:-.025em}
.post-card--featured p{-webkit-line-clamp:4;font-size:var(--fs-body)}
@media (max-width:767px){.post-card--featured{grid-template-columns:minmax(0,1fr)}}
/* плитка логотипа */
.logo-tile{display:grid;place-items:center;height:88px;padding:16px;border-radius:12px;background:var(--surface-2);color:var(--fg-subtle);font-weight:600;letter-spacing:-.02em;font-size:1.0625rem;transition:background-color var(--dur-3),color var(--dur-3),transform var(--dur-3) var(--ease-out)}
.logo-tile:hover{background:var(--surface);color:var(--fg);box-shadow:inset 0 0 0 1px var(--line),var(--shadow-sm)}
.logo-tile--color{background:var(--tile,var(--mbs-graphite));color:#fff}
.logo-tile--empty{background:transparent;box-shadow:inset 0 0 0 1px var(--line)}
/* карточка ресурса (низ страницы продукта WorkOS) */
.resource{display:grid;grid-template-columns:auto minmax(0,1fr);gap:4px 14px;padding:20px;border-radius:var(--r-lg);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line),var(--shadow-sm);text-decoration:none;transition:box-shadow var(--dur-3),transform var(--dur-3) var(--ease-out)}
.resource .ico{grid-row:span 3;color:var(--accent-ink);width:22px;height:22px;margin-top:2px}
.resource b{color:var(--accent-ink);font-weight:500;font-size:var(--fs-sm)}
.resource p{font-size:var(--fs-sm);color:var(--fg-subtle)}
.resource .link-arrow{margin-top:6px}
.resource:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 1px var(--line-strong),var(--shadow-md)}
/* мини-карточка с переключателем (герой WorkOS) */
.toggle-card{display:flex;align-items:center;gap:12px;padding:10px 12px 10px 14px;border-radius:12px;background:var(--glass-strong);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:var(--shadow-glass);font-size:var(--fs-sm);color:var(--fg);min-width:260px}
.toggle-card .switch{margin-left:auto}
.toggle-card .badge{margin-left:auto}
.toggle-card .badge + .switch{margin-left:8px}
/* тариф */
.price-card{display:grid;gap:20px;align-content:start;padding:clamp(24px,3vw,32px);border-radius:var(--r-xl);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line),var(--shadow-md)}
.price-card__head{display:grid;gap:10px}
.price-card__price{display:flex;align-items:baseline;gap:8px;color:var(--fg)}
.price-card__price b{font-family:var(--font-display);font-size:clamp(2.25rem,1.8rem + 1.5vw,3rem);font-weight:500;letter-spacing:-.04em;line-height:1}
.price-card__price span{font-size:var(--fs-sm);color:var(--fg-subtle)}
.price-card ul{display:grid;gap:10px;padding-top:20px;border-top:1px solid var(--line)}
.price-card li{display:flex;gap:10px;font-size:var(--fs-sm);line-height:1.5}
.price-card li .ico{width:16px;height:16px;margin-top:3px;color:var(--accent)}
.price-card{grid-template-columns:minmax(0,1fr)}
.price-card > *{min-width:0}
.price-card .btn{white-space:normal;text-align:center}
.price-card__ask{font-size:clamp(1.75rem,1.4rem + 1vw,2.25rem)!important}
/* рекомендуемый: тёмная карточка с красной обводкой, без свечения */
.price-card--featured{position:relative;color:#D4D4D8;background:var(--mbs-graphite);box-shadow:inset 0 0 0 2px var(--accent)}
@media (min-width:1181px){.plans--4 .price-card--featured{transform:translateY(-12px)}}
/* премиум: слегка выделен тёплым фоном и коралловой гранью */
.price-card--premium{background:linear-gradient(180deg,#FFF1EE,var(--surface) 46%);box-shadow:inset 0 0 0 1px var(--line-accent),var(--shadow-md)}
.price-card--premium .price-card__ask{color:var(--accent-ink)}
.price-card--featured h3,.price-card--featured .price-card__price{color:#fff}
.price-card--featured ul{border-color:rgba(255,255,255,.12)}
.price-card--featured li .ico{color:#FF8A6B}
.price-card--featured .link-arrow{color:#FFB4A6}
.price-card--featured .price-card__price span:not(.ph){color:#AEAEB1}
/* цена по проекту (тарифы, #site-price): две карточки 7/5 одной высоты, низ на одной линии.
   Левая — светлая, факторы цены нумерованными плитками в ряд; правая — графитовая с крупной иллюстрацией и пикселями */
.quote-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:12px;align-items:stretch}
.quote{display:grid;grid-template-rows:auto 1fr auto;gap:clamp(24px,3vw,40px);padding:clamp(24px,3vw,44px);border-radius:var(--r-xl);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line),0 24px 60px -40px rgba(24,24,27,.25)}
.quote p{font-size:var(--fs-body);line-height:1.55;color:var(--fg-muted);max-width:52ch}
.quote__t{margin-bottom:10px;font:500 clamp(1.625rem,1.2rem + 1.3vw,2.5rem)/1.08 var(--font-display);letter-spacing:-.03em;color:var(--fg)}
.quote__head{display:grid;grid-template-columns:clamp(72px,7vw,104px) minmax(0,1fr);gap:clamp(16px,2vw,28px);align-items:start}
.quote__icon{width:100%;height:auto;filter:drop-shadow(0 12px 20px rgba(247,75,59,.18))}
/* факторы цены — нумерованный список строками между тонкими линиями (не плитки: пустые плитки выглядели недогруженными) */
.quote__factors{display:grid;align-content:center;border-top:1px solid var(--line)}
.quote__factors li{display:grid;grid-template-columns:32px minmax(0,1fr);align-items:center;gap:16px;padding:clamp(14px,1.4vw,18px) 0;border-bottom:1px solid var(--line);font-size:var(--fs-body);line-height:1.45;color:var(--fg)}
.quote__n{justify-self:start;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;font:600 14px/1 var(--font-sans);color:#fff;background:linear-gradient(160deg,#DE4234,#C4332A 50%,#A32517);box-shadow:0 6px 14px -6px rgba(247,75,59,.7)}
.quote__foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px 24px;padding-top:clamp(18px,2vw,24px);border-top:1px solid var(--line)}
.quote__pay{font-size:var(--fs-sm);font-weight:500;color:var(--fg)}
.quote--ink{background:var(--mbs-graphite);box-shadow:inset 0 1px 1px rgba(255,255,255,.08),var(--shadow-lg);color:#D4D4D8}
.quote--ink .quote__t{color:#fff}
.quote--ink p{color:#AEAEB1}
.quote--ink .quote__foot{border-color:rgba(255,255,255,.12)}
.quote--ink .link-arrow{color:#FFB4A6}
.quote__art{justify-self:center;align-self:center;width:min(100%,280px);height:auto;filter:drop-shadow(0 30px 50px rgba(247,75,59,.3))}
@media (max-width:1023px){.quote-grid{grid-template-columns:minmax(0,1fr)}.quote__art{width:min(70%,240px)}}
@media (max-width:640px){.quote__factors li{align-items:start}.quote__factors li .quote__n{margin-top:-4px}.quote__head{grid-template-columns:64px minmax(0,1fr)}}
/* ссылка на живой сайт работы в виде адресной строки браузера (кейс без скриншотов) */
.site-link{display:inline-flex;align-items:center;gap:10px;height:52px;padding:0 18px 0 16px;border-radius:var(--r-pill);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line),var(--shadow-sm);color:var(--fg);font-weight:500;text-decoration:none;white-space:nowrap;transition:box-shadow var(--dur-2)}
.site-link:hover{box-shadow:inset 0 0 0 1px var(--line-accent),0 10px 24px -12px rgba(247,75,59,.45)}
.site-link > .ico{width:18px;height:18px;color:var(--fg-subtle)}
.site-link > .ico:last-child{color:var(--accent-ink);transition:transform var(--dur-3) var(--ease-out)}
.site-link:hover > .ico:last-child{transform:translate(2px,-2px)}
.site-link__dots{display:inline-flex;gap:5px;margin-right:4px}
/* офисы компании строками: заголовок слева, строки «метка · город · адрес · телефон» справа */
.offices{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:20px clamp(32px,6vw,96px);align-items:center}
.offices__list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.office{display:grid;grid-template-columns:18px minmax(0,11rem) minmax(0,1fr) auto;gap:4px 16px;align-items:baseline;padding:18px 0;border-bottom:1px solid var(--line)}
.office > .ico{width:18px;height:18px;align-self:center;color:var(--accent-ink)}
.office__city{font-weight:600;color:var(--fg)}
.office__addr{color:var(--fg-muted)}
.office__tel{grid-column:4;white-space:nowrap}
@media (max-width:860px){.offices{grid-template-columns:minmax(0,1fr)}}
/* contacts: addresses sit in the narrow hero column under the title, so each office stacks city, address, phone */
.offices__list--stack .office{grid-template-columns:18px minmax(0,1fr)}.offices__list--stack .office > .ico{align-self:baseline;transform:translateY(3px)}.offices__list--stack .office__addr,.offices__list--stack .office__tel{grid-column:2}
@media (max-width:560px){.office{grid-template-columns:18px minmax(0,1fr);padding:14px 0}.office > .ico{align-self:baseline;transform:translateY(3px)}.office__addr,.office__tel{grid-column:2}}
.site-link__dots i{width:8px;height:8px;border-radius:50%;background:var(--line-strong)}
.site-link__dots i:first-child{background:var(--accent)}
/* шаги (changelog, процесс) */
.timeline{position:relative;display:grid;gap:clamp(40px,5vw,72px)}
.timeline::before{content:"";position:absolute;left:180px;top:6px;bottom:0;width:1px;background:linear-gradient(var(--line-strong),transparent)}
.timeline__item{display:grid;grid-template-columns:180px minmax(0,1fr);gap:clamp(24px,4vw,56px);position:relative}
.timeline__date{position:relative;padding-right:24px;text-align:right;font:600 var(--fs-sm)/1.5 var(--font-sans);font-variant-numeric:tabular-nums;color:var(--accent-ink)}
.timeline__date::after{content:"";position:absolute;right:-5px;top:5px;width:9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px var(--bg),0 0 0 5px var(--line-accent)}
.timeline__body{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;align-content:start;max-width:680px}
.timeline__body h3{font-size:var(--fs-h3)}
.timeline__media{min-width:0;overflow:hidden;aspect-ratio:16/8;border-radius:var(--r-lg);background:linear-gradient(135deg,var(--surface-2),var(--accent-soft));box-shadow:inset 0 0 0 1px var(--line);display:grid;place-items:center;color:var(--accent-ink)}
@media (max-width:767px){
  .timeline::before{left:4px}
  .timeline__item{grid-template-columns:minmax(0,1fr);gap:10px;padding-left:28px}
  .timeline__date{text-align:left;padding:0}
  .timeline__date::after{left:-28px;right:auto}
}

/* --- вкладки, чипы, сегменты --- */
.tabs__list{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;padding:2px}
.tabs__list::-webkit-scrollbar{display:none}
.tab{flex:none;border:0;background:transparent;padding:9px 16px;border-radius:var(--r-pill);font-size:var(--fs-sm);font-weight:500;color:var(--fg-muted);transition:background-color var(--dur-2),color var(--dur-2)}
.tab:hover{color:var(--fg);background:var(--surface-2)}
.tab[aria-selected="true"]{color:var(--fg);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line-strong),var(--shadow-xs)}
.tabs--underline .tabs__list{gap:24px;border-bottom:1px solid var(--line)}
.tabs--underline .tab{border-radius:0;padding:12px 0;box-shadow:none;background:none;position:relative}
.tabs--underline .tab[aria-selected="true"]::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--accent)}
.tabs--vertical{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(24px,4vw,64px);align-items:start}
.tabs--vertical .tabs__list{flex-direction:column;overflow:visible}
.tabs--vertical .tab{display:grid;gap:4px;text-align:left;padding:16px 18px;border-radius:12px;font-weight:400;white-space:normal}
.tabs--vertical .tab strong{color:var(--fg);font-weight:500;font-size:var(--fs-body)}
.tabs--vertical .tab[aria-selected="true"]{background:var(--surface);box-shadow:inset 0 0 0 1px var(--line),var(--shadow-sm)}
.tab-panel{animation:fade-up var(--dur-3) var(--ease-out)}
@keyframes fade-up{from{opacity:0;transform:translateY(8px)}}
@media (max-width:1023px){.tabs--vertical{grid-template-columns:minmax(0,1fr)}}
[data-theme="dark"] .tab[aria-selected="true"]{background:rgba(255,255,255,.08);color:#fff}
[data-theme="dark"] .tab:hover{background:rgba(255,255,255,.05)}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips--scroll{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding:2px}
.chip{flex:none;display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 14px;border:0;border-radius:var(--r-pill);background:var(--surface);color:var(--fg-muted);font-size:var(--fs-sm);font-weight:500;
  box-shadow:inset 0 0 0 1px var(--line-strong);text-decoration:none;transition:background-color var(--dur-2),color var(--dur-2),box-shadow var(--dur-2)}
.chip:hover{color:var(--fg);box-shadow:inset 0 0 0 1px var(--fg-subtle)}
.chip[aria-pressed="true"],.chip.is-active{background:var(--fill-strong);color:var(--on-fill-strong);box-shadow:none}
.chip .count{font:500 11px/1 var(--font-mono);opacity:.6}
[data-theme="dark"] .chip{background:rgba(255,255,255,.05)}
[data-theme="dark"] .chip[aria-pressed="true"],[data-theme="dark"] .chip.is-active{background:var(--fill-strong)}

/* --- аккордеон (FAQ) --- */
.faq{display:grid;gap:10px}
.faq__item{border-radius:var(--r-md);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line),var(--shadow-xs);transition:box-shadow var(--dur-2)}
.faq__item:hover{box-shadow:inset 0 0 0 1px var(--line-strong),var(--shadow-xs)}
.faq__item summary{display:flex;align-items:center;gap:14px;padding:18px 20px;cursor:pointer;list-style:none;color:var(--fg);font-weight:500;line-height:1.4}
.faq__item summary::-webkit-details-marker{display:none}
.faq__item summary .faq__icon{flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--accent-soft);color:var(--accent-ink);transition:transform var(--dur-3) var(--ease-out)}
.faq__item summary .faq__icon .ico{width:14px;height:14px}
.faq__item[open] summary .faq__icon{transform:rotate(45deg)}
.faq__body{padding:0 20px 20px 58px;font-size:var(--fs-sm);line-height:1.65;max-width:76ch}
.faq__item[open] .faq__body{animation:fade-up var(--dur-3) var(--ease-out)}
[data-theme="dark"] .faq__item{background:rgba(255,255,255,.04)}

/* --- таблицы --- */
.table-wrap{position:relative;overflow-x:auto;border-radius:var(--r-lg);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line),var(--shadow-sm)}
.table{width:100%;border-collapse:collapse;font-size:var(--fs-sm);font-variant-numeric:tabular-nums}
.table th,.table td{padding:16px 20px;text-align:left;vertical-align:top;border-top:1px solid var(--line)}
.table thead th{border-top:0;font-weight:500;color:var(--fg);font-size:var(--fs-sm);white-space:nowrap}
.table tbody th{color:var(--fg);font-weight:500;width:26%}
.table td{color:var(--fg-muted)}
.table .is-us{background:linear-gradient(180deg,rgba(247,75,59,.035),rgba(247,75,59,.05))}
.table thead .is-us{color:var(--accent-ink)}
.mark{display:inline-flex;gap:8px;align-items:flex-start}
.mark .ico{width:16px;height:16px;margin-top:2px;flex:none}
.mark--yes .ico{color:var(--mbs-success)}
.mark--no .ico{color:var(--fg-subtle)}
.mark--part .ico{color:var(--mbs-warning)}
.table--matrix td,.table--matrix thead th:not(:first-child){text-align:center}
.table--matrix td .ico{margin-inline:auto}
.table--matrix tbody tr:hover{background:var(--surface-2)}
.table__group th{background:var(--surface-2);font:600 var(--fs-sm)/1.4 var(--font-sans)!important;color:var(--fg)!important}
[data-theme="dark"] .table-wrap{background:rgba(255,255,255,.03)}
@media (max-width:639px){
  .table--stack thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  .table--stack,.table--stack tbody,.table--stack tr,.table--stack th,.table--stack td{display:block;width:auto}
  .table--stack tr{padding:14px 16px;border-top:1px solid var(--line)}
  .table--stack tr:first-child{border-top:0}
  .table--stack th,.table--stack td{border:0;padding:4px 0}
  .table--stack td[data-label]::before{content:attr(data-label);display:block;font:600 12px/1.6 var(--font-sans);color:var(--fg-subtle)}
  .table--stack .is-us{background:none}
  .table--stack tbody th{width:auto}
}

/* --- блок кода --- */
.code{border-radius:var(--r-lg);background:var(--code-bg);color:var(--code-fg);box-shadow:inset 0 1px 1px rgba(255,255,255,.08),0 0 0 1px rgba(255,255,255,.06),var(--shadow-lg);overflow:hidden}
.code__bar{display:flex;align-items:center;gap:6px;padding:10px 12px;border-bottom:1px solid rgba(255,255,255,.08);overflow-x:auto;scrollbar-width:none}
.code__bar .tab{color:#AEAEB1;padding:6px 12px;font:500 12px/1.2 var(--font-mono)}
.code__bar .tab:hover{background:rgba(255,255,255,.06);color:#fff}
.code__bar .tab[aria-selected="true"]{background:rgba(255,255,255,.1);color:#fff;box-shadow:none}
.code__dots{display:flex;gap:6px;margin-right:8px}
.code__dots i{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.14)}
.code__copy{margin-left:auto;flex:none}
.code pre{padding:20px 22px;font:13.5px/1.7 var(--font-mono);overflow:auto;tab-size:2;max-height:480px}
.code__status{display:flex;gap:10px;align-items:center;padding:10px 22px;border-top:1px solid rgba(255,255,255,.08);font:500 12px/1 var(--font-mono);color:#AEAEB1}
.code__status .badge{background:rgba(31,138,91,.2);color:#6FE3A8;box-shadow:none}
.t-k{color:#FF8A6B}.t-s{color:#B8E6A8}.t-c{color:#8A8A8D;font-style:italic}.t-n{color:#FFD3CA}.t-p{color:#F2C9A0}.t-f{color:#FFE29A}

/* --- хлебные крошки, пагинация, оглавление, подменю --- */
.breadcrumbs ol{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:var(--fs-sm);color:var(--fg-subtle)}
.breadcrumbs li{display:inline-flex;align-items:center;gap:6px}
.breadcrumbs li + li::before{content:"";width:14px;height:14px;background:currentColor;opacity:.5;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M6 3.5L10.5 8 6 12.5' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M6 3.5L10.5 8 6 12.5' fill='none' stroke='%23000' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat}
.breadcrumbs a{text-decoration:none}
.breadcrumbs a:hover{color:var(--accent-ink)}
.breadcrumbs [aria-current]{color:var(--fg)}
.pagination{display:flex;gap:6px;align-items:center;justify-content:center}
.pagination a,.pagination span{min-width:40px;height:40px;display:grid;place-items:center;padding:0 10px;border-radius:var(--r-pill);font-size:var(--fs-sm);text-decoration:none;color:var(--fg-muted);font-variant-numeric:tabular-nums}
.pagination a:hover{background:var(--surface-2);color:var(--fg)}
.pagination [aria-current]{background:var(--fill-strong);color:var(--on-fill-strong)}
.toc{position:sticky;top:calc(var(--header-h) + 24px);display:grid;gap:12px;font-size:var(--fs-sm)}
.toc ol{display:grid;gap:2px;border-left:1px solid var(--line)}
.toc a{display:block;padding:6px 0 6px 14px;margin-left:-1px;border-left:2px solid transparent;color:var(--fg-subtle);text-decoration:none;line-height:1.4;transition:color var(--dur-2),border-color var(--dur-2)}
.toc a:hover{color:var(--fg)}
.toc a.is-active{color:var(--fg);border-left-color:var(--accent)}
.subnav{position:sticky;top:var(--header-h);z-index:20;background:var(--glass-strong);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-block:1px solid var(--line)}
.subnav__row{display:flex;align-items:center;gap:24px;min-height:52px}
.subnav__title{font-weight:500;color:var(--fg);font-size:var(--fs-sm);white-space:nowrap}
.subnav .chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none}
.subnav .chip{height:30px;box-shadow:none;background:transparent}
.subnav .chip.is-active{background:var(--accent-soft);color:var(--accent-ink)}
.subnav__cta{margin-left:auto}
@media (max-width:767px){.subnav__title,.subnav__cta{display:none}}

/* --- шапка --- */
.site-header{position:sticky;top:0;z-index:var(--z-header);height:var(--header-h);transition:background-color var(--dur-3),box-shadow var(--dur-3)}
.site-header.is-scrolled{background:rgba(255,255,255,.78);-webkit-backdrop-filter:blur(16px) saturate(1.5);backdrop-filter:blur(16px) saturate(1.5);box-shadow:0 1px 0 var(--line)}
.site-header__row{height:100%;display:flex;align-items:center;gap:24px}
.site-logo{display:inline-flex;align-items:center;gap:12px;text-decoration:none;flex:none}
.site-logo__img{height:22px;width:auto}
.site-logo__img--light{display:none}
.site-logo__sub{padding-left:12px;border-left:1px solid var(--line-strong);font-size:11px;line-height:1.2;color:var(--fg-muted);white-space:nowrap;font-weight:600;letter-spacing:.07em;text-transform:uppercase}
.site-nav{position:relative;flex:1;display:flex;justify-content:center}
.site-nav__list{display:flex;align-items:center;gap:2px}
.site-nav__link{display:inline-flex;align-items:center;gap:4px;height:38px;padding:0 13px;border:0;border-radius:var(--r-pill);background:transparent;color:var(--fg);font-size:15px;text-decoration:none;transition:background-color var(--dur-2),color var(--dur-2)}
.site-nav__link:hover,.is-open > .site-nav__link{background:rgba(24,24,27,.05)}
.site-nav__link[aria-current="page"]{color:var(--accent-ink)}
.site-nav__link .ico{transition:transform var(--dur-3) var(--ease-out);color:var(--fg-subtle)}
.is-open > .site-nav__link .ico{transform:rotate(180deg)}
.site-nav__item{position:relative}
.site-nav__item:has(.dropdown--mega){position:static}
.dropdown{position:absolute;top:calc(100% + 10px);z-index:5;opacity:0;visibility:hidden;transform:translateY(-6px) scale(.985);transform-origin:top center;
  border-radius:14px;background:var(--surface);box-shadow:inset 0 0 0 1px var(--line),0 .5px 3.6px rgba(24,24,27,.07),0 6.4px 10px rgba(24,24,27,.04),0 15px 24px rgba(24,24,27,.04),0 51px 80px rgba(24,24,27,.05);
  transition:opacity var(--dur-2) var(--ease-out),transform var(--dur-3) var(--ease-out),visibility 0s linear var(--dur-3)}
.dropdown::before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px}
.is-open > .dropdown{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.dropdown--mega{left:50%;translate:-50% 0;width:min(900px,calc(100vw - 48px));padding:12px}
.dropdown--list{left:50%;translate:-50% 0;width:260px;padding:8px}
.mega{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2px}
.mega__item{display:flex;gap:12px;align-items:flex-start;padding:12px;border-radius:10px;text-decoration:none;transition:background-color var(--dur-2)}
.mega__item:hover,.mega__item:focus-visible{background:var(--surface-2)}
.mega__item b{display:block;color:var(--fg);font-weight:500;font-size:var(--fs-sm);line-height:1.35}
.mega__item b + span{display:block;font-size:13px;line-height:1.4;color:var(--fg-subtle);margin-top:2px}
.mega__item .icon-tile{--s:36px;border-radius:10px}
.mega__item:hover .icon-tile{color:#fff;background:linear-gradient(180deg,#FF6A5A,var(--mbs-accent-strong));box-shadow:inset 0 1px 1px rgba(255,255,255,.35)}
.mega__foot{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:8px;padding:12px 12px 4px;border-top:1px solid var(--line);font-size:var(--fs-xs);color:var(--fg-subtle)}
.menu-list{display:grid;gap:2px}
.menu-list__item{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:8px;font-size:var(--fs-sm);color:var(--fg);text-decoration:none;transition:background-color var(--dur-2)}
.menu-list__item .ico{width:18px;height:18px;color:var(--accent-ink)}
.menu-list__item:hover{background:var(--surface-2)}
.site-header__actions{display:flex;align-items:center;gap:10px;flex:none}
.menu-toggle{display:none;width:44px;height:44px;border:0;border-radius:var(--r-pill);background:var(--surface);color:var(--fg);box-shadow:inset 0 0 0 1px var(--line-strong);place-items:center}
.menu-toggle[aria-expanded="true"] .ico{transform:rotate(90deg)}
.menu-toggle .ico{transition:transform var(--dur-3) var(--ease-out)}
/* шапка поверх тёмного первого экрана */
.site-header.is-on-dark:not(.is-scrolled) .site-logo__img--dark{display:none}
.site-header.is-on-dark:not(.is-scrolled) .site-logo__img--light{display:block}
.site-header.is-on-dark:not(.is-scrolled) .site-logo__sub,.site-header.is-on-dark:not(.is-scrolled) .site-nav__link{color:#fff}
.site-header.is-on-dark:not(.is-scrolled) .site-logo__sub{border-color:rgba(255,255,255,.25)}
.site-header.is-on-dark:not(.is-scrolled) .site-nav__link:hover{background:rgba(255,255,255,.1)}
/* тёмный первый экран заезжает под прозрачную шапку */
.site-header.is-on-dark ~ main > [data-theme="dark"]:first-child{margin-top:calc(-1 * var(--header-h));padding-top:calc(var(--header-h) + clamp(48px,6vw,104px))}
@media (max-width:1239px){.site-header__actions .messengers{display:none}}
@media (max-width:1023px){
  .site-nav,.site-header__cta{display:none}
  .menu-toggle{display:grid}
  .site-header__row{justify-content:space-between}
}
@media (max-width:359px){.site-logo__sub{display:none}}
/* мобильное меню: вне шапки (у шапки backdrop-filter, иначе fixed считался бы от неё) */
.mobile-menu{position:fixed;inset:var(--header-h) 0 0;z-index:var(--z-menu);overflow-y:auto;overscroll-behavior:contain;background:var(--bg);padding:12px var(--gutter) calc(32px + env(safe-area-inset-bottom,0px));
  display:flex;flex-direction:column;gap:24px;animation:fade-up var(--dur-3) var(--ease-out)}
.mobile-menu__nav{display:grid}
.mobile-menu__link,.mobile-menu__group summary{display:flex;align-items:center;justify-content:space-between;padding:16px 4px;border-bottom:1px solid var(--line);font-size:1.25rem;font-weight:500;letter-spacing:-.02em;color:var(--fg);text-decoration:none;cursor:pointer;list-style:none}
.mobile-menu__group summary::-webkit-details-marker{display:none}
.mobile-menu__group summary .ico{transition:transform var(--dur-3) var(--ease-out)}
.mobile-menu__group[open] summary .ico{transform:rotate(180deg)}
.mobile-menu__group ul{display:grid;gap:2px;padding:8px 0 12px}
.mobile-menu__group ul a{display:flex;align-items:center;gap:12px;padding:10px 4px;font-size:var(--fs-body);color:var(--fg);text-decoration:none}
.mobile-menu__foot{display:grid;gap:16px;margin-top:auto}
.mobile-menu__foot .messengers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
html.menu-open{overflow:hidden}
@media (min-width:1024px){.mobile-menu{display:none!important}}

/* --- подвал --- */
.site-footer{background:var(--bg-alt);padding-block:clamp(56px,6vw,96px) 32px;border-top:1px solid var(--line);font-size:var(--fs-sm)}
.site-footer__top{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(32px,5vw,80px)}
.site-footer__brand{display:grid;gap:18px;align-content:start}
.site-footer__about{max-width:36ch;color:var(--fg-subtle)}
.site-footer__cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.site-footer__h{font:600 var(--fs-sm)/1.4 var(--font-sans);color:var(--fg);margin-bottom:14px}
.site-footer__cols ul{display:grid;gap:10px}
.site-footer__cols a{color:var(--fg);text-decoration:none}
.site-footer__cols a:hover{color:var(--accent-ink)}
.site-footer__bottom{display:flex;flex-wrap:wrap;gap:10px 24px;align-items:center;margin-top:clamp(40px,5vw,72px);padding-top:24px;border-top:1px solid var(--line);color:var(--fg-subtle);font-size:var(--fs-xs)}
.site-footer__bottom a{color:inherit}
.site-footer__bottom a:hover{color:var(--accent-ink)}
.site-footer__note{margin-left:auto}
@media (max-width:1023px){.site-footer__top{grid-template-columns:minmax(0,1fr)}}
@media (max-width:639px){.site-footer__cols{grid-template-columns:repeat(2,minmax(0,1fr))}.site-footer__note{margin-left:0}}
/* нижняя панель на телефоне */
.bottom-bar{display:none}
@media (max-width:767px){
  .bottom-bar{position:fixed;left:8px;right:8px;bottom:calc(8px + env(safe-area-inset-bottom,0px));z-index:var(--z-bar);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;padding:6px;border-radius:20px;
    background:rgba(255,255,255,.86);-webkit-backdrop-filter:blur(16px) saturate(1.5);backdrop-filter:blur(16px) saturate(1.5);box-shadow:inset 0 0 0 1px var(--line),0 10px 30px rgba(24,24,27,.14)}
  .bottom-bar__item{display:grid;justify-items:center;gap:3px;padding:7px 2px 6px;border-radius:14px;font-size:11px;font-weight:500;color:var(--fg);text-decoration:none;line-height:1.2}
  .bottom-bar__item .ico{width:20px;height:20px}
  .bottom-bar__item--max .ico{color:#5A3CFF}.bottom-bar__item--wa .ico{color:#1DA851}.bottom-bar__item--tg .ico{color:#1E8FCB}
  .bottom-bar__item--cta{background:var(--btn-bg);color:#fff}
  .bottom-bar__item:active{background:var(--surface-2)}
  .bottom-bar__item--cta:active{background:var(--btn-bg-hover)}
  body{padding-bottom:calc(84px + env(safe-area-inset-bottom,0px))}
}

/* =========================================================================
   5. СЕКЦИИ
   ========================================================================= */
/* герой: главная (WorkOS) — крупный заголовок в две строки, вторая — акцент; справа стопка мини-карточек */
.hero{position:relative;isolation:isolate;padding-block:clamp(48px,6vw,104px) clamp(56px,6vw,96px)}
.hero__title{font-family:var(--font-display);font-weight:var(--fw-h1);font-size:var(--fs-display);line-height:1.02;letter-spacing:var(--ls-display);max-width:14ch}
.hero__title em{font-style:normal;font-weight:var(--fw-h1-accent);color:var(--accent-ink);display:block}
.hero__lead{margin-top:24px;max-width:46ch}
.hero__actions{display:flex;flex-wrap:wrap;gap:12px 8px;align-items:center;margin-top:32px}
.hero--home .split{align-items:center}
.toggle-stack{position:relative;display:grid;gap:10px;justify-items:end;padding:24px 0}
.toggle-stack::before{content:"";position:absolute;inset:-10% -20% -10% 10%;z-index:-1;background:repeating-linear-gradient(90deg,rgba(247,75,59,.16) 0 1px,transparent 1px 7px);
  -webkit-mask-image:radial-gradient(60% 55% at 60% 50%,#000,transparent 75%);mask-image:radial-gradient(60% 55% at 60% 50%,#000,transparent 75%)}
.toggle-stack .toggle-card:nth-child(2n){margin-right:56px}
.toggle-stack .toggle-card:nth-child(3n){margin-right:20px}
.toggle-stack .toggle-card.is-dim{opacity:.55}
@media (max-width:1023px){.toggle-stack{justify-items:stretch}.toggle-stack .toggle-card{margin-right:0!important}}
/* лента анонса под героем (WorkOS keynote) */
.announce{display:grid;grid-template-columns:minmax(0,1.3fr) repeat(3,minmax(0,1fr));gap:8px;align-items:stretch;padding:8px;border-radius:var(--r-lg);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line),var(--shadow-md)}
.announce__main{display:flex;gap:14px;align-items:center;padding:6px}
.announce__thumb{flex:none;width:104px;aspect-ratio:16/10;border-radius:10px;background:linear-gradient(135deg,var(--mbs-graphite),#3A1D1D);display:grid;place-items:center;color:#fff}
.announce__thumb span{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.92);color:var(--mbs-graphite)}
.announce__main b{display:block;color:var(--fg);font-weight:500;line-height:1.3}
.announce__tile{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:12px;background:var(--surface-2);text-decoration:none;color:var(--fg);font-weight:500;font-size:var(--fs-sm);transition:background-color var(--dur-2),box-shadow var(--dur-2)}
.announce__tile:hover{background:var(--surface);box-shadow:inset 0 0 0 1px var(--line-strong)}
@media (max-width:1023px){.announce{grid-template-columns:repeat(3,minmax(0,1fr))}.announce__main{grid-column:1/-1}}
@media (max-width:639px){.announce{grid-template-columns:minmax(0,1fr)}.announce__tile{justify-content:flex-start}}
/* герой по центру (Auros) — eyebrow, заголовок, лид, переливающаяся кнопка; фон — WebGL */
.hero--center{text-align:center;min-height:min(92svh,860px);display:grid;align-content:center;justify-items:center;overflow:hidden}
.hero--center .hero__title{max-width:15ch;margin-inline:auto}
.hero--center .hero__lead{margin-inline:auto}
.hero--center .hero__actions{justify-content:center}
.hero--center .eyebrow{margin-bottom:20px}
/* герой страницы (простая страница, цены, сравнение, блог) */
.hero--page{padding-block:clamp(40px,5vw,88px) clamp(32px,4vw,56px)}
.hero--page .hero__title{font-size:var(--fs-h1);max-width:20ch}
.hero__split{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(24px,4vw,64px);align-items:center}
.hero__art{display:block;width:100%;height:auto;max-width:560px;max-height:400px;object-fit:contain;object-position:right center;justify-self:end;margin-block:-24px}
@media (max-width:860px){.hero__split{grid-template-columns:minmax(0,1fr)}.hero__art{display:none}}
.hero--page.center .hero__title,.hero--page.center .hero__lead{margin-inline:auto}
.hero--page.center .hero__actions{justify-content:center}
.hero__chips{margin-top:28px}
.hero--page.center .hero__chips{justify-content:center}
/* герой продукта: текст + стеклянный интерфейс */
.ui-frame{position:relative;border-radius:var(--r-xl);padding:10px;background:var(--glass);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:var(--shadow-glass)}
.ui-frame__screen{border-radius:16px;overflow:hidden;background:var(--surface);box-shadow:inset 0 0 0 1px var(--line);aspect-ratio:16/11}
.ui-frame__bar{display:flex;gap:6px;align-items:center;padding:10px 12px;border-bottom:1px solid var(--line)}
.ui-frame__bar i{width:9px;height:9px;border-radius:50%;background:var(--line-strong)}
.ui-frame__url{margin-left:10px;flex:1;max-width:260px;height:22px;border-radius:var(--r-pill);background:var(--surface-2);font:400 11px/22px var(--font-mono);color:var(--fg-subtle);padding-left:10px;overflow:hidden;white-space:nowrap}
[data-theme="dark"] .ui-frame__screen{background:#0C0C0E}
/* заглушка (иллюстрация/интерфейс делают соседние сессии) */
/* --- иллюстрации: assets/illustrations, прозрачный фон, ~1600px. Сами файлы не правим --- */
.illu{display:block;width:100%;height:auto;max-width:100%}
.illu--media{aspect-ratio:4/3;object-fit:contain}
.illu--aside{width:min(100%,320px)}
.illu-panel{display:grid;place-items:center;aspect-ratio:16/11;padding:clamp(16px,5%,48px);border-radius:var(--r-xl);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line)}
.illu-panel .illu{width:100%;height:100%;object-fit:contain}
.post-card__cover img.illu,.timeline__media img.illu{width:100%;height:100%;object-fit:contain;padding:5% 12%}
.empty__illu{width:min(200px,60%);height:auto}
.state{display:grid;justify-items:center;align-content:start;gap:10px;text-align:center;padding:28px 24px 32px;border-radius:var(--r-xl);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line)}
.state__illu{width:min(220px,80%);height:auto;margin-bottom:6px}
.state p{max-width:32ch;font-size:var(--fs-sm)}
.state .btn{margin-top:6px}
@media (max-width:767px){.split .illu--aside{display:none}}
/* живой фрагмент assets/ui в стеклянной рамке: радиус рамки = радиус фрагмента (24) + отступ (10) */
.ui-frame--live{border-radius:34px}

.slot{position:relative;min-width:0;display:grid;place-items:center;align-content:center;gap:10px;min-height:280px;border-radius:var(--r-xl);padding:24px;text-align:center;color:var(--fg-subtle);font-size:var(--fs-sm);
  background:repeating-linear-gradient(135deg,transparent 0 10px,rgba(24,24,27,.025) 10px 11px),var(--surface-2);box-shadow:inset 0 0 0 1px var(--line);border:1px dashed var(--line-strong)}
.slot .ico{width:32px;height:32px;color:var(--accent-ink)}
.slot b{color:var(--fg);font-weight:500}
.slot code{font:12px var(--font-mono);color:var(--accent-ink)}
[data-theme="dark"] .slot{background:repeating-linear-gradient(135deg,transparent 0 10px,rgba(255,255,255,.03) 10px 11px),rgba(255,255,255,.03)}
.media-split{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:clamp(32px,5vw,80px);align-items:center}
.media-split--reverse{grid-template-columns:minmax(0,5fr) minmax(0,6fr)}
.media-split--reverse .media-split__media{order:2}
.media-split__text{display:grid;gap:16px;align-content:start}
.media-split__text .grid{margin-top:16px}
@media (max-width:1023px){.media-split,.media-split--reverse{grid-template-columns:minmax(0,1fr)}.media-split--reverse .media-split__media{order:0}}
/* ленты логотипов */
.logo-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
@media (max-width:1023px){.logo-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (max-width:639px){.logo-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.logo-grid .logo-tile{height:64px;font-size:.875rem}}
.logo-wall{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.logo-wall .logo-tile{height:auto;aspect-ratio:16/10}
@media (max-width:1023px){.logo-wall{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:639px){.logo-wall{grid-template-columns:repeat(2,minmax(0,1fr))}}
.marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee__track{display:flex;width:max-content;animation:marquee var(--marquee-dur,40s) linear infinite}
.marquee:hover .marquee__track{animation-play-state:paused}
.marquee__group{display:flex;flex:none;align-items:center;gap:clamp(32px,4vw,64px);padding-right:clamp(32px,4vw,64px)}
.marquee__item{display:inline-flex;align-items:center;gap:12px;white-space:nowrap;color:var(--fg);font-size:clamp(1.0625rem,1rem + .5vw,1.375rem);font-weight:500;letter-spacing:-.02em}
.marquee__item::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--accent)}
.marquee--logos .marquee__item{color:var(--fg-subtle);font-weight:600}
.marquee--logos .marquee__item::before{display:none}
@keyframes marquee{to{transform:translateX(-50%)}}
/* тёмная полоса с кодом (WorkOS «Developer-first») */
.dark-band{position:relative;overflow:hidden}
.dark-band::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(60% 50% at 50% 0%,rgba(247,75,59,.28),transparent 70%),radial-gradient(50% 60% at 100% 100%,rgba(192,48,31,.18),transparent 70%)}
.dark-band .fx-gl + .container{position:relative}
/* бенто (Auros «in numbers» + артефакт) */
.bento{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-rows:minmax(220px,auto);gap:12px}
.bento__card{position:relative;overflow:hidden;isolation:isolate;display:grid;align-content:space-between;gap:32px;padding:clamp(20px,2.2vw,32px);border-radius:var(--r-lg);background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--line)}
.bento__card canvas{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
/* пиксельный след на любой карточке: холст под содержимым, по скруглению */
[data-fx="pixels"]{position:relative;overflow:hidden;isolation:isolate}
[data-fx="pixels"]>canvas{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
.bento__card .stat__num{font-size:clamp(3rem,2rem + 3.5vw,5.25rem)}
.bento__card p{font-size:var(--fs-sm);max-width:36ch;margin-top:10px}
.bento__card--tall{grid-column:span 4;grid-row:span 2;background:linear-gradient(180deg,#FFE3DD 0%,#FFF8F6 100%);box-shadow:inset 0 0 0 1px var(--line-accent)}
.bento__card--wide{grid-column:span 8}
.bento__card--half{grid-column:span 4}
.bento__card--ink{background:var(--mbs-graphite);box-shadow:none;color:#D4D4D8}
.bento__card--ink .stat__num{color:#FFD3CA}
.bento__card--ink .stat__label{color:#AEAEB1}
[data-theme="dark"] .bento__card{background:rgba(255,255,255,.04)}
[data-theme="dark"] .bento__card--tall{background:linear-gradient(180deg,#FFD3CA 0%,#FFF4F1 100%)}
[data-theme="dark"] .bento__card--tall .stat__num,[data-theme="dark"] .bento__card--tall .stat__label{color:var(--mbs-ink)}
[data-theme="dark"] .bento__card--tall p{color:#4A3A40}
@media (max-width:1023px){.bento{grid-auto-rows:auto}.bento__card--tall,.bento__card--wide,.bento__card--half{grid-column:span 12;grid-row:auto}}
.reel{display:inline-block;height:1em;overflow:hidden;vertical-align:top}
.reel > span{display:block}
.reel i{display:block;font-style:normal;height:1em;line-height:1}
/* ряд крупных цифр (SSO «Built for the most demanding apps») */
.numbers{display:grid;grid-template-columns:repeat(var(--cols,3),minmax(0,1fr))}
.numbers > *{padding:4px clamp(20px,3vw,40px);border-left:1px solid var(--line)}
.numbers > :first-child{border-left:0;padding-left:0}
/* цифра не шире своей колонки: размер от ширины ячейки; слово вместо числа — мельче */
.numbers{container-type:inline-size;--cell:calc((100cqi - (var(--cols,3) - 1) * 2 * clamp(20px,3vw,40px)) / var(--cols,3))}
.numbers .stat__num{font-size:min(var(--fs-stat),calc(var(--cell) * .3));white-space:nowrap}
.numbers .stat__num--word{font-size:min(var(--fs-stat),calc(var(--cell) * .2))}
@media (max-width:767px){.numbers{--cell:100cqi}}
@media (max-width:767px){.numbers{grid-template-columns:minmax(0,1fr);gap:24px}.numbers > *{border-left:0;padding:0 0 24px;border-bottom:1px solid var(--line)}.numbers > :last-child{border-bottom:0}}
/* процесс с липкой картинкой (артефакт «дожим») */
.sticky-steps{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,5vw,72px);align-items:start}
.sticky-steps__list{display:grid}
.sticky-step{min-height:30svh;display:grid;align-content:center;gap:10px;padding-block:16px}
.sticky-step h3{color:var(--fg-subtle);transition:color var(--dur-3) var(--ease-out)}
.sticky-step.is-active h3{color:var(--fg)}
.sticky-step .eyebrow{color:var(--fg-subtle)}
.sticky-step.is-active .eyebrow{color:var(--accent-ink)}
.sticky-steps__fig{position:sticky;top:calc(var(--header-h) + 24px);display:grid;gap:12px}
.sticky-steps__fig canvas{width:100%;height:min(54svh,480px);border-radius:var(--r-lg);background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--line)}
@media (max-width:1023px){
  .sticky-steps{grid-template-columns:minmax(0,1fr);gap:0}
  .sticky-steps__fig{order:-1;top:var(--header-h);z-index:2;background:var(--bg);padding-block:8px}
  .section--alt .sticky-steps__fig{background:var(--bg-alt)}
  .sticky-steps__fig canvas{height:32svh}
  .sticky-step{min-height:26svh}
}
/* «линии» с каплями (Auros Explore + goo) */
.explore{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:12px;padding:12px;border-radius:var(--r-xl);background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--line)}
.explore__list{display:grid;gap:4px;align-content:start;padding:clamp(12px,1.5vw,20px)}
.explore__list .section-head{margin-bottom:12px;padding:8px 12px}
.explore__stage{position:relative;min-height:460px;border-radius:var(--r-lg);overflow:hidden;background-color:var(--surface);background-image:radial-gradient(rgba(24,24,27,.10) 1px,transparent 1.4px);background-size:28px 28px;box-shadow:inset 0 0 0 1px var(--line)}
.explore__stage svg{position:absolute;inset:0;margin:auto;width:min(92%,520px);height:auto}
.explore__cta{position:absolute;top:16px;right:16px;z-index:1}
[data-theme="dark"] .explore{background:rgba(255,255,255,.03)}
[data-theme="dark"] .explore__stage{background-color:rgba(255,255,255,.02);background-image:radial-gradient(rgba(255,211,202,.14) 1px,transparent 1.4px)}
@media (max-width:1023px){.explore{grid-template-columns:minmax(0,1fr)}.explore__stage{order:-1;min-height:320px}}
.goo-balls{fill:var(--accent)}
.goo-dots{fill:#fff}
[data-theme="dark"] .goo-balls{fill:#FFD3CA}
[data-theme="dark"] .goo-dots{fill:var(--bg)}
/* схема-дерево (WorkOS Directory Sync) */
.flow{position:relative;display:grid;grid-template-columns:repeat(var(--n,3),minmax(0,1fr));gap:24px;padding-top:72px}
.flow::before{content:"";position:absolute;top:0;left:50%;width:1px;height:36px;background:var(--line-strong)}
.flow::after{content:"";position:absolute;top:36px;left:calc(100%/var(--n,3)/2);right:calc(100%/var(--n,3)/2);height:36px;border:1px solid var(--line-strong);border-bottom:0;border-radius:16px 16px 0 0}
.flow__node{position:relative;display:grid;gap:10px;justify-items:center;text-align:center}
.flow__node::before{content:"";position:absolute;top:-8px;width:9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px var(--bg)}
.flow__node p{font-size:var(--fs-sm);color:var(--fg-subtle);max-width:28ch}
.flow__root{display:flex;justify-content:center;margin-bottom:-36px}
@media (max-width:767px){.flow{grid-template-columns:minmax(0,1fr);padding-top:24px}.flow::before,.flow::after,.flow__node::before{display:none}}
/* отзывы: стопка карточек с переключателем логотипов (WorkOS) */
.testimonials{display:grid;gap:28px;justify-items:center}
.testimonials__stage{position:relative;width:min(100%,640px);display:grid}
.testimonials__stage > .quote{grid-area:1/1;transition:opacity var(--dur-4) var(--ease-out),transform var(--dur-4) var(--ease-out)}
.testimonials__stage > .quote:not(.is-active){opacity:0;transform:translate(24px,12px) rotate(1.5deg);pointer-events:none}
.testimonials__stage::after{content:"";grid-area:1/1;z-index:-1;border-radius:var(--r-lg);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line),var(--shadow-sm);transform:translate(14px,10px) rotate(1.5deg)}
.testimonials__logos{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 8px}
.testimonials__logos button{border:0;background:none;padding:10px 16px;border-radius:var(--r-pill);font-weight:600;letter-spacing:-.02em;color:var(--fg-subtle);font-size:1.0625rem;transition:color var(--dur-2),background-color var(--dur-2)}
.testimonials__logos button:hover{color:var(--fg)}
.testimonials__logos button[aria-selected="true"]{color:var(--fg);background:var(--surface-2)}
/* тарифы, калькулятор */
.plans{display:grid;grid-template-columns:repeat(var(--plans,2),minmax(0,1fr));gap:16px;max-width:var(--plans-max,880px);margin-inline:auto}
@media (max-width:767px){.plans{grid-template-columns:minmax(0,1fr)}}
.calc{display:grid;grid-template-columns:minmax(0,1fr) 300px;border-radius:var(--r-xl);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line),var(--shadow-md);overflow:hidden}
.calc__main{display:grid;gap:24px;padding:clamp(20px,3vw,32px)}
.calc__head{display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.calc__head h3{font-size:var(--fs-h4)}
.calc__head p{font-size:var(--fs-sm);color:var(--fg-subtle)}
.calc__head .link-arrow{margin-left:auto}
.calc__value{display:flex;align-items:baseline;gap:8px;color:var(--fg)}
.calc__value b{font-size:1.25rem;font-weight:500;font-variant-numeric:tabular-nums}
.calc__value span{font-size:var(--fs-sm);color:var(--fg-subtle)}
.calc__total{font-family:var(--font-display);display:flex;align-items:baseline;gap:8px;font-size:clamp(1.75rem,1.4rem + 1.2vw,2.25rem);font-weight:500;letter-spacing:-.03em;color:var(--fg);font-variant-numeric:tabular-nums}
.calc__total small{font-size:var(--fs-sm);font-weight:400;color:var(--fg-subtle);letter-spacing:0}
.calc__side{padding:clamp(20px,3vw,28px);background:var(--surface-2);border-left:1px solid var(--line);display:grid;gap:12px;align-content:start;font-size:var(--fs-sm)}
.calc__side h4{font-size:var(--fs-sm);color:var(--fg)}
.tiers{display:grid;gap:2px}
.tiers li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 10px;border-radius:8px;font-variant-numeric:tabular-nums;transition:background-color var(--dur-2)}
.tiers li b{color:var(--fg);font-weight:500}
.tiers li.is-active{background:var(--surface);box-shadow:inset 0 0 0 1px var(--line-accent)}
.tiers .badge{height:20px;font-size:11px}
@media (max-width:767px){.calc{grid-template-columns:minmax(0,1fr)}.calc__side{border-left:0;border-top:1px solid var(--line)}}
[data-theme="dark"] .calc,[data-theme="dark"] .price-card:not(.price-card--featured){background:rgba(255,255,255,.04)}
[data-theme="dark"] .calc__side{background:rgba(255,255,255,.03)}
/* сравнение: шапка с двумя колонками */
.compare-head{display:grid;grid-template-columns:26% minmax(0,1fr) minmax(0,1fr)}
/* CTA */
.cta-center{display:grid;justify-items:center;text-align:center;gap:20px}
.cta-center .h1{font-size:var(--fs-h1);max-width:16ch}
.cta-form{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:40px clamp(32px,6vw,96px);align-items:start;padding:clamp(28px,4vw,56px);border-radius:var(--r-xl);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line),var(--shadow-lg)}
.cta-form__aside{display:grid;gap:16px;align-content:start}
/* на широком экране правая колонка (картинка и «Что будет после заявки») едет вниз рядом с длинной формой */
@media (min-width:1024px){.cta-form__aside{position:sticky;top:calc(var(--header-h) + 32px)}}
.cta-form__aside ul{display:grid;gap:12px;margin-top:8px}
.cta-form__aside li{display:flex;gap:10px;font-size:var(--fs-sm)}
.cta-form__aside li .ico{color:var(--accent);width:18px;height:18px;margin-top:1px}
@media (max-width:1023px){.cta-form{grid-template-columns:minmax(0,1fr)}}
[data-theme="dark"] .cta-form{background:rgba(255,255,255,.04)}
/* подписка в строку */
.subscribe{display:flex;gap:8px;max-width:440px}
.subscribe .input{flex:1}
@media (max-width:479px){.subscribe{flex-direction:column}}
/* блог */
.blog-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:20px;margin-bottom:32px}
.blog-tools{display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;margin-bottom:28px}
.blog-tools .input-group{width:min(100%,280px)}
.blog-tools .input{min-height:38px;padding-block:8px;border-radius:var(--r-pill)}
.post-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 24px}
@media (max-width:1023px){.post-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:639px){.post-grid{grid-template-columns:minmax(0,1fr)}}
/* статья */
.article{display:grid;grid-template-columns:220px minmax(0,1fr);gap:clamp(32px,5vw,80px);align-items:start}
.article__head{display:grid;gap:18px;max-width:var(--container-text);margin-bottom:32px}
.article__head h1{font-size:clamp(2rem,1.6rem + 2vw,3.25rem)}
.article__bar{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;padding-block:14px;border-block:1px solid var(--line);margin-bottom:32px;max-width:var(--container-text)}
.callout{display:flex;gap:12px;padding:18px 20px;border-radius:var(--r-md);background:var(--mbs-blush);box-shadow:inset 0 0 0 1px var(--line-accent);color:var(--fg);font-size:var(--fs-sm);line-height:1.6}
.callout .ico{color:var(--accent-ink);margin-top:2px}
[data-theme="dark"] .callout{background:rgba(247,75,59,.1);box-shadow:inset 0 0 0 1px rgba(247,75,59,.28)}
[data-theme="dark"] .callout .ico,[data-theme="dark"] .callout b{color:#FFB4A6}
@media (max-width:1023px){.article{grid-template-columns:minmax(0,1fr)}.article > .toc{display:none}}
/* текст, проявляющийся по словам; разъезжающиеся строки */
.statement{font-family:var(--font-display);font-size:clamp(1.625rem,1.2rem + 2vw,3rem);line-height:1.18;letter-spacing:-.032em;font-weight:500;color:var(--fg);max-width:22ch;margin-inline:auto;text-align:center;text-wrap:balance}
.statement .w{transition:color .3s linear}
.bigtext{overflow:clip;padding-block:1vw 4vw}
.bigtext__line{font-family:var(--font-display);display:block;width:max-content;font-size:var(--fs-mega);font-weight:500;line-height:1.04;letter-spacing:-.055em;padding-bottom:.08em;color:transparent;
  background:var(--grad-type);-webkit-background-clip:text;background-clip:text;will-change:transform}

/* =========================================================================
   5б. БЛОКИ СТРАНИЦ РАЗДЕЛА (добавлены при сборке страниц, 10.11.2026)
   ========================================================================= */
/* логотип из двух ссылок: знак МБС ведёт на mbsgroup.ru, подпись — на главную раздела */
.site-logo__mark{display:inline-flex;align-items:center}
a.site-logo__sub{text-decoration:none;transition:color var(--dur-2)}
a.site-logo__sub:hover{color:var(--fg)}
.site-footer .site-logo{margin-bottom:4px}
/* список с галочками; --2 — в две колонки */
.checks{display:grid;gap:12px;padding:0;list-style:none}
.checks li{display:grid;grid-template-columns:20px minmax(0,1fr);gap:12px;font-size:var(--fs-body);line-height:1.55;color:var(--fg-muted)}
.checks li > .ico{width:18px;height:18px;margin-top:3px;color:var(--accent-ink)}
.checks li b{color:var(--fg);font-weight:500}
.checks--2{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 40px}
.checks--sm li{font-size:var(--fs-sm)}
@media (max-width:767px){.checks--2{grid-template-columns:minmax(0,1fr)}}
[data-theme="dark"] .checks li > .ico{color:#FF8A6B}
/* «что даёт» под пунктом */
.gain{margin-top:6px;font-size:var(--fs-sm);line-height:1.55;color:var(--fg-muted)}
.gain b{color:var(--accent-ink);font-weight:500}
[data-theme="dark"] .gain b{color:#FFB4A6}
/* превью работ: снимок презентации или эскиза с подписью, без ссылки */
.shots{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:clamp(16px,2vw,24px)}
.shot{display:grid;gap:12px;align-content:start;margin:0}
.shot__img{aspect-ratio:1200/630;border-radius:var(--r-lg);overflow:hidden;background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--line),var(--shadow-md)}
.shot__img img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease-out)}
.shot:hover .shot__img img{transform:scale(1.025)}
.shot figcaption{display:grid;gap:2px;font-size:var(--fs-sm);line-height:1.5;color:var(--fg-subtle)}
.shot figcaption b{color:var(--fg);font-weight:500;font-size:var(--fs-h5)}
.shots__title{margin:clamp(32px,4vw,48px) 0 20px}
/* этап работы: крупный номер, название, условие оплаты */
.stage__head{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(16px,3vw,40px);align-items:start;margin-bottom:clamp(28px,3.5vw,48px)}
.stage__num{display:grid;place-items:center;width:clamp(64px,7vw,96px);aspect-ratio:1;border-radius:var(--r-xl);font:500 clamp(2rem,1.4rem + 2.4vw,3.5rem)/1 var(--font-display);letter-spacing:-.04em;color:var(--accent-ink);background:var(--accent-soft);box-shadow:inset 0 0 0 1px var(--line-accent)}
.stage__title{display:grid;gap:14px;justify-items:start;max-width:760px}
.stage__title .lead{color:var(--fg-muted)}
[data-theme="dark"] .stage__num{color:#FFD3CA;background:rgba(247,75,59,.16)}
/* номер этапа — цифра 01–08 из набора пака (assets/illustrations/number-NN.webp, копии в illu-icons) вместо плитки */
.stage__num--img,[data-theme="dark"] .stage__num--img{width:clamp(104px,11vw,168px);aspect-ratio:auto;background:none;box-shadow:none;border-radius:0}
.stage__num--img img{display:block;width:100%;height:auto;filter:drop-shadow(0 10px 18px rgba(247,75,59,.22))}
.stage__body{align-items:start}
.stage__body h3{font-size:var(--fs-h4);margin-bottom:16px}
.stage__fig{position:sticky;top:96px}
@media (max-width:1023px){.stage__fig{position:static}}
.stage__loop{display:flex;align-items:center;gap:8px;font:500 var(--fs-sm)/1.4 var(--font-sans);color:var(--accent-ink)}
/* человек: фото, имя, роль, действие */
.person{display:grid;grid-template-columns:auto minmax(0,1fr);gap:20px;align-items:center;padding:clamp(20px,2.4vw,28px);border-radius:var(--r-xl);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line),var(--shadow-md)}
.person__photo{width:clamp(88px,9vw,120px);aspect-ratio:1;border-radius:50%;object-fit:cover;box-shadow:0 0 0 4px var(--surface),0 0 0 5px var(--line-accent)}
.person__name{font-family:var(--font-display);font-size:var(--fs-h4);font-weight:500;color:var(--fg);letter-spacing:-.02em}
.person__role{font-size:var(--fs-sm);color:var(--fg-subtle);margin:4px 0 14px}
@media (max-width:479px){.person{grid-template-columns:minmax(0,1fr);justify-items:start}}
/* человек в тёмной теме — как баннер «Бесплатный разбор»: графит, коралловое свечение, бегущая грань, пиксели (data-fx="pixels" data-tone="ink") */
.person--ink{position:relative;isolation:isolate;overflow:hidden;color:#C7C7CC;
  background:radial-gradient(42% 140% at 100% 50%,rgba(247,75,59,.34),transparent 70%),radial-gradient(26% 120% at 0% 50%,rgba(247,75,59,.12),transparent 70%),var(--mbs-graphite);
  box-shadow:inset 0 1px 1px rgba(255,255,255,.08),0 30px 60px -30px rgba(24,24,27,.5)}
.person--ink .person__photo{box-shadow:0 0 0 4px var(--mbs-graphite),0 0 0 5px rgba(247,75,59,.7),0 12px 30px -10px rgba(247,75,59,.6)}
.person--ink .person__name{color:#fff}
.person--ink .person__role{color:#AEAEB1}
/* раскрывашка «Ещё N пунктов» */
.more{margin-top:16px}
.more > summary{display:inline-flex;align-items:center;gap:8px;min-height:44px;cursor:pointer;list-style:none;font-weight:500;color:var(--accent-ink)}
.more > summary::-webkit-details-marker{display:none}
.more > summary .ico{transition:transform var(--dur-3) var(--ease-out)}
.more[open] > summary .ico{transform:rotate(180deg)}
.more > .checks{margin-top:12px}
/* заглушка текста, который ещё пишется: рамка пунктиром */
.ph-box{padding:18px 20px;border-radius:var(--r-md);border:1px dashed var(--line-accent);background:repeating-linear-gradient(135deg,transparent 0 10px,rgba(247,75,59,.035) 10px 20px);color:var(--fg-muted);font-size:var(--fs-sm);line-height:1.6}
.ph-box b{display:block;margin-bottom:4px;font:600 var(--fs-sm)/1.4 var(--font-sans);color:var(--accent-ink)}
/* четыре обещания под заголовком тёмного героя */
.hero-points{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;width:100%;max-width:1120px;margin-top:clamp(40px,6vw,72px);text-align:left}
/* стекло прозрачнее (Андрей 10.11): частицы за карточкой видны, размытие слабое, грань и блик остаются */
.hero-point{display:grid;gap:8px;align-content:start;padding:18px 20px;border-radius:var(--r-lg);background:linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.015) 60%);-webkit-backdrop-filter:blur(3px) saturate(1.2);backdrop-filter:blur(3px) saturate(1.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.14),inset 0 0 0 1px rgba(255,255,255,.1)}
.hero-point b{display:flex;gap:10px;align-items:center;color:#fff;font-weight:500;font-size:var(--fs-h5);line-height:1.3}
.hero-point b .ico{flex:none;color:#FF8A6B}
.hero-point span{font-size:var(--fs-sm);line-height:1.5;color:#D4D4D8}
@media (max-width:1023px){.hero-points{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:539px){.hero-points{grid-template-columns:minmax(0,1fr)}}
/* сетка карточек в две колонки (кейсы, «ещё в рубрике») */
.post-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
@media (max-width:639px){.post-grid--2{grid-template-columns:minmax(0,1fr)}}
/* обложка статьи: иллюстрация на мягкой подложке */
.article__cover{max-width:var(--container-text);aspect-ratio:16/8;margin-bottom:40px;border-radius:var(--r-xl);overflow:hidden;display:grid;place-items:center;background:linear-gradient(135deg,var(--accent-soft),var(--surface-2) 60%);box-shadow:inset 0 0 0 1px var(--line)}
.article__cover .illu{width:auto;height:92%;object-fit:contain}
.article .card{max-width:var(--container-text)}
/* компактная история: узкая колонка годов */
@media (min-width:768px){
  .timeline--compact{gap:28px}
  .timeline--compact::before{left:64px}
  .timeline--compact .timeline__item{grid-template-columns:64px minmax(0,1fr);gap:32px}
  .timeline--compact .timeline__date{font-size:var(--fs-sm)}
}
.timeline--compact .timeline__body p{color:var(--fg-muted)}
/* опции тарифа со ссылкой на описание */
.price-card li a{color:inherit;text-decoration:underline;text-decoration-color:var(--line-strong);text-underline-offset:3px}
.price-card li a:hover{text-decoration-color:currentColor}
.price-card li b{color:var(--fg);font-weight:500}
.price-card--featured li b{color:#fff}
.price-card--featured li a{text-decoration-color:rgba(255,255,255,.3)}
.price-card .link-arrow{margin-top:auto}
.plans--4{--plans:4}
@media (max-width:1180px){.plans--4{--plans:2}}
/* --- сборка дашборда при прокрутке (data-dash-build, fx/dash.js) ---
   Холст 1152×602 (на телефоне 340×926) масштабируется под ширину; блоки .db-piece стоят по координатам --x/--y/--w/--h
   (на телефоне --mx/--my/--mw/--mh, .db-piece--dt скрыт). На компьютере секция закрепляется, блоки слетаются по прокрутке. */
.dash-build{padding-block:var(--section-y);overflow:clip}
.dash-build__track{position:relative}
.dash-build__sticky{display:flex;align-items:center}
.dash-build__inner{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(20px,2.4vw,32px);width:100%}
.dash-build__head{display:grid;gap:12px;max-width:62ch}
.dash-build__head .lead{color:#AEAEB1}
.dash-build__stage{display:grid;gap:10px;min-height:0}
.dash-build__frame{position:relative;width:100%;border-radius:clamp(18px,2vw,28px);padding:calc(24px * var(--s,1));
  background:radial-gradient(120% 90% at 100% 100%,rgba(247,75,59,.16),transparent 55%),linear-gradient(180deg,#1C1C1F,#121214);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),0 40px 80px rgba(0,0,0,.45);perspective:1800px}
.dash-build__canvas{position:relative;width:1152px;height:602px;transform-origin:0 0;transform:scale(var(--s,1));transform-style:preserve-3d}
.db-piece{position:absolute;left:calc(var(--x) * 1px);top:calc(var(--y) * 1px);width:calc(var(--w) * 1px);height:calc(var(--h) * 1px);
  display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:16px;color:#E4E4E7;font:400 13px/1.35 var(--font-sans);
  background:rgba(255,255,255,.045);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);backface-visibility:hidden}
.dash-build.is-js .db-piece{opacity:0;will-change:transform,opacity}
.dash-build.is-built .db-piece{will-change:auto}
.db-top,.db-greet{background:none;box-shadow:none;padding:0}
.db-top{justify-content:space-between}
.db-logo{height:20px;width:auto;margin-left:4px}
.db-pill{padding:8px 16px;border-radius:999px;background:#fff;color:#18181B;font-weight:600;font-size:13px}
.db-greet{flex-direction:column;align-items:flex-start;justify-content:center;gap:6px}
.db-hello{font:200 36px/1.05 var(--font-display);letter-spacing:-.03em;color:#fff}
.db-sub,.db-site__name span{font-size:12px;color:#8E8E93}
.db-num{flex-direction:column;align-items:stretch;justify-content:space-between;gap:4px;padding:12px 16px}
.db-val{font:200 36px/1 var(--font-display);letter-spacing:-.04em;color:#fff;font-variant-numeric:tabular-nums}
.db-num--accent .db-val{color:#FF8A7A}
.db-lab{display:flex;align-items:center;gap:6px;font-size:12px;color:#A1A1A6}
.db-lab .ico{color:#8E8E93}
.db-delta{display:inline-block;padding:2px 7px;border-radius:999px;background:rgba(52,199,123,.14);color:#5BD99A;font:600 11px/1.3 var(--font-sans)}
.db-spark{position:absolute;right:14px;top:16px;width:34%;height:26px;overflow:visible}
.db-spark__line{fill:none;stroke:#FF7A6C;stroke-width:1.6;vector-effect:non-scaling-stroke}
.db-spark__area{fill:rgba(255,122,108,.16)}
.db-ava{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:50%;background:linear-gradient(180deg,#DE4234,#A32517);color:#fff;font-weight:600}
.db-site__name{display:grid;gap:2px;min-width:0}
.db-site__name b{font:500 16px/1.25 var(--font-sans);color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.db-btn{margin-left:auto;display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);font-size:13px;color:#fff;white-space:nowrap}
.db-chart{flex-direction:column;align-items:stretch;gap:12px;padding:16px}
.db-big{display:flex;align-items:flex-start;gap:10px}
.db-big .db-val{font-size:44px}
.db-big span:not(.db-delta){font-size:12px;color:#8E8E93;line-height:1.3;margin-top:4px}
.db-bars{flex:1;display:grid;grid-template-columns:repeat(7,1fr);gap:10px;align-items:end;min-height:0}
.db-bar{display:grid;grid-template-rows:1fr auto;justify-items:center;gap:6px;height:100%}
.db-bar i{position:relative;align-self:end;width:min(14px,60%);height:calc(var(--v) * 100%);border-radius:999px;background:linear-gradient(180deg,rgba(255,255,255,.9),rgba(255,255,255,.16));transition:height .7s cubic-bezier(.16,1,.3,1)}
.db-bar span{font-size:11px;color:#8E8E93}
.db-bar.is-today i{background:linear-gradient(180deg,#FF6A5A,#C0301F);box-shadow:0 0 24px rgba(247,75,59,.45)}
.db-bar em{position:absolute;left:50%;top:-26px;translate:-50% 0;padding:3px 7px;border-radius:999px;background:#F74B3B;color:#fff;font:600 11px/1.2 var(--font-sans);font-style:normal;white-space:nowrap}
.db-mini{flex-direction:column;align-items:flex-start;justify-content:space-between;padding:14px}
.db-mini .db-val{font-size:34px}
.db-mini .db-spark{top:auto;bottom:14px;right:14px;width:40%;height:24px}
.db-path{justify-content:space-between}
.db-conv{font:200 34px/1 var(--font-display);letter-spacing:-.03em;color:#fff}
.db-row{gap:12px;padding:8px 14px}
.db-row__ic{display:grid;place-items:center;flex:none;width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.08);color:#E4E4E7}
.db-row__ic .ico{width:16px;height:16px}
.db-row .db-site__name b{font-size:13.5px}
.db-row .db-site__name span{font-size:11px}
.db-row__v{margin-left:auto;font:500 15px/1 var(--font-sans);color:#fff;font-variant-numeric:tabular-nums}
.db-row__ok{width:16px;height:16px;flex:none;color:#F74B3B}
.db-piece.is-ping{animation:db-ping 1.4s var(--ease-out)}
@keyframes db-ping{0%{box-shadow:inset 0 0 0 1px rgba(247,75,59,.9),0 0 0 0 rgba(247,75,59,.5)}100%{box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),0 0 0 14px rgba(247,75,59,0)}}
@media (min-width:900px) and (min-height:560px){
  .dash-build{--pin-y:clamp(24px,4.5vh,48px);padding-block:calc(var(--section-y) - var(--pin-y))}
  .dash-build__track{height:260vh}
  .dash-build__sticky{position:sticky;top:var(--header-h);height:calc(100svh - var(--header-h));padding-block:var(--pin-y)}
  .dash-build__inner{height:100%;grid-template-rows:auto minmax(0,1fr)}
  .dash-build__head{grid-template-columns:minmax(0,1fr) minmax(0,1fr);max-width:none;align-items:first baseline;gap:12px 48px}
  .dash-build__stage{align-content:start;justify-items:center}
}
@media (max-width:899px),(max-height:559px){
  .dash-build__canvas{width:340px;height:926px}
  .db-piece{left:calc(var(--mx,0) * 1px);top:calc(var(--my,0) * 1px);width:calc(var(--mw,0) * 1px);height:calc(var(--mh,0) * 1px)}
  .db-piece--dt{display:none}
  .db-val{font-size:30px}
  .db-hello{font-size:28px}
  .db-num .db-spark{display:none}
  .db-chart .db-big .db-val{font-size:38px}
}
@media (prefers-reduced-motion:reduce){.db-bar i{transition:none}.db-piece.is-ping{animation:none}}
/* команда: «Вы ⇄ общий чат ⇄ Мы», тёмная панель дня, итоги (главная, #team) */
.duo{display:grid;grid-template-columns:minmax(0,1fr) clamp(200px,20vw,280px) minmax(0,1fr);align-items:stretch}
.duo__side{display:grid;gap:clamp(20px,2.4vw,32px);align-content:start;padding:clamp(28px,3.4vw,48px);border-radius:28px;background:var(--surface);box-shadow:inset 0 0 0 1px var(--line),0 24px 60px -36px rgba(24,24,27,.28)}
.duo__name{font:var(--fw-h1) clamp(4rem,2.6rem + 4.4vw,7rem)/.9 var(--font-display);letter-spacing:-.04em;color:var(--fg)}
.duo__side--we .duo__name{color:var(--accent)}
.duo__list{display:grid}
.duo__list li{display:grid;gap:2px;padding:16px 0;border-top:1px solid var(--line);font-size:var(--fs-h5);line-height:1.4;color:var(--fg)}
.duo__list li:last-child{padding-bottom:0}
.duo__list b{font-weight:var(--fw-semibold)}
.duo__list span{color:var(--fg-muted);font-size:var(--fs-body)}
.duo__link{position:relative;display:grid;justify-items:center;gap:14px;text-align:center;align-self:stretch;align-content:center}
.duo__link::before,.duo__link::after{content:"";position:absolute;left:0;right:0;top:50%;height:2px;margin-top:-1px;z-index:0;
  background:linear-gradient(90deg,transparent,var(--accent),transparent) no-repeat,linear-gradient(var(--line-strong),var(--line-strong));
  background-size:34% 100%,100% 1px;background-position:-40% 0,0 50%;animation:duo-pulse 2.6s cubic-bezier(.45,0,.25,1) infinite}
.duo__link::after{background-image:linear-gradient(90deg,transparent,var(--accent),transparent);background-size:34% 100%;animation-direction:reverse;animation-delay:-1.3s}
@keyframes duo-pulse{to{background-position:140% 0,0 50%}}
.duo__hub{position:relative;z-index:1;display:grid;justify-items:center}
.duo__ico{display:grid;place-items:center;width:clamp(120px,11vw,156px);aspect-ratio:1;border-radius:30%;color:#fff;background:linear-gradient(160deg,#FF6A57,var(--accent) 55%,#C0301F);box-shadow:inset 0 2px 2px rgba(255,255,255,.35),inset 0 -6px 16px rgba(120,20,10,.25),0 24px 48px -16px rgba(247,75,59,.75);animation:duo-ring 2.6s ease-out infinite}
.duo__ico .ico{width:46%;height:46%;stroke-width:1.6}
@keyframes duo-ring{0%{box-shadow:inset 0 2px 2px rgba(255,255,255,.35),inset 0 -6px 16px rgba(120,20,10,.25),0 24px 48px -16px rgba(247,75,59,.75),0 0 0 0 rgba(247,75,59,.32)}100%{box-shadow:inset 0 2px 2px rgba(255,255,255,.35),inset 0 -6px 16px rgba(120,20,10,.25),0 24px 48px -16px rgba(247,75,59,.75),0 0 0 26px rgba(247,75,59,0)}}
.duo__cap{position:absolute;top:100%;left:50%;translate:-50% 0;margin-top:22px;display:grid;gap:2px;justify-items:center;text-align:center;white-space:nowrap;text-shadow:0 0 2px #F7F7F7,0 0 6px #F7F7F7,0 0 14px #F7F7F7}
.duo__cap b{font:500 var(--fs-h4)/1.2 var(--font-display);letter-spacing:-.02em;color:var(--fg)}
.duo__cap span{font-size:var(--fs-sm);color:var(--fg-muted)}
.team-top{position:relative;isolation:isolate}
.team-top > .fx-gl{z-index:-1;-webkit-mask-image:linear-gradient(transparent,#000 14%,#000 72%,transparent);mask-image:linear-gradient(transparent,#000 14%,#000 72%,transparent)}
@media (max-width:899px){
  .duo{grid-template-columns:minmax(0,1fr)}
  .duo__link{padding:28px 0 76px}
  .duo__link::before,.duo__link::after{left:50%;right:auto;top:0;bottom:60px;width:2px;height:auto;margin:0 0 0 -1px;
    background-image:linear-gradient(180deg,transparent,var(--accent),transparent),linear-gradient(var(--line-strong),var(--line-strong));background-size:100% 34%,1px 100%;background-position:0 -40%,50% 0;animation-name:duo-pulse-v}
  .duo__link::after{background-image:linear-gradient(180deg,transparent,var(--accent),transparent);background-size:100% 34%}
}
@keyframes duo-pulse-v{to{background-position:0 140%,50% 0}}

.dayband{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,5vw,80px);align-items:center;margin-top:clamp(56px,7vw,104px);padding:clamp(28px,4.4vw,64px);border-radius:32px;background:var(--bg);overflow:hidden;position:relative;isolation:isolate}
.dayband .h3{color:#fff;margin-bottom:clamp(24px,3vw,36px)}
.dayband__media{display:grid;gap:10px}
.dayline{position:relative;display:grid;gap:0}
.dayline::before{content:"";position:absolute;left:5px;top:10px;bottom:10px;width:1px;background:var(--line-strong)}
.dayline__item{position:relative;display:grid;gap:4px;padding:0 0 clamp(20px,2.4vw,28px) 32px}
.dayline__item:last-child{padding-bottom:0}
.dayline__item::before{content:"";position:absolute;left:0;top:5px;width:11px;height:11px;border-radius:50%;background:var(--bg);box-shadow:inset 0 0 0 2px var(--line-strong);animation:dayline-dot 9.6s infinite;animation-delay:calc(var(--i) * 2.4s)}
.dayline__item b{font:500 var(--fs-h4)/1.25 var(--font-display);letter-spacing:-.02em;color:#fff;animation:dayline-b 9.6s infinite;animation-delay:calc(var(--i) * 2.4s)}
.dayline__item p{font-size:var(--fs-body);line-height:1.5;color:var(--fg-muted);max-width:34ch}
@keyframes dayline-dot{0%,22%{background:var(--accent);box-shadow:inset 0 0 0 2px var(--accent),0 0 0 6px rgba(247,75,59,.18),0 0 18px rgba(247,75,59,.7)}28%,100%{background:var(--bg);box-shadow:inset 0 0 0 2px var(--line-strong)}}
@keyframes dayline-b{0%,22%{color:#FF8A7A}28%,100%{color:#fff}}
@media (max-width:899px){.dayband{grid-template-columns:minmax(0,1fr);border-radius:24px}}

.effects{margin-top:clamp(56px,7vw,104px)}
.effects .h3{margin-bottom:clamp(20px,2.6vw,32px)}
/* итоги — бенто 7/5 · 5/7: иконка слева от фразы, карточки компактные; первая карточка коралловая, последняя графитовая с пиксельным следом */
.effects__grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:12px}
.effect{grid-column:span 5;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;gap:clamp(14px,1.6vw,20px);padding:clamp(18px,2vw,26px);border-radius:var(--r-lg);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line),0 24px 60px -40px rgba(24,24,27,.25)}
.effect:nth-child(1),.effect:nth-child(4){grid-column:span 7}
.effect__t{max-width:24ch;font:500 clamp(1.1875rem,1rem + .6vw,1.5rem)/1.2 var(--font-display);letter-spacing:-.03em;color:var(--fg);text-wrap:balance}
.effect p{max-width:46ch;margin-top:6px;font-size:var(--fs-sm);line-height:1.5;color:var(--fg-muted)}
.effect--coral{background:linear-gradient(160deg,#FFE3DD 0%,#FFF8F6 70%);box-shadow:inset 0 0 0 1px var(--line-accent)}
.effect--coral .effect__t{color:#18181B}
.effect--coral p{color:#5A4A4E}
.effect--ink{background:var(--mbs-graphite);box-shadow:inset 0 1px 1px rgba(255,255,255,.08),var(--shadow-lg)}
.effect--ink .effect__t{color:#fff}
.effect--ink p{color:#AEAEB1}
.effects .note{margin-top:clamp(20px,2.4vw,28px)}
@media (max-width:899px){.effect,.effect:nth-child(1),.effect:nth-child(4){grid-column:span 12}}
@media (prefers-reduced-motion:reduce){.duo__link::before,.duo__link::after,.duo__ico,.dayline__item::before,.dayline__item b{animation:none}}

.illu--about{width:min(100%,460px);height:auto;margin-top:clamp(16px,3vw,40px);filter:drop-shadow(0 30px 50px rgba(247,75,59,.18))}
/* строка этапов: номера на общей серой линии (линии не краснеют, Андрей 10.11), текущий этап подсвечен, полоса прогресса по всем этапам; [data-stepnav] */
.stepnav .subnav__row{min-height:64px;gap:20px}
/* тёмная строка (data-theme="dark" на nav): графитовое стекло, токены темы переопределены */
.stepnav[data-theme="dark"]{background:rgba(18,18,20,.9);border-color:rgba(255,255,255,.08);color:var(--fg)}
.stepnav[data-theme="dark"] .stepnav__n{background:rgba(255,255,255,.04)}
.stepnav[data-theme="dark"] .is-active > .stepnav__item{background:rgba(255,255,255,.07);box-shadow:inset 0 0 0 1px rgba(247,75,59,.45),0 6px 22px -8px rgba(247,75,59,.55)}
.stepnav[data-theme="dark"] .is-done > .stepnav__item .stepnav__n{color:#fff}
.stepnav__list{position:relative;display:flex;align-items:center;gap:4px;flex:1;min-width:0;overflow-x:auto;scrollbar-width:none;padding:6px 2px}
.stepnav__list::-webkit-scrollbar{display:none}
.stepnav__list li{flex:1 1 auto;display:flex;align-items:center;min-width:0}
.stepnav__list li:first-child{flex:none}
.stepnav__list li + li::before{content:"";flex:1;min-width:12px;height:1px;margin:0 4px;background:var(--line-strong)}
.stepnav__item{flex:none;display:inline-flex;align-items:center;height:40px;padding:0 5px;border-radius:var(--r-pill);color:var(--fg-subtle);font-size:var(--fs-sm);font-weight:500;white-space:nowrap;text-decoration:none;transition:color .35s,background-color .35s,box-shadow .35s}
.stepnav__item:hover{color:var(--fg)}
.stepnav__t{display:block;max-width:0;opacity:0;overflow:hidden;transition:max-width .55s cubic-bezier(.16,1,.3,1),opacity .3s,margin .55s cubic-bezier(.16,1,.3,1)}
.is-active .stepnav__t,.stepnav__item:hover .stepnav__t,.stepnav__item:focus-visible .stepnav__t{max-width:300px;opacity:1;margin:0 9px 0 10px}
.stepnav__n{display:grid;place-items:center;flex:none;width:30px;height:30px;border-radius:50%;font:600 13px/1 var(--font-sans);font-variant-numeric:tabular-nums;color:var(--fg-muted);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line-strong);transition:color .35s,background .35s,box-shadow .35s,transform .45s cubic-bezier(.34,1.56,.64,1)}
.is-done > .stepnav__item{color:var(--fg-muted)}
.is-done > .stepnav__item .stepnav__n{color:var(--accent-ink);box-shadow:inset 0 0 0 1.5px var(--accent)}
.is-active > .stepnav__item{color:var(--fg);background:var(--surface);box-shadow:inset 0 0 0 1px var(--line-accent),0 6px 18px -8px rgba(247,75,59,.45)}
.is-active > .stepnav__item .stepnav__n{color:#fff;background:linear-gradient(160deg,#DE4234,#C4332A 50%,#A32517);box-shadow:0 0 0 4px rgba(247,75,59,.14),0 4px 12px -2px rgba(247,75,59,.6);transform:scale(1.06)}
.stepnav__bar{position:absolute;left:0;bottom:-1px;height:2px;width:100%;transform-origin:0 50%;transform:scaleX(var(--p,0));background:linear-gradient(90deg,#FF8A6B,var(--accent));transition:transform .15s linear}
@media (max-width:767px){.stepnav .subnav__row{min-height:56px}.stepnav__list{padding-inline:6px}.stepnav__list li{flex:none}.stepnav__list li + li::before{flex:none;width:14px}}
@media (prefers-reduced-motion:reduce){.stepnav__item,.stepnav__n,.stepnav__bar,.stepnav__t{transition:none}}
body:has([data-stepnav]) [id]{scroll-margin-top:calc(var(--header-h) + 84px)}

/* призыв «Бесплатный разбор»: компактная тёмная полоса — фото, заголовок с текстом, кнопка; по краю бежит коралловый блик */
@property --cta-a{syntax:"<angle>";inherits:false;initial-value:0deg}
.section--cta{padding-block:clamp(40px,5vw,72px)}
.cta-strip{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:clamp(18px,2.6vw,36px);padding:clamp(20px,2.4vw,28px) clamp(20px,3vw,36px);border-radius:28px;color:#C7C7CC;
  background:radial-gradient(42% 140% at 100% 50%,rgba(247,75,59,.34),transparent 70%),radial-gradient(26% 120% at 0% 50%,rgba(247,75,59,.12),transparent 70%),var(--mbs-graphite);
  box-shadow:inset 0 1px 1px rgba(255,255,255,.08),0 30px 60px -30px rgba(24,24,27,.5)}
.cta-strip::after,.person--ink::after{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;padding:1px;pointer-events:none;
  background:conic-gradient(from var(--cta-a),transparent 0 62%,rgba(255,138,107,.9) 80%,transparent 92%),linear-gradient(rgba(255,255,255,.1),rgba(255,255,255,.1));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:cta-run 7s linear infinite}
@keyframes cta-run{to{--cta-a:360deg}}
.cta-strip__photo{width:clamp(64px,6vw,88px);height:auto;aspect-ratio:1;border-radius:50%;object-fit:cover;box-shadow:0 0 0 3px var(--mbs-graphite),0 0 0 4px rgba(247,75,59,.7),0 12px 30px -10px rgba(247,75,59,.6)}
.cta-strip__text{display:grid;gap:6px;min-width:0}
.cta-strip__title{font:var(--fw-heavy) clamp(1.375rem,1.1rem + 1vw,2rem)/1.1 var(--font-display);letter-spacing:var(--ls-head);color:#fff}
.cta-strip p{font-size:var(--fs-body);line-height:1.5;max-width:56ch}
/* баннер «Персональное предложение» в колонке статьи: фото и заголовок в ряд, текст и кнопка ниже */
.cta-strip--stack{grid-template-columns:auto minmax(0,1fr);row-gap:14px;max-width:var(--container-text);margin-top:40px}
.cta-strip--stack .cta-strip__text{display:contents}
.cta-strip--stack p{grid-column:1 / -1}
.cta-strip--stack .btn{grid-column:1 / -1;justify-self:start}
/* рубрика блога без статей */
.blog-soon{color:var(--fg-muted);margin:0}
@media (max-width:860px){
  .cta-strip{grid-template-columns:auto minmax(0,1fr);align-items:center;row-gap:14px}
  .cta-strip__text{display:contents}
  .cta-strip p{grid-column:1 / -1}
  .cta-strip .btn{grid-column:1 / -1;justify-self:stretch;justify-content:center}
}
@media (prefers-reduced-motion:reduce){.cta-strip::after,.person--ink::after{animation:none}}

/* сноска под живым интерфейсом: без прозрачности, иначе 4.48:1 на сером фоне (ui.css не трогаем) */
p.mbs-ui-note{opacity:1}

/* =========================================================================
   6. ЭФФЕКТЫ: холсты, появление
   ========================================================================= */
.fx-gl{position:absolute;inset:0;width:100%;height:100%;z-index:-1;pointer-events:none}
.fx-fallback{background:radial-gradient(70% 60% at 50% 70%,rgba(247,75,59,.18),transparent 70%),radial-gradient(40% 40% at 20% 20%,rgba(255,138,107,.14),transparent 70%)}
[data-theme="dark"] .fx-fallback{background:radial-gradient(90% 70% at 50% 85%,#5A1A1E,var(--bg) 70%)}
.chart{position:relative}
.chart canvas{width:100%;height:var(--chart-h,280px)}
.chart__tip{position:absolute;pointer-events:none;padding:8px 10px;border-radius:var(--r-sm);background:var(--tooltip-bg);color:var(--tooltip-fg);font:500 12px/1.4 var(--font-sans);white-space:nowrap;transform:translate(-50%,calc(-100% - 12px));opacity:0;transition:opacity var(--dur-1)}
.chart__tip.is-on{opacity:1}
.chart__legend{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:var(--fs-xs);color:var(--fg-subtle);margin-top:12px}
.chart__legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px;background:var(--c)}
[data-rise] > *{will-change:auto}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:1ms!important;animation-iteration-count:1!important;transition-duration:1ms!important;scroll-behavior:auto!important}
  .marquee__track{animation:none}
  .skeleton{animation:none}
}

/* «Настройка сводки» (Итого на главной): карточка сайта из дашборда, по бокам панели выбора, выбор переключается сам;
   [data-tune], скрипт fx/tune.js. Карточка тёмная, как дашборд; панели светлые и парят над её краями (приём AuthKit). */
.tune{display:grid;gap:4px;width:100%;max-width:560px;justify-self:center;margin:0;container-type:inline-size}
@media (min-width:1024px){.split > .tune{width:calc(100% + 40px);max-width:none;margin-left:-40px}}
.tune__stage{position:relative;display:grid}
.tune__card{position:relative;z-index:1;width:100%;margin-inline:auto;display:grid;gap:4px;padding:30px 18px 30px;
  border-radius:24px;color:#E4E4E7;font:400 13px/1.35 var(--font-sans);
  background:radial-gradient(120% 80% at 100% 100%,rgba(247,75,59,.18),transparent 60%),linear-gradient(180deg,#1C1C1F,#121214);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),0 40px 70px -24px rgba(24,24,27,.55)}
.tune__head{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.tune__head .db-ava{width:30px;height:30px;font-size:13px}
.tune__site{display:grid;gap:1px;min-width:0}
.tune__site b{font-weight:600;color:#fff}
.tune__site span{font-size:11px;color:#8E8E93}
.tune__t{font:300 19px/1.2 var(--font-display);letter-spacing:-.02em;color:#fff}
.tune__sub{font-size:11px;color:#8E8E93}
.tune__val{margin-top:10px;font:200 46px/1 var(--font-display);letter-spacing:-.04em;color:#fff;font-variant-numeric:tabular-nums}
.tune__chart{position:relative;height:150px;margin-top:6px}
.tune__svg{position:absolute;inset:0 0 22px;width:100%;height:calc(100% - 22px);overflow:visible;transition:opacity .45s}
.tune__line{fill:none;stroke:#F74B3B;stroke-width:2;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.tune__axis{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:space-between;font-size:11px;color:#8E8E93;transition:opacity .45s}
.tune__bars{position:absolute;inset:26px 0 0;gap:8px;opacity:0;pointer-events:none;transition:opacity .45s}
.tune__bars .db-bar i{width:min(12px,60%)}
.tune__chart.is-bars .tune__svg,.tune__chart.is-bars .tune__axis{opacity:0}
.tune__chart.is-bars .tune__bars{opacity:1}
.tune__chart:not(.is-bars) .db-bar i{height:0}
.tune__panel{position:relative;z-index:2;display:flex;align-items:center;gap:2px;padding:6px;border-radius:18px;
  background:rgba(255,255,255,.86);backdrop-filter:blur(14px) saturate(1.4);
  box-shadow:inset 0 0 0 1px rgba(24,24,27,.07),0 18px 40px -16px rgba(24,24,27,.35)}
.tune__panel--k{order:-1;margin:0 10px -14px}
.tune__panel--p{margin:-14px 10px 0}
.tune__cap{display:none;padding:0 8px 6px;font-size:11px;color:var(--fg-subtle)}
.tune__hl{position:absolute;left:0;top:0;border-radius:12px;background:#18181B;box-shadow:0 6px 14px -6px rgba(24,24,27,.5);
  transition:transform .5s cubic-bezier(.34,1.3,.64,1),width .5s cubic-bezier(.16,1,.3,1),height .5s}
.tune:not(.is-js) .tune__hl{display:none}
.tune__opt{position:relative;flex:1 1 0;display:flex;align-items:center;justify-content:center;gap:8px;min-height:34px;padding:0 6px;border:0;border-radius:12px;
  background:none;color:var(--fg-muted);font:500 12px/1 var(--font-sans);text-align:left;cursor:pointer;transition:color .35s,scale .25s}
.tune__opt:hover{color:var(--fg)}
.tune__opt[aria-pressed="true"]{color:#fff}
.tune:not(.is-js) .tune__opt[aria-pressed="true"]{background:#18181B}
.tune__opt.is-tap{scale:.94}
.tune__opt:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
/* появление: карточка поднимается, панели выезжают с краёв, пункты по очереди */
.tune.is-js .tune__card{opacity:0;translate:0 24px;transition:opacity .8s,translate 1s cubic-bezier(.16,1,.3,1)}
.tune.is-js .tune__panel{opacity:0;transition:opacity .7s .25s,translate 1s .25s cubic-bezier(.16,1,.3,1)}
.tune.is-js .tune__panel--k{translate:-28px 0}
.tune.is-js .tune__panel--p{translate:28px 0}
.tune.is-js .tune__opt{opacity:0;translate:0 8px;transition:opacity .5s calc(.45s + var(--i) * 90ms),translate .6s calc(.45s + var(--i) * 90ms) cubic-bezier(.16,1,.3,1),color .35s,scale .25s}
.tune.is-in .tune__card,.tune.is-in .tune__panel,.tune.is-in .tune__opt{opacity:1;translate:none}
.tune__opt .ico{display:none}
/* место есть (≥500px) — панели по бокам карточки, как у AuthKit */
@container (min-width:500px){
  .tune__stage{display:block;padding:clamp(28px,4vw,44px) 0}
  .tune__card{width:290px;padding:18px 22px 16px}
  .tune__panel{position:absolute;display:grid;width:max-content;margin:0;padding:10px 6px 6px}
  .tune__panel--k{right:calc(50% + 145px - 18px);top:16%}
  .tune__panel--p{left:calc(50% + 145px - 18px);bottom:10%}
  .tune__cap{display:block}
  .tune__opt{justify-content:flex-start;gap:6px;padding:0 12px 0 10px;font-size:12.5px}
  .tune__opt .ico{display:block}
  .tune > .note{justify-content:center}
}
@media (prefers-reduced-motion:reduce){.tune.is-js .tune__card,.tune.is-js .tune__panel,.tune.is-js .tune__opt{opacity:1;translate:none;transition:none}.tune__hl{transition:none}}

/* Свёрнутые блоки с автопоказом («Сайт по современным стандартам» на главной): строки между волосяными линиями,
   открыт один блок, без клика посетителя блоки раскрываются по очереди, полоска внизу — время до следующего;
   [data-acc], скрипт fx/acc.js. Без скрипта всё раскрыто. */
.acc{--acc-t:4.2s;border-top:1px solid var(--line)}
.acc__item{position:relative;border-bottom:1px solid var(--line)}
.acc__h{margin:0;font:inherit}
.acc__btn{display:flex;align-items:center;gap:14px;width:100%;min-height:60px;padding:12px 4px;border:0;background:none;color:var(--fg);
  font:var(--fw-semibold) var(--fs-h5)/1.35 var(--font-sans);letter-spacing:-.01em;text-align:left;cursor:pointer}
.acc__btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:8px}
.acc__t{flex:1;min-width:0}
.acc__btn .icon-tile{transition:background-color .35s,color .35s,box-shadow .35s}
.acc__pm{position:relative;flex:none;width:28px;height:28px;border-radius:50%;box-shadow:inset 0 0 0 1px var(--line-strong);transition:background-color .35s,box-shadow .35s,transform .45s cubic-bezier(.16,1,.3,1)}
.acc__pm::before,.acc__pm::after{content:"";position:absolute;left:50%;top:50%;width:10px;height:1.5px;margin:-.75px 0 0 -5px;border-radius:1px;background:var(--fg-muted);transition:background-color .35s}
.acc__pm::after{transform:rotate(90deg)}
.acc__btn:hover .acc__pm{box-shadow:inset 0 0 0 1px var(--fg-subtle)}
.acc__panel{display:grid;grid-template-rows:1fr}
.acc__in{min-height:0;overflow:hidden;padding:0 4px 0 50px}
.acc__in > :last-child{margin-bottom:18px}
.acc__in p{font-size:var(--fs-sm);line-height:1.55;color:var(--fg-subtle);max-width:62ch}
.acc__timer{position:absolute;left:0;right:0;bottom:-1px;height:2px;transform:scaleX(0);transform-origin:0 50%;background:linear-gradient(90deg,#FF8A6B,var(--accent));pointer-events:none}
/* со скриптом: свёрнуто, открыт один */
.acc.is-js .acc__panel{grid-template-rows:0fr;visibility:hidden;transition:grid-template-rows .55s cubic-bezier(.16,1,.3,1),visibility 0s .55s}
.acc.is-js .acc__in{opacity:0;translate:0 -6px;transition:opacity .3s,translate .45s cubic-bezier(.16,1,.3,1)}
.acc.is-js .is-open .acc__panel{grid-template-rows:1fr;visibility:visible;transition:grid-template-rows .55s cubic-bezier(.16,1,.3,1)}
.acc.is-js .is-open .acc__in{opacity:1;translate:none;transition:opacity .45s .12s,translate .55s .12s cubic-bezier(.16,1,.3,1)}
.acc.is-js .is-open .acc__pm{background:var(--fg);box-shadow:none;transform:rotate(45deg)}
.acc.is-js .is-open .acc__pm::before,.acc.is-js .is-open .acc__pm::after{background:var(--bg)}
.acc.is-js .is-open .acc__btn .icon-tile{background:var(--accent);color:#fff}
.acc__timer.is-run{animation:acc-run var(--acc-t) linear forwards}
.acc.is-paused .acc__timer.is-run{animation-play-state:paused}
@keyframes acc-run{to{transform:scaleX(1)}}
@media (max-width:599px){.acc__btn{gap:12px;min-height:56px}.acc__in{padding-left:46px}}
@media (prefers-reduced-motion:reduce){.acc.is-js .acc__panel,.acc.is-js .acc__in{transition:none}}

/* Страница 404 (404.html): шапка страницы с картинкой error-404.webp и разделы карточками .feature-row.
   На телефоне картинка остаётся, но под текстом и небольшая — без неё страница пустая. */
.nf .hero__actions{margin-top:28px}
.nf__links{padding-block:0 clamp(56px,7vw,112px)}
.nf__links .h4{margin-bottom:12px;padding-inline:clamp(18px,1.8vw,24px)}
.nf__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;border-top:1px solid var(--line);padding-top:12px}
@media (max-width:1023px){.nf__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:599px){.nf__grid{grid-template-columns:minmax(0,1fr)}}
@media (max-width:860px){.nf .nf__art{display:block;justify-self:center;width:min(72%,300px);max-height:none;margin:8px 0 0;object-position:center}}
/* Авторский надзор 12.11 (NEWPATH#101): длинный заголовок юридических страниц не рвётся посреди слова; крошки на телефоне текут строкой; кнопка в узкой карточке тарифа без капса */
.hero__title--long{font-size:var(--fs-h1);max-width:22ch;hyphens:auto;-webkit-hyphens:auto}
@media (max-width:639px){.hero__title--long{overflow-wrap:normal}.breadcrumbs ol{display:block}.breadcrumbs li{display:inline}.breadcrumbs li + li::before{display:inline-block;vertical-align:-2px;margin:0 6px}}
.price-card .btn--shine{text-transform:none;letter-spacing:0;font-size:var(--fs-sm);line-height:1.25}