/* ============================================================
   MaxcroW — главная «Агентство». Дизайн-язык STUDIO («Ledger Wall»).
   Бумажный премиум: контурная типографика, оранж-пунктуация, P&L-карточки,
   кнопки с жёсткой тенью-смещением, bento-карточки с выезжающим уголком.
   Самохост Manrope (РКН, без Google Fonts). Лента — portal-bar.css (тёмная, поверх).
   ============================================================ */

@font-face{font-family:"Manrope";font-style:normal;font-weight:700;font-display:swap;
  src:url("/fonts/manrope-cyrillic-700-normal.woff2") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}
@font-face{font-family:"Manrope";font-style:normal;font-weight:700;font-display:swap;
  src:url("/fonts/manrope-latin-700-normal.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:"Manrope";font-style:normal;font-weight:800;font-display:swap;
  src:url("/fonts/manrope-cyrillic-800-normal.woff2") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}
@font-face{font-family:"Manrope";font-style:normal;font-weight:800;font-display:swap;
  src:url("/fonts/manrope-latin-800-normal.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}

:root{
  --paper:#F4F1EB; --paper-2:#EBE7DE; --ink:#16130E; --ink-2:#3D3830; --ink-soft:#6B655A;
  --line:#D8D2C6; --line-strong:#C3BCAD; --accent:#fe8b66; --accent-deep:#C2492A;
  --white:#FCFBF8; --ok:#2f9d6b; --maxw:1280px; --r:14px; --ease:cubic-bezier(.2,.7,.2,1);
  /* Shared action contract.
     primary  = family face / dark ink / white offset;
     contrast = dark face / white ink / family offset (calculators/dark panels). */
  --action-face:var(--accent); --action-ink:#171411; --action-back:#fff;
  --action-edge:color-mix(in srgb,var(--accent-deep) 72%,#171411); --action-focus:var(--accent-deep);
  --action-contrast-face:#171411; --action-contrast-ink:#fff; --action-contrast-back:var(--accent);
  --action-contrast-edge:#171411; --action-contrast-focus:var(--accent-deep);
  --action-disabled-face:#d8d2c6; --action-disabled-ink:#6b655a;
  --font-display:"Manrope",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}
/* Тема Стоматологии: светлый Studio + фирменный тил-акцент (переиспользуемо на нишу) */
body.theme-teal{
  --accent:#2EC4B6;--accent-deep:#0f857a;
  --action-face:var(--accent);--action-back:#fff;--action-edge:color-mix(in srgb,var(--accent-deep) 72%,#171411);--action-focus:var(--accent-deep);
  --action-contrast-back:var(--accent);--action-contrast-focus:var(--accent-deep);
}
/* Тема Клиник/медицины: светлый Studio + медицинский синий (переиспользуемо) */
body.theme-med{
  --accent:#2f9bd6;--accent-deep:#1c6ea4;
  --action-face:var(--accent);--action-back:#fff;--action-edge:color-mix(in srgb,var(--accent-deep) 72%,#171411);--action-focus:var(--accent-deep);
  --action-contrast-back:var(--accent);--action-contrast-focus:var(--accent-deep);
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--pbar-h,68px) + 16px)}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  font-family:"Manrope",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  background:var(--paper);color:var(--ink);font-weight:700;line-height:1.5;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;padding-top:var(--pbar-h,68px);
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 clamp(20px,2.5vw,24px)}
/* КУРСОР-кольцо (эталон HoReCa; палитра наследуется из var(--accent) → оранж/фиолет по секции) */
.cursor{position:fixed;top:0;left:0;width:16px;height:16px;border:1.5px solid var(--accent);border-radius:50%;pointer-events:none;z-index:99999;transform:translate(-50%,-50%);transition:width .22s ease,height .22s ease,background .22s ease,border-color .22s ease;will-change:transform;opacity:0}
.cursor.is-on{opacity:1}
.cursor.is-hover{width:40px;height:40px;background:color-mix(in srgb,var(--accent) 14%,transparent);border-color:var(--accent)}
.cursor.is-down{width:13px;height:13px;background:color-mix(in srgb,var(--accent) 28%,transparent)}
@media(hover:none),(max-width:980px){.cursor{display:none}}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:4px}
:focus:not(:focus-visible){outline:none}

/* секц. общее */
.sec{padding:clamp(56px,8vw,104px) 0}
.section-kick{font-size:13.5px;font-weight:800;letter-spacing:.04em;color:var(--accent-deep);margin-bottom:18px;text-transform:uppercase}
.sec-head{margin-bottom:clamp(34px,5vw,52px);max-width:62ch}
.sec-head h2{font-size:clamp(30px,4.6vw,56px);font-weight:800;letter-spacing:-.04em;line-height:1.02}
.sec-head h2 em{font-style:normal;color:var(--accent-deep)}
.sec-head p{margin-top:18px;font-size:16.5px;font-weight:700;color:var(--ink-2);line-height:1.6;letter-spacing:-.01em;max-width:60ch}

/* кнопки */
.btn{font-family:inherit;cursor:pointer;font-weight:800;letter-spacing:-.01em;border-radius:12px;min-height:48px;
  transition:transform .2s var(--ease),background .2s,box-shadow .25s var(--ease),border-color .2s;
  display:inline-flex;align-items:center;gap:10px;border:1px solid transparent}
.btn svg{width:18px;height:18px;flex:none}
.btn .arr{transition:transform .25s var(--ease)}
.btn:hover .arr{transform:translateX(4px)}
.btn-primary{font-size:17px;color:var(--action-ink);background:var(--action-face);border-color:var(--action-edge);padding:15px 26px;box-shadow:6px 6px 0 var(--action-back),7px 7px 0 color-mix(in srgb,var(--action-edge) 42%,transparent);white-space:nowrap}
.btn-primary:hover{transform:translate(2px,2px);background:color-mix(in srgb,var(--action-face) 92%,var(--accent));box-shadow:3px 3px 0 var(--action-back),4px 4px 0 color-mix(in srgb,var(--action-edge) 42%,transparent)}
.btn-primary:active{transform:translate(4px,4px);box-shadow:1px 1px 0 var(--action-back),2px 2px 0 color-mix(in srgb,var(--action-edge) 42%,transparent)}
.btn-primary:focus-visible{outline:3px solid var(--action-focus);outline-offset:4px}
.btn-primary:disabled,.btn-primary[aria-disabled="true"]{opacity:.72;cursor:not-allowed;color:var(--action-disabled-ink);background:var(--action-disabled-face);border-color:var(--line-strong);box-shadow:3px 3px 0 color-mix(in srgb,var(--action-back) 45%,var(--paper-2));transform:none;pointer-events:none}
.btn-primary.btn-contrast{--action-face:var(--action-contrast-face);--action-ink:var(--action-contrast-ink);--action-back:var(--action-contrast-back);--action-edge:var(--action-contrast-edge);--action-focus:var(--action-contrast-focus)}
.btn-ghost{font-size:16px;color:var(--ink);background:var(--white);border-color:var(--line-strong);padding:14px 22px;box-shadow:3px 3px 0 color-mix(in srgb,var(--accent) 58%,transparent)}
.btn-ghost:hover{transform:translate(1px,1px);background:color-mix(in srgb,var(--white) 94%,var(--accent));border-color:var(--ink-soft);box-shadow:1px 1px 0 color-mix(in srgb,var(--accent) 58%,transparent)}
.btn-ghost:active{transform:translate(2px,2px);box-shadow:none}
.btn-ghost:focus-visible{outline:3px solid var(--action-focus);outline-offset:4px}
.btn-ghost:disabled,.btn-ghost[aria-disabled="true"]{opacity:.72;cursor:not-allowed;color:var(--action-disabled-ink);background:var(--action-disabled-face);border-color:var(--line-strong);box-shadow:none;transform:none;pointer-events:none}

/* ---------- HERO ---------- */
.hero{position:relative;padding:clamp(40px,6vw,86px) 0 clamp(36px,5vw,64px)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:clamp(28px,4vw,60px);align-items:end}
.eyebrow{display:inline-flex;align-items:center;flex-wrap:wrap;gap:6px 10px;font-size:13.5px;font-weight:800;letter-spacing:.02em;color:var(--ink-2);margin-bottom:26px}
.eyebrow .tick{display:inline-block;width:30px;height:3px;background:var(--accent);border-radius:2px}
.eyebrow .since{color:var(--ink-soft);font-weight:700;white-space:nowrap}
h1.display{font-weight:800;letter-spacing:-.045em;line-height:.92;font-size:clamp(44px,8.6vw,124px);text-transform:lowercase}
.display .ln{display:block}
.display .out{color:transparent;-webkit-text-stroke:2px var(--ink)}
.display .solid{color:var(--ink)}
.display .money{position:relative;color:var(--ink);padding:0 .04em}
.display .money::after{content:"";position:absolute;left:0;right:0;bottom:.08em;height:.16em;background:var(--accent);z-index:-1;border-radius:2px;transform:scaleX(0);transform-origin:left;transition:transform .8s var(--ease) .3s}
.display.lit .money::after{transform:scaleX(1)}
.display .period{color:var(--accent);-webkit-text-stroke:0}
.hero-sub{margin-top:30px;max-width:52ch;font-size:clamp(16px,1.5vw,19px);font-weight:700;color:var(--ink-2);line-height:1.55;letter-spacing:-.01em}
.hero-sub b{color:var(--ink);font-weight:800}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px;align-items:center}
.hero-note{margin-top:18px;font-size:13px;font-weight:700;color:var(--ink-soft);display:flex;align-items:center;gap:8px}
.hero-note svg{width:16px;height:16px;color:var(--accent-deep);flex:none}

/* ledger-карточка (сигнатура) */
.ledger{background:var(--white);border:1px solid var(--line-strong);border-radius:var(--r);padding:26px 26px 22px;position:relative;box-shadow:0 1px 0 var(--line)}
.ledger::before{content:"";position:absolute;left:0;top:22px;bottom:22px;width:4px;background:var(--accent);border-radius:0 3px 3px 0}
.ledger-head{display:flex;align-items:baseline;justify-content:space-between;padding-bottom:14px;margin-bottom:6px;border-bottom:1px solid var(--line)}
.ledger-head .t{font-size:12.5px;font-weight:800;letter-spacing:.06em;color:var(--ink-soft);text-transform:uppercase}
.ledger-head .live{font-size:12px;font-weight:800;color:var(--accent-deep);display:flex;align-items:center;gap:7px}
.ledger-head .live i{width:7px;height:7px;border-radius:50%;background:var(--accent);display:inline-block;animation:pulse 2s var(--ease) infinite}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.4;transform:scale(.7)}}
.ledger-row{display:flex;align-items:baseline;justify-content:space-between;padding:13px 0;border-bottom:1px dashed var(--line);gap:12px}
.ledger-row:last-of-type{border-bottom:0}
.ledger-row .k{font-size:14.5px;font-weight:700;color:var(--ink-2)}
.ledger-row .v{font-size:clamp(24px,3vw,34px);font-weight:800;letter-spacing:-.03em;color:var(--ink);font-variant-numeric:tabular-nums;white-space:nowrap}
.ledger-row .v small{font-size:.5em;color:var(--ink-soft);font-weight:800;letter-spacing:0}
.ledger-row .v .up{color:var(--accent-deep)}
.ledger-foot{margin-top:14px;font-size:12.5px;font-weight:700;color:var(--ink-soft);line-height:1.5}
@media(max-width:880px){.hero-grid{grid-template-columns:1fr}.ledger{max-width:520px}}

/* ---------- ЯКОРНОЕ МЕНЮ (journey-навигация, sticky + scroll-spy) ---------- */
.anchornav{position:sticky;top:var(--pbar-h,68px);z-index:900;background:color-mix(in srgb,var(--paper) 90%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.anchornav__in{display:flex;align-items:center;justify-content:center;gap:18px;height:56px}
.anchornav__links{display:flex;align-items:center;gap:6px;flex-wrap:wrap;justify-content:center;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;-webkit-overflow-scrolling:touch}
.anchornav__links::-webkit-scrollbar{display:none}
/* --many: длинное journey-меню всегда остаётся в одну строку и не ломает высоту sticky-панели. */
.anchornav--many .anchornav__links{flex-wrap:nowrap;justify-content:flex-start;width:100%;padding:0 16px}
.anchornav--many .anchornav__link{white-space:nowrap}
.anchornav__link{flex:none;font-size:14px;font-weight:700;color:var(--ink-soft);padding:8px 14px;border-radius:9px;white-space:nowrap;transition:color .2s var(--ease),background .2s var(--ease)}
.anchornav__link:hover{color:var(--ink)}
.anchornav__link.is-active{color:var(--accent-deep);background:color-mix(in srgb,var(--accent) 13%,transparent)}
@media(max-width:760px){.anchornav__in{height:52px}.anchornav__links{flex-wrap:nowrap;justify-content:flex-start;width:100%;gap:2px}}
/* якорь приземляется ниже топбара + якорного меню */
:where(section[id],nav[id]){scroll-margin-top:calc(var(--pbar-h,68px) + 70px)}

/* ---------- PROOF ---------- */
.proof{background:var(--paper-2)}
.proof-in{display:grid;grid-template-columns:repeat(4,1fr)}
.proof-cell{padding:30px clamp(14px,2.4vw,30px);border-right:1px solid var(--line)}
.proof-cell:last-child{border-right:0}
.proof-cell .num{font-size:clamp(30px,4vw,48px);font-weight:800;letter-spacing:-.04em;line-height:1;font-variant-numeric:tabular-nums}
.proof-cell .num .acc{color:var(--accent-deep)}
.proof-cell .lab{margin-top:12px;font-size:13.5px;font-weight:700;color:var(--ink-soft);letter-spacing:-.01em;line-height:1.4}
@media(max-width:760px){.proof-in{grid-template-columns:repeat(2,1fr)}.proof-cell:nth-child(2){border-right:0}.proof-cell:nth-child(1),.proof-cell:nth-child(2){border-bottom:1px solid var(--line)}}

/* ---------- TOOLS (bento) ---------- */
.tool-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.card{position:relative;overflow:hidden;background:var(--white);border:1px solid var(--line-strong);border-radius:var(--r);padding:26px 26px 24px;
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s;display:flex;flex-direction:column;min-height:188px}
.card:hover{transform:translateY(-5px);box-shadow:0 16px 36px -20px rgba(22,19,14,.4);border-color:var(--ink-soft)}
.card .idx{font-size:13px;font-weight:800;color:var(--ink-soft);font-variant-numeric:tabular-nums;letter-spacing:.04em}
.card__ico{position:absolute;z-index:2;top:clamp(20px,2.4vw,26px);right:clamp(20px,2.4vw,26px);width:46px;height:46px;display:inline-flex;align-items:center;justify-content:center;border-radius:13px;background:color-mix(in srgb,var(--accent) 13%,transparent);color:var(--accent-deep);transition:background .3s var(--ease),color .3s var(--ease),transform .3s var(--ease)}
.card__ico svg{width:24px;height:24px;display:block}
.card:hover .card__ico{background:var(--accent);color:#fff;transform:rotate(-6deg)}
/* Мини-список «что умеет» в карточках инструментов (главная) */
.card__can{list-style:none;margin:12px 0 0;display:grid;gap:7px}
.card__can li{position:relative;padding-left:20px;font-size:13px;line-height:1.45;color:var(--ink-2)}
.card__can li::before{content:"";position:absolute;left:0;top:5px;width:11px;height:6px;border-left:2px solid var(--accent-deep);border-bottom:2px solid var(--accent-deep);transform:rotate(-45deg)}
.theme-dark .card__can li{color:rgba(255,255,255,.78)}
.theme-dark .card__can li::before{border-color:var(--accent)}
/* заголовок не заезжает под иконку-плашку (длинные h3) */
.card:has(.card__ico) h3,.why:has(.card__ico) h3,.step:has(.card__ico) h3{padding-right:56px}
.card.feat .card__ico{display:none}
@media(max-width:560px){.card__ico{width:40px;height:40px}.card__ico svg{width:21px;height:21px}}
.card h3{font-size:21px;font-weight:800;letter-spacing:-.02em;margin-top:16px;line-height:1.12}
.card p{font-size:14.5px;font-weight:700;color:var(--ink-2);margin-top:10px;line-height:1.5;letter-spacing:-.01em}
.card .badge{margin-top:auto;padding-top:16px;display:inline-flex;align-items:center;gap:8px;font-size:12.5px;font-weight:800;color:var(--accent-deep)}
.card .badge .ln{width:0;height:2px;background:var(--accent);transition:width .35s var(--ease)}
.card:hover .badge .ln{width:26px}
.card .corner,.why .corner{position:absolute;top:0;right:0;width:46px;height:46px;background:var(--accent);clip-path:polygon(100% 0,0 0,100% 100%);transform:translate(46px,-46px);transition:transform .35s var(--ease)}
.card:hover .corner,.why:hover .corner{transform:translate(0,0)}
.card.span3,.card.span2{grid-column:auto}
.card.feat{grid-column:1 / -1;background:var(--ink);border-color:var(--ink);flex-direction:row;align-items:center;justify-content:space-between;gap:30px;min-height:auto}
.card.feat:hover{box-shadow:0 18px 40px -22px rgba(22,19,14,.7)}
.card.feat .corner{background:var(--accent)}
.card.feat h3{color:var(--white);font-size:clamp(22px,2.6vw,30px);margin-top:0;max-width:26ch}
.card.feat p{color:#C9C3B8;margin-top:8px}
.card.feat .ftxt{display:flex;flex-direction:column;gap:6px}
.card.feat .fcta{flex:none;font-size:15px;font-weight:800;color:var(--ink);background:var(--accent);padding:14px 22px;border-radius:11px;display:inline-flex;align-items:center;gap:8px;transition:transform .2s var(--ease);white-space:nowrap}
.card.feat .fcta:hover{transform:translateX(4px)}
@media(max-width:980px){.tool-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.tool-grid{grid-template-columns:1fr}.card.feat{flex-direction:column;align-items:stretch;gap:18px}.card.feat .ftxt{gap:8px}.card.feat .fcta{width:100%;justify-content:center;padding:15px 22px;font-size:16px;margin-top:2px}}

/* ---------- CASES ---------- */
.cases-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.kase{background:var(--white);border:1px solid var(--line-strong);border-radius:var(--r);padding:26px;display:flex;flex-direction:column;transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.kase:hover{transform:translateY(-4px);box-shadow:0 16px 36px -22px rgba(22,19,14,.4)}
.kase .tag{font-size:12px;font-weight:800;letter-spacing:.04em;color:var(--ink-soft);text-transform:uppercase}
.kase h3{font-size:19px;font-weight:800;letter-spacing:-.02em;margin-top:8px}
.kase .desc{font-size:14px;font-weight:700;color:var(--ink-2);margin-top:8px;line-height:1.5}
.kase .metrics{margin-top:18px;padding-top:16px;border-top:1px dashed var(--line);display:flex;gap:22px;flex-wrap:wrap}
.kase .metric b{display:block;font-size:26px;font-weight:800;letter-spacing:-.03em;color:var(--accent-deep);font-variant-numeric:tabular-nums;line-height:1}
.kase .metric span{font-size:12px;font-weight:700;color:var(--ink-soft);margin-top:5px;display:block}
@media(max-width:860px){.cases-grid{grid-template-columns:1fr}}

/* ---------- WHY (ledger-список преимуществ) ---------- */
.why-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}
.why{position:relative;overflow:hidden;background:var(--white);border:1px solid var(--line-strong);border-radius:var(--r);padding:26px 26px 24px;display:flex;flex-direction:column;min-height:172px;transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s}
.why:hover{transform:translateY(-5px);box-shadow:0 16px 36px -20px rgba(22,19,14,.4);border-color:var(--ink-soft)}
.why:hover .card__ico{background:var(--accent);color:#fff;transform:rotate(-6deg)}
.why .n{font-size:13px;font-weight:800;color:var(--ink-soft);font-variant-numeric:tabular-nums;letter-spacing:.04em}
.why h3{font-size:19px;font-weight:800;letter-spacing:-.02em;margin-top:14px;line-height:1.15}
.why p{font-size:14.5px;font-weight:700;color:var(--ink-2);margin-top:9px;line-height:1.55}
@media(max-width:760px){.why-grid{grid-template-columns:1fr}}
/* Заголовок «Почему мы» — 2 колонки: текст + карандашный скетч-щит (паттерн proc-head) */
.why-head{max-width:none;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(28px,4vw,56px);align-items:center}
.why-sketch{width:clamp(200px,19vw,248px);pointer-events:none}
@media(max-width:860px){.why-head{grid-template-columns:1fr;gap:18px;align-items:start}.why-sketch{width:100%;max-width:300px}}
@media(max-width:560px){.why-sketch{display:block;width:100%;max-width:200px;margin:8px auto 0}}
/* СКЕТЧ-ЩИТ с ₽ (V3): техника p9 — wobble + draw-on + петля перекладины ₽ + float */
.v3-svg{display:block;width:100%;height:auto;overflow:visible}
.v3-ink{fill:none;stroke:var(--ink);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.v3-ink2{fill:none;stroke:var(--ink-2);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.v3-soft{fill:none;stroke:var(--ink-soft);stroke-width:1.3;stroke-linecap:round;opacity:.55}
.v3-accent-line{fill:none;stroke:var(--accent-deep);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.v3-accent-tick{fill:none;stroke:var(--accent);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.v3-dot{fill:var(--accent)}
.v3-draw{stroke-dasharray:100;stroke-dashoffset:100;animation:v3-draw 1.9s ease forwards}
.v3-d1{animation-delay:.05s;animation-duration:2.2s}
.v3-d2{animation-delay:.55s}
.v3-d3{animation-delay:.9s}
.v3-d4{animation-delay:1.05s}
.v3-d5{animation-delay:1.15s}
.v3-d6{animation-delay:1.3s}
.v3-d7{animation-delay:1.6s;animation-duration:2.1s}
@keyframes v3-draw{to{stroke-dashoffset:0}}
.v3-tickloop{stroke-dasharray:100;stroke-dashoffset:100;animation:v3-ticks 7s ease-in-out infinite}
.v3-t1{animation-delay:2.4s}
@keyframes v3-ticks{0%{stroke-dashoffset:100}8%{stroke-dashoffset:0}78%{stroke-dashoffset:0}88%{stroke-dashoffset:100}100%{stroke-dashoffset:100}}
.v3-float{transform-box:fill-box;transform-origin:center;animation:v3-float 6.5s ease-in-out infinite}
@keyframes v3-float{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-2.5px) rotate(-.5deg)}}
@media (prefers-reduced-motion: reduce){.v3-draw,.v3-tickloop{stroke-dasharray:none;stroke-dashoffset:0;animation:none}.v3-float{animation:none}.v3-dot{display:none}}
/* Заголовок «SERM 5.0» — 2 колонки: текст + скетч роста рейтинга (паттерн proc-head) */
.serm-head{max-width:none;display:grid;grid-template-columns:minmax(0,1fr) clamp(300px,34vw,480px);gap:clamp(28px,4vw,56px);align-items:center}
.serm-sketch{width:100%;pointer-events:none}
@media(max-width:980px){.serm-head{grid-template-columns:minmax(0,1fr) clamp(260px,32vw,380px)}}
@media(max-width:860px){.serm-head{grid-template-columns:1fr;gap:18px;align-items:start}.serm-sketch{width:100%;max-width:420px}}
@media(max-width:560px){.serm-sketch{display:block;width:100%;max-width:200px;margin:8px auto 0}}
/* СКЕТЧ РОСТ РЕЙТИНГА ЗВЁЗДАМИ (S1): техника p9 — wobble + draw-on + поп акцент-звезды + петля + float */
.s1-svg{display:block;width:100%;height:auto;overflow:visible}
.s1-ink{fill:none;stroke:var(--ink);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.s1-ink2{fill:none;stroke:var(--ink-2);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.s1-soft{fill:none;stroke:var(--ink-soft);stroke-width:1.3;stroke-linecap:round;opacity:.55}
.s1-accent-line{fill:none;stroke:var(--accent-deep);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.s1-accent-tick{fill:none;stroke:var(--accent);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.s1-star-fill{fill:var(--accent);stroke:var(--accent-deep);stroke-width:1.2;stroke-linejoin:round}
.s1-spark{fill:none;stroke:var(--accent);stroke-width:2;stroke-linecap:round}
.s1-dot{fill:var(--accent)}
.s1-draw{stroke-dasharray:100;stroke-dashoffset:100;animation:s1-draw 1.9s ease forwards}
.s1-d1{animation-delay:.05s}
.s1-d2{animation-delay:.35s}
.s1-d3{animation-delay:.55s}
.s1-d4{animation-delay:.75s}
.s1-d5{animation-delay:.95s}
.s1-d6{animation-delay:1.15s}
.s1-d8{animation-delay:1.75s;animation-duration:2.1s}
.s1-d9{animation-delay:3.6s;animation-duration:.5s}
@keyframes s1-draw{to{stroke-dashoffset:0}}
.s1-pop{transform-box:fill-box;transform-origin:center;opacity:0;animation:s1-pop .6s ease 1.55s forwards}
@keyframes s1-pop{0%{opacity:0;transform:scale(.4) rotate(-25deg)}70%{opacity:1;transform:scale(1.12) rotate(4deg)}100%{opacity:1;transform:scale(1) rotate(0deg)}}
.s1-tickloop{stroke-dasharray:100;stroke-dashoffset:100;animation:s1-ticks 7s ease-in-out infinite}
.s1-t1{animation-delay:2.2s}
@keyframes s1-ticks{0%{stroke-dashoffset:100}8%{stroke-dashoffset:0}78%{stroke-dashoffset:0}88%{stroke-dashoffset:100}100%{stroke-dashoffset:100}}
.s1-float{transform-box:fill-box;transform-origin:center;animation:s1-float 6.5s ease-in-out infinite}
@keyframes s1-float{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-2.5px) rotate(-.5deg)}}
@media (prefers-reduced-motion: reduce){.s1-draw,.s1-tickloop{stroke-dasharray:none;stroke-dashoffset:0;animation:none}.s1-pop{opacity:1;animation:none;transform:none}.s1-float{animation:none}.s1-dot{display:none}}
/* Заголовок «Видеоотзывы» — 2 колонки: текст + скетч talking head (паттерн proc-head) */
.reviews-head{max-width:none;display:grid;grid-template-columns:minmax(0,1fr) clamp(300px,32vw,460px);gap:clamp(28px,4vw,56px);align-items:center}
.reviews-sketch{width:100%;pointer-events:none}
@media(max-width:980px){.reviews-head{grid-template-columns:minmax(0,1fr) clamp(240px,30vw,360px)}}
@media(max-width:860px){.reviews-head{grid-template-columns:1fr;gap:18px;align-items:start}.reviews-sketch{width:100%;max-width:400px}}
@media(max-width:560px){.reviews-sketch{display:block;width:100%;max-width:200px;margin:8px auto 0}}
/* СКЕТЧ TALKING HEAD (R2): техника p9 — wobble + draw-on + петля REC-кольца + мигание точки + float */
.r2-svg{display:block;width:100%;height:auto;overflow:visible}
.r2-ink{fill:none;stroke:var(--ink);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.r2-ink2{fill:none;stroke:var(--ink-2);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.r2-soft{fill:none;stroke:var(--ink-soft);stroke-width:1.3;stroke-linecap:round;opacity:.55}
.r2-accent-line{fill:none;stroke:var(--accent-deep);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.r2-accent-fill{fill:var(--accent);stroke:var(--accent);stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.r2-rec-ring{fill:none;stroke:var(--accent);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.r2-rec-dot{fill:var(--accent)}
.r2-draw{stroke-dasharray:100;stroke-dashoffset:100;animation:r2-draw 1.9s ease forwards}
.r2-d1{animation-delay:.05s}
.r2-d2{animation-delay:.45s}
.r2-d3{animation-delay:.7s}
.r2-d4{animation-delay:.9s}
.r2-d5{animation-delay:1.1s}
.r2-d6{animation-delay:1.3s}
.r2-d7{animation-delay:1.5s}
.r2-d8{animation-delay:1.75s;animation-duration:2.1s}
.r2-d9{animation-delay:2.55s}
@keyframes r2-draw{to{stroke-dashoffset:0}}
.r2-tickloop{stroke-dasharray:100;stroke-dashoffset:100;animation:r2-ticks 7s ease-in-out infinite}
.r2-t1{animation-delay:2.8s}
@keyframes r2-ticks{0%{stroke-dashoffset:100}8%{stroke-dashoffset:0}78%{stroke-dashoffset:0}88%{stroke-dashoffset:100}100%{stroke-dashoffset:100}}
.r2-rec-dot{animation:r2-blink 1.6s ease-in-out infinite;animation-delay:3s}
@keyframes r2-blink{0%,100%{opacity:1}50%{opacity:.15}}
.r2-float{transform-box:fill-box;transform-origin:center;animation:r2-float 6.5s ease-in-out infinite}
@keyframes r2-float{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-2.5px) rotate(-.5deg)}}
@media (prefers-reduced-motion: reduce){.r2-draw,.r2-tickloop{stroke-dasharray:none;stroke-dashoffset:0;animation:none}.r2-float{animation:none}.r2-rec-dot{animation:none;opacity:1}}
/* Заголовок «Инструменты» — 2 колонки: текст + скетч воронка→₽ (паттерн proc-head) */
.tools-head{max-width:none;display:grid;grid-template-columns:minmax(0,1fr) clamp(300px,32vw,460px);gap:clamp(28px,4vw,56px);align-items:center}
.tools-sketch{width:100%;pointer-events:none}
@media(max-width:980px){.tools-head{grid-template-columns:minmax(0,1fr) clamp(240px,30vw,360px)}}
@media(max-width:860px){.tools-head{grid-template-columns:1fr;gap:18px;align-items:start}.tools-sketch{width:100%;max-width:400px}}
@media(max-width:560px){.tools-sketch{display:block;width:100%;max-width:200px;margin:8px auto 0}}
/* СКЕТЧ ВОРОНКА ИНСТРУМЕНТЫ→₽ (T8): техника p9 — wobble + draw-on + петля подчёркивания + бегущие точки + float */
.t8-svg{display:block;width:100%;height:auto;overflow:visible}
.t8-ink{fill:none;stroke:var(--ink);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.t8-ink2{fill:none;stroke:var(--ink-2);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.t8-soft{fill:none;stroke:var(--ink-soft);stroke-width:1.3;stroke-linecap:round;opacity:.55}
.t8-accent-line{fill:none;stroke:var(--accent-deep);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.t8-accent-tick{fill:none;stroke:var(--accent);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.t8-dot{fill:var(--accent)}
.t8-draw{stroke-dasharray:100;stroke-dashoffset:100;animation:t8-draw 1.9s ease forwards}
.t8-d1{animation-delay:.05s}
.t8-d2{animation-delay:.4s}
.t8-d3{animation-delay:.7s}
.t8-d4{animation-delay:1s}
.t8-d5{animation-delay:1.25s}
.t8-d6{animation-delay:1.5s}
.t8-d7{animation-delay:1.75s}
.t8-d8{animation-delay:2s;animation-duration:2.1s}
@keyframes t8-draw{to{stroke-dashoffset:0}}
.t8-tickloop{stroke-dasharray:100;stroke-dashoffset:100;animation:t8-ticks 7s ease-in-out infinite}
.t8-t1{animation-delay:2.6s}
@keyframes t8-ticks{0%{stroke-dashoffset:100}8%{stroke-dashoffset:0}78%{stroke-dashoffset:0}88%{stroke-dashoffset:100}100%{stroke-dashoffset:100}}
.t8-float{transform-box:fill-box;transform-origin:center;animation:t8-float 6.5s ease-in-out infinite}
@keyframes t8-float{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-2.5px) rotate(-.5deg)}}
@media (prefers-reduced-motion: reduce){.t8-draw,.t8-tickloop{stroke-dasharray:none;stroke-dashoffset:0;animation:none}.t8-float{animation:none}.t8-dot{display:none}}
/* Заголовок «Калькулятор» — 2 колонки: текст + скетч спидометр ROI (паттерн proc-head) */
.calc-head{max-width:none;display:grid;grid-template-columns:minmax(0,1fr) clamp(280px,30vw,420px);gap:clamp(28px,4vw,56px);align-items:center}
.calc-sketch{width:100%;pointer-events:none}
@media(max-width:980px){.calc-head{grid-template-columns:minmax(0,1fr) clamp(220px,28vw,330px)}}
@media(max-width:860px){.calc-head{grid-template-columns:1fr;gap:18px;align-items:start}.calc-sketch{width:100%;max-width:360px}}
@media(max-width:560px){.calc-sketch{display:block;width:100%;max-width:200px;margin:8px auto 0}}
/* СКЕТЧ СПИДОМЕТР ROI (C7): техника p9; стрелка вращается вокруг втулки (фикс оси view-box 130,116) */
.c7-svg{display:block;width:100%;height:auto;overflow:visible}
.c7-ink{fill:none;stroke:var(--ink);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.c7-ink2{fill:none;stroke:var(--ink-2);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.c7-soft{fill:none;stroke:var(--ink-soft);stroke-width:1.3;stroke-linecap:round;opacity:.55}
.c7-accent-line{fill:none;stroke:var(--accent-deep);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.c7-accent-tick{fill:none;stroke:var(--accent);stroke-width:3.4;stroke-linecap:round;stroke-linejoin:round}
.c7-dot{fill:var(--accent)}
.c7-draw{stroke-dasharray:100;stroke-dashoffset:100;animation:c7-draw 1.9s ease forwards}
.c7-d1{animation-delay:.05s}
.c7-d2{animation-delay:.4s}
.c7-d3{animation-delay:.65s}
.c7-d4{animation-delay:.85s}
.c7-d5{animation-delay:1.05s}
.c7-d6{animation-delay:1.25s}
.c7-d7{animation-delay:1.45s}
.c7-d8{animation-delay:1.7s;animation-duration:2.1s}
.c7-d9{animation-delay:2.4s}
@keyframes c7-draw{to{stroke-dashoffset:0}}
.c7-tickloop{stroke-dasharray:100;stroke-dashoffset:100;animation:c7-ticks 7s ease-in-out infinite}
@keyframes c7-ticks{0%{stroke-dashoffset:100;opacity:0}2%{opacity:1}8%{stroke-dashoffset:0}92%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}
.c7-needle{transform-box:view-box;transform-origin:130px 116px;animation:c7-swing 4.5s ease-in-out infinite}
@keyframes c7-swing{0%,100%{transform:rotate(0deg)}30%{transform:rotate(-13deg)}45%{transform:rotate(-7deg)}60%{transform:rotate(-15deg)}80%{transform:rotate(-2deg)}}
.c7-float{transform-box:fill-box;transform-origin:center;animation:c7-float 6.5s ease-in-out infinite}
@keyframes c7-float{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-2.5px) rotate(-.5deg)}}
@media (prefers-reduced-motion: reduce){.c7-draw,.c7-tickloop{stroke-dasharray:none;stroke-dashoffset:0;animation:none}.c7-float,.c7-needle{animation:none}}
/* Заголовок «Кейсы» — 2 колонки: текст + скетч кубок-трофей (портретный, умеренный слот) */
.cases-head{max-width:none;display:grid;grid-template-columns:minmax(0,1fr) clamp(200px,24vw,290px);gap:clamp(28px,4vw,56px);align-items:center}
.cases-sketch{width:100%;pointer-events:none}
@media(max-width:980px){.cases-head{grid-template-columns:minmax(0,1fr) clamp(170px,22vw,240px)}}
@media(max-width:860px){.cases-head{grid-template-columns:1fr;gap:18px;align-items:start}.cases-sketch{width:100%;max-width:240px}}
@media(max-width:560px){.cases-sketch{display:block;width:100%;max-width:200px;margin:8px auto 0}}
/* СКЕТЧ КУБОК-ТРОФЕЙ с ₽ (K1): техника p9 — wobble + draw-on + петля перерисовки ₽ + пульс-вспышка + float */
.k1-svg{display:block;width:100%;height:auto;overflow:visible}
.k1-ink{fill:none;stroke:var(--ink);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.k1-ink2{fill:none;stroke:var(--ink-2);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.k1-soft{fill:none;stroke:var(--ink-soft);stroke-width:1.3;stroke-linecap:round;opacity:.55}
.k1-accent-line{fill:none;stroke:var(--accent-deep);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.k1-accent-tick{fill:none;stroke:var(--accent);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.k1-dot{fill:var(--accent)}
.k1-draw{stroke-dasharray:100;stroke-dashoffset:100;animation:k1-draw 1.9s ease forwards}
.k1-d1{animation-delay:.05s}
.k1-d2{animation-delay:.4s}
.k1-d3{animation-delay:.6s}
.k1-d4{animation-delay:.8s}
.k1-d5{animation-delay:1s}
.k1-d6{animation-delay:1.2s}
.k1-d7{animation-delay:1.4s}
@keyframes k1-draw{to{stroke-dashoffset:0}}
.k1-redraw{stroke-dasharray:100;stroke-dashoffset:100;animation:k1-redraw 7s ease-in-out infinite}
.k1-r1{animation-delay:1.7s}
@keyframes k1-redraw{0%{stroke-dashoffset:100}10%{stroke-dashoffset:0}80%{stroke-dashoffset:0}92%{stroke-dashoffset:100}100%{stroke-dashoffset:100}}
.k1-burst{transform-box:fill-box;transform-origin:center;animation:k1-burst 3.2s ease-in-out infinite;animation-delay:1.6s}
@keyframes k1-burst{0%,100%{transform:scale(.8);opacity:.55}50%{transform:scale(1.12);opacity:1}}
.k1-spark{animation:k1-spark 3.2s ease-in-out infinite}
.k1-s1{animation-delay:2s}
.k1-s2{animation-delay:2.6s}
@keyframes k1-spark{0%,100%{opacity:.2;transform:scale(.7)}50%{opacity:1;transform:scale(1)}}
.k1-float{transform-box:fill-box;transform-origin:center;animation:k1-float 6.5s ease-in-out infinite}
@keyframes k1-float{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-2.5px) rotate(-.5deg)}}
@media (prefers-reduced-motion: reduce){.k1-draw,.k1-redraw{stroke-dasharray:none;stroke-dashoffset:0;animation:none}.k1-float,.k1-burst,.k1-spark{animation:none}.k1-spark{opacity:.8}}
/* Заголовок «Команда» — 2 колонки: текст + скетч личный менеджер (паттерн proc-head) */
.team-head{max-width:none;display:grid;grid-template-columns:minmax(0,1fr) clamp(280px,30vw,440px);gap:clamp(28px,4vw,56px);align-items:center}
.team-sketch{width:100%;pointer-events:none}
@media(max-width:980px){.team-head{grid-template-columns:minmax(0,1fr) clamp(230px,28vw,340px)}}
@media(max-width:860px){.team-head{grid-template-columns:1fr;gap:18px;align-items:start}.team-sketch{width:100%;max-width:380px}}
@media(max-width:560px){.team-sketch{display:block;width:100%;max-width:200px;margin:8px auto 0}}
/* СКЕТЧ ЛИЧНЫЙ МЕНЕДЖЕР (TM3): техника p9 — wobble + draw-on + пульс точки-онлайн + float */
.tm3-svg{display:block;width:100%;height:auto;overflow:visible}
.tm3-ink{fill:none;stroke:var(--ink);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.tm3-ink2{fill:none;stroke:var(--ink-2);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.tm3-soft{fill:none;stroke:var(--ink-soft);stroke-width:1.3;stroke-linecap:round;opacity:.55}
.tm3-accent-line{fill:none;stroke:var(--accent-deep);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.tm3-dot{fill:var(--accent)}
.tm3-pulse-ring{stroke:var(--accent);stroke-width:1.6;fill:none}
.tm3-draw{stroke-dasharray:100;stroke-dashoffset:100;animation:tm3-draw 1.9s ease forwards}
.tm3-d1{animation-delay:.05s}
.tm3-d2{animation-delay:.3s}
.tm3-d3{animation-delay:.5s}
.tm3-d4{animation-delay:.8s}
.tm3-d5{animation-delay:1s}
.tm3-d6{animation-delay:1.2s}
.tm3-d7{animation-delay:1.45s}
.tm3-d8{animation-delay:1.65s;animation-duration:2.1s}
.tm3-d9{animation-delay:2.3s}
@keyframes tm3-draw{to{stroke-dashoffset:0}}
.tm3-onlinedot{transform-box:fill-box;transform-origin:center;animation:tm3-blip 3.4s ease-in-out infinite}
@keyframes tm3-blip{0%,100%{transform:scale(1)}50%{transform:scale(1.28)}}
.tm3-pulse-ring{transform-box:fill-box;transform-origin:center;opacity:0;animation:tm3-ripple 3.4s ease-out infinite}
@keyframes tm3-ripple{0%{transform:scale(.5);opacity:.7}70%{transform:scale(2.1);opacity:0}100%{transform:scale(2.1);opacity:0}}
.tm3-float{transform-box:fill-box;transform-origin:center;animation:tm3-float 6.5s ease-in-out infinite}
@keyframes tm3-float{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-2.5px) rotate(-.5deg)}}
@media (prefers-reduced-motion: reduce){.tm3-draw{stroke-dasharray:none;stroke-dashoffset:0;animation:none}.tm3-float{animation:none}.tm3-onlinedot{animation:none}.tm3-pulse-ring{display:none}}

/* ЗАГОЛОВОК МЕДИА — текст + скетч (2 колонки, эталон .proc-head/.team-head) */
.media-head{max-width:none;display:grid;grid-template-columns:minmax(0,1fr) clamp(300px,32vw,460px);gap:clamp(28px,4vw,56px);align-items:center}
.media-sketch{width:100%;pointer-events:none}
@media(max-width:980px){.media-head{grid-template-columns:minmax(0,1fr) clamp(240px,30vw,360px)}}
@media(max-width:860px){.media-head{grid-template-columns:1fr;gap:18px;align-items:start}.media-sketch{width:100%;max-width:400px}}
@media(max-width:560px){.media-sketch{display:block;width:100%;max-width:200px;margin:8px auto 0}}
/* СКЕТЧ ПОДКАСТ-СТОЛ (MD5): техника p9 — wobble + draw-on + бегущий пульс волны между микрофонами + float */
.md5-svg{display:block;width:100%;height:auto;overflow:visible}
.md5-ink{fill:none;stroke:var(--ink);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.md5-ink2{fill:none;stroke:var(--ink-2);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.md5-soft{fill:none;stroke:var(--ink-soft);stroke-width:1.3;stroke-linecap:round;opacity:.55}
.md5-accent-line{fill:none;stroke:var(--accent-deep);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.md5-accent-tick{fill:none;stroke:var(--accent);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.md5-dot{fill:var(--accent)}
.md5-draw{stroke-dasharray:100;stroke-dashoffset:100;animation:md5-draw 1.9s ease forwards}
.md5-d1{animation-delay:.05s}
.md5-d2{animation-delay:.35s}
.md5-d3{animation-delay:.6s}
.md5-d4{animation-delay:.85s}
.md5-d5{animation-delay:1.1s}
.md5-d6{animation-delay:1.3s}
.md5-d8{animation-delay:1.75s;animation-duration:2.1s}
@keyframes md5-draw{to{stroke-dashoffset:0}}
.md5-pulseloop{stroke-dasharray:22 78;stroke-dashoffset:100;animation:md5-pulse 3.4s linear 2.6s infinite}
@keyframes md5-pulse{0%{stroke-dashoffset:100}100%{stroke-dashoffset:0}}
.md5-float{transform-box:fill-box;transform-origin:center;animation:md5-float 6.5s ease-in-out infinite}
@keyframes md5-float{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-2.5px) rotate(-.5deg)}}
@media (prefers-reduced-motion: reduce){.md5-draw,.md5-pulseloop{stroke-dasharray:none;stroke-dashoffset:0;animation:none}.md5-float{animation:none}.md5-dot{display:none}}

/* ЗАГОЛОВОК FAQ — текст + скетч (2 колонки, эталон .proc-head/.media-head) */
.faq-head{max-width:none;display:grid;grid-template-columns:minmax(0,1fr) clamp(300px,32vw,460px);gap:clamp(28px,4vw,56px);align-items:center}
.faq-sketch{width:100%;pointer-events:none}
@media(max-width:980px){.faq-head{grid-template-columns:minmax(0,1fr) clamp(240px,30vw,360px)}}
@media(max-width:860px){.faq-head{grid-template-columns:1fr;gap:18px;align-items:start}.faq-sketch{width:100%;max-width:400px}}
@media(max-width:560px){.faq-sketch{display:block;width:100%;max-width:200px;margin:8px auto 0}}

/* ЦЕНТРИРОВАНИЕ СКЕТЧ-АНИМАЦИЙ при схлопывании заголовка секции в 1 колонку (561–860px).
   Без этого скетч с max-width прижимался влево, справа зияла пустота (правка по скрину Сергея 30.06).
   ≤560 уже центрируется своим margin:auto, >860 — 2-колоночный grid. */
@media (min-width: 561px) and (max-width: 860px) {
  .tools-sketch, .why-sketch, .serm-sketch, .reviews-sketch, .calc-sketch,
  .cases-sketch, .team-sketch, .media-sketch, .faq-sketch, .proc-sketch {
    margin-left: auto;
    margin-right: auto;
  }
}
/* СКЕТЧ ДИАЛОГ ВОПРОС→ОТВЕТ (FQ2): техника p9 — wobble + draw-on + бегущая точка-связь по дуге + float */
.fq2-svg{display:block;width:100%;height:auto;overflow:visible}
.fq2-ink{fill:none;stroke:var(--ink);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.fq2-ink2{fill:none;stroke:var(--ink-2);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.fq2-soft{fill:none;stroke:var(--ink-soft);stroke-width:1.3;stroke-linecap:round;opacity:.55}
.fq2-accent-line{fill:none;stroke:var(--accent-deep);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.fq2-dot{fill:var(--accent)}
.fq2-draw{stroke-dasharray:100;stroke-dashoffset:100;animation:fq2-draw 1.9s ease forwards}
.fq2-d1{animation-delay:.05s}
.fq2-d2{animation-delay:.55s}
.fq2-d3{animation-delay:.95s}
.fq2-d4{animation-delay:1.2s}
.fq2-d5{animation-delay:1.5s}
.fq2-d6{animation-delay:2.1s}
@keyframes fq2-draw{to{stroke-dashoffset:0}}
.fq2-dot{opacity:0;animation:fq2-dotin .3s ease 2.6s forwards}
@keyframes fq2-dotin{to{opacity:1}}
.fq2-float{transform-box:fill-box;transform-origin:center;animation:fq2-float 6.5s ease-in-out infinite}
@keyframes fq2-float{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-2.5px) rotate(-.5deg)}}
@media (prefers-reduced-motion: reduce){.fq2-draw{stroke-dasharray:none;stroke-dashoffset:0;animation:none}.fq2-float{animation:none}.fq2-dot{display:none}}

/* ---------- PROCESS ---------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.step{position:relative;overflow:hidden;background:var(--white);border:1px solid var(--line-strong);border-radius:var(--r);padding:26px 26px 24px;display:flex;flex-direction:column;min-height:178px;transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s}
.step:hover{transform:translateY(-5px);box-shadow:0 16px 36px -20px rgba(22,19,14,.4);border-color:var(--ink-soft)}
.step:hover .card__ico{background:var(--accent);color:#fff;transform:rotate(-6deg)}
.step:hover .corner{transform:translate(0,0)}
.step .corner{position:absolute;top:0;right:0;width:46px;height:46px;background:var(--accent);clip-path:polygon(100% 0,0 0,100% 100%);transform:translate(46px,-46px);transition:transform .35s var(--ease)}
.step .st{font-size:13px;font-weight:800;color:var(--accent-deep);font-variant-numeric:tabular-nums;letter-spacing:.06em}
.step h3{font-size:18px;font-weight:800;letter-spacing:-.02em;margin-top:14px;line-height:1.15}
.step p{font-size:14px;font-weight:700;color:var(--ink-2);margin-top:8px;line-height:1.5}
@media(max-width:860px){.steps{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.steps{grid-template-columns:1fr}}
/* CTA-полоса под шагами процесса (единый паттерн с cases__cta, светлый Studio) */
.proc-cta{display:flex;flex-direction:column;align-items:center;text-align:center;gap:18px;margin-top:34px;padding:clamp(28px,3.4vw,40px) 32px;border:1px dashed var(--line-strong);border-radius:22px;background:radial-gradient(120% 150% at 50% 0%,color-mix(in srgb,var(--accent) 10%,transparent) 0%,transparent 60%),var(--white)}
.proc-cta__head{display:flex;flex-direction:column;gap:10px;max-width:660px}
.proc-cta__head b{font-family:var(--f-display),sans-serif;font-weight:800;font-size:clamp(21px,2.7vw,28px);letter-spacing:-.02em;color:var(--ink);line-height:1.16}
.proc-cta__head span{color:var(--ink-soft);font-size:15px;line-height:1.55}
.proc-cta__btn{min-width:280px;max-width:100%;justify-content:center}
@media(max-width:720px){.proc-cta{padding:26px 20px;gap:16px;margin-top:26px}.proc-cta__head b{font-size:21px}.proc-cta__btn{width:100%;min-width:0;font-size:15px;padding-left:18px;padding-right:18px}}
/* секция process кончается CTA-баннером (самодостаточный блок) → нижний отступ урезан ~вдвое,
   чтобы не зияла пустота под кнопкой (по просьбе Сергея 30.06). Верхний padding не трогаем. */
#process{padding-bottom:clamp(28px,4vw,56px)}

/* ---------- FOUNDER ---------- */
.founder{background:var(--ink);border-radius:24px;padding:clamp(30px,4vw,52px);display:grid;grid-template-columns:auto 1fr;gap:clamp(24px,4vw,48px);align-items:center;position:relative;overflow:hidden}
.founder::after{content:"";position:absolute;right:-90px;top:-90px;width:300px;height:300px;border:2px solid color-mix(in srgb,var(--accent) 22%,transparent);border-radius:50%}
.founder__ph{width:clamp(120px,16vw,180px);height:clamp(120px,16vw,180px);border-radius:20px;object-fit:cover;border:1px solid rgba(255,255,255,.15);position:relative;z-index:1}
.founder__b{position:relative;z-index:1}
.founder__q{font-size:clamp(18px,2.3vw,26px);font-weight:800;letter-spacing:-.02em;line-height:1.3;color:var(--white)}
.founder__q .u{color:var(--accent)}
.founder__who{margin-top:18px;font-size:14.5px;font-weight:800;color:#E7E2D8}
.founder__who span{display:block;font-weight:700;color:#9b948a;font-size:13px;margin-top:3px}
@media(max-width:620px){.founder{grid-template-columns:1fr;text-align:left}}
/* КОМАНДА — портретные карточки (эталон HoReCa/Dental в языке Studio) */
.team-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:8px}
.tm{position:relative;display:flex;flex-direction:column;background:var(--white);border:1px solid var(--line-strong);border-radius:18px;overflow:hidden;transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s var(--ease)}
.tm:hover{transform:translateY(-6px);box-shadow:0 22px 48px -26px rgba(22,19,14,.5);border-color:var(--ink-soft)}
.tm__ph{position:relative;aspect-ratio:1/1;overflow:hidden;background:linear-gradient(135deg,var(--paper-2),var(--paper))}
.tm__ph img{width:100%;height:100%;object-fit:cover;object-position:center 16%;position:relative;z-index:1;transition:transform .6s var(--ease)}
.tm:hover .tm__ph img{transform:scale(1.045)}
.tm__init{position:absolute;inset:0;z-index:0;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:800;font-size:clamp(48px,7vw,68px);letter-spacing:-.03em;color:color-mix(in srgb,var(--accent-deep) 60%,var(--ink-soft));background:linear-gradient(135deg,var(--paper-2),color-mix(in srgb,var(--accent) 15%,var(--paper)))}
.tm__tag{position:absolute;left:14px;bottom:14px;z-index:2;display:inline-flex;align-items:center;gap:6px;padding:7px 13px;border-radius:999px;background:color-mix(in srgb,var(--ink) 80%,transparent);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:var(--white);font-size:11px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}
.tm--lead .tm__tag{background:var(--accent);color:#221007}
.tm__body{display:flex;flex-direction:column;flex:1;padding:21px 22px 24px}
.tm__name{font-family:var(--font-display);font-weight:800;font-size:21px;letter-spacing:-.025em;line-height:1.05;color:var(--ink)}
.tm__role{margin-top:7px;font-size:11.5px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--accent-deep)}
.tm__bio{margin-top:14px;font-size:14px;font-weight:600;line-height:1.58;color:var(--ink-soft)}
.tm__bio .u{color:var(--ink);font-weight:800;box-shadow:inset 0 -.5em 0 color-mix(in srgb,var(--accent) 34%,transparent)}
.tm--lead{border-color:color-mix(in srgb,var(--accent) 55%,var(--line-strong))}
.tm--lead::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--accent);z-index:3}
@media(max-width:860px){.team-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.team-grid{grid-template-columns:1fr}}

/* ---------- FAQ ---------- */
.faq{display:grid;gap:12px}
.qa{background:var(--white);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;transition:border-color .2s}
.qa.open{border-color:var(--line-strong)}
.qa__q{width:100%;text-align:left;font-family:inherit;font-weight:800;font-size:16.5px;letter-spacing:-.01em;color:var(--ink);
  background:none;border:0;cursor:pointer;padding:20px 22px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.qa__q svg{flex:none;width:20px;height:20px;color:var(--accent-deep);transition:transform .3s var(--ease)}
.qa.open .qa__q svg{transform:rotate(45deg)}
.qa__a{max-height:0;overflow:hidden;transition:max-height .35s var(--ease)}
.qa__a p{padding:0 22px 20px;font-size:15px;font-weight:700;color:var(--ink-2);line-height:1.6}

/* ---------- CTA + форма ---------- */
.cta-box{background:var(--ink);border-radius:24px;padding:clamp(34px,5vw,64px);display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(30px,5vw,60px);align-items:center;position:relative;overflow:hidden}
.cta-box::after{content:"";position:absolute;right:-80px;top:-80px;width:300px;height:300px;border:2px solid color-mix(in srgb,var(--accent) 30%,transparent);border-radius:50%}
.cta-box::before{content:"";position:absolute;right:-30px;bottom:-120px;width:260px;height:260px;border:2px solid color-mix(in srgb,var(--accent) 18%,transparent);border-radius:50%}
.cta-copy{position:relative;z-index:1;min-width:0}
.cta-copy .k{font-size:13.5px;font-weight:800;letter-spacing:.04em;color:var(--accent);margin-bottom:18px;text-transform:uppercase}
.cta-copy h2{font-size:clamp(28px,4vw,46px);font-weight:800;letter-spacing:-.035em;line-height:1.04;color:var(--white)}
.cta-copy h2 .u{color:var(--accent)}
.cta-copy p{margin-top:20px;font-size:16px;font-weight:700;color:#C9C3B8;line-height:1.6;max-width:42ch;letter-spacing:-.01em}
.cta-copy .micro{margin-top:22px;display:flex;flex-wrap:wrap;gap:18px}
.cta-copy .micro span{font-size:13px;font-weight:800;color:#E7E2D8;display:flex;align-items:center;gap:8px}
.cta-copy .micro span::before{content:"";width:8px;height:8px;background:var(--accent);border-radius:50%;flex:none}
.form{position:relative;z-index:1;background:var(--white);border-radius:18px;padding:clamp(24px,3vw,32px);min-width:0}
.form h3{font-size:19px;font-weight:800;letter-spacing:-.02em;margin-bottom:6px}
.form .sub{font-size:13.5px;font-weight:700;color:var(--ink-soft);margin-bottom:20px}
.field{margin-bottom:15px}
.field label{display:block;font-size:13px;font-weight:800;color:var(--ink-2);margin-bottom:8px;letter-spacing:-.01em}
.field input,.field textarea{width:100%;font-family:inherit;font-weight:700;font-size:16px;color:var(--ink);background:var(--paper);border:1px solid var(--line-strong);border-radius:11px;padding:14px 16px;transition:border-color .2s,box-shadow .2s,background .2s}
.field textarea{resize:vertical;min-height:64px}
.field input::placeholder,.field textarea::placeholder{color:#A39C8E;font-weight:700}
.field input:hover,.field textarea:hover{border-color:var(--ink-soft)}
.field input:focus,.field textarea:focus{outline:none;border-color:var(--accent);background:var(--white);box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 28%,transparent)}
.consent{display:flex;gap:10px;align-items:flex-start;margin:4px 0 16px}
.consent input{margin-top:3px;accent-color:var(--accent-deep);flex:none}
.consent label{font-size:12px;font-weight:700;color:var(--ink-soft);line-height:1.5}
.consent a{color:var(--accent-deep);text-decoration:underline}
.form .form-submit{width:100%;justify-content:center}
.form .hint{margin-top:13px;font-size:11.5px;font-weight:700;color:var(--ink-soft);line-height:1.5;text-align:center}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
@media(max-width:860px){.cta-box{grid-template-columns:1fr}}

/* ---------- FOOTER (богатый, тема-адаптивный — как у HoReCa, в стиле страницы) ---------- */
.foot{border-top:1px solid var(--line);background:var(--paper-2);padding:clamp(44px,5vw,64px) 0 24px;margin-top:clamp(48px,7vw,90px)}
.foot-grid{display:grid;grid-template-columns:minmax(230px,1.2fr) minmax(130px,.72fr) minmax(300px,1.55fr) minmax(240px,1.25fr);gap:clamp(24px,2.4vw,40px)}
.foot-brand .logo{display:inline-flex;align-items:baseline;gap:2px;font-family:var(--font-display);font-weight:800;font-size:22px;letter-spacing:-.03em;color:var(--ink)}
.foot-brand .logo .dot{color:var(--accent);font-size:25px}
.foot-brand p{margin:13px 0 0;font-size:14px;font-weight:700;color:var(--ink-soft);line-height:1.6;max-width:32ch}
.foot-soc{display:flex;gap:10px;margin-top:18px}
.foot-soc a{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:12px;background:var(--white);border:1px solid var(--line-strong);color:var(--ink-2);transition:all .18s var(--ease)}
.foot-soc a:hover{border-color:var(--accent);color:var(--accent-deep);transform:translateY(-2px)}
.foot-soc svg{width:18px;height:18px}
.foot-col b{display:block;font-size:12.5px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-soft);margin-bottom:14px}
.foot-col a{display:block;font-size:14.5px;font-weight:700;color:var(--ink-2);margin-bottom:10px;transition:color .15s}
.foot-col a:hover{color:var(--accent-deep)}
.foot-tools-links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 18px;align-items:start}
.foot-tools-links a{line-height:1.35}
.foot-col--contacts .foot-contact{display:flex;align-items:center;gap:11px;margin-bottom:13px;color:var(--ink-2);font-weight:700;text-decoration:none}
.foot-contact svg{width:20px;height:20px;color:var(--accent-deep);flex:none}
.foot-contact em{display:block;font-style:normal;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-soft)}
.foot-contact span{font-size:14px;line-height:1.3}
.foot-contact--static{color:var(--ink-soft)}
a.foot-contact:hover{color:var(--accent-deep)}
.foot-cta{margin-top:18px;font-size:16px;padding:15px 20px;text-align:center}
/* CTA в подвале сохраняет общий цветной primary-контракт; здесь только геометрия. */
.foot-col--contacts a.foot-cta{display:flex;width:100%;justify-content:center;align-items:center;gap:8px;color:var(--action-ink)}
.foot-col--contacts a.foot-cta:hover{color:var(--action-ink)}
/* Кнопка отправки формы — центрируем текст+стрелку (full-width, иначе прижата влево) */
.cta__submit{justify-content:center}
.theme-dark .foot-col--contacts a.foot-cta{color:var(--action-ink)}
.foot-legal{margin-top:clamp(30px,4vw,44px);padding-top:22px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px}
.foot-legal__req b{font-size:13.5px;font-weight:800;color:var(--ink)}
.foot-legal__req span{display:block;font-size:12.5px;font-weight:700;color:var(--ink-soft);margin-top:3px}
.foot-legal__links{display:flex;flex-wrap:wrap;gap:8px 18px}
.foot-legal__links a{font-size:13px;font-weight:700;color:var(--ink-soft);transition:color .15s}
.foot-legal__links a:hover{color:var(--accent-deep)}
.foot-bottom{margin-top:20px;padding-top:18px;border-top:1px solid var(--line);display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;font-size:12.5px;font-weight:700;color:var(--ink-soft)}
.foot-bottom b{color:var(--accent-deep)}
@media(max-width:1080px){.foot-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}.foot-brand{grid-column:1/-1}}
@media(max-width:860px){.foot-grid{grid-template-columns:1fr 1fr;gap:28px 22px}.foot-brand,.foot-col--contacts{grid-column:1/-1}}
@media(max-width:520px){.foot-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 18px}.foot-brand,.foot-col--contacts{grid-column:1/-1}.foot-tools-links{grid-template-columns:1fr}.foot-col a{font-size:13.5px}.foot-legal,.foot-bottom{flex-direction:column;align-items:flex-start}.foot-bottom{padding-right:76px}}
@media(max-width:420px){.foot-grid{grid-template-columns:1fr}.foot-brand,.foot-col--contacts{grid-column:auto}.foot-tools-links{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px}}
@media(max-width:420px){body.theme-teal .foot-grid,body.theme-med .foot-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 16px}body.theme-teal .foot-brand,body.theme-teal .foot-col--contacts,body.theme-med .foot-brand,body.theme-med .foot-col--contacts{grid-column:1/-1}}
@media(max-width:340px){.foot-tools-links{grid-template-columns:1fr}}

/* ---------- ОВЕРЛЕИ: гейт + поп-ап (Studio-стиль) ---------- */
.ov{position:fixed;inset:0;z-index:3000;display:flex;align-items:center;justify-content:center;padding:24px;
  background:rgba(22,19,14,.55);-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);
  opacity:0;visibility:hidden;transition:opacity .25s ease,visibility .25s ease}
.ov.open{opacity:1;visibility:visible}
.ov__card{width:100%;max-width:480px;background:var(--white);border:1px solid var(--line-strong);border-radius:22px;padding:36px 32px;position:relative;
  box-shadow:0 40px 90px -30px rgba(22,19,14,.6);transform:translateY(14px);transition:transform .3s var(--ease)}
.ov.open .ov__card{transform:none}
.ov__close{position:absolute;top:14px;right:14px;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:var(--paper);color:var(--ink-soft);cursor:pointer;font-size:20px;line-height:1;display:flex;align-items:center;justify-content:center;font-family:inherit}
.ov__close:hover{color:var(--ink);border-color:var(--line-strong)}
.ov__eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:12.5px;font-weight:800;letter-spacing:.04em;color:var(--accent-deep);text-transform:uppercase;margin-bottom:16px}
.ov__eyebrow::before{content:"";width:24px;height:3px;background:var(--accent);border-radius:2px}
.ov__card h2{font-size:clamp(22px,3.4vw,27px);font-weight:800;letter-spacing:-.02em;line-height:1.15;margin-bottom:10px}
.ov__card>p{font-size:15px;font-weight:700;color:var(--ink-2);margin-bottom:22px;line-height:1.5}
.gate__opts{display:flex;flex-direction:column;gap:11px}
.gate__opt{display:flex;align-items:center;gap:14px;width:100%;text-align:left;cursor:pointer;background:var(--paper);border:1px solid var(--line);border-radius:13px;padding:15px 18px;color:var(--ink);font-family:inherit;font-size:16px;font-weight:800;transition:border-color .15s,background .15s,transform .15s var(--ease)}
.gate__opt:hover{border-color:var(--accent);background:var(--white);transform:translateY(-2px)}
.gate__opt[aria-pressed="true"]{border-color:var(--accent-deep);background:color-mix(in srgb,var(--accent) 13%,var(--white));box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 18%,transparent)}
.gate__opt .ic{width:40px;height:40px;border-radius:11px;background:color-mix(in srgb,var(--oc,var(--accent)) 16%,transparent);color:var(--oc,var(--accent-deep));display:flex;align-items:center;justify-content:center;flex:none}
.gate__opt .ic svg{width:21px;height:21px}
.gate__actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}
.gate__continue,.gate__allow{min-height:46px;border-radius:11px;padding:11px 14px;font-family:inherit;font-size:12.5px;font-weight:800;line-height:1.3;cursor:pointer;transition:transform .2s var(--ease),border-color .2s,background .2s}
.gate__continue{color:var(--ink-2);background:transparent;border:1px solid var(--line-strong)}
.gate__allow{color:var(--action-ink);background:var(--action-face);border:1px solid var(--action-edge);box-shadow:4px 4px 0 var(--action-back),5px 5px 0 color-mix(in srgb,var(--action-edge) 42%,transparent)}
.gate__continue:hover{transform:translateY(-2px)}
.gate__allow:hover{transform:translate(2px,2px);background:color-mix(in srgb,var(--action-face) 92%,var(--accent));box-shadow:2px 2px 0 var(--action-back),3px 3px 0 color-mix(in srgb,var(--action-edge) 42%,transparent)}
.gate__allow:active{transform:translate(4px,4px);box-shadow:none}
.gate__continue:focus-visible,.gate__allow:focus-visible{outline:3px solid var(--action-focus);outline-offset:4px}
.gate__note{margin-top:14px;font-size:11.5px;font-weight:650;color:var(--ink-soft);text-align:left;line-height:1.45;letter-spacing:.005em}
.gate__note a{color:var(--accent-deep);text-decoration:underline}
@media(max-width:520px){.ov{padding:14px}.ov__card{padding:28px 20px;max-height:calc(100dvh - 28px);overflow:auto}.gate__actions{grid-template-columns:1fr}}
.pop__list li span{flex:1}
.pop__list b{color:var(--ink);font-weight:800}
.pop__list{list-style:none;margin:0 0 22px}
.pop__list li{display:flex;align-items:flex-start;gap:10px;font-size:14.5px;font-weight:700;color:var(--ink-2);margin-bottom:11px}
.pop__list li svg{width:20px;height:20px;color:var(--accent-deep);flex:none;margin-top:1px}
.pop__btns{display:flex;flex-direction:column;gap:10px}
.pop__btns .btn-primary{justify-content:center;white-space:nowrap;font-size:15.5px}
.pop__later{background:none;border:0;color:var(--ink-soft);font-size:14px;font-weight:700;cursor:pointer;font-family:inherit;padding:4px}
.pop__later:hover{color:var(--ink)}

/* ---------- НЕНАВЯЗЧИВЫЕ CTA-КАРТОЧКИ (не закрывают контент) ---------- */
.engage{position:fixed;right:clamp(14px,2vw,28px);bottom:clamp(14px,2vw,28px);z-index:2900;width:min(430px,calc(100vw - 28px));pointer-events:none;opacity:0;visibility:hidden;transform:translateY(18px) scale(.985);transition:opacity .24s ease,transform .28s var(--ease),visibility .24s ease}
.engage.open{pointer-events:auto;opacity:1;visibility:visible;transform:none}
.engage__card{position:relative;overflow:hidden;padding:28px 26px 24px;border:1px solid var(--line-strong);border-radius:20px;background:color-mix(in srgb,var(--white) 96%,var(--accent) 4%);box-shadow:0 28px 70px -28px rgba(22,19,14,.72)}
.engage__card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--accent)}
.engage__card h2{max-width:360px;margin:0 40px 9px 0;font-size:clamp(20px,2.4vw,26px);line-height:1.16;letter-spacing:-.025em}
.engage__card>p{margin:0 0 18px;color:var(--ink-2);font-size:14px;font-weight:700;line-height:1.5}
.engage__close{position:absolute;right:12px;top:12px;display:grid;place-items:center;width:40px;height:40px;border:1px solid var(--line);border-radius:50%;background:var(--paper);color:var(--ink-soft);font:700 20px/1 inherit;cursor:pointer}
.engage__close:hover{color:var(--ink);border-color:var(--line-strong)}
.engage__actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.engage__actions .btn{min-height:46px;flex:1 1 240px;justify-content:center;font-size:14px}
.engage__actions .pop__later{flex:0 0 auto}
.engage--ai .engage__card::after{content:"AI";position:absolute;right:-6px;bottom:-25px;color:color-mix(in srgb,var(--accent) 9%,transparent);font-size:92px;font-weight:800;line-height:1;pointer-events:none}
.engage--ai .engage__actions,.engage--ai .engage__card>p{position:relative;z-index:1}
.mx-overlay-active .mxc-btn,.mx-overlay-active .mxc-tease{opacity:0!important;pointer-events:none!important}
@media(max-width:760px){.engage{left:10px;right:10px;bottom:calc(10px + env(safe-area-inset-bottom));width:auto}.engage__card{padding:20px 18px 18px;max-height:min(52dvh,430px);overflow:auto}.engage__card h2{font-size:20px}.engage__card>p{margin-bottom:14px}.engage__actions{align-items:stretch}.engage__actions .btn,.engage__actions .pop__later{width:100%;flex-basis:100%}}
@media(prefers-reduced-motion:reduce){.engage,.engage__card{animation:none!important;transition:none!important;transform:none!important}}

/* ---------- STICKY CTA (мобайл) + TOAST ---------- */

/* КНОПКА «НАВЕРХ» (язык Studio: бумага + акцент, палитра по секции) */
.toast{position:fixed;left:50%;bottom:26px;transform:translate(-50%,140%);opacity:0;visibility:hidden;pointer-events:none;z-index:4000;background:var(--ink);color:var(--white);border-radius:12px;padding:15px 24px;font-size:14.5px;font-weight:800;box-shadow:0 20px 50px -20px rgba(22,19,14,.7);transition:transform .35s var(--ease),opacity .35s var(--ease),visibility .35s var(--ease);max-width:90vw}
.toast.show{transform:translate(-50%,0);opacity:1;visibility:visible;pointer-events:auto}

/* ---------- доп. блоки для продуктовых страниц инструментов ---------- */
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chip{font-size:13.5px;font-weight:800;color:var(--ink-2);background:var(--white);border:1px solid var(--line-strong);border-radius:999px;padding:9px 16px}
.ps{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.ps__card{background:var(--white);border:1px solid var(--line-strong);border-radius:var(--r);padding:28px}
.ps__card .lbl{font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:10px;display:inline-block}
.ps__card--s{border-color:color-mix(in srgb,var(--accent) 45%,var(--line-strong))}
.ps__card--s .lbl{color:var(--accent-deep)}
.ps__card p{font-size:15.5px;font-weight:700;color:var(--ink-2);line-height:1.6}
@media(max-width:760px){.ps{grid-template-columns:1fr}}
.plan{background:var(--white);border:1px solid var(--line-strong);border-radius:var(--r);padding:clamp(26px,4vw,40px);text-align:center;max-width:640px;margin:0 auto}
.plan h3{font-size:20px;font-weight:800;letter-spacing:-.02em}
.plan__price{margin:14px 0 18px;font-size:clamp(19px,2.4vw,26px);font-weight:800;color:var(--accent-deep);letter-spacing:-.02em}
.plan__list{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-bottom:24px}
.plan__list span{font-size:13.5px;font-weight:700;color:var(--ink-2);background:var(--paper-2);border:1px solid var(--line);border-radius:999px;padding:8px 14px}
.crumbs{font-size:13px;font-weight:700;color:var(--ink-soft);margin-bottom:18px}
.crumbs a{color:var(--ink-2)}.crumbs a:hover{color:var(--accent-deep)}.crumbs span{margin:0 7px;color:var(--ink-soft)}
.th-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.th-grid .card .cat{font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-soft)}
.th-grid .card .price{margin-top:8px;font-size:12.5px;font-weight:800;color:var(--accent-deep)}
.th-grid .card.hide{display:none}
@media(max-width:1000px){.th-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.th-grid{grid-template-columns:1fr}}
.goalbar{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 30px}

/* ---------- Шоукейсы инструментов на хабе (полноширинные блоки, разделитель = шов .seam) ---------- */
.tshow.sec{padding:clamp(44px,6vw,84px) 0}
.tshow-intro.sec{padding:clamp(38px,5vw,62px) 0 clamp(8px,1.2vw,14px)}
.tshow-intro__chip{display:table;margin:0 auto;padding:11px 24px;border:1px solid color-mix(in srgb,var(--accent) 45%,transparent);border-radius:999px;font-weight:800;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-deep);background:color-mix(in srgb,var(--accent) 8%,transparent)}
.tshow-intro__sub{margin:14px auto 0;text-align:center;max-width:64ch;color:var(--ink-soft);font-size:14.5px;font-weight:700;line-height:1.55}
.tshow__grid{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(320px,540px);gap:clamp(28px,4vw,58px);align-items:center}
.tshow__grid--rev{grid-template-columns:minmax(320px,540px) minmax(0,1.02fr)}
.tshow__grid--rev .tshow__decor{order:-1}
.tshow__body .section-kick{font-size:14px}
.tshow__body h2{font-size:clamp(28px,3.4vw,46px);letter-spacing:-.035em;line-height:1.05;max-width:16ch}
.tshow__lead{margin-top:16px;font-family:var(--font-display);font-weight:800;font-size:clamp(19px,2vw,25px);line-height:1.3;letter-spacing:-.3px;max-width:30ch}
.tshow__desc{margin-top:12px;font-size:clamp(16px,1.4vw,17.5px);line-height:1.62;color:var(--ink-2);max-width:56ch}
.tshow__can{margin-top:16px}
.tshow__can li{font-size:clamp(15px,1.3vw,16.5px)}
.tshow__mets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 18px;margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}
.tshow__met{min-width:0}
.tshow__met b{display:block;font-family:var(--font-display);font-weight:800;font-size:clamp(21px,2vw,26px);letter-spacing:-.5px;color:var(--accent)}
.tshow__met span{display:block;font-size:13px;color:var(--ink-soft);margin-top:3px}
.tshow__actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.tshow__decor{position:relative;min-width:0;display:flex;align-items:center;justify-content:center;
  background:radial-gradient(80% 80% at 50% 40%,rgba(157,93,255,.10),transparent 70%);border-radius:22px;padding:8px}
.tshow__decor svg{display:block;width:100%;max-width:520px;height:auto;overflow:visible;margin:auto}
.hub-faq__head{margin-bottom:clamp(34px,4.5vw,56px)}
.hub-faq .faq{max-width:none;margin:0}
@media(max-width:920px){
  .tshow__grid,.tshow__grid--rev{grid-template-columns:1fr;gap:20px}
  .tshow__grid--rev .tshow__decor{order:0}
  .tshow__decor{max-width:420px;margin:0 auto;width:100%}
  .tshow__actions .btn{flex:1 1 auto;justify-content:center}
  .tshow__body h2,.tshow__lead{max-width:none}
}
@media(max-width:560px){.tshow__mets{grid-template-columns:1fr;gap:10px}}

/* ---------- AI-neon декоры шоукейсов (анимации; пауза вне вьюпорта через .aidec.out-view) ---------- */
.aidec.out-view *{animation-play-state:paused!important}
.motion-scene.out-view,.motion-scene.out-view *{animation-play-state:paused!important}
/* ---------- хаб /tools/: декор hero (созвездие над панелью) и каталога (маршрутизатор задач) ---------- */
.hero-side{position:relative;min-width:0}
.hero-aidec{position:absolute;left:-5%;right:-5%;bottom:calc(100% - 4px);pointer-events:none}
.hero-aidec svg{display:block;width:100%;height:auto;overflow:visible}
@media(max-width:880px){.hero-aidec{display:none}}
.thead-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,360px);gap:clamp(24px,4vw,56px);align-items:center;margin-bottom:clamp(30px,4vw,44px)}
.thead-grid .sec-head{margin-bottom:0}
@media(max-width:920px){.thead-grid{grid-template-columns:1fr;gap:24px}}
.adh-dot{stroke-dasharray:.1 11.9;animation:adhFlow 2.8s linear infinite}
.adh-dot-b{animation-delay:-1.2s}
.adh-dot-c{animation-delay:-.6s}
.adh-dot-d{animation-delay:-2s}
@keyframes adhFlow{from{stroke-dashoffset:0}to{stroke-dashoffset:-24}}
.adh-stream{stroke-dasharray:.1 9.9;animation:adhStream 1.9s linear infinite}
.adh-stream-b{animation-delay:-.9s}
@keyframes adhStream{from{stroke-dashoffset:0}to{stroke-dashoffset:-20}}
.adh-np{animation:adhPulse 3.2s ease-in-out infinite}
.adh-d2{animation-delay:-.5s}.adh-d3{animation-delay:-1s}.adh-d4{animation-delay:-1.6s}.adh-d5{animation-delay:-2.1s}.adh-d6{animation-delay:-2.7s}
@keyframes adhPulse{0%,100%{opacity:.3}50%{opacity:.85}}
.adh-core{animation:adhCore 2.8s ease-in-out infinite}
@keyframes adhCore{0%,100%{opacity:.55}50%{opacity:1}}
.adh-orbit{animation:adhOrbit 16s linear infinite}
@keyframes adhOrbit{from{stroke-dashoffset:0}to{stroke-dashoffset:-88}}
.adh-sp{animation:adhTwink 2.6s ease-in-out infinite}
.adh-sp-2{animation-delay:-.9s}.adh-sp-3{animation-delay:-1.7s}
@keyframes adhTwink{0%,100%{opacity:.15}50%{opacity:.9}}
.adc-dot{stroke-dasharray:.1 11.9;stroke-linecap:round;animation:adcFlow 2.6s linear infinite}
.adc-dot-b{animation-delay:-1.05s;animation-duration:3.4s}
.adc-dot-c{animation-delay:-1.9s;animation-duration:3.4s}
@keyframes adcFlow{from{stroke-dashoffset:0}to{stroke-dashoffset:-24}}
.adc-cyan{stroke-dasharray:.1 9.9;stroke-linecap:round;animation:adcCyan 1.6s linear infinite}
@keyframes adcCyan{from{stroke-dashoffset:0}to{stroke-dashoffset:-20}}
.adc-ring{animation:adcRing 14s linear infinite}
@keyframes adcRing{from{stroke-dashoffset:0}to{stroke-dashoffset:-77}}
.adc-halo{animation:adcBreath 3s ease-in-out infinite}
@keyframes adcBreath{0%,100%{opacity:.28}50%{opacity:.6}}
.adc-core{animation:adcCore 2.6s ease-in-out infinite}
@keyframes adcCore{0%,100%{opacity:.55}50%{opacity:1}}
.adc-chip{animation:adcChip 3.4s ease-in-out infinite}
@keyframes adcChip{0%,100%{opacity:.18}50%{opacity:.45}}
.adc-ok{animation:adcOk 4.2s ease-in-out infinite}
@keyframes adcOk{0%,100%{opacity:.15}45%,75%{opacity:.55}}
.adc-check{stroke-dasharray:20;animation:adcCheck 4.2s ease-in-out infinite}
@keyframes adcCheck{0%{stroke-dashoffset:20;opacity:.2}30%{stroke-dashoffset:0;opacity:1}75%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:20;opacity:.2}}
.adc-sp{animation:adcTwink 2.8s ease-in-out infinite}
.adc-sp-2{animation-delay:-1s}.adc-sp-3{animation-delay:-1.9s}
@keyframes adcTwink{0%,100%{opacity:.15}50%{opacity:.9}}
.hfq-flow{animation:hfqFlow 2.7s linear infinite}
.hfq-flow--b{animation-delay:-.7s}.hfq-flow--c{animation-delay:-1.4s}.hfq-flow--out{animation-duration:1.8s;animation-delay:-.35s}
@keyframes hfqFlow{to{stroke-dashoffset:-24}}
.hfq-node{animation:hfqNode 3s ease-in-out infinite}.hfq-node--b{animation-delay:-1s}.hfq-node--c{animation-delay:-2s}
@keyframes hfqNode{0%,100%{opacity:.4}50%{opacity:1}}
.hfq-qglow,.hfq-cardglow{animation:hfqGlow 3.4s ease-in-out infinite}.hfq-cardglow{animation-delay:-1.7s}
@keyframes hfqGlow{0%,100%{opacity:.25}50%{opacity:.58}}
.hfq-q{transform-box:view-box;transform-origin:120px 110px;animation:hfqQuestion 3.2s ease-in-out infinite}
@keyframes hfqQuestion{0%,100%{transform:translateY(0);opacity:.7}50%{transform:translateY(-3px);opacity:1}}
.hfq-check{stroke-dasharray:24;animation:hfqCheck 4.2s ease-in-out infinite}
@keyframes hfqCheck{0%,18%{stroke-dashoffset:24;opacity:.2}42%,78%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:24;opacity:.2}}
.ad01-nucleus{transform-box:view-box;transform-origin:150px 150px;animation:adPulse01 2.8s ease-in-out infinite;}
@keyframes adPulse01{0%,100%{transform:scale(1)}50%{transform:scale(1.3)}}
.ad01-coreglow{animation:adGlow01 2.8s ease-in-out infinite;}
@keyframes adGlow01{0%,100%{opacity:.45}50%{opacity:1}}
.ad01-ringhalo{animation:adBreathe01 2.8s ease-in-out infinite;}
@keyframes adBreathe01{0%,100%{opacity:.38}50%{opacity:.62}}
.ad01-dot{stroke-dasharray:.1 11.9;stroke-linecap:round;animation:adFlow01 2.6s linear infinite;}
.ad01-dot-b{animation-delay:-1.3s;}
@keyframes adFlow01{from{stroke-dashoffset:0}to{stroke-dashoffset:-24}}
.ad01-syn{animation:adSyn01 2.8s ease-in-out infinite;}
.ad01-syn-2{animation-delay:-.7s;}
.ad01-syn-3{animation-delay:-1.4s;}
.ad01-syn-4{animation-delay:-2.1s;}
@keyframes adSyn01{0%,100%{opacity:.35}50%{opacity:1}}
.ad01-scan{transform-box:view-box;transform-origin:80px 38px;animation:adScan01 3.6s ease-in-out infinite;}
@keyframes adScan01{0%{transform:translateY(0);opacity:0}12%{opacity:.7}55%{opacity:.7}68%,100%{transform:translateY(48px);opacity:0}}
.ad01-check{stroke-dasharray:21;animation:adCheck01 4s ease-in-out infinite;}
@keyframes adCheck01{0%{stroke-dashoffset:21;opacity:.25}30%{stroke-dashoffset:0;opacity:1}78%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:21;opacity:.25}}
.ad01-orbit{animation:adOrbit01 14s linear infinite;}
@keyframes adOrbit01{from{stroke-dashoffset:0}to{stroke-dashoffset:-90}}
.ad02-np{animation:nodePulse02 2.5s ease-in-out infinite}
.ad02-nc{animation:corePulse02 2.5s ease-in-out infinite}
.ad02-d0{animation-delay:0s}
.ad02-d1{animation-delay:.32s}
.ad02-d2{animation-delay:.64s}
.ad02-d3{animation-delay:.96s}
.ad02-d4{animation-delay:1.28s}
.ad02-run{animation:dashRun02 3.2s linear infinite}
.ad02-scan{animation:scan02 4s ease-in-out infinite alternate;transform-box:view-box;transform-origin:0px 0px}
.ad02-coinhalo{animation:coinGlow02 3s ease-in-out infinite}
.ad02-float{animation:float02 3.4s ease-in-out infinite alternate;transform-box:view-box;transform-origin:0px 0px}
.ad02-sp{animation:sparkle02 2.4s ease-in-out infinite}
.ad02-s1{animation-delay:.5s}
.ad02-s2{animation-delay:1.2s}
.ad02-s3{animation-delay:.8s}
@keyframes nodePulse02{0%,100%{opacity:.15}50%{opacity:.9}}
@keyframes corePulse02{0%,100%{opacity:.65;r:2.6px}50%{opacity:1;r:3.6px}}
@keyframes dashRun02{from{stroke-dashoffset:0}to{stroke-dashoffset:-79}}
@keyframes scan02{from{transform:translateX(0)}to{transform:translateX(212px)}}
@keyframes coinGlow02{0%,100%{opacity:.3}50%{opacity:.75}}
@keyframes float02{from{transform:translateY(0)}to{transform:translateY(-3px)}}
@keyframes sparkle02{0%,100%{opacity:.15}50%{opacity:1}}
.ad03-halo{animation:breathe03 3.2s ease-in-out infinite}
.ad03-core{transform-box:view-box;transform-origin:150px 82px;animation:core03 2.4s ease-in-out infinite}
.ad03-pulse{transform-box:view-box;transform-origin:150px 148px;animation:pulse03 3.6s cubic-bezier(.25,.6,.4,1) infinite}
.ad03-pulse--b{animation-delay:1.8s}
.ad03-cometA{animation:cometA03 4s linear infinite}
.ad03-cometB{animation:cometB03 3.2s linear infinite}
.ad03-miniA{animation:blink03 2.8s ease-in-out infinite}
.ad03-miniB{animation:blink03 3.6s ease-in-out 1.4s infinite}
@keyframes breathe03{0%,100%{opacity:.4}50%{opacity:.8}}
@keyframes core03{0%,100%{transform:scale(1)}50%{transform:scale(1.28)}}
@keyframes pulse03{0%{transform:scale(.35);opacity:.9}55%{opacity:.35}100%{transform:scale(3);opacity:0}}
@keyframes cometA03{from{stroke-dashoffset:0}to{stroke-dashoffset:-504.5}}
@keyframes cometB03{from{stroke-dashoffset:0}to{stroke-dashoffset:322.9}}
@keyframes blink03{0%,74%,100%{opacity:1}82%{opacity:.2}88%{opacity:.9}94%{opacity:.35}}
.ad04-hl{animation:haloCycle04 6.6s ease-in-out infinite}
.ad04-edge{animation:edgeCycle04 6.6s ease-in-out infinite}
.ad04-hb{animation:heartCycle04 6.6s ease-in-out infinite}
.ad04-p2 .ad04-hl,.ad04-p2 .ad04-edge,.ad04-p2 .ad04-hb{animation-delay:2.2s}
.ad04-p3 .ad04-hl,.ad04-p3 .ad04-edge,.ad04-p3 .ad04-hb{animation-delay:4.4s}
.ad04-f{transform-box:view-box;transform-origin:150px 110px;opacity:0;animation:floatUp04 3.6s ease-in-out infinite}
.ad04-f1{animation-delay:.2s;animation-duration:3.4s}
.ad04-f2{animation-delay:1.1s}
.ad04-f3{animation-delay:2s;animation-duration:3.9s}
.ad04-f4{animation-delay:.7s;animation-duration:3.7s}
.ad04-f5{animation-delay:1.6s;animation-duration:3.3s}
.ad04-node{animation:nodePulse04 2.8s ease-in-out infinite}
.ad04-node2{animation-delay:1.4s}
@keyframes haloCycle04{0%,45%,100%{opacity:.22}9%,30%{opacity:.8}}
@keyframes edgeCycle04{0%,45%,100%{opacity:.6}9%,30%{opacity:1}}
@keyframes heartCycle04{0%,45%,100%{opacity:.3}9%{opacity:1}17%{opacity:.45}25%{opacity:1}33%{opacity:.6}}
@keyframes floatUp04{0%{transform:translateY(0);opacity:0}14%{opacity:.95}65%{opacity:.7}100%{transform:translateY(-64px);opacity:0}}
@keyframes nodePulse04{0%,100%{opacity:.25}50%{opacity:.9}}
.ad05-core{transform-box:view-box;transform-origin:146px 104px;animation:adCore05 2.6s ease-in-out infinite;}
@keyframes adCore05{0%,100%{transform:scale(1);}50%{transform:scale(1.18);}}
.ad05-coreHalo{animation:adHalo05 2.6s ease-in-out infinite;}
@keyframes adHalo05{0%,100%{opacity:.32;}50%{opacity:.75;}}
.ad05-hexGlow{animation:adHexGlow05 2.6s ease-in-out infinite;}
@keyframes adHexGlow05{0%,100%{opacity:.38;}50%{opacity:.65;}}
.ad05-tick1{animation:adTick05 2.6s ease-in-out infinite;}
.ad05-tick2{animation:adTick05 2.6s ease-in-out infinite;animation-delay:1.3s;}
@keyframes adTick05{0%,100%{opacity:.3;}50%{opacity:.9;}}
.ad05-bubGlow{animation:adBreathe05 3.4s ease-in-out infinite;}
@keyframes adBreathe05{0%,100%{opacity:.38;}50%{opacity:.62;}}
.ad05-flow{animation:adFlow05 2.8s linear infinite;}
@keyframes adFlow05{to{stroke-dashoffset:-24;}}
.ad05-orbit{animation:adOrbit05 4s linear infinite;}
@keyframes adOrbit05{to{stroke-dashoffset:-64;}}
.ad05-pkt1{offset-path:path("M114 78 C123 83 127 82 133 86.5");animation:adPkt05 2.8s ease-in-out infinite;}
.ad05-pkt2{offset-path:path("M157 122 C162 126 165 127 170 130");animation:adPkt05 2.8s ease-in-out infinite;animation-delay:1.4s;}
@keyframes adPkt05{0%{offset-distance:0%;opacity:0;}12%{opacity:1;}42%{offset-distance:100%;opacity:1;}50%,100%{offset-distance:100%;opacity:0;}}
.ad05-dot{transform-box:view-box;animation:adType05 2s ease-in-out infinite;}
.ad05-dot1{transform-origin:198px 157px;}
.ad05-dot2{transform-origin:217px 157px;animation-delay:.25s;}
.ad05-dot3{transform-origin:236px 157px;animation-delay:.5s;}
@keyframes adType05{0%,60%,100%{transform:translateY(0);opacity:.55;}30%{transform:translateY(-4.5px);opacity:1;}}
.ad06-halo{animation:breathe06 3.4s ease-in-out infinite;}
.ad05-pkt1,.ad05-pkt2,.ad06-pIn,.ad06-out,.ad07-dot,.ad09-dot{transform-box:view-box;transform-origin:0 0;offset-anchor:0 0;offset-rotate:0deg}
.ad06-pIn{opacity:0;animation:fallIn06 2.8s ease-in-out infinite;}
.ad06-p1{offset-path:path('M100,10 C100,55 122,95 146,132');}
.ad06-p2{offset-path:path('M150,4 C150,50 150,90 150,132');animation-delay:.7s;}
.ad06-p3{offset-path:path('M202,12 C200,58 178,98 154,132');animation-delay:1.4s;}
.ad06-p4{offset-path:path('M126,6 C126,50 136,92 148,132');animation-delay:2.1s;}
.ad06-out{opacity:0;offset-path:path('M150,155 L150,180');animation:drop06 4.2s ease-in-out 2.6s infinite;}
.ad06-flashDot{animation:flashDot06 4.2s ease-in-out 2.6s infinite;}
.ad06-flashRing{transform-box:view-box;transform-origin:150px 152px;animation:flashRing06 4.2s ease-in-out 2.6s infinite;}
.ad06-land{animation:land06 4.2s ease-in-out 2.6s infinite;}
.ad06-nodeA{animation:node06 2.4s ease-in-out infinite;}
.ad06-nodeB{animation:node06 2.4s ease-in-out infinite;animation-delay:1.2s;}
.ad06-dotA{animation:dot06 3s ease-in-out infinite;}
.ad06-dotB{animation:dot06 3s ease-in-out infinite;animation-delay:.5s;}
.ad06-dotC{animation:dot06 3s ease-in-out infinite;animation-delay:1s;}
@keyframes fallIn06{0%{offset-distance:0%;opacity:0}10%{opacity:1}78%{opacity:1}96%{offset-distance:100%;opacity:0}100%{offset-distance:100%;opacity:0}}
@keyframes drop06{0%{offset-distance:0%;opacity:0}4%{opacity:1}20%{offset-distance:100%;opacity:1}27%{offset-distance:100%;opacity:0}100%{offset-distance:100%;opacity:0}}
@keyframes flashDot06{0%{opacity:0}5%{opacity:1}18%{opacity:0}100%{opacity:0}}
@keyframes flashRing06{0%{transform:scale(.4);opacity:0}6%{opacity:.9}22%{transform:scale(1.7);opacity:0}100%{transform:scale(1.7);opacity:0}}
@keyframes breathe06{0%,100%{opacity:.4}50%{opacity:.65}}
@keyframes node06{0%,100%{opacity:.55}50%{opacity:1}}
@keyframes dot06{0%,100%{opacity:.25}50%{opacity:.9}}
@keyframes land06{0%,16%{opacity:.15}24%{opacity:.9}42%,100%{opacity:.15}}
.ad07-b{transform-box:view-box;animation:barGrow07 3.2s ease-in-out infinite;}
.ad07-b1{transform-origin:67px 178px;}
.ad07-b2{transform-origin:103px 178px;animation-delay:.5s;}
.ad07-b3{transform-origin:139px 178px;animation-delay:1s;}
@keyframes barGrow07{0%{transform:scaleY(.45)}40%,72%{transform:scaleY(1)}100%{transform:scaleY(.45)}}
.ad07-dot{offset-path:path("M50,122 C62,114 72,102 86,100 C100,98 108,113 120,112 C136,110 140,86 154,82 C168,78 176,94 188,94 C202,94 212,70 224,68 C236,66 252,74 264,80");offset-rotate:0deg;animation:dotRun07 3.6s ease-in-out infinite;}
@keyframes dotRun07{0%{offset-distance:0%;opacity:0}8%{opacity:1}92%{opacity:1}100%{offset-distance:100%;opacity:0}}
.ad07-ind{transform-box:view-box;transform-origin:260px 39px;animation:pulse07 2.4s ease-in-out infinite;}
@keyframes pulse07{0%,100%{transform:scale(.75);opacity:.55}50%{transform:scale(1.2);opacity:1}}
.ad07-lineGlow{animation:breathe07 4s ease-in-out infinite;}
@keyframes breathe07{0%,100%{opacity:.35}50%{opacity:.6}}
.ad07-node{animation:nodeBlink07 2.8s ease-in-out infinite;}
.ad07-n2{animation-delay:.9s;}
.ad07-n3{animation-delay:1.8s;}
@keyframes nodeBlink07{0%,100%{opacity:.4}50%{opacity:1}}
.ad08-halo{animation:flash08 1.2s linear -.78s infinite}
.ad08-scan{transform-box:view-box;transform-origin:0 0;animation:scan08 3.6s ease-in-out infinite}
.ad08-node{animation:node08 2.6s ease-in-out infinite}
.ad08-dotRa{transform-box:view-box;transform-origin:0 0;animation:dotRa08 3.6s linear 0s infinite}
.ad08-dotRb{transform-box:view-box;transform-origin:0 0;animation:dotRb08 3.6s linear -1.2s infinite}
.ad08-dotRc{transform-box:view-box;transform-origin:0 0;animation:dotRc08 3.6s linear -2.4s infinite}
.ad08-dotCa{transform-box:view-box;transform-origin:0 0;animation:dotC08 3.2s linear -.6s infinite}
.ad08-dotCb{transform-box:view-box;transform-origin:0 0;animation:dotC08 3.2s linear -2.2s infinite}
.ad08-ring{transform-box:view-box}
.ad08-ring1{transform-origin:126px 86px;animation:ring08 3.6s linear 0s infinite}
.ad08-ring2{transform-origin:126px 108px;animation:ring08 3.6s linear -1.2s infinite}
.ad08-ring3{transform-origin:131px 138px;animation:ring08 3.6s linear -2.4s infinite}
@keyframes flash08{0%,100%{opacity:.45}8%{opacity:.95}18%{opacity:.45}}
@keyframes scan08{0%{transform:translateY(0);opacity:0}10%{opacity:.65}85%{opacity:.65}100%{transform:translateY(114px);opacity:0}}
@keyframes node08{0%,100%{opacity:.45}50%{opacity:1}}
@keyframes dotRa08{0%{transform:translate(0,0);opacity:0}7%{opacity:.95}45%{transform:translate(114px,0);opacity:.95}60%{transform:translate(82px,-26px);opacity:0}100%{transform:translate(82px,-26px);opacity:0}}
@keyframes dotRb08{0%{transform:translate(0,0);opacity:0}7%{opacity:.95}45%{transform:translate(118px,0);opacity:.95}60%{transform:translate(88px,26px);opacity:0}100%{transform:translate(88px,26px);opacity:0}}
@keyframes dotRc08{0%{transform:translate(0,0);opacity:0}7%{opacity:.95}45%{transform:translate(115px,0);opacity:.95}60%{transform:translate(84px,20px);opacity:0}100%{transform:translate(84px,20px);opacity:0}}
@keyframes dotC08{0%{transform:translate(0,0);opacity:0}6%{opacity:.9}90%{opacity:.9}100%{transform:translate(286px,0);opacity:0}}
@keyframes ring08{0%,44%{transform:scale(.3);opacity:0}47%{transform:scale(.8);opacity:.9}62%{transform:scale(2.4);opacity:0}100%{transform:scale(2.4);opacity:0}}
.ad09-dot{visibility:hidden}
@supports (offset-path:path("M0 0L10 10")){
  .ad09-dot{visibility:visible;offset-path:path("M26 110a124 92 0 1 0 248 0a124 92 0 1 0 -248 0");offset-rotate:0deg;transform-box:view-box;transform-origin:150px 110px}
  .ad09-dot1{animation:adOrbit09 6.5s linear infinite}
  .ad09-dot2{animation:adOrbit09 6.5s linear infinite;animation-delay:-3.25s}
}
.ad09-halo{animation:adHalo09 3s ease-in-out infinite alternate}
.ad09-breathe{animation:adBreath09 3s ease-in-out infinite alternate}
.ad09-bar{transform-box:view-box;transform-origin:150px 105px;animation:adGrow09 3.2s ease-in-out infinite alternate}
.ad09-b2{animation-delay:-.45s}
.ad09-b3{animation-delay:-.9s}
.ad09-b4{animation-delay:-1.35s}
.ad09-b5{animation-delay:-1.8s}
.ad09-b6{animation-delay:-2.25s}
.ad09-trend{stroke-dasharray:69;animation:adDraw09 4s ease-in-out infinite}
.ad09-node{transform-box:view-box;transform-origin:176px 54px;animation:adNode09 2.6s ease-in-out infinite}
.ad09-arrow{transform-box:view-box;transform-origin:150px 141px;animation:adBob09 2.4s ease-in-out infinite}
@keyframes adOrbit09{from{offset-distance:0%}to{offset-distance:100%}}
@keyframes adHalo09{from{opacity:.38}to{opacity:.62}}
@keyframes adBreath09{from{opacity:.45}to{opacity:1}}
@keyframes adGrow09{from{transform:scaleY(.5)}to{transform:scaleY(1)}}
@keyframes adDraw09{0%{stroke-dashoffset:69;opacity:0}7%{stroke-dashoffset:69;opacity:1}55%{stroke-dashoffset:0;opacity:1}86%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}
@keyframes adNode09{0%,100%{transform:scale(1);opacity:.7}50%{transform:scale(1.45);opacity:1}}
@keyframes adBob09{0%,100%{transform:translateY(-1.4px)}50%{transform:translateY(1.4px)}}
.ad10-ring-o{animation:ad10ring 3s ease-in-out infinite;transform-box:view-box;transform-origin:150px 110px}
.ad10-ring-i{animation:ad10ring 3s ease-in-out -1.5s infinite;transform-box:view-box;transform-origin:150px 110px}
@keyframes ad10ring{0%,100%{transform:scale(1)}50%{transform:scale(1.055)}}

.ad10-nucleus{animation:ad10nuc 2.4s ease-in-out infinite;transform-box:view-box;transform-origin:150px 110px}
@keyframes ad10nuc{0%,100%{transform:scale(1);opacity:.85}50%{transform:scale(1.28);opacity:1}}

.ad10-flash{animation:ad10flash 4s ease-in-out infinite}
@keyframes ad10flash{0%,38%{opacity:0}47%{opacity:.75}52%{opacity:.45}57%{opacity:.7}70%,100%{opacity:0}}

.ad10-pulse{animation:ad10dash 3s ease-in-out infinite}
.ad10-p1{animation-delay:-.2s}
.ad10-p2{animation-delay:-1.2s}
.ad10-p3{animation-delay:-2.2s}
.ad10-p4{animation-delay:-.7s}
.ad10-p5{animation-delay:-1.7s}
.ad10-p6{animation-delay:-2.7s}
@keyframes ad10dash{from{stroke-dashoffset:100}to{stroke-dashoffset:0}}

.ad10-n1,.ad10-n2,.ad10-n3,.ad10-n4,.ad10-n5,.ad10-n6{animation:ad10node 3s ease-in-out infinite}
.ad10-n1{animation-delay:-.2s}
.ad10-n2{animation-delay:-1.2s}
.ad10-n3{animation-delay:-2.2s}
.ad10-n4{animation-delay:-.7s}
.ad10-n5{animation-delay:-1.7s}
.ad10-n6{animation-delay:-2.7s}
@keyframes ad10node{0%,100%{opacity:.35}50%{opacity:.9}}

.ad10-orbit{animation:ad10orbit 4s linear infinite}
@keyframes ad10orbit{to{stroke-dashoffset:-18}}
.ad11-flow{animation:flow11 3s ease-in-out infinite}
.ad11-flow--p2{animation-delay:.5s}
.ad11-flow--p3{animation-delay:1s}
.ad11-dots{animation:dash11 2.8s ease-in-out infinite}
.ad11-dots--p2{animation-duration:3.4s;animation-delay:.6s}
.ad11-dots--p3{animation-duration:3.1s;animation-delay:1.2s}
.ad11-gap{animation:gap11 3.2s ease-in-out infinite}
.ad11-magHalo{animation:pulse11 3.2s ease-in-out infinite}
.ad11-field{animation:field11 3.6s ease-in-out infinite}
.ad11-f2{animation-delay:1.4s}
.ad11-src{animation:node11 2.8s ease-in-out infinite}
.ad11-n2{animation-delay:.7s}
.ad11-n3{animation-delay:1.3s}
.ad11-spark{animation:flare11 2.8s ease-in-out infinite;transform-box:view-box}
.ad11-s1{transform-origin:201px 87px}
.ad11-s2{transform-origin:199px 97px;animation-delay:1s}
.ad11-s3{transform-origin:203px 105px;animation-delay:1.9s}
.ad11-bar{animation:grow11 3.2s ease-in-out infinite;transform-box:view-box}
.ad11-b1{transform-origin:216.5px 192px}
.ad11-b2{transform-origin:229.5px 192px;animation-delay:.35s}
.ad11-b3{transform-origin:242.5px 192px;animation-delay:.7s}
.ad11-b4{transform-origin:255.5px 192px;animation-delay:1.05s}
.ad11-led{animation:node11 2.2s ease-in-out infinite}
@keyframes flow11{from{stroke-dashoffset:18}to{stroke-dashoffset:0}}
@keyframes dash11{from{stroke-dashoffset:56}to{stroke-dashoffset:0}}
@keyframes pulse11{0%,100%{opacity:.38}50%{opacity:.72}}
@keyframes field11{0%,100%{opacity:.16}50%{opacity:.5}}
@keyframes gap11{0%,100%{opacity:.55}50%{opacity:1}}
@keyframes node11{0%,100%{opacity:.35}50%{opacity:1}}
@keyframes flare11{0%{opacity:0;transform:scale(.35)}12%{opacity:1;transform:scale(1.3)}32%{opacity:.7;transform:scale(1)}55%{opacity:0;transform:scale(.45)}100%{opacity:0;transform:scale(.35)}}
@keyframes grow11{0%,100%{transform:scaleY(.4)}55%{transform:scaleY(1)}70%{transform:scaleY(.95)}80%{transform:scaleY(1)}}
.ad12-scan{animation:ad12scan 3.6s ease-in-out infinite;transform-box:view-box;transform-origin:118px 78px;will-change:transform;}
.ad12-run{animation:ad12run 3.4s ease-in-out infinite;}
.ad12-np{animation:ad12glow 2.6s ease-in-out infinite;transform-box:view-box;transform-origin:118px 78px;}
.ad12-barGlow{animation:ad12glow 3.2s ease-in-out infinite;}
@keyframes ad12scan{0%{transform:translateX(-88px);opacity:0}8%{opacity:1}92%{opacity:1}100%{transform:translateX(88px);opacity:0}}
@keyframes ad12run{0%{stroke-dashoffset:16;opacity:0}8%{opacity:1}92%{opacity:1}100%{stroke-dashoffset:-124;opacity:0}}
@keyframes ad12glow{0%,100%{opacity:.3}50%{opacity:.8}}

.goalbar button{font-family:inherit;font-weight:800;font-size:14px;letter-spacing:-.01em;cursor:pointer;color:var(--ink-2);background:var(--white);border:1px solid var(--line-strong);border-radius:999px;padding:10px 18px;transition:all .18s var(--ease)}
.goalbar button:hover{border-color:var(--ink-soft)}
.goalbar button.active{background:var(--accent);color:#160a2e;border-color:var(--accent)}

/* ============================================================
   ТЁМНАЯ AI-ТЕМА (переиспользуемая): <body class="theme-dark">.
   Переопределяет нейтральные токены, сохраняя семантику primary/contrast:
   тематическая primary остаётся узнаваемой на любой поверхности, а contrast
   применяется только осознанно (например, внутри калькулятора).
   ============================================================ */
.theme-dark{
  --paper:#0b0a12; --paper-2:#100e1c; --white:#15131f;
  --ink:#f4f2fb; --ink-2:rgba(244,242,251,.76); --ink-soft:rgba(244,242,251,.54);
  --line:rgba(255,255,255,.09); --line-strong:rgba(255,255,255,.17);
  --accent:#9d5dff; --accent-deep:#bca4ff;
  --action-face:var(--accent); --action-ink:#171411; --action-back:#fff;
  --action-edge:color-mix(in srgb,var(--accent) 70%,#171411); --action-focus:#fff;
  --action-contrast-face:#171411; --action-contrast-ink:#fff; --action-contrast-back:var(--accent);
  --action-contrast-edge:#171411; --action-contrast-focus:#fff;
  --action-disabled-face:#34313c; --action-disabled-ink:#aaa5b3;
}
.theme-dark .btn-primary{background:var(--action-face);border-color:var(--action-edge);color:var(--action-ink);box-shadow:6px 6px 0 var(--action-back),7px 7px 0 color-mix(in srgb,var(--accent) 48%,transparent)}
.theme-dark .btn-primary:hover{background:color-mix(in srgb,var(--action-face) 88%,#fff);border-color:var(--action-edge);box-shadow:3px 3px 0 var(--action-back),4px 4px 0 color-mix(in srgb,var(--accent) 48%,transparent)}
.theme-dark .btn-primary:disabled,.theme-dark .btn-primary[aria-disabled="true"]{color:var(--action-disabled-ink);background:var(--action-disabled-face);border-color:var(--line-strong);box-shadow:3px 3px 0 color-mix(in srgb,var(--accent) 30%,transparent)}
.theme-dark .btn-ghost{color:var(--ink);background:var(--paper-2);border-color:var(--line-strong);box-shadow:3px 3px 0 color-mix(in srgb,var(--accent) 48%,transparent)}
.theme-dark .btn-ghost:hover{background:color-mix(in srgb,var(--paper-2) 90%,var(--accent));border-color:var(--accent)}
.theme-dark .card:hover{box-shadow:0 18px 40px -22px color-mix(in srgb,var(--accent) 45%,transparent)}
/* «тёмные блоки» светлой темы → на тёмной = приподнятая поверхность с кантом */
.theme-dark .cta-box,.theme-dark .founder,.theme-dark .card.feat{background:var(--paper-2);border:1px solid var(--line-strong)}
.theme-dark .cta-copy h2,.theme-dark .founder__q,.theme-dark .card.feat h3{color:var(--ink)}
.theme-dark .cta-copy p,.theme-dark .card.feat p{color:var(--ink-2)}
.theme-dark .founder__who{color:var(--ink)} .theme-dark .founder__who span{color:var(--ink-soft)}
.theme-dark .cta-copy .micro span{color:var(--ink-2)}
.theme-dark .card.feat .fcta{background:var(--accent);color:#160a2e}
.theme-dark .card.feat .idx{color:var(--ink-soft)!important}
.theme-dark .toast{background:var(--accent);color:#160a2e}
/* мягкое фиолетовое свечение-атмосфера за hero */
/* clip: декор-glow ::before уходит right:-80px за правый край full-width hero и даёт ~80px горизонт. overflow
   на theme-dark tool-страницах (.hero — position:relative, но без отсечки). overflow-x:clip отсекает горизонт.
   вылет, сохраняя вертикальную атмосферу (top:-120px) и не создавая y-скролл-контейнер (в отличие от hidden). */
.theme-dark .hero{overflow-x:clip}
.theme-dark .hero::before{content:"";position:absolute;top:-120px;right:-80px;width:520px;height:520px;pointer-events:none;
  background:radial-gradient(circle,color-mix(in srgb,var(--accent) 18%,transparent),transparent 66%);filter:blur(20px);z-index:0}
.theme-dark .hero>.wrap{position:relative;z-index:1}

/* reveal */
.rv{opacity:0;transform:translateY(14px);transition:opacity .45s var(--ease),transform .45s var(--ease)}
.rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none}.display .money::after{transition:none;transform:scaleX(1)}*{animation:none!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}

/* ===== МЕДИА / ВИДЕО (главная, Studio) ===== */
.video-facade{position:relative;display:block;border-radius:18px;overflow:hidden;background:linear-gradient(135deg,var(--ink),#34302a);cursor:pointer;text-decoration:none}
.video-facade__poster{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;transition:opacity .5s var(--ease)}
.video-facade.is-bg .video-facade__poster{opacity:1}
.video-facade::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(10,8,6,.55),transparent 58%);z-index:1;pointer-events:none}
.video-facade__play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:2}
.video-facade__play svg{width:60px;height:60px;filter:drop-shadow(0 8px 22px rgba(0,0,0,.45));transition:transform .3s var(--ease)}
.video-facade:hover .video-facade__play svg{transform:scale(1.09)}
.video-facade iframe{position:absolute;inset:0;width:100%;height:100%;border:0;z-index:3}
/* видео-отзывы */
.vrev-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.vrev{display:flex;flex-direction:column;gap:13px}
.vrev .video-facade{aspect-ratio:4/5}
.vrev__badge{position:absolute;left:13px;bottom:13px;z-index:2;display:inline-flex;align-items:center;gap:6px;padding:7px 13px;border-radius:999px;background:rgba(255,255,255,.16);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:#fff;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}
.vrev__who b{font-weight:800;font-size:15.5px;color:var(--ink)}
.vrev__who span{display:block;font-size:13px;color:var(--ink-soft);font-weight:700;margin-top:3px}
.vrev__who span .u{color:var(--accent-deep);font-weight:800}
@media(max-width:860px){.vrev-grid{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.vrev-grid{grid-template-columns:1fr}}
/* подкасты */
.pod-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.pod__cat{display:block;font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--accent-deep);margin-bottom:11px}
.pod .video-facade{aspect-ratio:16/9}
@media(max-width:860px){.pod-grid{grid-template-columns:1fr}}
/* рилсы */
.reels-head{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;margin:clamp(36px,5vw,52px) 0 20px}
.reels-head h3{font-family:var(--font-display);font-size:clamp(19px,2.3vw,27px);font-weight:800;letter-spacing:-.03em;color:var(--ink);margin-top:6px}
.reels-nav{display:flex;gap:10px;flex:none}
.rnav{width:44px;height:44px;border-radius:50%;border:1px solid var(--line-strong);background:var(--white);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;color:var(--ink-2);transition:all .18s var(--ease)}
.rnav svg{width:18px;height:18px}
.rnav:hover{border-color:var(--accent-deep);color:var(--accent-deep)}
/* viewport-обёртка: даёт контекст для плавного затухания правого края в фон.
   ВАЖНО: затухание идёт в rgba(paper,0)→paper (НЕ keyword `transparent` — он
   интерполирует через прозрачно-ЧЁРНЫЙ и даёт грязный серый налёт). */
.reels-vp{position:relative}
.reels-vp::after{content:"";position:absolute;top:0;right:0;bottom:0;width:clamp(72px,8vw,124px);pointer-events:none;z-index:2;background:linear-gradient(to right,rgba(244,241,235,0) 0%,rgba(244,241,235,.55) 58%,rgba(244,241,235,.92) 86%,var(--paper) 100%)}
/* padding-bottom 44px = место под полную мягкую тень рилсов (тень уходит ~38px);
   иначе overflow-y:hidden резал её → резкая горизонтальная линия снизу. */
.reels-track{display:flex;gap:16px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;padding:6px 2px 44px;-webkit-overflow-scrolling:touch;scrollbar-width:none}
/* Красивый фон для медиа-секций (видеоотзывы, рилсы): тёплый градиент + мягкое
   акцентное свечение — тёмные карточки сидят на богатой подложке, без плоского «обреза». */
.sec--media{position:relative;overflow:hidden}
.sec--media::before{content:"";position:absolute;left:50%;top:-10%;width:min(1100px,92%);height:520px;transform:translateX(-50%);background:radial-gradient(60% 100% at 50% 0%,color-mix(in srgb,var(--accent) 14%,transparent),transparent 72%);filter:blur(20px);pointer-events:none;z-index:0}
.sec--media > .wrap{position:relative;z-index:1}
.reels-track::-webkit-scrollbar{display:none}
.reel.video-facade{flex:0 0 clamp(224px,22vw,288px);aspect-ratio:9/16;scroll-snap-align:start;border-radius:18px;box-shadow:0 20px 40px -22px rgba(22,19,14,.4)}
@media(max-width:520px){.reel.video-facade{flex-basis:70vw}}

/* ===== ВИДЕООТЗЫВЫ (крупная карусель, эталон HoReCa) ===== */
.videos{position:relative}
.videos-head{display:flex;justify-content:flex-end;margin-bottom:18px}
.videos-track{position:relative;padding:6px}
.videos-track::-webkit-scrollbar{display:none}
.vcard{display:none;grid-template-columns:minmax(280px,360px) 1fr;gap:clamp(24px,4vw,44px);align-items:center;padding:clamp(20px,3vw,32px);border-radius:22px;background:var(--white);border:1px solid var(--line-strong);box-shadow:0 30px 64px -28px rgba(22,19,14,.4)}
.vcard.is-active{display:grid;animation:vcardIn .4s var(--ease)}
@keyframes vcardIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.vcard__frame{position:relative;width:100%;aspect-ratio:333/592;max-width:360px;border-radius:18px;overflow:hidden;background:var(--ink);display:block}
.vcard__frame .video-facade__play svg{width:60px;height:60px}
.vcard__badge{position:absolute;left:13px;top:13px;z-index:4;display:inline-flex;align-items:center;padding:7px 13px;border-radius:999px;background:var(--accent);color:#221007;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}
.vcard__brand{display:inline-flex;align-items:center;padding:7px 14px;border-radius:999px;background:color-mix(in srgb,var(--accent) 12%,transparent);color:var(--accent-deep);font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}
.vcard__name{font-family:var(--font-display);font-weight:800;font-size:clamp(24px,3vw,34px);letter-spacing:-.03em;color:var(--ink);margin:16px 0 8px}
.vcard__title{font-size:15.5px;font-weight:600;color:var(--ink-soft);line-height:1.5;max-width:38ch}
.vcard__stats{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:20px 0 0}
.vcard__stats li{background:var(--paper-2);border-radius:13px;padding:14px 16px}
.vcard__stats b{font-family:var(--font-display);font-weight:800;font-size:clamp(18px,2vw,22px);letter-spacing:-.03em;color:var(--ink);display:block;line-height:1}
.vcard__stats em{font-style:normal;font-size:12px;font-weight:700;color:var(--ink-soft);margin-top:4px;display:block}
.vcard__case{display:inline-flex;align-items:center;gap:6px;font-weight:800;font-size:14px;color:var(--accent-deep)}
.vcard__trust{margin:18px 0 0;font-size:14px;font-weight:600;line-height:1.55;color:var(--ink-soft);max-width:440px}
.vcard__cta-row{display:flex;align-items:center;flex-wrap:wrap;gap:16px 22px;margin-top:20px}
.vcard__cta-row .vcard__cta{flex:0 0 auto}
@media(max-width:820px){.vcard{grid-template-columns:1fr;gap:20px;text-align:left}.vcard__frame{max-width:300px;margin:0 auto}}

/* ===== КЕЙСЫ И ОТЗЫВЫ (постеры HoReCa, видеоотзывы) ===== */
.case-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.case-card{background:var(--white);border:1px solid var(--line-strong);border-radius:18px;overflow:hidden;display:flex;flex-direction:column;transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s var(--ease)}
.case-card:hover{transform:translateY(-5px);box-shadow:0 22px 46px -26px rgba(22,19,14,.45);border-color:var(--ink-soft)}
.case-card__media{position:relative;aspect-ratio:16/10;background:var(--ink);background-size:cover;background-position:center}
.case-card__media .video-facade{position:absolute;inset:0;border-radius:0;background:transparent}
.case-card__media .video-facade__play svg{width:54px;height:54px}
.case-card__badge{position:absolute;left:12px;top:12px;z-index:4;display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:999px;background:var(--accent);color:#221007;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}
.case-card__badge--soft{background:rgba(255,255,255,.92);color:var(--ink)}
.case-card__media--static::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(10,8,6,.32),transparent 52%)}
.case-card__body{padding:20px 22px 22px}
.case-card__cat{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.05em;color:var(--accent-deep)}
.case-card__brand{font-family:var(--font-display);font-weight:800;font-size:21px;letter-spacing:-.025em;color:var(--ink);margin:8px 0 10px}
.case-card__desc{margin:0 0 16px;font-size:13.5px;font-weight:600;line-height:1.5;color:var(--ink-soft)}
.case-card__metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;border-top:1px solid var(--line);padding-top:15px}
.case-card__metrics b{font-family:var(--font-display);font-weight:800;font-size:18px;letter-spacing:-.03em;color:var(--ink);display:block;line-height:1}
.case-card__metrics span{font-size:11px;font-weight:700;color:var(--ink-soft);margin-top:4px;display:block;line-height:1.2}
@media(max-width:920px){.case-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.case-grid{grid-template-columns:1fr}.case-card__metrics b{font-size:17px}}


/* ============================================================
   ИНТЕГРАЦИЯ: швы + 3D-фон hero + CTA-моушн. Добавить В КОНЕЦ studio.css
   (после .case-card... строка ~486). Анимируется только transform/opacity.
   ============================================================ */

/* ---------- 1. СИСТЕМА ШВОВ (тихие стыки секций) ---------- */
.seam{position:relative}
.seam>.wrap{position:relative;z-index:1}
/* шов = градиент-зона потепления + хайрлайн, ОБА в ::after двумя слоями фона.
   Хайрлайн впечён сюда (а не в ::before), т.к. у .sec--media ::before занят радиальным
   свечением — иначе коллизия псевдоэлемента и шов на медийных секциях не виден. */
.seam::after{content:"";position:absolute;left:0;right:0;bottom:0;height:clamp(56px,6.5vw,104px);pointer-events:none;z-index:0;background:linear-gradient(to right,transparent,var(--line-strong) 16%,var(--line-strong) 84%,transparent) bottom left/100% 1px no-repeat,linear-gradient(to bottom,color-mix(in srgb,var(--paper) 0%,transparent) 0%,color-mix(in srgb,var(--paper-2) 72%,var(--paper)) 100%)}
/* .seam--line — устар.: хайрлайн теперь во всех .seam через ::after выше (класс безвреден) */
.proof{position:relative}
.proof::before,.proof::after{content:"";position:absolute;left:0;right:0;height:clamp(26px,3.4vw,46px);pointer-events:none;z-index:0}
.proof::before{top:0;background:linear-gradient(to bottom,var(--paper),color-mix(in srgb,var(--paper) 0%,transparent))}
.proof::after{bottom:0;background:linear-gradient(to top,var(--paper),color-mix(in srgb,var(--paper) 0%,transparent))}
.proof>.wrap{position:relative;z-index:1}
/* заземление тёмных плашек — богатая СТАТИЧНАЯ тень (overflow не режет наружу) */
.card.feat{box-shadow:0 30px 70px -34px rgba(22,19,14,.55),0 5px 16px -10px rgba(22,19,14,.32)}
.card.feat:hover{box-shadow:0 34px 78px -34px rgba(22,19,14,.6),0 7px 18px -10px rgba(22,19,14,.4)}
#cta .cta__wrap{box-shadow:0 34px 80px -38px rgba(22,19,14,.5),0 8px 20px -12px rgba(22,19,14,.32)}
.cases .case{box-shadow:0 18px 46px -28px rgba(22,19,14,.4)}
/* тёплый ОРЕОЛ под тёмным баннером tools (на родителе .tool-grid: у .card.feat overflow:hidden) */
.tool-grid{position:relative}
.tool-grid::after{content:"";position:absolute;left:50%;bottom:-30px;width:min(900px,88%);height:240px;transform:translateX(-50%);z-index:0;pointer-events:none;border-radius:50%;background:radial-gradient(50% 50% at 50% 50%,color-mix(in srgb,var(--ink) 13%,transparent),transparent 72%);filter:blur(26px);opacity:var(--seam-halo,1);transition:opacity .9s var(--ease)}
.tool-grid>*{position:relative;z-index:1}
@media(prefers-reduced-motion:reduce){.tool-grid::after{transition:none}}
@media(max-width:620px){.seam::after{height:clamp(32px,8vw,56px)}.tool-grid::after{filter:blur(16px)}}

/* ---------- 2. HERO 3D-ФОН (узоры в перспективе, под контентом) ---------- */
.hero__bg{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;perspective:900px;perspective-origin:62% 36%;-webkit-mask-image:radial-gradient(125% 115% at 64% 34%,#000 38%,transparent 100%);mask-image:radial-gradient(125% 115% at 64% 34%,#000 38%,transparent 100%);--px:0;--py:0}
.hero>.wrap{position:relative;z-index:1}
.hero__bg .pl{position:absolute;left:-12%;top:-14%;width:124%;height:128%;transform-style:preserve-3d;backface-visibility:hidden}
.hero__bg .pl>i{position:absolute;inset:-6%;display:block;will-change:transform}
.hero__bg .pl--dots{transform:translateZ(-220px) translate3d(calc(var(--px)*-9px),calc(var(--py)*-9px),0)}
.hero__bg .pl--dots>i{background-image:radial-gradient(circle,color-mix(in srgb,var(--ink) 26%,transparent) 1.4px,transparent 1.5px);background-size:34px 34px;opacity:.10;animation:heroDrift 46s linear infinite}
.hero__bg .pl--mesh{transform:translateZ(-90px) translate3d(calc(var(--px)*-18px),calc(var(--py)*-18px),0)}
.hero__bg .pl--mesh>i{background-image:repeating-linear-gradient(60deg,color-mix(in srgb,var(--ink) 20%,transparent) 0 1px,transparent 1px 52px),repeating-linear-gradient(-60deg,color-mix(in srgb,var(--ink) 20%,transparent) 0 1px,transparent 1px 52px);opacity:.085;animation:heroFloat 38s var(--ease) infinite alternate}
.hero__bg .pl--glow{transform:translateZ(40px) translate3d(calc(var(--px)*26px),calc(var(--py)*26px),0)}
.hero__bg .pl--glow>i{background-image:radial-gradient(42% 40% at 30% 24%,color-mix(in srgb,var(--accent) 16%,transparent),transparent 70%),radial-gradient(36% 34% at 84% 78%,color-mix(in srgb,var(--accent-deep) 9%,transparent),transparent 72%);opacity:.9;animation:heroGlow 30s var(--ease) infinite alternate}
.hero__bg .pl--veil{position:absolute;inset:0;transform:none;background:radial-gradient(120% 90% at 30% 36%,transparent 0,transparent 46%,var(--paper) 96%),linear-gradient(180deg,transparent 62%,var(--paper) 100%)}
@keyframes heroDrift{from{transform:translate3d(0,0,0)}to{transform:translate3d(34px,34px,0)}}
@keyframes heroFloat{from{transform:translate3d(0,0,0) rotate(-1.4deg)}to{transform:translate3d(26px,-18px,0) rotate(1.4deg)}}
@keyframes heroGlow{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(-22px,16px,0) scale(1.06)}}
.theme-dark .hero__bg .pl--dots>i,.theme-dark .hero__bg .pl--mesh>i{opacity:.07}
@media(max-width:880px){.hero__bg{perspective:none;-webkit-mask-image:radial-gradient(140% 120% at 50% 30%,#000 42%,transparent 100%);mask-image:radial-gradient(140% 120% at 50% 30%,#000 42%,transparent 100%)}.hero__bg .pl{left:0;top:0;width:100%;height:100%;transform:none!important}.hero__bg .pl>i{animation:none!important;transform:none!important}.hero__bg .pl--mesh,.hero__bg .pl--glow{display:none}.hero__bg .pl--dots>i{opacity:.07}}
@media(hover:none){.hero__bg .pl>i{animation:none!important;transform:none!important}}
@media(prefers-reduced-motion:reduce){.hero__bg .pl{transform:translateZ(0)!important}.hero__bg .pl>i{animation:none!important;transform:none!important}.hero__bg .pl--glow>i{transform:none!important}}

/* ---------- 3. CTA attention-motion (блик + кивок стрелки). cta__submit исключён ---------- */
/* блик ВСЕГДА на CSS (без JS-тоггла .cta-anim — он мерцал при джиттере IntersectionObserver на ховере/скролле). Футер-кнопка и submit исключены. */
.btn-primary:not(.cta__submit):not(.foot-cta){position:relative;overflow:hidden;isolation:isolate}
.btn-primary:not(.cta__submit):not(.foot-cta)>*{position:relative;z-index:2}
.btn-primary:not(.cta__submit):not(.foot-cta)::after{content:"";position:absolute;top:-60%;left:-30%;width:34%;height:220%;z-index:1;pointer-events:none;background:linear-gradient(100deg,transparent 0%,color-mix(in srgb,var(--white) 34%,transparent) 50%,transparent 100%);transform:translateX(-260%) skewX(-14deg);opacity:0}
@media(prefers-reduced-motion:no-preference){
  .btn-primary:not(.cta__submit):not(.foot-cta)::after{animation:ctaSheen 9s var(--ease) infinite}
  .btn-primary:not(.cta__submit):not(.foot-cta) .arr,.btn-primary:not(.cta__submit):not(.foot-cta)>svg{animation:ctaArrowNudge 9s var(--ease) infinite}
}
@media(hover:hover){.btn-primary:not(.cta__submit):not(.foot-cta):hover::after,.btn-primary:not(.cta__submit):not(.foot-cta):focus-visible::after{animation-play-state:paused;opacity:0}}
.btn-primary:not(.cta__submit):not(.foot-cta):hover .arr,.btn-primary:not(.cta__submit):not(.foot-cta):active .arr,.btn-primary:not(.cta__submit):not(.foot-cta):hover>svg,.btn-primary:not(.cta__submit):not(.foot-cta):active>svg{animation:none}
.btn-primary:not(.cta__submit):not(.foot-cta):disabled::after,.btn-primary:not(.cta__submit):not(.foot-cta)[aria-disabled="true"]::after{animation:none;opacity:0}
.btn-primary:disabled .arr,.btn-primary:disabled>svg,.btn-primary[aria-disabled="true"] .arr,.btn-primary[aria-disabled="true"]>svg{animation:none;transform:none}

/* ============================================================
   PROCESS — 3D-иллюстрация «восходящий путь к росту».
   Изометрия на бумаге: 4 ступени с реальными гранями + искра-маркер,
   которая поднимается по ступеням и завершается всплеском вверх.
   Чистый CSS 3D (preserve-3d/perspective). Анимация — только transform/opacity.
   Параллакс (--px/--py) опционально из proc.js; всё остальное работает без JS.
   ============================================================ */
/* Процесс: 2-колоночная шапка (заголовок | интро) + 4 карточки в ряд во всю ширину, без пустой колонки */
/* Процесс: текст+интро слева | карандашный чек-лист справа (фикс-ширина → без пустоты), 4 карточки в ряд ниже */
/* Чередование сторон секционных скетчей (чётные секции — скетч слева). direction-приём:
   rtl зеркалит колонки грида без дублирования ширин; на мобиле реверс снят. */
.sec-head.dsk-flip{direction:rtl}
.sec-head.dsk-flip>*{direction:ltr}
@media(max-width:860px){.sec-head.dsk-flip{direction:ltr}}
.proc-head{max-width:none;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(28px,4vw,56px);align-items:center}
.proc-head__intro{margin-top:16px;font-size:16.5px;font-weight:700;color:var(--ink-2);line-height:1.6;letter-spacing:-.01em;max-width:54ch}
.proc-sketch{width:clamp(220px,21vw,272px);pointer-events:none}
.ascend{position:relative;width:100%;height:clamp(300px,30vw,380px);perspective:1150px;perspective-origin:54% 40%;pointer-events:none;--px:0;--py:0;--lh:46px}
.ascend__stage{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateX(56deg) rotateZ(-44deg) translate3d(calc(var(--px)*10px),calc(var(--py)*10px),0);will-change:transform;animation:ascFloat 9s var(--ease) infinite alternate}
/* Подложка-сетка (пол) для ощущения глубины */
.ascend__grid{position:absolute;left:6%;top:8%;width:88%;height:84%;transform:translateZ(-2px);
  background-image:repeating-linear-gradient(0deg,color-mix(in srgb,var(--ink) 18%,transparent) 0 1px,transparent 1px 38px),repeating-linear-gradient(90deg,color-mix(in srgb,var(--ink) 18%,transparent) 0 1px,transparent 1px 38px);
  opacity:.10;-webkit-mask-image:radial-gradient(70% 70% at 60% 50%,#000 30%,transparent 100%);mask-image:radial-gradient(70% 70% at 60% 50%,#000 30%,transparent 100%)}
/* Ступень: верхняя грань + левая боковая стенка (реальная высота) */
.ascend__step{position:absolute;width:92px;height:92px;transform-style:preserve-3d;
  left:calc(54px + var(--i)*72px);top:calc(214px - var(--i)*60px);
  transform:translateZ(calc(var(--i)*var(--lh)))}
.ascend__step::before{content:"";position:absolute;inset:0;border-radius:11px;
  background:linear-gradient(135deg,var(--white),var(--paper-2));
  border:1.5px solid var(--line-strong);
  box-shadow:0 0 0 1px color-mix(in srgb,var(--white) 70%,transparent) inset,0 14px 26px -10px color-mix(in srgb,var(--ink) 30%,transparent)}
.ascend__step::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:var(--lh);
  transform-origin:bottom;transform:rotateX(-90deg);
  background:linear-gradient(color-mix(in srgb,var(--ink) 10%,var(--paper-2)),color-mix(in srgb,var(--ink) 26%,var(--paper-2)));
  border:1.5px solid var(--line-strong);border-top:none;border-radius:0 0 4px 4px}
/* Верхняя ступень — акцент (точка роста) */
.ascend__step--top::before{border-color:var(--accent);
  background:linear-gradient(135deg,color-mix(in srgb,var(--accent) 26%,var(--white)),color-mix(in srgb,var(--accent) 9%,var(--white)));
  box-shadow:0 0 0 1px color-mix(in srgb,var(--accent) 30%,transparent) inset,0 16px 30px -10px color-mix(in srgb,var(--accent-deep) 36%,transparent)}
.ascend__step--top::after{background:linear-gradient(color-mix(in srgb,var(--accent) 16%,var(--paper-2)),color-mix(in srgb,var(--accent-deep) 22%,var(--paper-2)));border-color:var(--accent)}
/* Искра-маркер: путь от 1-й ступени к вершине, затем всплеск вверх */
.ascend__spark{position:absolute;width:24px;height:24px;left:0;top:0;margin:-12px;border-radius:50%;transform-style:preserve-3d;
  background:radial-gradient(circle at 38% 34%,var(--white),var(--accent) 52%,var(--accent-deep));
  box-shadow:0 0 18px 5px color-mix(in srgb,var(--accent) 55%,transparent),0 0 4px 1px color-mix(in srgb,var(--accent-deep) 60%,transparent);
  animation:ascSpark 6.4s cubic-bezier(.5,0,.5,1) infinite}
/* Кольцо-всплеск на вершине (только opacity+scale) */
.ascend__burst{position:absolute;width:64px;height:64px;left:calc(54px + 3*72px + 46px);top:calc(214px - 3*60px + 46px);margin:-32px;border-radius:50%;
  border:2px solid var(--accent);transform-style:preserve-3d;transform:translateZ(calc(3*var(--lh) + 70px));opacity:0;
  animation:ascBurst 6.4s cubic-bezier(.2,.7,.2,1) infinite}
@keyframes ascFloat{from{transform:rotateX(56deg) rotateZ(-44deg) translate3d(calc(var(--px)*10px),calc(var(--py)*10px),-8px)}to{transform:rotateX(56deg) rotateZ(-44deg) translate3d(calc(var(--px)*10px),calc(var(--py)*10px),12px)}}
/* только transform/opacity (без left/top — те триггерят layout) */
@keyframes ascSpark{
  0%{transform:translate3d(54px,214px,46px)}
  6%{transform:translate3d(54px,214px,46px)}
  26%{transform:translate3d(126px,154px,92px)}
  46%{transform:translate3d(198px,94px,138px)}
  66%{transform:translate3d(270px,34px,184px)}
  80%{transform:translate3d(270px,34px,250px) scale(1.35)}
  92%{transform:translate3d(270px,34px,196px) scale(1)}
  100%{transform:translate3d(54px,214px,46px) scale(.9);opacity:.5}
}
@keyframes ascBurst{0%,66%{opacity:0;transform:translateZ(calc(3*var(--lh) + 70px)) scale(.4)}74%{opacity:.85}88%{opacity:0;transform:translateZ(calc(3*var(--lh) + 70px)) scale(1.9)}100%{opacity:0}}
/* Планшет: иллюстрация под заголовком, без параллакса */
@media(max-width:860px){.proc-head{grid-template-columns:1fr;gap:16px;align-items:start}.proc-sketch{width:100%;max-width:360px}}
@media(max-width:560px){.proc-sketch{display:block;width:100%;max-width:200px;margin:8px auto 0}}
/* Мобайл: иллюстрация скрыта (декор), верстка не страдает */
@media(max-width:760px){.ascend{display:none}}
/* Тач/coarse: параллакс не нужен, оставляем мягкий float (CSS) */
@media(hover:none){.ascend__stage{transform:rotateX(56deg) rotateZ(-44deg)!important}}
/* Reduced-motion: статичная сцена, искра припаркована на вершине, без движения */
@media(prefers-reduced-motion:reduce){
  .ascend__stage{animation:none!important;transform:rotateX(56deg) rotateZ(-44deg)!important}
  .ascend__spark{animation:none!important;transform:translate3d(270px,34px,196px)!important}
  .ascend__burst{animation:none!important;opacity:.5;transform:translateZ(calc(3*var(--lh) + 70px)) scale(1)!important}
}
@keyframes ctaSheen{0%{transform:translateX(-260%) skewX(-14deg);opacity:0}2%{opacity:.85}9%{opacity:.85}11%{transform:translateX(360%) skewX(-14deg);opacity:0}100%{transform:translateX(360%) skewX(-14deg);opacity:0}}
@keyframes ctaArrowNudge{0%,82%,100%{transform:translateX(0)}88%{transform:translateX(3px)}94%{transform:translateX(0)}}
@media(prefers-reduced-motion:reduce){.btn-primary:not(.cta__submit)::after{animation:none!important;opacity:0!important}.btn-primary:not(.cta__submit) .arr,.btn-primary:not(.cta__submit)>svg{animation:none!important}}
/* блик-бегунок работает и на мобиле (по просьбе Сергея 30.06). Ранее был отключён на touch/≤760px —
   причина (sticky-hover гасил блик на тапе) снята: hover-пауза теперь только под @media(hover:hover). */

/* ===== HERO: лёгкое staggered-проявление строк заголовка (чистый CSS, без JS — заголовок виден даже без скриптов) ===== */
.display .ln{animation:heroLineUp .8s var(--ease) both}
.display .ln:nth-child(1){animation-delay:.06s}
.display .ln:nth-child(2){animation-delay:.18s}
.display .ln:nth-child(3){animation-delay:.30s}
@keyframes heroLineUp{from{opacity:1;transform:translateY(14px)}to{opacity:1;transform:none}}

@media(prefers-reduced-motion:reduce){.display .ln{animation:none}}

/* ===== HERO: карандашный скетч «рост прибыли» (STUDIO) над P&L. Столбцы вырастают, цикл повторяет рост ===== */
.hero-aside{align-self:end;display:flex;flex-direction:column;gap:clamp(18px,2.4vw,30px);min-width:0}
.hero-sketch{width:100%;pointer-events:none}
.hs-svg{display:block;width:100%;height:auto;overflow:visible}
.hs-axis{fill:none;stroke:var(--ink-2);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.hs-grid line{stroke:var(--ink-soft);stroke-width:1;opacity:.4}
.hs-rect{fill:color-mix(in srgb,var(--ink) 5%,transparent);stroke:var(--ink-2);stroke-width:2.1;stroke-linejoin:round}
.hs-hatch line{stroke:var(--ink-soft);stroke-width:1;opacity:.45;stroke-linecap:round}
.hs-accrect{fill:color-mix(in srgb,var(--accent) 24%,transparent);stroke:var(--accent-deep);stroke-width:2.6;stroke-linejoin:round}
.hs-trend{fill:none;stroke:var(--accent-deep);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:5 5;opacity:.8}
.hs-coin{fill:var(--accent);stroke:var(--accent-deep);stroke-width:1.5}
.hs-rub{font:800 13px/1 var(--font-display),sans-serif;fill:var(--white)}
.hs-arrow{fill:none;stroke:var(--accent-deep);stroke-width:2.8;stroke-linecap:round;stroke-linejoin:round}
.hs-bar{transform-box:fill-box;transform-origin:50% 100%;transform:scaleY(1);animation:hs-grow 6.5s var(--ease) infinite}
.hs-b1{animation-delay:0s}.hs-b2{animation-delay:.16s}.hs-b3{animation-delay:.32s}.hs-b4{animation-delay:.48s}.hs-b5{animation-delay:.64s}
.hs-cap{transform-box:fill-box;transform-origin:50% 100%;animation:hs-cap 6.5s var(--ease) .64s infinite}
.hs-trend{stroke-dashoffset:0;animation:hs-trend 6.5s var(--ease) .3s infinite}
@keyframes hs-grow{0%{transform:scaleY(1);opacity:1}62%{transform:scaleY(1);opacity:1}70%{transform:scaleY(1);opacity:0}72%{transform:scaleY(0);opacity:0}88%{transform:scaleY(1);opacity:1}100%{transform:scaleY(1);opacity:1}}
@keyframes hs-cap{0%{opacity:1;transform:scale(1)}62%{opacity:1;transform:scale(1)}70%{opacity:0;transform:scale(.6)}86%{opacity:0;transform:scale(.6)}94%{opacity:1;transform:scale(1.12)}100%{opacity:1;transform:scale(1)}}
@keyframes hs-trend{0%{stroke-dashoffset:0;opacity:.8}64%{stroke-dashoffset:0;opacity:.8}72%{opacity:0}74%{stroke-dashoffset:0;opacity:0}100%{opacity:.8}}
@media(max-width:880px){.hero-aside{align-self:stretch;align-items:center}.hero-sketch{max-width:520px;width:100%}}
@media(max-width:620px){.hero-sketch{display:none}}
@media(prefers-reduced-motion:reduce){.hs-bar,.hs-cap,.hs-trend{animation:none!important;transform:scaleY(1)!important;opacity:1!important;stroke-dashoffset:0!important}.hs-cap{transform:none!important}}

/* ===== P&L «карандашный планшет-чеклист» (вариант 2) — сигнатура hero, под графиком ===== */
/* Композиция: ширина = графику (hero-sketch), единый карандашный стек. Рамка/галочки рисуются штрихом,
   цифры ×16.7 и 93% накручиваются штатным data-count'ом синхронно с прорисовкой. */
.pl2-card{position:relative;width:100%;margin:0;box-sizing:border-box;padding:44px 30px 26px;
  font-family:var(--font-display);color:var(--ink);-webkit-font-smoothing:antialiased}
.pl2-defs{position:absolute;width:0;height:0;pointer-events:none}
/* планшет-подложка */
.pl2-board{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;overflow:visible}
.pl2-frame{fill:var(--white);stroke:var(--ink-2);stroke-width:2;stroke-linejoin:round;
  stroke-dasharray:1420;stroke-dashoffset:1420;animation:pl2-draw 1.15s cubic-bezier(.6,.05,.3,1) .05s forwards}
.pl2-clip-body{fill:var(--paper-2);stroke:var(--ink-2);stroke-width:2;stroke-linejoin:round;
  stroke-dasharray:240;stroke-dashoffset:240;animation:pl2-draw .7s ease-out .5s forwards}
.pl2-clip-bar{fill:none;stroke:var(--ink-soft);stroke-width:3;stroke-linecap:round;
  stroke-dasharray:60;stroke-dashoffset:60;animation:pl2-draw .45s ease-out .82s forwards}
.pl2-div{fill:none;stroke:var(--line-strong);stroke-width:1.6;stroke-linecap:round;
  stroke-dasharray:344;stroke-dashoffset:344;animation:pl2-draw .55s ease-out forwards}
.pl2-div{animation-delay:.55s}.pl2-div-2{animation-delay:.66s}.pl2-div-3{animation-delay:.77s}
/* содержимое */
.pl2-content{position:relative;z-index:1}
.pl2-head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin:0 4px 14px}
.pl2-title{font-size:12.5px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft);
  opacity:0;animation:pl2-pop .5s ease-out .3s forwards}
.pl2-live{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:800;color:var(--accent-deep);
  white-space:nowrap;flex:0 0 auto;
  opacity:0;animation:pl2-pop .5s ease-out .42s forwards}
.pl2-dot{width:8px;height:8px;border-radius:50%;background:var(--accent);
  box-shadow:0 0 0 0 color-mix(in srgb,var(--accent) 55%,transparent);animation:pl2-pulse 1.9s ease-out .9s infinite}
.pl2-rows{list-style:none;margin:0;padding:0}
.pl2-row{display:grid;grid-template-columns:26px 1fr auto;align-items:center;column-gap:12px;min-height:56px;padding:0 4px}
.pl2-label{font-size:14.5px;font-weight:700;color:var(--ink-2);opacity:0;animation:pl2-fade .5s ease-out forwards}
.pl2-val{font-size:clamp(24px,3vw,33px);font-weight:800;color:var(--ink);letter-spacing:-.03em;line-height:1;
  white-space:nowrap;font-variant-numeric:tabular-nums;opacity:0;transform:translateY(6px) scale(.94);
  animation:pl2-num .38s cubic-bezier(.34,1.56,.6,1) forwards}
.pl2-val small{font-size:.5em;font-weight:800;color:var(--ink-soft);letter-spacing:0}
/* числа появляются РАНЬШЕ счётчика (data-count, ~1.2с) — накрутка ×16.7 и 93% видна целиком */
.pl2-r1 .pl2-label{animation-delay:.22s}.pl2-r1 .pl2-val{animation-delay:.1s}
.pl2-r2 .pl2-label{animation-delay:.3s}.pl2-r2 .pl2-val{animation-delay:.18s}
.pl2-r3 .pl2-label{animation-delay:.38s}.pl2-r3 .pl2-val{animation-delay:.26s}
/* галочки — дорисовываются по очереди */
.pl2-tick{width:24px;height:24px;overflow:visible}
.pl2-tick-path{fill:none;stroke:var(--accent-deep);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:42;stroke-dashoffset:42;animation:pl2-draw .5s ease-out forwards}
.pl2-r1 .pl2-tick-path{animation-delay:.62s}.pl2-r2 .pl2-tick-path{animation-delay:.8s}.pl2-r3 .pl2-tick-path{animation-delay:.98s}
/* ROMI: рукописный крест + число */
.pl2-val-x{display:inline-flex;align-items:center;gap:1px;color:var(--accent-deep)}
.pl2-cross{width:18px;height:18px;overflow:visible;margin-right:1px;flex:none}
.pl2-cross-a,.pl2-cross-b{fill:none;stroke:var(--accent-deep);stroke-width:2.8;stroke-linecap:round;
  stroke-dasharray:24;stroke-dashoffset:24;animation:pl2-draw .4s ease-out forwards}
.pl2-cross-a{animation-delay:.64s}.pl2-cross-b{animation-delay:.76s}
.pl2-x-num{color:var(--accent-deep)}
.pl2-note{margin:16px 4px 0;padding-top:14px;border-top:1px dashed var(--line);
  font-size:12.5px;line-height:1.5;font-weight:700;color:var(--ink-soft);
  opacity:0;animation:pl2-fade .6s ease-out 1.05s forwards}
.pl2-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
@keyframes pl2-draw{to{stroke-dashoffset:0}}
@keyframes pl2-fade{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@keyframes pl2-pop{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
@keyframes pl2-num{to{opacity:1;transform:none}}
@keyframes pl2-pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--accent) 50%,transparent)}70%{box-shadow:0 0 0 9px transparent}100%{box-shadow:0 0 0 0 transparent}}
@media(max-width:880px){.pl2-card{max-width:520px;margin:0 auto}}
@media(prefers-reduced-motion:reduce){
  .pl2-card *,.pl2-card *::before,.pl2-card *::after{animation:none!important}
  .pl2-frame,.pl2-clip-body,.pl2-clip-bar,.pl2-div,.pl2-tick-path,.pl2-cross-a,.pl2-cross-b{stroke-dashoffset:0!important}
  .pl2-title,.pl2-live,.pl2-label,.pl2-val,.pl2-note{opacity:1!important;transform:none!important}
}

/* ===== Скетч «чек-лист процесса» (p9) в блоке «Как мы работаем» ===== */
.p9-svg{display:block;width:100%;height:auto;overflow:visible}

/* базовые карандашные линии */
.p9-ink{fill:none;stroke:var(--ink);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.p9-ink2{fill:none;stroke:var(--ink-2);stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.p9-soft{fill:none;stroke:var(--ink-soft);stroke-width:1.3;stroke-linecap:round;opacity:.55}
.p9-tick{fill:none;stroke:var(--ink);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.p9-accent-line{fill:none;stroke:var(--accent-deep);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.p9-accent-tick{fill:none;stroke:var(--accent);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.p9-dot{fill:var(--accent)}

/* draw-on: прорисовка линий планшета и строк */
.p9-draw{stroke-dasharray:100;stroke-dashoffset:100;animation:p9-draw 1.9s ease forwards}
.p9-d1{animation-delay:.05s}
.p9-d2{animation-delay:.45s}
.p9-d3{animation-delay:.7s}
.p9-d4{animation-delay:.9s}
.p9-d5{animation-delay:1.1s}
.p9-d6{animation-delay:1.3s}
.p9-d7{animation-delay:1.5s}
.p9-d8{animation-delay:1.75s;animation-duration:2.1s}
.p9-d9{animation-delay:2.5s}

@keyframes p9-draw{to{stroke-dashoffset:0}}

/* галочки: ставятся по очереди и зацикленно перерисовываются */
.p9-tickloop{stroke-dasharray:100;stroke-dashoffset:100;animation:p9-ticks 7s ease-in-out infinite}
.p9-t1{animation-delay:.85s}
.p9-t2{animation-delay:1.15s}
.p9-t3{animation-delay:1.45s}
.p9-t4{animation-delay:1.8s}

/* цикл: появилась -> держится -> исчезла -> снова (по кругу внимание) */
@keyframes p9-ticks{
  0%{stroke-dashoffset:100}
  8%{stroke-dashoffset:0}
  78%{stroke-dashoffset:0}
  88%{stroke-dashoffset:100}
  100%{stroke-dashoffset:100}
}

/* мягкое покачивание сцены */
.p9-float{transform-box:fill-box;transform-origin:center;animation:p9-float 6.5s ease-in-out infinite}
@keyframes p9-float{0%,100%{transform:translateY(0) rotate(0deg)}50%{transform:translateY(-2.5px) rotate(-.5deg)}}

/* бегущая точка-маркер по строкам списка (петля) */
.p9-dot{opacity:0;animation:p9-marker 7s linear 2.6s infinite}
@keyframes p9-marker{
  0%{transform:translate(101px,66px);opacity:0}
  4%{opacity:1}
  22%{transform:translate(146px,62px)}
  25%{transform:translate(103px,94px)}
  47%{transform:translate(148px,90px)}
  50%{transform:translate(105px,122px)}
  72%{transform:translate(150px,118px)}
  75%{transform:translate(107px,150px)}
  95%{transform:translate(152px,146px);opacity:1}
  100%{transform:translate(152px,146px);opacity:0}
}

/* доступность: без движения — полный статичный рисунок */
@media (prefers-reduced-motion: reduce){
  .p9-draw,.p9-tickloop{stroke-dasharray:none;stroke-dashoffset:0;animation:none}
  .p9-float{animation:none}
  .p9-dot{display:none}
}

/* ===== ПОСАДОЧНЫЕ 2.0 (эталон /tools/, переиспользуется разделами) ===== */
/* заголовок секции с мини-декором: чередование сторон */
.lp-head{display:grid;grid-template-columns:minmax(0,1fr) clamp(220px,25vw,340px);gap:clamp(28px,5vw,72px);align-items:center;max-width:none;width:100%}
.lp-head--r{direction:rtl}
.lp-head--r>*{direction:ltr}
.lp-head__txt{min-width:0;max-width:760px}
.lp-head__dec{display:flex;justify-content:center;align-items:center;min-width:0}
.lp-head__dec .lpd{width:100%;max-width:320px;height:auto;color:var(--accent);overflow:visible}
.lp-head__dec.out-view [class*="lpd-"]{animation-play-state:paused!important}
@media(max-width:860px){.lp-head{grid-template-columns:1fr;gap:22px}.lp-head--r{direction:ltr}.lp-head__dec{display:flex;width:min(100%,320px);margin:0 auto}.lp-head__dec .lpd{max-width:280px}}
@media(max-width:520px){.lp-head__dec{width:min(100%,240px)}.lp-head__dec .lpd{max-width:220px}}
/* декор-примитивы: неон в акценте страницы */
.lpd-core{fill:currentColor;opacity:.85;animation:lpdPulse 2.8s ease-in-out infinite}
.lpd-c2{animation-delay:1.4s}
.lpd-sat{fill:currentColor;opacity:.6;animation:lpdBlink 3.6s ease-in-out infinite}
.lpd-dot{fill:currentColor;opacity:.35}
.lpd-d2{animation:lpdBlink 4.4s ease-in-out infinite 1s}
.lpd-orbit{fill:none;stroke:currentColor;stroke-width:1.6;opacity:.4;stroke-dasharray:4 7;animation:lpdSpin 14s linear infinite;transform-box:fill-box;transform-origin:center}
.lpd-ring{fill:none;stroke:currentColor;stroke-width:1.4;opacity:.3}
.lpd-r2{opacity:.16}
.lpd-node{fill:none;stroke:currentColor;stroke-width:1.8;opacity:.75}
.lpd-n2{opacity:.45}
.lpd-path,.lpd-wave{fill:none;stroke:currentColor;stroke-width:1.8;opacity:.55;stroke-linecap:round;stroke-dasharray:400;stroke-dashoffset:400;animation:lpdDraw 2.4s ease forwards}
.lpd-path[pathLength="1"],.lpd-wave[pathLength="1"]{stroke-dasharray:1;stroke-dashoffset:1}
.lpd-p2{opacity:.3;animation-delay:.5s}
@keyframes lpdPulse{0%,100%{opacity:.85}50%{opacity:.35}}
@keyframes lpdBlink{0%,100%{opacity:.6}50%{opacity:.15}}
@keyframes lpdSpin{to{transform:rotate(360deg)}}
@keyframes lpdDraw{to{stroke-dashoffset:0}}
@media(prefers-reduced-motion:reduce){.lpd-path,.lpd-wave{stroke-dasharray:none;stroke-dashoffset:0;animation:none}.lpd-core,.lpd-sat,.lpd-d2,.lpd-orbit{animation:none}}
@media(prefers-reduced-motion:reduce){.aidec [class^="ad"],.aidec [class*=" ad"]{animation:none!important}}
/* bento «Что внутри»: широкие карточки без пустот */
.tool-grid .tg-wide{grid-column:span 2}
@media(max-width:620px){.tool-grid .tg-wide{grid-column:auto}}
/* карточки-интеграции вместо голых чипов */
.integ-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.integ{background:var(--white);border:1px solid var(--line-strong);border-radius:var(--r);padding:22px 22px 20px;transition:transform .35s var(--ease),box-shadow .35s var(--ease),border-color .35s var(--ease)}
.integ:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--accent) 45%,var(--line-strong));box-shadow:0 14px 30px -18px rgba(0,0,0,.35)}
.integ .chip{pointer-events:none}
.integ p{margin-top:12px;font-size:14px;font-weight:700;color:var(--ink-2);line-height:1.55;letter-spacing:-.01em}
@media(max-width:980px){.integ-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.integ-grid{grid-template-columns:1fr}}
/* формат работы: инфокарточки + плашка цены */
.fmt-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.fmt{background:var(--white);border:1px solid var(--line-strong);border-radius:var(--r);padding:24px 22px;transition:transform .35s var(--ease),border-color .35s var(--ease)}
.fmt:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--accent) 45%,var(--line-strong))}
.fmt .n{font-size:13px;font-weight:800;color:var(--accent-deep);font-variant-numeric:tabular-nums}
.fmt h3{font-size:17.5px;font-weight:800;letter-spacing:-.02em;margin-top:12px;line-height:1.2}
.fmt p{font-size:14px;font-weight:700;color:var(--ink-2);margin-top:8px;line-height:1.55}
.plan-line{margin-top:22px;background:var(--white);border:1px solid color-mix(in srgb,var(--accent) 45%,var(--line-strong));border-radius:var(--r);padding:22px clamp(22px,3vw,34px);display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.plan-line__txt .k{font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft)}
.plan-line .plan__price{margin-top:4px;font-size:clamp(17px,2.2vw,21px);font-weight:800;letter-spacing:-.01em}
@media(max-width:980px){.fmt-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.fmt-grid{grid-template-columns:1fr}.plan-line{align-items:stretch;flex-direction:column}.plan-line .btn{justify-content:center}}
/* каскад появления карточек в сетках посадочной */
.tool-grid .rv:nth-child(2),.steps .rv:nth-child(2),.integ-grid .rv:nth-child(2),.fmt-grid .rv:nth-child(2){transition-delay:.07s}
.tool-grid .rv:nth-child(3),.steps .rv:nth-child(3),.integ-grid .rv:nth-child(3),.fmt-grid .rv:nth-child(3){transition-delay:.14s}
.tool-grid .rv:nth-child(4),.steps .rv:nth-child(4),.integ-grid .rv:nth-child(4),.fmt-grid .rv:nth-child(4){transition-delay:.21s}
.tool-grid .rv:nth-child(5),.integ-grid .rv:nth-child(5){transition-delay:.28s}
.tool-grid .rv:nth-child(6),.integ-grid .rv:nth-child(6){transition-delay:.35s}
@media(prefers-reduced-motion:reduce){.tool-grid .rv,.steps .rv,.integ-grid .rv,.fmt-grid .rv{transition-delay:0s}}
/* тёмная тема: карточки новых секций */
.theme-dark .integ,.theme-dark .fmt,.theme-dark .plan-line{background:var(--paper-2)}

/* Hero внутренних посадочных: полноценная композиция «смысл + уникальный объект», без рамки-карточки. */
.lp-hero-grid{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(300px,.82fr);align-items:center;gap:clamp(34px,5vw,76px)}
.lp-hero__copy{min-width:0}
.lp-hero-grid .lp-h1,.lp-hero-grid .lp-sub{max-width:none}
.lp-hero__visual{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:center;min-width:0;min-height:clamp(280px,31vw,430px);padding:clamp(4px,1vw,14px);pointer-events:none}
.lp-hero__visual::before{content:"";position:absolute;z-index:-1;width:86%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--accent) 20%,transparent),transparent 68%);filter:blur(12px);opacity:.72}
.lp-hero__visual>svg,.lp-hero__visual .lpd,.lp-hero__visual .lpv,.med-hero-visual,.dental-hero-visual{display:block;width:100%;max-width:430px;height:auto;overflow:visible;color:var(--accent)}
.lp-intent{display:flex;align-items:center;gap:10px;margin-top:18px;padding-top:16px;border-top:1px solid var(--line);font-size:12.5px;font-weight:800;color:var(--ink-soft);line-height:1.45}
.lp-intent::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 5px color-mix(in srgb,var(--accent) 14%,transparent);flex:none}
.lp-hero__visual.out-view [class*="lpd-"],.lp-hero__visual.out-view [class*="hero-"]{animation-play-state:paused!important}
@media(max-width:880px){.lp-hero-grid{display:grid;grid-template-columns:1fr;gap:22px}.lp-hero__visual{width:min(100%,390px);min-height:250px;margin:0 auto;padding:0}.lp-hero__visual>svg,.lp-hero__visual .lpd,.lp-hero__visual .lpv,.med-hero-visual,.dental-hero-visual{max-width:340px}}
@media(max-width:520px){.lp-hero__visual{width:min(100%,310px);min-height:210px}.lp-hero__visual>svg,.lp-hero__visual .lpd,.lp-hero__visual .lpv,.med-hero-visual,.dental-hero-visual{max-width:285px}.lp-intent{align-items:flex-start}}
@media(prefers-reduced-motion:reduce){.lp-hero__visual *{animation:none!important}}

/* Видимое авторство и источники для коммерческих/YMYL-посадочных. */
.eeat{margin-top:clamp(28px,4vw,44px);padding:22px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);display:grid;grid-template-columns:minmax(0,1.2fr) minmax(220px,.8fr);gap:18px 34px;align-items:start}
.eeat__people{font-size:13.5px;font-weight:800;color:var(--ink-2);line-height:1.55}
.eeat__date{display:block;margin-top:5px;font-size:12px;color:var(--ink-soft)}
.eeat__sources{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px 14px}
.eeat__sources a{font-size:12.5px;font-weight:800;color:var(--accent-deep);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.eeat__sources a:hover{color:var(--ink)}
@media(max-width:720px){.eeat{grid-template-columns:1fr}.eeat__sources{justify-content:flex-start}}
/* ===== Единый SERM share: Telegram / VK / копирование ===== */
.serm__share{margin-top:clamp(28px,4vw,44px);text-align:center}
.serm__share-label{display:block;margin-bottom:14px;font-size:15px;color:var(--muted)}
.serm__share-row{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.serm__share-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 18px;font:inherit;font-size:14px;font-weight:700;color:var(--text);background:rgba(var(--accent-rgb),.06);border:1px solid rgba(var(--accent-rgb),.34);border-radius:999px;cursor:pointer;transition:background .2s ease,border-color .2s ease,color .2s ease,transform .15s ease}
.serm__share-btn svg{width:18px;height:18px;color:var(--accent);transition:color .2s ease}
.serm__share-btn:hover{background:rgba(var(--accent-rgb),.14);border-color:rgba(var(--accent-rgb),.58);color:var(--ink)}
.serm__share-btn:focus-visible{outline:3px solid rgba(var(--accent-rgb),.34);outline-offset:3px}
.serm__share-btn:active{transform:scale(.97)}
.serm__share-btn--copy svg{stroke:var(--accent)}
@media(max-width:480px){.serm__share-row{gap:8px}.serm__share-btn{width:100%;padding:12px 16px}}
@media(prefers-reduced-motion:reduce){.serm__share-btn,.serm__share-btn svg{transition:none}.serm__share-btn:hover,.serm__share-btn:active{transform:none}}

/* Systemic touch targets for sticky navigation and inline case actions. */
.anchornav__link,
.vcard__case {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  box-sizing: border-box;
}
.vcard__case {
  padding-block: 10px;
}
.vcard__case:focus-visible {
  outline: 3px solid color-mix(in srgb,var(--accent) 38%,transparent);
  outline-offset: 3px;
  border-radius: 6px;
}