/* Сайт Кирилла Горяйнова. Светлая тема (вариант А, выбор владельца 02.10.2026).
   Нормы: review/RESEARCH_typography_color.md и review/RESEARCH_text_volume.md, раздел «Нормы для этого сайта».
   Страница светлая (#FFFFFF и #F5F7FA), тёмные только первый экран с портретом и подвал (#0B1220).
   Шкала шрифта из пяти размеров: 390: 16, 18, 21, 30, 32; 1440: 16, 20, 24, 40, 48. Мельче 16 px смыслового текста нет. */

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

:root{
  /* Светлая основа */
  --c-bg:#FFFFFF;
  --c-bg-alt:#F5F7FA;
  --c-surface:#FFFFFF;
  --c-text:#1E293B;           /* 14.6:1, Lc 101 на белом */
  --c-heading:#0F172A;
  --c-muted:#475569;          /* 7.6:1, Lc 86 на белом; 7.1:1, Lc 81 на #F5F7FA */
  --c-accent:#1D4ED8;         /* 6.7:1, Lc 82; белый текст на нём 6.7:1 */
  --c-accent-hover:#1E40AF;
  --c-accent-soft:#EFF4FF;
  --c-on-accent:#FFFFFF;
  --c-rule:#E2E8F0;           /* разделители и рамки без смысла */
  --c-control:#64748B;        /* рамки интерактивных элементов: 4.8:1 */
  --c-focus:#1D4ED8;
  --c-gain:#15803D;
  --c-loss:#B91C1C;
  --c-error:#B91C1C;
  --c-header-bg:rgba(255,255,255,.96);
  --c-tint:#DBEAFE;
  --c-on-tint:#1E3A8A;
  --c-tint-gain:#DCFCE7;
  --c-on-tint-gain:#14532D;
  --c-tint-loss:#FEE2E2;
  --c-on-tint-loss:#7F1D1D;
  --c-warn:#FEF3C7;
  --c-on-warn:#92400E;
  /* Тёмные блоки: первый экран и подвал */
  --d-bg:#0B1220;
  --d-surface:#152038;
  --d-text:#E6EAF2;           /* 15.5:1, Lc 93 */
  --d-heading:#F4F6FA;
  --d-muted:#CBD5E1;          /* 12.6:1, Lc 80 */
  --d-accent:#93C5FD;
  --d-rule:rgba(255,255,255,.22);

  --f-sans:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --fs-s:16px;
  --fs-b:18px;
  --fs-l:21px;
  --fs-h2:30px;
  --fs-h1:32px;
  --lh-b:1.55;
  --lh-h:1.2;
  --measure:66ch;
  --maxw:1160px;
  --gutter:16px;
  --edge-gap:calc(max(0px,(100vw - var(--maxw)) / 2) + var(--gutter));
  --sp-1:8px;
  --sp-2:12px;
  --sp-3:16px;
  --sp-4:24px;
  --sp-5:32px;
  --sp-6:48px;
  --sp-7:64px;
  --sp-8:96px;
  --section-y:56px;
  --radius:16px;
  --radius-sm:10px;
  --btn-h:52px;
  --header-h:64px;
  --t-fast:.18s;
  --t-reveal:.6s;
  --shadow-card:0 1px 2px rgba(15,23,42,.06),0 8px 24px rgba(15,23,42,.06);
  --shadow-lift:0 2px 4px rgba(15,23,42,.06),0 16px 40px rgba(15,23,42,.10);
}
@media (min-width:900px){
  :root{--fs-b:20px;--fs-l:24px;--fs-h2:40px;--fs-h1:48px;--gutter:32px;--section-y:96px}
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 12px);background:var(--c-bg)}
body{margin:0;background:var(--c-bg);color:var(--c-text);font-family:var(--f-sans);font-size:var(--fs-b);line-height:var(--lh-b);overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
h1,h2,h3{line-height:var(--lh-h);margin:0;color:var(--c-heading);overflow-wrap:break-word}
h1{font-size:var(--fs-h1);font-weight:800;letter-spacing:-0.02em}
h2{font-size:var(--fs-h2);font-weight:700;letter-spacing:-0.015em}
h3{font-size:var(--fs-l);font-weight:700}
p,ul,ol,dl,figure{margin:0}
b,strong{font-weight:700;color:var(--c-heading)}
a{color:var(--c-accent);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--c-accent-hover)}
:focus-visible{outline:3px solid var(--c-focus);outline-offset:3px;border-radius:6px}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.muted{color:var(--c-muted)}
.small{font-size:var(--fs-s)}
.num{font-variant-numeric:tabular-nums}
.nowrap{white-space:nowrap}

.wrap{max-width:var(--maxw);margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter)}
.section{padding-top:var(--section-y);padding-bottom:var(--section-y);position:relative}
.bg-base{background:var(--c-bg)}
.bg-surface{background:var(--c-bg-alt)}

/* Шапка секции: метка, заголовок-утверждение, одна главная мысль */
.eyebrow{display:block;font-size:var(--fs-s);font-weight:700;color:var(--c-accent);text-transform:uppercase;letter-spacing:.06em;margin-bottom:var(--sp-2)}
.section-head{margin-bottom:var(--sp-5);max-width:var(--measure)}
.section-head h2{margin-bottom:var(--sp-3)}
.section-head p{color:var(--c-muted)}
.section-head p + p{margin-top:var(--sp-2)}
.key{font-size:var(--fs-l);line-height:1.45;font-weight:600;color:var(--c-heading)}
.section-head .key{color:var(--c-heading)}
.section-cta{margin-top:var(--sp-5);display:flex;flex-wrap:wrap;gap:var(--sp-3) var(--sp-4);align-items:center}

/* Кнопки */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:var(--btn-h);padding:0 var(--sp-4);border-radius:var(--radius-sm);font:inherit;font-size:var(--fs-b);font-weight:600;line-height:1.25;text-decoration:none;cursor:pointer;border:2px solid transparent;transition:background-color var(--t-fast),border-color var(--t-fast),color var(--t-fast);-webkit-tap-highlight-color:transparent;text-align:center}
.btn-arrow::after{content:"→";font-weight:700;transition:transform var(--t-fast)}
.btn-arrow:hover::after{transform:translateX(3px)}
.btn-primary{background:var(--c-accent);color:var(--c-on-accent)}
.btn-primary:hover{background:var(--c-accent-hover);color:var(--c-on-accent)}
.btn-primary[disabled],.btn-primary[aria-disabled="true"]{opacity:.5;cursor:not-allowed}
.btn-secondary{background:transparent;color:var(--c-heading);border-color:var(--c-control)}
.btn-secondary:hover{border-color:var(--c-accent);color:var(--c-accent);background:var(--c-accent-soft)}
.btn-link{color:var(--c-accent);font-weight:600;text-decoration:underline;text-underline-offset:3px;min-height:44px;display:inline-flex;align-items:center;gap:6px}

/* Теги-пилюли */
.tags{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:0}
.tags li{font-size:var(--fs-s);color:var(--c-muted);padding:4px 12px;border-radius:999px;background:var(--c-bg-alt)}

/* Карточки: без лишних рамок, отделены фоном и тенью */
.card{background:var(--c-surface);border:1px solid var(--c-rule);border-radius:var(--radius);box-shadow:var(--shadow-card)}

/* Закреплённая шапка */
.site-header{position:sticky;top:0;z-index:50;background:var(--c-header-bg);border-bottom:1px solid var(--c-rule);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:var(--sp-3);min-height:var(--header-h)}
.brand{display:flex;flex-direction:column;text-decoration:none;color:var(--c-heading);line-height:1.25;min-width:0}
.brand-name{font-weight:700;font-size:var(--fs-s)}
.brand-role{font-size:var(--fs-s);color:var(--c-muted)}
.nav{display:none}
.nav ul{list-style:none;padding:0;margin:0;display:flex;gap:2px}
.nav a{display:inline-flex;align-items:center;min-height:40px;padding:0 10px;border-radius:8px;font-size:var(--fs-s);font-weight:500;color:var(--c-muted);text-decoration:none;position:relative}
.nav a:hover{color:var(--c-heading);background:var(--c-bg-alt)}
.nav a.is-active{color:var(--c-accent);font-weight:600}
.nav a.is-active::after{content:"";position:absolute;left:10px;right:10px;bottom:3px;height:2px;background:var(--c-accent);border-radius:2px}
.header-cta{display:none}
.menu-toggle{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid var(--c-control);background:var(--c-bg);border-radius:var(--radius-sm);cursor:pointer;padding:0;flex:none}
.menu-toggle span{display:block;width:20px;height:2px;background:var(--c-heading);position:relative}
.menu-toggle span::before,.menu-toggle span::after{content:"";position:absolute;left:0;width:20px;height:2px;background:var(--c-heading);transition:transform var(--t-fast)}
.menu-toggle span::before{top:-6px}
.menu-toggle span::after{top:6px}
.menu-toggle[aria-expanded="true"] span{background:transparent}
.menu-toggle[aria-expanded="true"] span::before{transform:translateY(6px) rotate(45deg)}
.menu-toggle[aria-expanded="true"] span::after{transform:translateY(-6px) rotate(-45deg)}
.mobile-nav{display:none;border-top:1px solid var(--c-rule);background:var(--c-bg)}
.mobile-nav.is-open{display:block}
.mobile-nav ul{list-style:none;padding:var(--sp-2) var(--gutter) var(--sp-3);margin:0;display:grid;gap:2px}
.mobile-nav a{display:block;padding:10px 8px;border-radius:8px;text-decoration:none;color:var(--c-text);font-weight:500}
.mobile-nav a.is-active{color:var(--c-accent);background:var(--c-accent-soft)}

/* Плавающая кнопка на телефоне */
.fab{position:fixed;left:var(--gutter);right:var(--gutter);bottom:12px;z-index:40;display:none;box-shadow:0 12px 32px rgba(15,23,42,.35)}
.fab.is-visible{display:inline-flex}

/* ===== Тёмные блоки: первый экран и подвал ===== */
.dark{background:var(--d-bg);color:var(--d-text);--c-focus:var(--d-accent)}
.dark h1,.dark h2,.dark h3,.dark b,.dark strong{color:var(--d-heading)}
.dark a{color:var(--d-accent)}
.dark a:hover{color:#FFFFFF}
.dark .muted{color:var(--d-muted)}
.dark .btn-primary{background:#FFFFFF;color:var(--d-bg)}
.dark .btn-primary:hover{background:#DBEAFE;color:var(--d-bg)}
.dark .btn-secondary{color:var(--d-heading);border-color:rgba(255,255,255,.6)}
.dark .btn-secondary:hover{background:rgba(255,255,255,.08);color:#FFFFFF;border-color:#FFFFFF}
.dark .eyebrow{color:#BFDBFE}

/* Первый экран */
.hero{padding:var(--sp-4) 0 var(--sp-6);position:relative;z-index:1;border-radius:0 0 28px 28px;box-shadow:0 18px 40px -24px rgba(15,23,42,.5)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--sp-5);align-items:start}
.hero h1{max-width:22ch}
.hero h1 .hl{color:var(--d-accent)}
.asks-title{margin-top:var(--sp-4);font-size:var(--fs-s);font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#BFDBFE}
.asks{list-style:none;padding:0;margin:var(--sp-2) 0 0;display:grid;gap:10px}
.asks a{display:block;height:100%;padding:14px 16px;border-radius:12px;background:rgba(255,255,255,.06);border:1px solid var(--d-rule);color:var(--d-text);text-decoration:none;line-height:1.45;transition:border-color var(--t-fast),background-color var(--t-fast)}
.asks a:hover{border-color:var(--d-accent);background:rgba(255,255,255,.1);color:var(--d-text)}
.asks b{display:block;font-size:var(--fs-l);margin-bottom:2px}
.cta{display:flex;flex-wrap:wrap;gap:var(--sp-2);align-items:center;margin-top:var(--sp-4)}
.cta .btn{width:100%}
.cta .cta-note{order:3;flex-basis:100%;margin-top:0}
.cta-note{margin-top:var(--sp-2);font-size:var(--fs-s);color:var(--d-muted);max-width:56ch}
.hero-facts{list-style:none;padding:0;margin:var(--sp-5) 0 0;display:grid;grid-template-columns:repeat(2,auto);justify-content:start;gap:var(--sp-3) var(--sp-6)}
.hero-fact-num{display:block;font-size:var(--fs-h2);font-weight:800;line-height:1.1;color:#FFFFFF;white-space:nowrap}
.hero-fact-label{display:block;font-size:var(--fs-s);line-height:1.4;color:var(--d-muted);margin-top:4px;max-width:18ch}
.hero .more{margin-top:var(--sp-3)}
.hero .more summary{color:var(--d-accent)}
.hero .more > :not(summary){color:var(--d-muted)}
.hero-photo{margin:0}
.hero-photo img{width:100%;aspect-ratio:4/3;object-fit:cover;object-position:50% 18%;border-radius:var(--radius);box-shadow:0 24px 48px rgba(0,0,0,.35)}

/* «Подробнее» */
.more{margin-top:var(--sp-3);max-width:var(--measure)}
.more summary{display:inline-flex;align-items:center;gap:8px;min-height:44px;cursor:pointer;list-style:none;font-size:var(--fs-s);font-weight:600;color:var(--c-accent);border-radius:6px}
.more summary::-webkit-details-marker{display:none}
.more summary::after{content:"";width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform var(--t-fast)}
.more[open] summary::after{transform:translateY(2px) rotate(-135deg)}
.more > :not(summary){margin-top:var(--sp-2);color:var(--c-muted)}
.more ul{padding-left:1.15em;display:grid;gap:6px}
.more p + p{margin-top:var(--sp-1)}

/* Цифры о себе */
.stats-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--sp-4);list-style:none;padding:0;margin:0}
.stat{display:grid;gap:6px;align-content:start;padding-top:var(--sp-3);border-top:3px solid var(--c-accent)}
.stat-num{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px;line-height:1.1}
.stat-num .value{font-size:var(--fs-h2);font-weight:800;color:var(--c-heading);white-space:nowrap}
.stat-num .unit{font-size:var(--fs-s);font-weight:600;color:var(--c-accent)}
.stat-label{display:block;color:var(--c-muted)}
.stats-note{margin-top:var(--sp-4);color:var(--c-muted);max-width:var(--measure)}

/* С кем работал */
.companies{padding:var(--sp-5) 0 0}
.companies .wrap > *{min-width:0}
.companies .wrap{border-top:1px solid var(--c-rule);padding-top:var(--sp-4)}
.companies .wrap{display:grid;gap:var(--sp-1)}
.companies .eyebrow{margin-bottom:0;color:var(--c-muted)}
.companies p{color:var(--c-muted)}
.companies b{color:var(--c-heading)}

/* Услуги: три направления колонками, без тяжёлых карточек */
.tracks{display:grid;gap:var(--sp-5)}
.track{border-top:3px solid var(--c-rule);padding-top:var(--sp-3);display:grid;gap:var(--sp-2);align-content:start}
.track:first-child{border-top-color:var(--c-accent)}
.track p{color:var(--c-muted)}
.track ul{padding-left:1.15em;display:grid;gap:4px}
.track .proof{font-size:var(--fs-s);font-weight:600}
.formats{display:grid;gap:var(--sp-3);margin-top:var(--sp-5);padding-top:var(--sp-4);border-top:1px solid var(--c-rule)}
.format h3{font-size:var(--fs-b);margin-bottom:4px}
.format p{color:var(--c-muted)}

/* Окно браузера вокруг превью демо */
.browser{border:1px solid var(--c-rule);border-radius:var(--radius-sm);overflow:hidden;background:var(--c-bg);box-shadow:var(--shadow-card)}
.browser-bar{display:flex;align-items:center;gap:6px;padding:8px 12px;background:var(--c-bg-alt);border-bottom:1px solid var(--c-rule)}
.browser-bar i{width:10px;height:10px;border-radius:50%;display:block}
.browser-bar i:nth-child(1){background:#F87171}
.browser-bar i:nth-child(2){background:#FBBF24}
.browser-bar i:nth-child(3){background:#34D399}
.browser-bar .url{margin-left:8px;flex:1;min-height:24px;border-radius:6px;background:var(--c-bg);font-size:var(--fs-s);line-height:1.2;color:var(--c-muted);display:flex;align-items:center;padding:0 10px;overflow:hidden;white-space:nowrap;border:1px solid var(--c-rule)}
.browser img{width:100%;aspect-ratio:1280/756;object-fit:cover}
.browser-zoom{display:block;width:100%;padding:0;border:0;background:transparent;cursor:zoom-in}
.zoom-hint{font-size:var(--fs-s);color:var(--c-muted);margin-top:8px}

/* Демо */
.demo-card{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--sp-4);padding:var(--sp-4)}
.demo-card h3{margin:var(--sp-1) 0}
.demo-labels{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.kicker,.case-kicker{display:inline-flex;font-size:var(--fs-s);font-weight:700;color:var(--c-accent);text-transform:uppercase;letter-spacing:.06em}
.demo-badge{display:inline-flex;font-size:var(--fs-s);font-weight:600;color:var(--c-on-warn);background:var(--c-warn);border-radius:999px;padding:2px 10px}
.demo-card p.muted{max-width:var(--measure)}
.demo-card .tags{margin-top:var(--sp-3)}
.demo-card .demo-actions{display:flex;flex-wrap:wrap;gap:var(--sp-2) var(--sp-3);margin-top:var(--sp-4)}
dialog.lightbox{border:0;padding:0;background:transparent;max-width:min(96vw,1280px);width:auto}
dialog.lightbox::backdrop{background:rgba(15,23,42,.86)}
dialog.lightbox img{width:100%;height:auto;border-radius:8px}
dialog.lightbox .close,dialog.cl-lightbox .close{position:absolute;top:8px;right:8px;width:44px;height:44px;border-radius:50%;border:1px solid var(--c-control);background:var(--c-surface);color:var(--c-heading);font-size:22px;line-height:1;cursor:pointer}
.lightbox-caption{margin:var(--sp-2) 0 0;font-size:var(--fs-s);color:var(--c-text);background:var(--c-surface);padding:var(--sp-2) var(--sp-3);border-radius:var(--radius-sm)}

/* Кейсы: живые карточки */
.case{padding:var(--sp-4);display:grid;grid-template-columns:minmax(0,1fr);gap:var(--sp-4)}
.case h3{max-width:32ch}
.cl-text,.cl-gallery{display:grid;gap:var(--sp-3);align-content:start;min-width:0}
.cl-text .case-kicker{justify-self:start}
.case-lines{display:grid;gap:var(--sp-3)}
.case-lines > div{display:grid;gap:2px}
.case-lines dt{font-size:var(--fs-s);font-weight:700;color:var(--c-heading)}
.case-lines dd{margin:0;color:var(--c-muted)}
.case-lines > div:last-child dd{color:var(--c-text)}
.case-lines dd ul{margin:4px 0 0;padding-left:1.15em;display:grid;gap:6px}
.case-more{grid-column:1/-1;margin-top:0}
.case-more-lead{font-weight:600;color:var(--c-heading);margin-top:var(--sp-3)}
.case-body{display:grid;gap:var(--sp-3);margin-top:var(--sp-3)}
.case-row{display:grid;gap:4px}
.case-row dt{font-size:var(--fs-s);font-weight:700;color:var(--c-heading)}
.case-row dd{margin:0}
.case-row ul{padding-left:1.15em;display:grid;gap:6px}
.case-more .case-pic{margin-top:var(--sp-3);max-width:420px}
.case-demo-link{font-size:var(--fs-s);font-weight:600}
.case-demo-link a{display:inline-flex;align-items:center;min-height:44px}
.case-demo-link a::after{content:"\2192";margin-left:6px}
.cl-steps{list-style:none;padding:0;margin:0;display:grid;gap:var(--sp-3);grid-template-columns:minmax(0,1fr)}
.cl-step{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--sp-1);align-content:start;min-width:0;position:relative}
.cl-zoom{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in;text-align:left;color:inherit;font:inherit;border-radius:12px}
/* Рамка: тёмные экраны сервисов в аккуратном «корпусе», нарисованные картинки на светлой подложке */
.cl-frame{display:block;border-radius:12px;overflow:hidden;background:var(--c-bg-alt);border:1px solid var(--c-rule);transition:border-color var(--t-fast),box-shadow var(--t-fast)}
.cl-zoom:hover .cl-frame{border-color:var(--c-accent);box-shadow:var(--shadow-lift)}
.cl-frame--img{height:220px;background:#0F172A;border:6px solid #1E293B;border-radius:14px;box-shadow:0 1px 0 rgba(255,255,255,.06) inset,var(--shadow-card);position:relative}
.cl-frame--img img{width:100%;height:100%;object-fit:cover;object-position:center top;border-radius:6px}
.cl-fit-left img{object-position:left top}
.cl-fit-center img{object-position:center center}
.cl-crop img{width:calc(var(--w) * var(--s,1));height:auto;max-width:none;object-fit:fill}
.cl-crop--card{--w:597px;--s:.75}
.cl-crop--board{--w:1600px;--s:.72}
.cl-crop--analysis{--w:794px;--s:1}
.cl-zoom .cl-frame--img::after{content:"";position:absolute;right:8px;bottom:8px;width:34px;height:34px;border-radius:50%;background:var(--c-surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230F172A' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6'/%3E%3Cpath d='M15 15l5 5M10.5 8v5M8 10.5h5'/%3E%3C/svg%3E") center/18px no-repeat;box-shadow:0 2px 8px rgba(15,23,42,.3)}
.cl-frame--art{display:grid;align-content:center;background:var(--c-surface);box-shadow:var(--shadow-card)}
.cl-cap{display:flex;align-items:flex-start;gap:8px;font-size:var(--fs-s);color:var(--c-text);font-weight:500}
.cl-n{flex:none;width:24px;height:24px;border-radius:50%;display:inline-grid;place-items:center;font-size:var(--fs-s);font-weight:700;color:var(--c-on-accent);background:var(--c-accent);line-height:1}
.cl-note{font-size:var(--fs-s);color:var(--c-muted);font-style:italic}

/* Нарисованные картинки кейсов (aria-hidden, цифры продублированы текстом карточки) */
.cl-art{display:grid;gap:10px;padding:var(--sp-3);font-size:var(--fs-s);line-height:1.35;color:var(--c-text)}
.cl-frame .cl-art-title{display:none}
.cl-art-title{font-size:var(--fs-s);font-weight:700;color:var(--c-heading)}
.cl-fbar{display:grid;gap:4px}
.cl-fbar i{display:block;height:14px;width:max(var(--w),6px);border-radius:4px;background:var(--c-accent)}
.cl-fbar--ok i{background:var(--c-gain)}
.cl-flabel b{font-size:var(--fs-b);margin-right:4px}
.cl-callout{margin-top:4px;padding:8px 10px;border-radius:8px;border:1px dashed var(--c-loss);color:var(--c-loss);background:var(--c-tint-loss);font-weight:600}
.cl-funnel--orders .cl-fbar i{height:20px}
.cl-wrow{display:grid;grid-template-columns:7em minmax(0,1fr);gap:8px;align-items:center}
.cl-wname{color:var(--c-muted);white-space:nowrap}
.cl-wrow--total .cl-wname{color:var(--c-heading);font-weight:700}
.cl-wbar{display:flex;height:18px;border-radius:4px;overflow:hidden}
.cl-wrow--total .cl-wbar{height:26px}
.cl-wbar i{display:block;width:var(--w);font-style:normal;font-weight:700;color:#0F172A;text-align:center;line-height:26px;overflow:hidden}
.cl-week .s0,.cl-legend .s0{background:#60A5FA}
.cl-week .s1,.cl-legend .s1{background:#7DD3FC}
.cl-week .s2,.cl-legend .s2{background:#FCD34D}
.cl-week .s3,.cl-legend .s3{background:#6EE7B7}
.cl-week .s4,.cl-legend .s4{background:#CBD5E1}
.cl-legend{display:flex;flex-wrap:wrap;gap:4px 12px;color:var(--c-muted);align-items:center;margin-top:4px}
.cl-legend > span{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.cl-legend i{display:inline-block;width:12px;height:12px;border-radius:2px}
/* Кейс 2: окно мессенджера */
.cl-chat{padding:0;gap:0;background:var(--c-surface)}
.cl-chat-head{display:flex;align-items:center;gap:8px;padding:8px 12px;background:var(--c-bg-alt);border-bottom:1px solid var(--c-rule);font-weight:600;color:var(--c-heading)}
.cl-chat-head i{width:22px;height:22px;border-radius:50%;background:var(--c-accent)}
.cl-chat-body{display:grid;gap:6px;padding:10px 12px}
.cl-msg{display:grid;gap:2px;max-width:88%;padding:6px 10px;border-radius:12px 12px 12px 4px;background:var(--c-bg-alt);justify-self:start}
.cl-msg b{font-size:var(--fs-s);color:var(--c-accent);font-weight:600}
.cl-msg--b{justify-self:end;border-radius:12px 12px 4px 12px;background:var(--c-tint)}
.cl-msg--b b{color:var(--c-gain)}
/* Кейс 5: карточка спорного заказа */
.cl-dispute{background:var(--c-surface)}
.cl-dispute-head{font-weight:700;color:var(--c-on-warn)}
.cl-dispute-row{color:var(--c-muted)}
.cl-dispute-verdict{display:grid;gap:2px;padding:8px 10px;border-left:3px solid var(--c-accent);background:var(--c-accent-soft);border-radius:0 8px 8px 0}
.cl-dispute-verdict b{font-size:var(--fs-s);color:var(--c-accent)}
.cl-dispute-note{font-style:italic;color:var(--c-muted)}
.cl-dispute-btns{display:flex;flex-wrap:wrap;gap:6px}
.cl-dispute-btns i{font-style:normal;font-weight:600;padding:4px 10px;border-radius:999px;border:1px solid var(--c-control);background:var(--c-surface)}
.cl-dispute-btns i:first-child{border-color:var(--c-gain);color:var(--c-gain)}
/* Кейс 4: схема */
.cl-scheme svg{display:block;width:100%;height:auto}
.cl-sch-line{fill:none;stroke:var(--c-accent);stroke-width:2}
.cl-sch-line--main{stroke:var(--c-gain);stroke-width:3}
.cl-sch-arrow{fill:var(--c-accent)}
.cl-sch-biz{fill:var(--c-surface);stroke:var(--c-control)}
.cl-sch-core{fill:var(--c-tint);stroke:var(--c-accent);stroke-width:1.5}
.cl-sch-owner{fill:var(--c-tint-gain);stroke:var(--c-gain);stroke-width:1.5}
.cl-sch-t{fill:var(--c-heading);font-family:var(--f-sans);font-size:15px;font-weight:600;text-anchor:middle}
.cl-sch-t--core{fill:var(--c-heading)}
.cl-scheme .cl-sch-v{display:none}
/* Кейс 6: макет дашборда рекомендаций */
.cl-dash{background:var(--c-surface);gap:0;padding:0}
.cl-dash-head{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px;align-items:center;padding:10px 12px;border-bottom:1px solid var(--c-rule)}
.cl-dash-tag{font-size:var(--fs-s);font-weight:600;color:var(--c-on-warn);background:var(--c-warn);border-radius:999px;padding:2px 8px}
.cl-rec-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 10px;align-items:center;padding:9px 12px;border-bottom:1px solid var(--c-rule)}
.cl-rec-row--head{display:none}
.cl-rec-item{font-weight:600;color:var(--c-heading)}
.cl-rec-act{font-weight:600;padding:2px 8px;border-radius:6px;justify-self:start}
.cl-rec-act--down{background:var(--c-tint);color:var(--c-on-tint)}
.cl-rec-act--stock{background:var(--c-tint-gain);color:var(--c-on-tint-gain)}
.cl-rec-act--stop{background:var(--c-tint-loss);color:var(--c-on-tint-loss)}
.cl-rec-why{color:var(--c-muted);grid-column:1/-1}
/* Кейс 1 в «Подробнее»: два кольца */
.case-pic{display:grid;gap:var(--sp-3);padding:var(--sp-4);background:var(--c-bg-alt);border-radius:var(--radius-sm);align-content:center}
.bars-title{font-size:var(--fs-s);font-weight:700;color:var(--c-heading)}
.rings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-3);justify-items:center;text-align:center}
.ring-item{display:grid;gap:var(--sp-1);justify-items:center}
.ring{--p:0;width:104px;height:104px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--ring-c) calc(var(--p) * 1%),#E2E8F0 0);position:relative}
.ring::before{content:"";position:absolute;inset:12px;border-radius:50%;background:var(--c-bg-alt)}
.ring-value{position:relative;font-weight:700;font-size:var(--fs-l);color:var(--c-heading)}
.ring-label{font-size:var(--fs-s);color:var(--c-text)}
/* Окно увеличения картинок кейсов */
dialog.cl-lightbox{width:min(96vw,1200px);max-height:92vh;overflow:auto;background:var(--c-surface);color:var(--c-text);border:0;border-radius:var(--radius);padding:var(--sp-5) var(--sp-3) var(--sp-3)}
dialog.cl-lightbox::backdrop{background:rgba(15,23,42,.86)}
.cl-zoom-body img{width:100%;height:auto;border-radius:8px}
.cl-zoom-body .cl-art-title{display:block}
.cl-zoom-cap{margin-top:var(--sp-2);color:var(--c-muted);font-size:var(--fs-s)}

/* Ленты (кейсы, демо, пакеты на телефоне): нативная прокрутка со snap, JS добавляет стрелки, кружки, счётчик и высоту по активному слайду */
.carousel{position:relative}
.has-carousel{overflow-x:clip}
.carousel-track{display:flex;align-items:flex-start;gap:var(--sp-4);overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-behavior:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:4px 0 24px;overscroll-behavior-x:contain}
.carousel-track::-webkit-scrollbar{display:none}
.carousel.is-ready .carousel-track{transition:height .35s ease}
.carousel-track:focus-visible{outline:3px solid var(--c-focus);outline-offset:4px;border-radius:var(--radius)}
.carousel-slide{flex:0 0 100%;min-width:0;scroll-snap-align:start;scroll-snap-stop:always;transition:opacity .35s ease,border-color var(--t-fast)}
.carousel.is-ready .carousel-slide:not(.is-active){opacity:.5;cursor:pointer}
.carousel.is-ready .carousel-slide:not(.is-active):hover{opacity:.8}
.carousel.is-ready .carousel-slide:not(.is-active) *{pointer-events:none}
.carousel-side{display:none;position:absolute;top:4px;height:var(--active-h,100%);width:48px;z-index:3;pointer-events:none}
.carousel-side-prev{left:calc(-1 * min(24px,var(--edge-gap)))}
.carousel-side-next{left:calc(var(--slide-w,92%) - 24px)}
.carousel-side .carousel-btn{position:absolute;left:0;top:calc(var(--side-y,50%) - 24px);width:48px;height:48px;pointer-events:auto;background:var(--c-surface);box-shadow:var(--shadow-lift)}
.carousel-side .carousel-btn:disabled{opacity:.35;cursor:default;pointer-events:none}
.carousel-nav{display:none;align-items:center;gap:var(--sp-2);flex-wrap:nowrap;margin-top:var(--sp-2)}
.carousel.is-ready .carousel-nav{display:flex}
.carousel-btn{width:44px;height:44px;border-radius:50%;border:1px solid var(--c-control);background:var(--c-surface);color:var(--c-heading);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:0;flex:none;transition:border-color var(--t-fast),background-color var(--t-fast),opacity var(--t-fast)}
.carousel-btn::before{content:"";width:10px;height:10px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateX(-2px) rotate(-45deg)}
.carousel-prev::before{transform:translateX(2px) rotate(135deg)}
.carousel-btn:hover{border-color:var(--c-accent);color:var(--c-accent);background:var(--c-accent-soft)}
.carousel-btn[aria-disabled="true"]{opacity:.35;cursor:default;pointer-events:none}
.carousel-count{min-width:4.5ch;text-align:center;font-size:var(--fs-s);font-weight:600;color:var(--c-muted)}
.carousel-hint{display:none;font-size:var(--fs-s);color:var(--c-muted)}
.carousel-dots{list-style:none;padding:0;margin:0 0 0 auto;display:flex;flex-wrap:nowrap;gap:4px}
.carousel-dots button{width:32px;height:32px;border-radius:50%;border:1px solid var(--c-control);background:var(--c-surface);color:var(--c-muted);font:inherit;font-size:var(--fs-s);font-weight:600;cursor:pointer;padding:0;line-height:1}
.carousel-dots button:hover{border-color:var(--c-accent);color:var(--c-accent)}
.carousel-dots button[aria-current="true"]{border-color:var(--c-accent);background:var(--c-accent);color:var(--c-on-accent)}

/* Процесс */
.process-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--sp-6);align-items:start}
.portrait{display:none;margin:0}
.portrait img{width:280px;border-radius:var(--radius);aspect-ratio:832/1248;object-fit:cover;box-shadow:var(--shadow-lift)}
.portrait figcaption{margin-top:var(--sp-2);font-size:var(--fs-s);color:var(--c-muted);max-width:280px}
.timeline{list-style:none;padding:0;margin:0;display:grid;gap:0}
.step{display:grid;grid-template-columns:44px minmax(0,1fr);gap:var(--sp-3);position:relative;padding-bottom:var(--sp-4)}
.step::before{content:"";position:absolute;left:21px;top:44px;bottom:0;width:2px;background:var(--c-rule)}
.step:last-child::before{display:none}
.step-num{width:44px;height:44px;border-radius:50%;background:var(--c-accent);color:var(--c-on-accent);font-weight:700;display:flex;align-items:center;justify-content:center;font-size:var(--fs-b);flex:none}
.step-body{padding-top:6px}
.step-body h3{margin-bottom:4px}
.step-body p{max-width:var(--measure);color:var(--c-muted)}
.step-body .more{margin-top:0}
.process-note{margin-top:var(--sp-2);color:var(--c-muted);max-width:var(--measure)}

/* Пакеты */
.packages{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--sp-4);align-items:stretch}
.pkg{display:flex;flex-direction:column;gap:var(--sp-2);padding:var(--sp-4)}
.pkg-core{border:2px solid var(--c-accent);box-shadow:0 12px 32px rgba(29,78,216,.12)}
.pkg-tag{font-size:var(--fs-s);font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--c-accent)}
.pkg p,.pkg ul{color:var(--c-muted)}
.pkg ul{padding-left:1.15em;display:grid;gap:4px}
.pkg-meta{margin-top:auto;display:grid;gap:2px;border-top:1px solid var(--c-rule);padding-top:var(--sp-3);color:var(--c-muted)}
.pkg-meta b{color:var(--c-heading);font-weight:600}
.pkg-price{font-size:var(--fs-l);font-weight:800;color:var(--c-heading)}
.pkg .btn{width:100%}

/* FAQ */
.faq-list{display:grid;gap:0;max-width:860px;border-top:1px solid var(--c-rule)}
.faq-list details{border-bottom:1px solid var(--c-rule)}
.faq-list summary{list-style:none;cursor:pointer;padding:var(--sp-3) 0;min-height:44px;font-weight:600;display:flex;justify-content:space-between;gap:var(--sp-3);align-items:center;color:var(--c-heading)}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::after{content:"+";font-size:28px;line-height:1;color:var(--c-accent);flex:none;transition:transform var(--t-fast)}
.faq-list details[open] summary::after{transform:rotate(45deg)}
.faq-list .answer{padding:0 0 var(--sp-3);color:var(--c-muted);max-width:var(--measure)}

/* Контакт */
.contact-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--sp-5)}
[data-lead][hidden]{display:none!important}
.lead-off{display:grid;gap:var(--sp-3);padding:var(--sp-4);align-content:start}
.lead-off h3{font-size:var(--fs-l)}
.lead-off p{color:var(--c-muted)}
.lead-off .btn{justify-self:start}
.form{display:grid;gap:var(--sp-3);padding:var(--sp-4)}
.field{display:grid;gap:6px}
.field label{font-size:var(--fs-s);font-weight:600;color:var(--c-heading)}
.field input,.field textarea{width:100%;font:inherit;color:var(--c-heading);background:var(--c-surface);border:1px solid var(--c-control);border-radius:var(--radius-sm);padding:12px 14px;min-height:var(--btn-h)}
.field input:focus,.field textarea:focus{border-color:var(--c-accent);box-shadow:0 0 0 3px #BFDBFE;outline:none}
.field textarea{min-height:130px;resize:vertical}
.field input::placeholder,.field textarea::placeholder{color:#64748B;opacity:1}
.field.is-invalid input,.field.is-invalid textarea{border-color:var(--c-error)}
.field-error{font-size:var(--fs-s);color:var(--c-error);display:none}
.field.is-invalid .field-error{display:block}
.hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.consent{display:grid;grid-template-columns:auto 1fr;gap:var(--sp-2);align-items:start;font-size:var(--fs-s);color:var(--c-muted)}
.consent input{width:20px;height:20px;margin:3px 0 0;accent-color:var(--c-accent)}
.consent.is-invalid label{color:var(--c-error)}
.form-actions{display:grid;gap:var(--sp-2)}
.form .btn{width:100%}
.form-note{font-size:var(--fs-s);color:var(--c-muted)}
.form-status{display:none;padding:var(--sp-3);border-radius:var(--radius-sm);font-size:var(--fs-s)}
.form-status.is-ok{display:block;background:var(--c-tint-gain);color:var(--c-on-tint-gain)}
.form-status.is-error{display:block;background:var(--c-tint-loss);color:var(--c-on-tint-loss)}
.contact-side{display:grid;gap:var(--sp-3);align-content:start}
.contact-side h3{font-size:var(--fs-l)}
.contact-links{list-style:none;padding:0;margin:0;display:grid;gap:var(--sp-2)}
.contact-links li{display:flex;align-items:center;gap:12px;color:var(--c-muted)}
.contact-links .ico{width:40px;height:40px;border-radius:10px;background:var(--c-accent-soft);display:inline-flex;align-items:center;justify-content:center;color:var(--c-accent);font-weight:700;font-size:var(--fs-s);flex:none}
.contact-links a,.contact-links .plain{font-weight:600;color:var(--c-heading)}
.contact-links a{display:inline-flex;align-items:center;min-height:44px}

/* Подвал (тёмный) */
.footer{padding:var(--sp-6) 0;font-size:var(--fs-s)}
.footer .wrap{display:grid;gap:var(--sp-2)}
.footer p{color:var(--d-muted)}
.footer a{color:#FFFFFF;display:inline-block;padding:6px 0}

/* Служебные страницы: политика, согласие, 404 */
.doc{max-width:var(--measure)}
.doc h1{font-size:var(--fs-h2);margin-bottom:var(--sp-4)}
.doc h2{font-size:var(--fs-l);margin:var(--sp-5) 0 var(--sp-2)}
.doc p,.doc ul{margin-bottom:var(--sp-2)}
.doc{min-height:50vh}
.stub{border:2px dashed var(--c-loss);border-radius:var(--radius);padding:var(--sp-4);background:var(--c-tint-loss);color:var(--c-on-tint-loss);margin:var(--sp-4) 0}
.doc .code{font-size:var(--fs-h1);font-weight:800;color:var(--c-accent);line-height:1;margin-bottom:var(--sp-3)}

/* Баннер согласия на Метрику: на телефоне полоса внизу до 72 px, от 640 px узкая плашка в правом нижнем углу */
.cookie{position:fixed;left:0;right:0;bottom:0;z-index:45;background:var(--c-surface);border-top:1px solid var(--c-rule);box-shadow:0 -8px 24px rgba(15,23,42,.12);padding:8px var(--gutter);display:none;gap:8px;align-items:center;flex-wrap:nowrap}
.cookie.is-visible{display:flex}
.cookie p{flex:1 1 auto;min-width:0;font-size:var(--fs-s);line-height:1.3;color:var(--c-muted)}
.cookie .btn{min-height:40px;padding:0 12px;font-size:var(--fs-s);white-space:nowrap}
body:has(.cookie.is-visible) .fab{bottom:calc(var(--cookie-h,60px) + 8px)}
body:has(.cookie.is-visible){padding-bottom:var(--cookie-h,60px)}

/* Появление при прокрутке */
/* Анимация появления при прокрутке убрана 09.10.2026 (владелец: «шрифт всплывает»). Класс оставлен для счётчиков и целей. */
.reveal{opacity:1;transform:none}
.no-motion .reveal{opacity:1;transform:none;transition:none}

/* ===== Телефон ===== */
@media (max-width:899px){
  .hero-photo{order:2}
  .carousel{display:flex;flex-direction:column}
  .carousel.is-ready .carousel-nav{order:-1;margin:0 0 var(--sp-2)}
  #demo-carousel.is-ready .carousel-nav{order:1;margin:var(--sp-2) 0 0}
  .pkg-carousel .carousel-slide{flex-basis:86%}
  .pkg-carousel .carousel-hint{display:inline}
  .fab.is-visible{display:inline-flex}
  .footer a,.track .proof a{padding:10px 0}
}
@media (max-width:639px){
  .cl-steps--3{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-3) var(--sp-2)}
  .cl-steps--3 .cl-step:first-child{grid-column:1/-1}
  .cl-steps--3 .cl-step:not(:first-child) .cl-frame--img{height:150px}
  .cl-frame--img{height:190px}
  .cl-scheme .cl-sch-h{display:none}
  .cl-scheme .cl-sch-v{display:block;max-width:320px;margin:0 auto}
  .case,.demo-card,.pkg,.lead-off,.form{padding:var(--sp-3)}
}

/* ===== Планшет и шире ===== */
@media (min-width:640px){
  .cta .btn{width:auto}
  .asks{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .formats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .form .btn{width:auto;min-width:220px}
  .cl-steps--2{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cl-steps--3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cl-steps--3 .cl-step:first-child{grid-column:1/-1}
  .cl-rec-row{grid-template-columns:70px 172px minmax(0,1fr);gap:10px}
  .cl-rec-row--head{display:grid;font-size:var(--fs-s);color:var(--c-muted)}
  .cl-rec-why,.cl-rec-eff{grid-column:auto}
  .cookie{left:auto;right:12px;bottom:12px;max-width:320px;border:1px solid var(--c-rule);border-radius:var(--radius-sm);box-shadow:var(--shadow-lift);padding:10px 12px;flex-wrap:wrap}
  .cookie p{flex:1 1 100%}
  body:has(.cookie.is-visible){padding-bottom:0}
}
@media (min-width:900px){
  .nav{display:block}
  .header-cta{display:inline-flex;min-height:44px;padding:0 16px;font-size:var(--fs-s)}
  .menu-toggle{display:none}
  .hero{padding:var(--sp-7) 0 var(--sp-7)}
  .hero-grid{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:var(--sp-7)}
  .hero-photo{margin-top:var(--sp-4)}
  .hero-photo img{aspect-ratio:4/5;object-position:50% 12%}
  .tracks{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-5)}
  .formats{gap:var(--sp-6)}
  .stats-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-5)}
  .demo-card{grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);align-items:start;padding:var(--sp-5)}
  .case{grid-template-columns:minmax(0,5fr) minmax(0,7fr);column-gap:var(--sp-5);row-gap:var(--sp-4);padding:var(--sp-5)}
  .cl-steps--3 .cl-step:first-child .cl-frame--img{height:300px}
  .carousel{margin-right:calc(-1 * var(--carousel-extra,0px))}
  .carousel-slide{flex-basis:var(--slide-w,92%)}
  .carousel-track::after{content:"";flex:0 0 var(--carousel-tail,calc(8% - var(--sp-4)))}
  .carousel.is-ready .carousel-side{display:block}
  .carousel-nav{margin-right:var(--carousel-extra,0px)}
  .pkg-carousel{margin-right:0}
  .pkg-carousel .carousel-track{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-4);overflow:visible;scroll-snap-type:none;padding:4px 0 0;height:auto!important;align-items:stretch}
  .pkg-carousel .carousel-track::after{display:none}
  .carousel.is-ready.pkg-carousel .carousel-slide{opacity:1;cursor:auto}
  .carousel.is-ready.pkg-carousel .carousel-slide *{pointer-events:auto}
  .carousel.is-ready.pkg-carousel .carousel-nav,.carousel.is-ready.pkg-carousel .carousel-side{display:none}
  .pkg{padding:var(--sp-5)}
  .process-grid{grid-template-columns:280px minmax(0,1fr);gap:var(--sp-7)}
  .portrait{display:block;position:sticky;top:calc(var(--header-h) + 24px)}
  .step{grid-template-columns:52px minmax(0,1fr);gap:var(--sp-4)}
  .step::before{left:25px;top:52px}
  .step-num{width:52px;height:52px}
  .step-body{padding-top:10px}
  .contact-grid{grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:var(--sp-7)}
  .form,.lead-off{padding:var(--sp-5)}
  .companies .wrap{grid-template-columns:auto 1fr;align-items:baseline;gap:var(--sp-4)}
  .fab{display:none!important}
  body:has(.cookie.is-visible) .fab.is-visible{display:none!important}
}

/* Отключение анимаций */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{transition:none!important;animation:none!important}
  .reveal{opacity:1;transform:none}
}

/* Первый экран цепляет за 3 секунды: на телефоне четыре плитки сеткой 2×2 и кнопка без прокрутки (решение владельца 02.10.2026) */
@media (max-width:639px){
  .asks{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .asks a{padding:10px 12px;font-size:var(--fs-s);line-height:1.4}
  .asks b{font-size:var(--fs-b)}
  .asks-title{margin-top:var(--sp-3)}
  .cta{margin-top:var(--sp-3)}
}
@media (min-width:900px){
  .hero{padding-top:var(--sp-6)}
  .asks a{padding:12px 16px}
}
.nav a,.header-cta,.brand-name,.brand-role{white-space:nowrap}
@media (min-width:900px){
  .hero-grid{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:var(--sp-6)}
  .hero .cta .btn{padding:0 20px}
}
@media (min-width:900px) and (max-width:1199px){
  .brand-role{display:none}
  .nav a{padding:0 7px}
}

/* ===== Наглядность вместо текста (слова владельца 02.10.2026) ===== */
/* Услуги: три карточки со значком и одной строкой результата */
.tracks--cards .track{border-top:0;padding:var(--sp-4);background:var(--c-surface);border:1px solid var(--c-rule);border-radius:var(--radius);box-shadow:var(--shadow-card);gap:var(--sp-2)}
.tracks--cards .track:first-child{border-top-color:var(--c-rule)}
.track-ico{width:56px;height:56px;border-radius:14px;background:var(--c-accent-soft);display:grid;place-items:center;color:var(--c-accent)}
.track-ico svg{width:30px;height:30px}
.track-result{font-size:var(--fs-b);color:var(--c-heading)!important;font-weight:500}
.track .more{margin-top:0}
.formats-line{margin-top:var(--sp-4);color:var(--c-muted);max-width:var(--measure)}
.formats-line b{color:var(--c-heading)}

/* Цифры о себе: крупное число и подпись в 3-5 слов */
.stats-grid--big .stat{border-top:0;padding-top:0}
.stats-grid--big .stat-num .value{font-size:var(--fs-h1);color:var(--c-accent)}

/* Как я работаю: цепочка из пяти шагов, описание по нажатию */
.chain{list-style:none;padding:0;margin:0;display:grid;gap:0;counter-reset:none}
.chain-step{position:relative;padding:0 0 var(--sp-3) 60px}
.chain-step::before{content:"";position:absolute;left:21px;top:44px;bottom:0;width:2px;background:var(--c-rule)}
.chain-step:last-child::before{display:none}
.chain-step details summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:var(--sp-2);min-height:44px;font-weight:700;color:var(--c-heading);font-size:var(--fs-b)}
.chain-step details summary::-webkit-details-marker{display:none}
.chain-num{position:absolute;left:0;top:0;width:44px;height:44px;border-radius:50%;background:var(--c-accent);color:var(--c-on-accent);font-weight:700;display:grid;place-items:center}
.chain-label::after{content:"";display:inline-block;width:8px;height:8px;margin-left:10px;border-right:2px solid var(--c-accent);border-bottom:2px solid var(--c-accent);transform:translateY(-3px) rotate(45deg);transition:transform var(--t-fast)}
.chain-step details[open] .chain-label::after{transform:translateY(1px) rotate(-135deg)}
.chain-step details > :not(summary){margin-top:6px;color:var(--c-muted);max-width:var(--measure)}
.chain-step details ul{padding-left:1.15em;display:grid;gap:4px}
@media (min-width:900px){
  .chain{grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--sp-3);align-items:start}
  .chain-step{padding:60px 0 0}
  .chain-step::before{left:50px;right:calc(-1 * var(--sp-3));top:21px;bottom:auto;width:auto;height:2px}
  .chain-step details summary{align-items:flex-start;min-height:0}
  .chain-step details > :not(summary){font-size:var(--fs-s)}
}

/* Пакеты: три ступени лестницы */
.ladder{list-style:none;padding:0;margin:0;display:grid;gap:var(--sp-3)}
.rung{display:grid;gap:6px;align-content:start;padding:var(--sp-4);border-radius:var(--radius);background:var(--c-surface);border:1px solid var(--c-rule);box-shadow:var(--shadow-card);position:relative}
.rung-core{border:2px solid var(--c-accent);box-shadow:0 12px 32px rgba(29,78,216,.12)}
.rung-step{font-size:var(--fs-s);font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--c-accent)}
.rung-price{font-size:var(--fs-h2);font-weight:800;line-height:1.1;color:var(--c-heading)}
.rung p{color:var(--c-muted)}
.rung-term{font-size:var(--fs-s);color:var(--c-muted)}
.rung-term b{color:var(--c-heading)}
@media (max-width:899px){
  .rung:nth-child(2){margin-left:16px}
  .rung:nth-child(3){margin-left:32px}
}
@media (min-width:900px){
  .ladder{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-4);align-items:end}
  .rung{min-height:220px}
  .rung:nth-child(2){min-height:270px}
  .rung:nth-child(3){min-height:320px}
  .rung + .rung::before{content:"";position:absolute;left:calc(-1 * var(--sp-4) + 4px);bottom:40px;width:14px;height:14px;border-right:3px solid var(--c-accent);border-top:3px solid var(--c-accent);transform:rotate(45deg)}
}

/* Кейсы: сначала картинка-результат и заголовок, потом три короткие строки; на виду не больше двух картинок */
.case.case-live .cl-gallery{order:-1}
@media (min-width:900px){
  .case.case-live{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
  .case.case-live .cl-steps--3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .case.case-live .cl-steps--3 .cl-step:first-child{grid-column:auto}
  .case.case-live .cl-steps--3 .cl-step:first-child .cl-frame--img{height:220px}
}
.case-lines dd{display:block}
.case-lines .lead-point{color:var(--c-heading);font-weight:600}
/* Баннер Метрики это юридическая плашка: на телефоне 14 px (норма 8 исследования допускает мелкий кегль только для юридических сносок), чтобы полоса была не выше 72 px */
@media (max-width:639px){
  .cookie{padding:6px 12px;gap:6px}
  .cookie p,.cookie .btn{font-size:14px}
  .cookie p{line-height:1.25}
  .cookie .btn{min-height:40px;padding:0 8px;border-width:1px}
  .cookie p{letter-spacing:-.01em}
}

/* Телефон короче (цена в «Пакетах» не дальше 8 экранов): карточки услуг в строку со значком, фото первого экрана ниже,
   у кейсов на телефоне одна нарисованная картинка (вторая повторяет текст карточки и видна от 640 px), экраны сервисов парой */
@media (max-width:639px){
  .tracks{gap:var(--sp-3)}
  .tracks--cards .track{grid-template-columns:44px minmax(0,1fr);column-gap:var(--sp-2);row-gap:4px;padding:var(--sp-3);align-items:center}
  .tracks--cards .track > :not(.track-ico):not(h3){grid-column:1/-1}
  .track-ico{width:44px;height:44px;border-radius:12px}
  .track-ico svg{width:24px;height:24px}
  .hero-photo img{aspect-ratio:16/9}
  .cl-steps--2{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp-2)}
  .cl-steps--2 .cl-frame--img{height:150px}
  .cl-steps--2:has(.cl-frame--art) {grid-template-columns:minmax(0,1fr)}
  .cl-steps--2:has(.cl-frame--art) .cl-step + .cl-step{display:none}
}
@media (max-width:899px){.carousel-track{padding-bottom:16px}}
/* Подпись шага выглядит как ссылка: по нажатию открывается описание */
.chain-label::after{display:none}
.chain-label{color:var(--c-accent);text-decoration:underline dotted 2px;text-underline-offset:5px}
.chain-step details[open] .chain-label{text-decoration-style:solid}
.chain-step summary:hover .chain-label{color:var(--c-accent-hover)}
/* кейс 1, неделя менеджера: подписи долей не слипаются в превью */
.cl-wrow--total .cl-wbar i{font-size:12px;letter-spacing:-.01em}
.cl-zoom-body .cl-wrow--total .cl-wbar i{font-size:14px}
/* «Как я работаю»: шаги сверху вниз рядом с портретом (возвращено по решению владельца 02.10.2026) */
.timeline{list-style:none;margin:0;padding:0;display:grid;gap:var(--sp-4)}
.timeline .step{display:grid;grid-template-columns:44px minmax(0,1fr);gap:var(--sp-3);align-items:start;position:relative}
.timeline .step:not(:last-child)::before{content:"";position:absolute;left:21px;top:48px;bottom:calc(-1 * var(--sp-4));width:2px;background:var(--c-rule)}
.timeline .step-num{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--c-accent);color:var(--c-on-accent);font-weight:700;font-size:var(--fs-b)}
.timeline .step-body h3{margin:6px 0 4px;font-size:var(--fs-l);line-height:var(--lh-h);color:var(--c-heading)}
.timeline .step-body > p{margin:0;max-width:var(--measure);color:var(--c-text)}
.timeline .more{margin-top:4px}
.process-note{margin-top:var(--sp-4)}

/* Пакеты: ступень обёрнута в details (описание по нажатию на телефоне); на широком экране вид прежний */
.rung-d{display:grid;gap:6px}
.rung-d > summary{display:grid;gap:6px;list-style:none;cursor:default}
.rung-d > summary::-webkit-details-marker{display:none}

/* ===== Длина главной на телефоне (03.10.2026, владелец одобрил): только до 767 px, 1440 не меняется =====
   Блоки, кейсы и тексты те же; скрытое открывается одним нажатием. */
@media (max-width:767px){
  :root{--section-y:40px}
  .section-head{margin-bottom:var(--sp-3)}
  .section-head h2{margin-bottom:var(--sp-1)}
  .section-cta{margin-top:var(--sp-3)}
  .more{margin-top:var(--sp-1)}

  /* Первый экран: заголовок, плитки и кнопка не меняются; портрет под ними ниже */
  .hero{padding-bottom:var(--sp-4)}
  .hero-facts{margin-top:var(--sp-3)}
  .hero-photo img{aspect-ratio:2/1;object-position:50% 22%}

  /* Цифры о себе: три числа в ряд */
  .stats-grid,.stats-grid--big{grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--sp-2)}
  .stats-grid--big .stat-num{flex-direction:column;align-items:flex-start;gap:0}
  .stats-grid--big .stat-num .value{font-size:var(--fs-h2)}
  .stat{gap:2px}

  /* Услуги: карточки плотнее */
  .tracks{gap:var(--sp-2)}
  .tracks--cards .track{padding:12px var(--sp-3);row-gap:0}
  .formats-line{margin-top:var(--sp-3)}
  .companies{padding-top:var(--sp-4)}

  /* Демо: карточка не выше экрана */
  .demo-card{gap:var(--sp-2);padding:12px}
  .demo-card .demo-actions{margin-top:var(--sp-2)}

  /* Кейсы: одна картинка компактно, вторая кнопкой с лупой и подписью; строки плотнее */
  .case{gap:var(--sp-2);padding:12px}
  .cl-text,.cl-gallery{gap:var(--sp-2)}
  .case-lines{gap:var(--sp-1)}
  .case-lines dd{line-height:1.45}
  .cl-steps{gap:var(--sp-1)}
  .cl-steps--2,.cl-steps--2:has(.cl-frame--art){grid-template-columns:minmax(0,1fr)}
  .cl-frame--img{height:170px}
  .cl-frame--art{max-height:210px;overflow:hidden}
  .cl-steps--2 > .cl-step + .cl-step,.cl-steps--2:has(.cl-frame--art) .cl-step + .cl-step{display:grid;grid-template-columns:44px minmax(0,1fr);align-items:center;gap:var(--sp-2)}
  .cl-steps--2 > .cl-step + .cl-step .cl-zoom{width:44px;height:44px;border-radius:50%;background:var(--c-accent-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231D4ED8' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='10.5' cy='10.5' r='6'/%3E%3Cpath d='M15 15l5 5M10.5 8v5M8 10.5h5'/%3E%3C/svg%3E") center/20px no-repeat}
  .cl-steps--2 > .cl-step + .cl-step .cl-frame{display:none}
  .cl-note{display:none}

  /* Пакеты: одна карточка, три строки «Шаг: цена», описание по нажатию */
  .ladder{gap:0;background:var(--c-surface);border:1px solid var(--c-rule);border-radius:var(--radius);box-shadow:var(--shadow-card);overflow:hidden}
  .rung,.rung-core{margin:0!important;padding:0;border:0;border-radius:0;box-shadow:none;min-height:0}
  .rung + .rung{border-top:1px solid var(--c-rule)}
  .rung-core{background:var(--c-accent-soft)}
  .rung-d > summary{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 12px;padding:12px var(--sp-3);min-height:52px;cursor:pointer;position:relative;padding-right:40px}
  .rung-d > summary::after{content:"";position:absolute;right:16px;top:50%;width:8px;height:8px;border-right:2px solid var(--c-accent);border-bottom:2px solid var(--c-accent);transform:translateY(-70%) rotate(45deg);transition:transform var(--t-fast)}
  .rung-d[open] > summary::after{transform:translateY(-30%) rotate(-135deg)}
  .rung-step{font-size:var(--fs-b);text-transform:none;letter-spacing:0;color:var(--c-heading)}
  .rung-price{font-size:var(--fs-b);color:var(--c-accent)}
  .rung-d > p{padding:0 var(--sp-3) 12px}

  /* Как я работаю: номер и название одной строкой, короткая строка; полный текст по нажатию на шаг */
  .timeline{gap:var(--sp-2)}
  .timeline .step{grid-template-columns:32px minmax(0,1fr);column-gap:var(--sp-2)}
  .timeline .step-num{width:32px;height:32px;font-size:var(--fs-s)}
  .timeline .step:not(:last-child)::before{left:15px;top:36px;bottom:calc(-1 * var(--sp-2))}
  .timeline .step-body h3{margin:2px 0 2px;font-size:var(--fs-b)}
  .timeline .step-body h3::after{content:"";display:inline-block;width:7px;height:7px;margin-left:8px;border-right:2px solid var(--c-accent);border-bottom:2px solid var(--c-accent);transform:translateY(-3px) rotate(45deg)}
  .timeline .step:has(.more[open]) .step-body h3::after{transform:translateY(0) rotate(-135deg)}
  .timeline .more{margin-top:0}
  .timeline .more:not([open]) summary{position:absolute;inset:0;min-height:44px;color:transparent;background:transparent;border-radius:10px;z-index:1}
  .timeline .more:not([open]) summary::after{display:none}
  .process-note{margin-top:var(--sp-3)}

  /* FAQ и контакт плотнее */
  .faq-list summary{padding:10px 0}
  .contact-grid{gap:var(--sp-3)}
  .contact-side{gap:var(--sp-2)}
  .contact-links{gap:0}
  .lead-off{padding:var(--sp-3);gap:var(--sp-2)}
  .footer{padding:var(--sp-4) 0}
  .footer .wrap{gap:0}
}
@media (max-width:767px){
  /* Услуги: «Что входит» открывается нажатием на карточку, отдельная строка-кнопка не нужна */
  .tracks--cards .track{position:relative}
  .tracks--cards .track h3::after{content:"";display:inline-block;width:7px;height:7px;margin-left:8px;border-right:2px solid var(--c-accent);border-bottom:2px solid var(--c-accent);transform:translateY(-3px) rotate(45deg)}
  .tracks--cards .track:has(.more[open]) h3::after{transform:translateY(0) rotate(-135deg)}
  .tracks--cards .track .more:not([open]) summary{position:absolute;inset:0;min-height:44px;color:transparent;background:transparent;border-radius:var(--radius);z-index:1}
  .tracks--cards .track .more:not([open]) summary::after{display:none}
  .tracks--cards .track .more{margin:0}
}
@media (max-width:767px){
  .cl-frame--art{align-content:start}
  .timeline .step{padding-bottom:0}
  .carousel-dots{gap:3px}
  .carousel-dots button{width:30px;height:30px}
  .carousel.is-ready .carousel-nav{gap:4px}
}
@media (max-width:420px){
  /* счётчик «1 / 6» дублирует кружки: на узком экране только для экранного диктора */
  .carousel-count{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
}
@media (max-width:767px){
  .demo-badge{padding:0 8px;border-radius:6px}
  #demo .section-cta .btn{font-size:var(--fs-s);padding:0 16px;width:100%}
  .cl-frame--art{max-height:180px}
  .cl-frame--img{height:160px}
  .hero-photo img{aspect-ratio:12/5}
}
@media (max-width:767px){
  :root{--section-y:36px}
  .companies{padding-top:var(--sp-3)}
  .companies .wrap{padding-top:var(--sp-3)}
}

/* Портрет на телефоне (03.10.2026, решение владельца по отзыву читателя): человек по пояс, голова целиком.
   Кадр 4:5 из того же файла, сверху срезается только пустой фон; стоит под кнопкой, первый экран не сдвигает */
@media (max-width:767px){
  .hero-photo{justify-self:center;width:min(64%,280px)}
  .hero-photo img{aspect-ratio:4/5;object-position:50% 85%}
}

/* Доступность (03.10.2026, пачка 1, пункт 6) */
/* Ссылка «К содержанию» появляется при фокусе с клавиатуры */
.skip-link:focus,.skip-link:focus-visible{position:fixed!important;left:12px;top:12px;width:auto;height:auto;margin:0;padding:10px 16px;clip:auto;overflow:visible;white-space:nowrap;z-index:100;background:var(--c-accent);color:var(--c-on-accent);border-radius:var(--radius-sm);font-weight:600;text-decoration:none}
/* Элемент в фокусе не прячется под плавающую кнопку и баннер на телефоне */
@media (max-width:899px){html{scroll-padding-bottom:96px}}
/* Цифры о себе в три колонки на телефоне: длинные слова переносятся, не залезают в соседнюю колонку */
@media (max-width:767px){.stats-grid--big .stat-label{hyphens:auto;-webkit-hyphens:auto;overflow-wrap:break-word;min-width:0}}
@media (max-width:767px){
  .stats-grid--big{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr) minmax(0,1fr)}
  .stats-grid--big .stat-label{font-size:var(--fs-s);line-height:1.4}
}
@media (max-width:767px){
  .stats-grid,.stats-grid--big{grid-template-columns:minmax(0,1fr);gap:var(--sp-2)}
  .stats-grid--big .stat{grid-template-columns:140px minmax(0,1fr);column-gap:12px;align-items:baseline}
  .stats-grid--big .stat-num{flex-direction:row;align-items:baseline;gap:6px;flex-wrap:nowrap}
  .stats-grid--big .stat-label{font-size:var(--fs-b);hyphens:manual}
}

/* ===== Тёмная тема по кнопке (04.10.2026, решение владельца; вариант Б из пробных страниц) =====
   Только переопределение переменных под html[data-theme="dark"], правила не дублируются.
   Первый экран и подвал темнее страницы и отделены границей. */
html[data-theme="dark"]{
  color-scheme:dark;
  --c-bg:#0B1220;
  --c-bg-alt:#0F1829;
  --c-surface:#152038;
  --c-text:#E6EAF2;
  --c-heading:#F4F6FA;
  --c-muted:#CBD5E1;
  --c-accent:#93C5FD;
  --c-accent-hover:#BFDBFE;
  --c-accent-soft:rgba(147,197,253,.14);
  --c-on-accent:#0B1220;
  --c-rule:#2C3C5E;
  --c-control:#8492AC;
  --c-focus:#BFDBFE;
  --c-gain:#4ADE80;
  --c-loss:#FCA5A5;
  --c-error:#FCA5A5;
  --c-header-bg:rgba(11,18,32,.95);
  --c-tint:rgba(147,197,253,.18);
  --c-on-tint:#DBEAFE;
  --c-tint-gain:rgba(74,222,128,.16);
  --c-on-tint-gain:#BBF7D0;
  --c-tint-loss:rgba(252,165,165,.16);
  --c-on-tint-loss:#FECACA;
  --d-bg:#060A14;
  --shadow-card:0 0 0 1px #2C3C5E,0 8px 24px rgba(0,0,0,.35);
  --shadow-lift:0 0 0 1px #3B4D73,0 16px 40px rgba(0,0,0,.45);
}
html[data-theme="dark"] .card,html[data-theme="dark"] .tracks--cards .track,html[data-theme="dark"] .rung,html[data-theme="dark"] .ladder{border-color:#2C3C5E}
html[data-theme="dark"] .hero,html[data-theme="dark"] .footer{border:1px solid #24324F}
html[data-theme="dark"] .hero{border-top:0}
html[data-theme="dark"] .cl-frame--img{border-color:#334155}
html[data-theme="dark"] .cookie{box-shadow:0 -8px 24px rgba(0,0,0,.5)}

/* Кнопка темы: значок луны в светлой теме, солнца в тёмной; без JS скрыта */
.theme-toggle{display:none;align-items:center;justify-content:center;width:44px;height:44px;flex:none;padding:0;border-radius:50%;border:1px solid var(--c-control);background:transparent;color:var(--c-heading);cursor:pointer}
.theme-js .theme-toggle{display:inline-flex}
.theme-toggle:hover{border-color:var(--c-accent);color:var(--c-accent)}
.theme-toggle svg{width:22px;height:22px}
.theme-toggle .ico-sun{display:none}
html[data-theme="dark"] .theme-toggle .ico-sun{display:block}
html[data-theme="dark"] .theme-toggle .ico-moon{display:none}
.site-header .wrap{gap:var(--sp-2)}
.site-header .theme-toggle{margin-left:auto}
.site-header .header-actions .theme-toggle{margin-left:0}
@media (min-width:900px){.site-header .header-cta + .theme-toggle{margin-left:0}}
.header-actions{display:inline-flex;align-items:center;gap:var(--sp-2)}
@media (min-width:900px){
  .site-header .wrap{justify-content:flex-start}
  .site-header .nav{margin-left:auto}
}

/* Телефон: строка «Начинаем с бесплатного разбора…» на первом экране вместе с главной кнопкой (пачка 2, пункт 4) */
@media (max-width:639px){
  .eyebrow-role{display:none}
  .hero .cta{gap:var(--sp-1) var(--sp-2)}
  .hero{padding-top:var(--sp-2)}
  .hero .asks-title{margin-top:var(--sp-2)}
  .hero .asks{gap:6px}
  .hero .asks a{padding:8px 12px}
  .hero .cta{margin-top:var(--sp-2)}
  .hero .cta .cta-note{order:0;margin:2px 0 0;line-height:1.4}
  .hero .cta .btn-secondary{width:auto;min-height:44px;padding:0;border:0;background:none;color:var(--d-accent);text-decoration:underline;text-underline-offset:3px}
}
/* Телефон: карточка кейса 1 начинается с заголовка, картинка после текста (пачка 2, пункт 4) */
@media (max-width:899px){
  .case.case-live--1 .cl-gallery{order:0}
}
.site-header .header-actions{margin-left:auto}
@media (max-width:639px){
  .site-header:has(.header-actions) .brand-role{display:none}
  .header-actions .btn-link{white-space:nowrap}
}

/* Команда (решение владельца 09.10.2026): второй слой под услугами, без кнопки и цены */
.team{margin-top:var(--sp-5);padding:var(--sp-5);display:grid;gap:var(--sp-4);border-left:4px solid var(--c-accent)}
.team-head{display:grid;gap:var(--sp-3);align-items:center}
.team-num{margin:0;font-size:3rem;line-height:1;font-weight:700;color:var(--c-accent);display:grid;gap:6px}
.team-num span{font-size:var(--fs-s);font-weight:600;line-height:1.3;color:var(--c-muted)}
.team h3{margin:0}
.team-lead{margin:var(--sp-1) 0 0;color:var(--c-muted)}
.team-list{list-style:none;margin:0;padding:0;display:grid;gap:var(--sp-3)}
.team-list li{display:grid;gap:4px;align-content:start;padding-top:var(--sp-2);border-top:1px solid var(--c-rule)}
.team-list b{color:var(--c-heading)}
.team-list span{color:var(--c-muted)}
@media (min-width:640px){
  .team-head{grid-template-columns:auto minmax(0,1fr);gap:var(--sp-4)}
  .team-num span{max-width:9em}
  .team-list{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--sp-5)}
}
@media (max-width:639px){
  .team{padding:var(--sp-3);gap:var(--sp-2)}
  .team-num{display:none}
  .team-list{gap:var(--sp-2)}
  .team-list li{display:block;padding-top:var(--sp-2)}
  .team-list b::after{content:". "}
}

/* Свёрнутые блоки: демо и пример процесса (решение владельца 09.10.2026) */
.fold{margin-top:var(--sp-4)}
.fold > summary{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 18px;cursor:pointer;list-style:none;font-size:var(--fs-b);font-weight:600;color:var(--c-accent);border:1px solid var(--c-rule);border-radius:999px;background:var(--c-surface)}
.fold > summary::-webkit-details-marker{display:none}
.fold > summary::after{content:"";width:9px;height:9px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-2px) rotate(45deg)}
.fold[open] > summary::after{transform:translateY(2px) rotate(-135deg)}
.fold[open] > summary{margin-bottom:var(--sp-4)}
.fold-lead{color:var(--c-muted);max-width:var(--measure);margin-bottom:var(--sp-4)}
.fold .timeline{max-width:var(--measure)}
.fold .process-note{margin-top:var(--sp-4);max-width:var(--measure)}