@charset "UTF-8";
/* ==========================================================================
   V Международная конференция случаев МИГ · 29–30 января 2027
   Брейкпоинты: десктоп ≥1200 · планшет 768–1199 · телефон <768
   Кегль нигде не опускается ниже 18px — правило владелицы.
   ========================================================================== */

:root{
  --grunt:#050505;
  --plita:#0E0E0E;
  --plita-2:#141414;
  --ramka:#1E1E1E;
  --ramka-2:#242424;

  --bel:#FFFFFF;
  --sery:#B2B2B2;
  --sery-2:#9A9A9A;
  --sery-3:#7E7E7E;

  --malina:#FE0469;
  --golub:#00C2FF;
  --oranzh:#FF8F28;

  --gradient:linear-gradient(90deg,#F60462 0%,#FB7C28 100%);
  --gradient-shapka:linear-gradient(90deg,#F61268 0%,#FB901D 100%);

  --polosa:1408px;
  --pole:clamp(20px, 3.63vw + 8.4px, 64px);

  --zag:clamp(32px, 3.40vw + 19.8px, 72px);   --zag-lh:1.08;
  --zag-2:clamp(26px, 1.19vw + 21.7px, 40px); --zag-2-lh:1.2;
  --zag-3:clamp(22px, 0.34vw + 20.8px, 26px); --zag-3-lh:1.3;
  --tekst:clamp(18px, 0.17vw + 17.4px, 20px); --tekst-lh:1.5;
  --melko:18px; --melko-lh:1.45;

  --radius:24px;
  --radius-s:20px;

  --shapka-h:85px;
}

/* Ссылка меню прокручивает раздел к верху окна, а там стоит липкая шапка —
   без этого отступа её высота съедала заголовок раздела. */
[id]{scroll-margin-top:calc(var(--shapka-h) + 18px)}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}

*,*::before,*::after{box-sizing:border-box}

html{-webkit-text-size-adjust:100%}

/* Русские слова длиннее своей колонки: «Обсессивно-компульсивное»,
   «Терапевты-докладчики», «ВЕРТИКАЛЕЙ.». Сначала пробуем перенос по слогам,
   если словаря нет — рвём по букве, но не оставляем под обрезом. */
body{overflow-wrap:break-word}
/* Браузер больше не рвёт слова сам: «под-ряд», «тера-пии», «пригла-шённый»
   — это всё была автоматическая расстановка. Правило владелицы: слово
   переносится целиком. Ручной мягкий перенос (manual) остаётся доступным
   там, где мы ставим его сознательно. */
.h1,.h2,.h3,h1,h2,h3,h4,p,li,cite,blockquote,b,i,u{hyphens:manual;-webkit-hyphens:manual}

body{
  margin:0;
  background:var(--grunt);
  color:var(--bel);
  font-family:'Onest','Golos Text',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  font-size:var(--tekst);
  line-height:var(--tekst-lh);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
}

img{max-width:100%;display:block;border:0}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
ul{margin:0;padding:0;list-style:none}
h1,h2,h3,h4,p{margin:0}

:focus-visible{outline:2px solid var(--golub);outline-offset:3px}

/* Поля полосы учитывают вырез экрана: в альбомной ориентации iPhone
   отдаёт под «чёлку» и скруглённый угол по 44–59 px слева или справа,
   и без этого текст подходил бы под них вплотную. На экранах без выреза
   env() отдаёт ноль, и поле остаётся прежним. Для этого в <head>
   прописано viewport-fit=cover — без него env() всегда ноль. */
.v{
  width:100%;
  max-width:calc(var(--polosa) + var(--pole) * 2 +
                 env(safe-area-inset-left) + env(safe-area-inset-right));
  margin:0 auto;
  padding-left:calc(var(--pole) + env(safe-area-inset-left));
  padding-right:calc(var(--pole) + env(safe-area-inset-right));
}

.s{position:relative;overflow:hidden}

/* ---------- типографика ---------- */
.nad{
  display:block;
  font-family:'Golos Text',sans-serif;
  font-weight:500;
  font-size:var(--melko);
  line-height:22px;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--sery-3);
}
.h1,.h2{
  font-family:'Golos Text',sans-serif;
  font-weight:900;
  font-size:var(--zag);
  line-height:var(--zag-lh);
  letter-spacing:-.01em;
  text-transform:uppercase;
  text-wrap:balance;
}
.h3{
  font-family:'Golos Text',sans-serif;
  font-weight:700;
  font-size:var(--zag-3);
  line-height:var(--zag-3-lh);
}
.lid{
  font-size:var(--tekst);
  line-height:var(--tekst-lh);
  color:var(--sery);
  max-width:780px;
}
.m{font-size:var(--melko);line-height:var(--melko-lh)}
.cv-m{color:var(--malina)}
.cv-s{color:var(--golub)}
.cv-o{color:var(--oranzh)}

/* ---------- кнопки ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  min-height:69px;
  padding:0 34px;
  border-radius:999px;
  font-family:'Golos Text',sans-serif;
  font-weight:600;
  font-size:var(--melko);
  line-height:1;
  background:var(--gradient);
  color:var(--bel);
  transition:transform .18s ease,box-shadow .18s ease;
}
.btn:hover{transform:translateY(-2px);box-shadow:0 0 34px rgba(255,10,102,.38)}
.btn:active{transform:translateY(0)}
.btn--k{background:none;border:1.4px solid #2FB8E8;color:#4FC8F0}
.btn--k:hover{border-color:#4FC8F0;box-shadow:none}
.shapka__btn{min-height:51px;padding:0 24px;background:var(--gradient-shapka)}

/* неоновая кнопка тарифа: ядро светлее, свечение двумя слоями */
.neon{
  position:relative;
  display:flex;
  align-items:center;
  width:100%;
  height:68px;
  border-radius:34px;
  color:#050505;
  font-family:'Golos Text',sans-serif;
  font-weight:600;
  font-size:clamp(18px, 0.34vw + 16.8px, 22px);
  transition:transform .18s ease;
}
.neon span{flex:1;text-align:center;padding-right:52px}
.neon i{
  position:absolute;right:8px;top:8px;
  width:52px;height:52px;border-radius:50%;
  background:#050505;
  display:flex;align-items:center;justify-content:center;
}
.neon i svg{width:19px;height:18px}
.neon:hover{transform:translateY(-2px)}
.neon--m{background:radial-gradient(ellipse at 50% 50%,#FE63A2 0%,#FE4B93 38%,#FE0469 72%,#E5045F 100%);
  box-shadow:0 0 22px rgba(254,4,105,.6),0 0 52px rgba(254,4,105,.34)}
.neon--s{background:radial-gradient(ellipse at 50% 50%,#61D9FF 0%,#4DD2FF 38%,#00C2FF 72%,#00AFE6 100%);
  box-shadow:0 0 22px rgba(0,194,255,.6),0 0 52px rgba(0,194,255,.34)}
.neon--o{background:radial-gradient(ellipse at 50% 50%,#FFBA7A 0%,#FFAC62 38%,#FF8F28 72%,#E68124 100%);
  box-shadow:0 0 22px rgba(255,143,40,.6),0 0 52px rgba(255,143,40,.34)}
.neon--m i svg{stroke:#FE0469}
.neon--s i svg{stroke:#00C2FF}
.neon--o i svg{stroke:#FF8F28}

/* ---------- серый паттерн ---------- */
.pole-pat{position:relative}
.pole-pat::before{
  content:"";
  position:absolute;inset:0;
  background-image:url('../img/pattern-stroy.svg');
  background-repeat:repeat;
  background-size:456px 456px;
  opacity:.55;
  pointer-events:none;
  z-index:0;
}
.pole-pat > *{position:relative;z-index:1}

/* ==========================================================================
   ШАПКА
   ========================================================================== */
.shapka{
  position:sticky;top:0;z-index:60;
  background:rgba(5,5,5,.86);
  backdrop-filter:saturate(140%) blur(14px);
  -webkit-backdrop-filter:saturate(140%) blur(14px);
  border-bottom:1px solid rgba(255,255,255,.06);
}
.shapka .v{display:flex;align-items:center;gap:28px;min-height:84px}
.shapka__logo{display:flex;align-items:center;gap:12px;flex:0 1 auto;min-width:0}
.shapka__logo img{height:34px;width:auto}
.shapka__nav{display:flex;gap:26px;margin-left:18px;flex:1}
.shapka__nav a{font-size:var(--melko);color:var(--sery);transition:color .15s}
.shapka__nav a:hover{color:var(--bel)}
.shapka__yaz{display:flex;gap:10px;font-size:var(--melko);color:var(--sery-3)}
.shapka__yaz b{color:var(--bel);font-weight:500}
.burger{display:none;flex:0 0 44px;width:44px;height:44px;margin-left:auto;
  align-items:center;justify-content:center}
.burger span{display:block;width:22px;height:2px;background:var(--bel);position:relative}
.burger span::before,.burger span::after{content:"";position:absolute;left:0;width:22px;height:2px;background:var(--bel)}
.burger span::before{top:-7px}
.burger span::after{top:7px}

.shapka.menyu .shapka__nav{
  display:flex;position:absolute;top:100%;left:0;right:0;
  flex-direction:column;gap:0;margin:0;
  background:var(--plita);padding:6px 0 10px;
  border-bottom:1px solid var(--ramka);
}
.shapka.menyu .shapka__nav a{
  display:block;padding:13px var(--pole);
  font-size:var(--melko);line-height:24px;color:var(--bel);
}
.shapka.menyu .shapka__nav a:hover{background:var(--plita-2)}

/* ==========================================================================
   01 · ПЕРВЫЙ ЭКРАН
   ========================================================================== */
.geroy{padding:0 0 32px;min-height:0}
.geroy .v{position:relative;z-index:2}
.geroy__foto{
  position:absolute;right:0;top:0;
  width:64%;height:660px;
  border-radius:0 0 0 40px;
  overflow:hidden;
  z-index:0;
}
.geroy__foto img{width:100%;height:100%;object-fit:cover}
.geroy__foto::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,#050505 0%,rgba(5,5,5,.86) 26%,rgba(5,5,5,0) 62%),
             linear-gradient(0deg,#050505 0%,rgba(5,5,5,0) 38%);
}
.dekor{position:absolute;pointer-events:none;mix-blend-mode:screen;z-index:1}
.dekor--kolca{right:16%;top:-130px;width:420px}
.dekor--dugi{right:-60px;bottom:-40px;width:300px}
.dekor--krest{right:3%;top:176px;width:140px;mix-blend-mode:normal}
.dekor--krest2{display:none;mix-blend-mode:normal}

/* Надзаголовок вынесен из текстовой колонки отдельным блоком перед фото:
   на телефоне он должен стоять НАД снимком, а место под снимком занимает
   название (Тина 01.11). На десктопе фото абсолютное, поэтому вынос
   ничего не двигает — отступ 40 просто переехал на него. */
.geroy__nadpis{position:relative;z-index:2;padding-top:40px}
.geroy__nadpis .nad{max-width:640px}
.geroy__t{position:relative;display:flow-root;max-width:640px}
.geroy h1{margin:22px 0 0}
.geroy__lid{margin-top:26px;max-width:520px;color:var(--sery)}
.geroy__data{
  position:absolute;left:560px;top:130px;
  padding-left:26px;border-left:1px solid var(--ramka-2);
  font-family:'Golos Text',sans-serif;font-weight:700;
}
/* Обёртка нужна только телефону, на десктопе она прозрачна для раскладки */
.geroy__data-niz{display:contents}
.geroy__data b{display:block;font-size:clamp(26px, 0.68vw + 23.6px, 34px);line-height:1.06;text-transform:uppercase}
.geroy__data i{display:block;margin-top:4px;font-size:clamp(20px, 0.51vw + 18.2px, 26px);font-style:normal;color:var(--sery-2)}
.geroy__data u{display:flex;align-items:center;gap:10px;margin-top:16px;padding-top:14px;
  border-top:1px solid var(--ramka-2);text-decoration:none;font-size:var(--melko);
  font-weight:500;letter-spacing:.1em;color:var(--sery)}
.geroy__data u::before{content:"";width:12px;height:12px;border-radius:50%;background:var(--malina)}
.geroy__knopki{display:flex;gap:20px;margin-top:28px;flex-wrap:wrap}
.cifry{display:flex;gap:0;margin-top:30px;border-top:1px solid var(--ramka-2);padding-top:20px}
.cifry li{flex:1;padding-right:24px;border-right:1px solid var(--ramka-2)}
.cifry li:last-child{border-right:0}
.cifry b{display:block;font-family:'Golos Text',sans-serif;font-weight:900;font-size:clamp(32px, 1.02vw + 28.3px, 44px);line-height:1.09}
.cifry span{display:block;margin-top:6px;font-size:var(--melko);line-height:24px;color:var(--sery-2)}
.melkoj{display:flex;gap:32px;flex-wrap:wrap;margin-top:18px;font-size:var(--melko);color:var(--sery-3)}
.melkoj li{display:flex;align-items:flex-start;gap:9px;max-width:420px}
.melkoj li::before{content:"";flex:0 0 5px;width:5px;height:5px;margin-top:11px;
  border-radius:50%;background:var(--sery-3)}

/* ==========================================================================
   02 · ГОЛОСА
   ========================================================================== */
.golosa{padding:0;min-height:0}
.golosa .v{position:relative;z-index:2;padding-top:36px;padding-bottom:34px}
.golosa__skulptura{position:absolute;left:-60px;top:90px;width:430px;z-index:0;opacity:.95}
.golosa__proem{position:absolute;right:0;top:0;width:330px;z-index:0}
.golosa__kolca{position:absolute;right:-40px;top:-40px;width:720px;z-index:1;mix-blend-mode:screen;opacity:.9}
.golosa__otr{position:absolute;left:0;right:0;bottom:0;width:100%;z-index:0;opacity:.8}
.golosa__nad{position:relative;z-index:3}
.golosa__citata{
  position:relative;z-index:3;
  max-width:720px;margin:40px 0 0 300px;
  font-family:'Golos Text',sans-serif;font-weight:400;
  font-size:clamp(22px, 1.36vw + 17.1px, 38px);line-height:1.32;
}
/* Кавычки — пара, обе розовые, фраза внутри них (Тина 02.11: «отдельно розовые
   кавычки в начале, а белые в конце — это не красиво»). Раньше открывающая
   была отдельным знаком в 72 px, а закрывающая сидела в тексте обычной белой. */
.golosa__citata .kav{
  color:var(--malina);font-weight:400;
  font-family:Gelasio,Georgia,'Times New Roman',serif;
  font-size:1.62em;line-height:0;vertical-align:-.24em;
}
.golosa__citata .kav:first-child{margin-right:.02em}
.golosa__citata .kav:last-child{margin-left:.04em}
.golosa__citata em{font-style:italic;color:var(--malina)}
.golosa__niz{position:relative;z-index:3;display:flex;align-items:flex-end;gap:48px;margin-top:44px;flex-wrap:wrap}
.golosa__pod{max-width:470px}
.golosa__pod h3{margin-bottom:14px}
.golosa__pod p{font-size:var(--melko);line-height:25px;color:var(--sery-2)}
.golosa__ssylka{display:flex;align-items:center;gap:16px;font-family:'Golos Text',sans-serif;
  font-weight:500;font-size:var(--melko);letter-spacing:.1em;text-transform:uppercase}
/* круг 61 — размер из макета, узел 243:22 */
.golosa__ssylka i{width:61px;height:61px;border-radius:50%;border:1px solid var(--ramka-2);
  display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.golosa__avtor{margin-left:auto;width:min(284px, 100%);min-width:0;text-align:center}
/* Портрет по макету (узлы 256:5 и 243:8): чёрно-белая вырезка в кольце
   284, фигура 180×258 — это 63,4 % ширины кольца, верх на 14,1 %,
   низ растворяется в чёрном. Было: цветной снимок, жёстко обрезанный
   в круг 170. Доли, а не пиксели, чтобы кольцо ужималось на телефоне. */
.golosa__krug{position:relative;width:100%;aspect-ratio:1;
  border-radius:50%;border:1px solid rgba(254,4,105,.5);margin:0 auto 16px}
.golosa__krug img{position:absolute;left:50%;translate:-50% 0;top:14.1%;
  width:63.4%;height:auto;
  -webkit-mask-image:linear-gradient(180deg,#000 56%,rgba(0,0,0,0) 100%);
          mask-image:linear-gradient(180deg,#000 56%,rgba(0,0,0,0) 100%)}
.golosa__avtor b{display:block;font-family:'Golos Text',sans-serif;font-weight:700;
  font-size:var(--melko);letter-spacing:.08em;text-transform:uppercase;color:var(--malina)}
.golosa__avtor span{display:block;margin-top:4px;font-size:var(--melko);color:var(--sery-2)}

/* ==========================================================================
   02Б · МНЕНИЯ КОЛЛЕГ (раскрывается кнопкой «Читать мнения коллег»)
   ========================================================================== */
.mneniya{display:none;padding:0 0 56px}
.mneniya.otkryt{display:block}
.mneniya h2{margin-bottom:32px}
.mneniya__setka{align-items:stretch}
.mnenie{display:flex;flex-direction:column;margin:0;padding:30px;
  background:var(--plita);border:1px solid var(--ramka);border-radius:var(--radius)}
.mnenie blockquote{flex:1;margin:0;font-size:var(--tekst);line-height:30px;color:#E6E6E6}
.mnenie figcaption{margin-top:26px;padding-top:20px;border-top:1px solid var(--ramka)}
.mnenie figcaption b{display:block;font-family:'Golos Text',sans-serif;font-weight:700;
  font-size:var(--melko);letter-spacing:.06em;text-transform:uppercase;color:var(--malina)}
.mnenie figcaption span{display:block;margin-top:5px;font-size:var(--melko);
  line-height:24px;color:var(--sery-2)}
.mnenie--o figcaption b{color:var(--golub)}
.golosa__ssylka{cursor:pointer;text-align:left}
.golosa__ssylka i{transition:transform .2s ease}
[data-mneniya][aria-expanded="true"] i{transform:rotate(90deg)}

/* ==========================================================================
   03 · ШЕСТЬ СЛУЧАЕВ
   ========================================================================== */
.sluchai{padding:56px 0 64px}
.sluchai__shapka{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;flex-wrap:wrap}
/* Строка дня по макету (272:9–272:11): название 22/Bold белым, тонкая линия
   во всю оставшуюся ширину и счёт дня справа серым 18/Medium. */
.den{display:flex;align-items:center;gap:24px;margin:36px 0 20px}
.den b{font-family:'Golos Text',sans-serif;font-weight:700;font-size:22px;
  letter-spacing:.4px;text-transform:uppercase;color:#fff}
.den i{flex:1;height:1px;background:#2A2A2A}
.den span{font-size:var(--melko);font-weight:500;letter-spacing:1.6px;
  text-transform:uppercase;color:#8A8A8A;white-space:nowrap}
.setka-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}

/* Карточка случая — по паспорту макета (фрейм 03, карточка 392×336):
   поля 36, радиус 20, номер 36/40 сверху на 28, название 30/34 на 108,
   лента спектра 76×5 на 190, докладчик на 212, модератор на 236,
   выемка 106×106 в углу, кнопка 68×68 с отступом 6 от края карточки.
   Те же числа работают и на телефоне: владелица просила одинаковые. */
.sluchay{
  position:relative;
  min-height:336px;
  border-radius:20px;
  padding:28px 36px 36px;
  background:var(--plita);
  border:1px solid #2A2A2A;
  overflow:hidden;
}
/* Широкая карточка: 580 против 392 в макете. Первая в первом дне,
   последняя во втором. Доли колонок взяты из макета напрямую. */
.sluchai__setka--d1{grid-template-columns:580fr 392fr 392fr}
.sluchai__setka--d2{grid-template-columns:392fr 392fr 580fr}
/* «Планета» — радиальный круг 300×300 в точке 430,76 карточки 580×336,
   он вылезает за край и обрезается карточкой. Три стопы из макета. */
.sluchay__planeta{position:absolute;right:-150px;bottom:-40px;width:300px;height:300px;
  border-radius:50%;pointer-events:none}
.sluchay--m .sluchay__planeta{background:radial-gradient(circle,
  rgba(142,2,57,.55) 0%, rgba(142,2,57,.26) 62%, rgba(142,2,57,0) 100%)}
.sluchay--o .sluchay__planeta{background:radial-gradient(circle,
  rgba(201,106,14,.55) 0%, rgba(201,106,14,.26) 62%, rgba(201,106,14,0) 100%)}
.sluchay--s .sluchay__planeta{background:radial-gradient(circle,
  rgba(5,70,100,.55) 0%, rgba(5,70,100,.26) 62%, rgba(5,70,100,0) 100%)}
/* У цветных карточек в макете рамки нет (узел 272:15 — обводка пустая).
   Прозрачная вместо цветной: коробка не меняется, но вдоль выемки
   больше не рисуется цветная линия. */
/* Карточка обрезает содержимое по внутреннему краю рамки, поэтому выемка
   не могла накрыть сам ободок, и вдоль неё оставалась цветная линия.
   В макете у цветных карточек рамки нет вовсе — убираем её целиком;
   размер коробки не меняется, box-sizing border-box. */
.sluchay--m{background:var(--malina);border:0;color:#1A000B}
.sluchay--s{background:#2EB0E0;border:0;color:#052130}
.sluchay--o{background:var(--oranzh);border:0;color:#2A1402}
.sluchay__nomer{font-family:'Golos Text',sans-serif;font-weight:900;font-size:36px;line-height:40px}
.sluchay:not([class*="sluchay--"]) .sluchay__nomer{color:var(--sery-2)}
.sluchay__data{position:absolute;right:36px;top:30px;
  display:flex;align-items:center;justify-content:center;
  width:128px;height:40px;border-radius:20px;
  background:#000;font-size:var(--melko);font-weight:500;line-height:1}
.sluchay--m .sluchay__data{color:var(--malina)}
.sluchay--s .sluchay__data{color:#2EB0E0}
.sluchay--o .sluchay__data{color:var(--oranzh)}
.sluchay:not([class*="sluchay--"]) .sluchay__data{background:none;border:1px solid #2A2A2A;color:var(--sery-2)}
.sluchay__nazv{margin-top:40px;font-family:'Golos Text',sans-serif;font-weight:900;
  font-size:clamp(22px, 0.68vw + 19.6px, 30px);line-height:1.14;text-transform:uppercase}
.sluchay__raduga{width:76px;height:5px;margin:48px 0 17px;border-radius:3px;
  background:linear-gradient(90deg,#00C2FF 0%,#FE0469 50%,#FF8F28 100%)}
/* последний абзац обходит выемку: в макете строки короткие и под неё
   не заходят, на телефоне фамилия модератора переносится */
/* Выемка 107 шириной стоит у края карточки, а поле карточки 36 —
   значит в текст она заходит ровно на 71 px, а не на 104, как я резервировал.
   Отступ нужен всему блоку: при системном увеличении шрифта строки
   спускаются в полосу выемки, и имя терапевта тоже уходило под кнопку. */
.sluchay__kto{padding-right:74px;font-size:var(--melko);line-height:22px}
.sluchay__kto b{display:block;font-weight:600}
.sluchay__kto span{display:block;margin-top:2px;line-height:24px}
.sluchay:not([class*="sluchay--"]) .sluchay__kto span{color:var(--sery-2)}
/* Выпуск 2 px и радиус на те же 2 больше радиуса карточки — иначе
   по скруглению угла остаётся серп от края карточки. */
.sluchay__vyemka{position:absolute;right:-2px;bottom:-2px;width:108px;height:108px;
  background:var(--grunt);border-top-left-radius:30px;border-bottom-right-radius:22px}
.sluchay:not([class*="sluchay--"]) .sluchay__vyemka{
  border-top:1px solid #2A2A2A;border-left:1px solid #2A2A2A}
/* Вырез добавляет прямоугольнику не один угол, а три: внутренний и два
   внешних — там, где вырез выходит на край карточки (Тина 02.11: «было 4,
   а стало 6, и у этих углов не скруглённые концы»). Внутренний скругляла
   сама выемка, внешние оставались острыми. В десктопном чистовике выемка
   нарисована вектором, и там скруглены все три (узел 296:2, радиус 20).
   Здесь внешние делаются радиальным градиентом: внутри круга прозрачно —
   видно карточку, снаружи грунт. У карточек с обводкой по дуге идёт
   та же линия в 1 px, иначе рамка обрывалась бы на повороте. */
.sluchay{--ug:20px}
.sluchay__vyemka::before,.sluchay__vyemka::after{
  content:"";position:absolute;width:var(--ug);height:var(--ug);
  background:radial-gradient(circle at 0 0,
    rgba(5,5,5,0) calc(var(--ug) - .5px), var(--grunt) var(--ug))}
.sluchay__vyemka::before{right:2px;top:calc(var(--ug) * -1)}
.sluchay__vyemka::after{left:calc(var(--ug) * -1);bottom:2px}
.sluchay:not([class*="sluchay--"]) .sluchay__vyemka::before,
.sluchay:not([class*="sluchay--"]) .sluchay__vyemka::after{
  background:radial-gradient(circle at 0 0,
    rgba(5,5,5,0) calc(var(--ug) - 1px), #2A2A2A calc(var(--ug) - 1px),
    #2A2A2A var(--ug), var(--grunt) var(--ug))}
.sluchay:not([class*="sluchay--"]) .sluchay__vyemka::before{right:1px}
.sluchay:not([class*="sluchay--"]) .sluchay__vyemka::after{bottom:1px}
.sluchay__knopka{position:absolute;right:6px;bottom:6px;width:68px;height:68px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;transition:transform .2s ease}
.sluchay__knopka:hover{transform:scale(1.06)}
.sluchay.otkryt .sluchay__knopka{transform:rotate(180deg)}
.sluchay.otkryt .sluchay__knopka:hover{transform:rotate(180deg) scale(1.06)}
.sluchay__knopka svg{width:18px;height:18px}
/* Цвет кнопки кодирует день: первый день голубой, второй малиновый. */
.sluchay__knopka{background:#2EB0E0}
.sluchay__knopka svg{stroke:#050505}
.sluchay[data-niz="1"] .sluchay__knopka{background:var(--malina)}
.sluchay[data-niz="1"] .sluchay__knopka svg{stroke:#fff}

.sluchay__raskryt{display:none;margin-top:28px;padding-top:26px;border-top:1px solid rgba(255,255,255,.14)}
.sluchay--m .sluchay__raskryt,.sluchay--s .sluchay__raskryt,.sluchay--o .sluchay__raskryt{
  border-top-color:rgba(5,5,5,.28)}
.sluchay.otkryt .sluchay__raskryt{display:block}
/* Выемка с кнопкой 107×107 сидит в нижнем правом углу и при раскрытии
   наезжала на последние строки списка. Освобождаем под неё место:
   107 высоты выемки минус 36 нижнего поля карточки, плюс воздух. */
.sluchay.otkryt .sluchay__raskryt{padding-bottom:80px}
.sluchay__raskryt p{font-size:var(--melko);line-height:26px}
.sluchay__raskryt h4{margin:22px 0 10px;font-family:'Golos Text',sans-serif;font-weight:700;font-size:var(--melko);
  letter-spacing:.08em;text-transform:uppercase}
.sluchay__raskryt li{position:relative;padding-left:18px;margin-bottom:8px;font-size:var(--melko);line-height:25px}
.sluchay__raskryt li::before{content:"";position:absolute;left:0;top:10px;width:6px;height:6px;border-radius:50%;
  background:currentColor;opacity:.6}

/* ==========================================================================
   03Б · КНОПКА «КАК УСТРОЕНА ВЕРТИКАЛЬ»
   ========================================================================== */
.vert-knopka{padding:0 0 10px;text-align:center;border-top:1px solid var(--ramka)}
.vert-knopka .nad{margin-top:56px}
.vert-knopka h2{margin:18px 0 0;font-size:clamp(26px, 1.19vw + 21.7px, 40px);line-height:1.16}
.vert-knopka__btn{
  position:relative;display:inline-flex;align-items:center;justify-content:center;
  width:560px;max-width:100%;height:72px;margin:34px 0 0;border-radius:36px;
  background:var(--gradient);box-shadow:0 0 34px rgba(255,10,102,.34);
  font-family:'Golos Text',sans-serif;font-weight:600;font-size:clamp(18px, 0.34vw + 16.8px, 22px);color:var(--bel);
}
.vert-knopka__btn i{position:absolute;right:12px;top:12px;width:48px;height:48px;border-radius:50%;
  background:var(--plita);display:flex;align-items:center;justify-content:center;transition:transform .2s}
.vert-knopka__btn[aria-expanded="true"] i{transform:rotate(180deg)}
.vert-knopka__pod{margin:26px 0 56px;font-size:var(--melko);color:var(--sery-3)}

/* ==========================================================================
   04 · КАК УСТРОЕНА ВЕРТИКАЛЬ
   ========================================================================== */
.vert{display:none;padding:0 0 64px}
.vert.otkryt{display:block}
.vert__verh{position:relative;min-height:600px}
.vert__skulptura{position:absolute;right:0;top:0;width:55%;z-index:0;border-radius:0 0 0 32px;overflow:hidden}
.vert__skulptura::after{content:"";position:absolute;inset:0;
  background:linear-gradient(90deg,#050505 0%,rgba(5,5,5,.8) 22%,rgba(5,5,5,0) 58%)}
.vert__t{position:relative;z-index:2;max-width:620px;padding-top:60px}
.vert__t h2{margin:20px 0 0;font-size:clamp(28px, 2.38vw + 19.4px, 56px);line-height:1.1}
.vert__t .lid{margin-top:26px}
/* Номера вертикалей над арками. Левая координата — доля ширины снимка,
   посчитанная по центрам арок, поэтому они держатся при любом размере. */
.vert__nomera{position:relative;height:28px;margin:40px 0 10px}
.vert__nomera span{position:absolute;top:0;translate:-50% 0;
  font-family:'Golos Text',sans-serif;font-weight:900;font-size:20px;line-height:28px;
  letter-spacing:.04em;color:var(--sery-3)}
/* ── Подписи внутри арок. Положение и кегли — из макета, который
   владелица поправила сама; доли считаются от снимка 1536 × 658.
   Контейнер объявлен размерной единицей (container-type), и ВСЁ внутри
   задано в cqw — долях его собственной ширины: кегль, интерлиньяж,
   разрядка. Поэтому подпись не может разъехаться с колоннами ни при
   каком размере окна и ни при каком зуме — она меряется той же
   линейкой, что и фотография. Требование Тины 02.11:
   «уменьшить или увеличить окно браузера — текст всё равно на месте».

   Это единственное место в проекте, где нужны container queries:
   vw тут не годится, потому что полоса контента ограничена max-width
   и на широком экране перестаёт расти вместе с окном. */
/* Номера над аркадой и подписи внутри неё — две формы одного и того же,
   и переключаются они по одной границе. Поэтому обе лежат в одном
   размерном контейнере: иначе порог «по окну» и порог «по ширине
   снимка» разошлись бы, и на нескольких пикселях ширины было бы видно
   сразу и то и другое. */
.vert__arki{container-type:inline-size}
.vert__arkada{position:relative;margin:0;border-radius:var(--radius);overflow:hidden}
.vert__arkada img{display:block;width:100%;height:auto}
.vert__nomer,.vert__nazv,.vert__zalnom{position:absolute;display:none;
  translate:-50% 0;text-align:center;width:14%;pointer-events:none;
  font-style:normal;text-decoration:none}
.vert__nomer{top:1.824%;font-family:'Golos Text',sans-serif;font-weight:900;
  font-size:2.604cqw;line-height:2.734cqw}
.vert__nomer--m{color:var(--malina)}
.vert__nomer--s{color:var(--golub)}
.vert__nomer--o{color:var(--oranzh)}
.vert__nazv{top:22.644%;font-family:'Golos Text',sans-serif;font-weight:700;
  font-size:1.042cqw;line-height:1.302cqw;color:#fff;text-transform:uppercase}
.vert__zalnom{top:33.587%;font-family:Onest,sans-serif;font-weight:500;
  font-size:1.042cqw;line-height:1.302cqw;letter-spacing:.078cqw;
  color:var(--sery-2);text-transform:uppercase}
/* Подписи включаются только там, где они читаются. Кегль 16 в макете —
   это 1,042 % ширины снимка; чтобы он дал хотя бы 12 px, снимку нужно
   около 1150. Ниже остаются номера над аркадой: ужимать подпись дальше
   бессмысленно — она привязана к ширине фотографии, а не к странице. */
@container (min-width: 1150px){
  .vert__nomer,.vert__nazv,.vert__zalnom{display:block}
  .vert__nomera{display:none}
}
.vert__krug{margin-top:26px;font-size:var(--melko);color:var(--sery-2)}
.vert__raspisanie{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;margin-top:28px}
.vert__den-sh b{display:block;font-family:'Golos Text',sans-serif;font-weight:900;font-size:26px;text-transform:uppercase}
.vert__den-sh span{display:block;margin-top:4px;font-size:var(--melko);color:var(--sery-2)}
.vert__zaly{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:28px}
.vert__zal b{display:block;font-family:'Golos Text',sans-serif;font-weight:900;font-size:22px;color:var(--sery-3)}
.vert__zal i{display:block;margin-top:8px;font-style:normal;font-family:'Golos Text',sans-serif;
  font-weight:700;font-size:var(--melko);line-height:24px;text-transform:uppercase}
.vert__zal u{display:block;margin-top:8px;text-decoration:none;font-size:var(--melko);color:var(--sery-3)}
/* Цвет закреплён за залом: тот же зал в оба дня помечен одинаково, и те же
   три цвета работают в знаках правил и в точках расписания на телефоне. */
.vert__zal--m u{color:var(--malina)}
.vert__zal--s u{color:var(--golub)}
.vert__zal--o u{color:var(--oranzh)}
.pravila{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;margin-top:64px;
  padding:40px 0;border-top:1px solid var(--ramka);border-bottom:1px solid var(--ramka)}
.pravilo h4{font-family:'Golos Text',sans-serif;font-weight:900;font-size:22px;line-height:28px;text-transform:uppercase}
.pravilo p{margin-top:14px;font-size:var(--melko);line-height:25px;color:var(--sery-2)}
.pravilo__znak{width:46px;height:46px;border-radius:50%;border:1px solid var(--ramka-2);margin-bottom:18px;
  display:flex;align-items:center;justify-content:center;color:#fff}
/* Знак правила берёт цвет своего зала — те же три цвета, что у тарифов
   и у точек расписания. Белая обводка на чёрном читалась как заглушка. */
.pravilo--m .pravilo__znak{color:var(--malina);border-color:rgba(254,4,105,.42)}
.pravilo--s .pravilo__znak{color:var(--golub);border-color:rgba(0,194,255,.42)}
.pravilo--o .pravilo__znak{color:var(--oranzh);border-color:rgba(255,143,40,.42)}
.vert__niz{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;margin-top:64px;align-items:start}
.vert__lestnica{border-radius:var(--radius);overflow:hidden}
.vert__forma{background:var(--plita);border:1px solid var(--ramka);border-radius:var(--radius);padding:36px}
.vert__forma h3{margin-bottom:12px}
.vert__forma p{font-size:var(--melko);line-height:25px;color:var(--sery-2)}
.pole{display:block;width:100%;min-width:0;height:52px;margin-top:14px;padding:0 18px;border-radius:12px;
  background:var(--plita-2);border:1px solid var(--ramka-2);color:var(--bel);font-size:var(--melko)}
.pole::placeholder{color:var(--sery-3)}
.vert__forma .btn{width:100%;margin-top:20px}
.soglasie{display:flex;align-items:flex-start;gap:12px;margin-top:12px;padding:10px 0;
  min-height:44px;font-size:var(--melko);line-height:24px;color:var(--sery-3)}
.soglasie input{flex:0 0 22px;width:22px;height:22px;margin:1px 0 0;accent-color:var(--malina)}
/* При системном увеличении шрифта (Android «Самый большой», iOS крупный текст)
   «конфиденциальности» становится шире колонки, а флекс-элемент по умолчанию
   не сужается ниже своего самого длинного слова и уезжает за край. */
.soglasie span{min-width:0}
.shapka__logo,.golosa__ssylka,.razdel h3,.razdel span,
.zhurnal__niz > *,.podval__niz > *,.format__shapka > *{min-width:0}

/* ==========================================================================
   05 · СПЕЦИАЛЬНЫЕ ЛЕКЦИИ
   ========================================================================== */
.lekcii{padding:56px 0 64px}
.lekcii h2{margin-bottom:22px}
.lekciya{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:72px;align-items:center;margin-top:48px}
.lekciya--pravo .lekciya__foto{order:2}
.lekciya__foto{position:relative;display:flex;gap:24px;align-items:flex-start}
/* Досье лектора — карточка, как у спикеров (Тина 02.11: «под текст и фото
   нужна подложка „карточка“ как у спикеров, иначе фон сливается с текстом»).
   Секция лежит на паттерне «строй», и серый текст биографии на нём терялся. */
.lekciya__arka{width:100%;max-width:304px;background:var(--plita);
  border:1px solid var(--ramka);border-radius:var(--radius);
  padding:28px 28px 32px;overflow:hidden}
/* Портрет со знаком живёт в своей обёртке: доли знака считаются от неё,
   а не от колонки. Благодаря этому колонка с биографией может быть шире
   портрета, не раздувая знак. */
.lekciya__portret{position:relative;width:100%;max-width:304px}
.lekciya__portret > img:not(.lekciya__znak){width:100%;height:auto;aspect-ratio:304/380;object-fit:cover;
  border-radius:152px 152px 10px 10px;border:1px solid var(--ramka-2);background:var(--plita-2)}
.lekciya__arka b{display:block;margin-top:18px;font-family:'Golos Text',sans-serif;font-weight:700;font-size:20px}
/* Должность и биография. Должность светлее биографии: под короткой строкой
   появился длинный абзац, и без разницы в тоне две серые строки подряд
   сливаются в одну массу. */
.lekciya__arka span{display:block;margin-top:6px;font-size:var(--melko);line-height:26px;
  color:#E6E6E6;font-weight:500}
.lekciya__bio{margin-top:12px;font-size:var(--melko);line-height:26px;color:var(--sery-2)}
.lekciya__bio + .lekciya__bio{margin-top:10px}

/* Лекция с биографиями. Досье двух ведущих в половину блока не помещается:
   абзацы ужимаются в столбцы по 304 и тянутся на девять и тринадцать строк,
   пока вторая половина пустует. Поэтому название поднимается наверх,
   а под ним идут два досье во всю ширину — колонка 652 вместо 304. */
.lekciya--bio{display:flex;flex-direction:column;gap:36px;align-items:stretch}
.lekciya--bio .lekciya__t{order:-1}
/* Раскладка и порядок — разными правилами: селектор с двумя классами
   (0,3,0) перебивал мобильное переопределение (0,2,0), и карточка лекции
   с классом --pravo схлопывалась на телефоне в столбец 136 px. */
.lekciya--bio .lekciya__foto{display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:start}
.lekciya--pravo.lekciya--bio .lekciya__foto{order:0}
.lekciya--bio .lekciya__arka{max-width:none}
/* Одинокий лектор с биографией: композиция прежняя (досье слева, название
   справа), но колонка досье — вся половина блока, а не 304. */
.lekciya__arka--shir{max-width:none}
.lekciya--bio .lekciya__nazv{max-width:62ch}
.lekciya__portret > img:not(.lekciya__znak){position:relative;z-index:2}
/* Геометрия с макета: знак 260 при портрете 304 (86%), верх знака выше верха
   портрета на 56px — это 21,5% его собственной стороны, поэтому сдвиг через
   translate: он масштабируется вместе со знаком на любой ширине. */
.lekciya__znak{position:absolute;z-index:0;left:30%;top:0;width:86%;height:auto;
  translate:0 -21.5%;pointer-events:none}
.lekciya__arka--odin .lekciya__znak{left:-36%}
/* Знак первого лектора — влево, и сам рисунок отражён, чтобы разрывы
   колец смотрели наружу. `scale` применяется после `translate`, так что
   вертикальный вынос знака не ломается.
   Вынос 8 %, а не зеркальные 16 %: справа у знака соседа внутри блока
   есть место, а слева сразу край страницы. При 16 % на ширине 1200 знак
   доходил до 3 px от края окна — не прокрутка, но срез. */
.lekciya__znak--levo{left:-8%;scale:-1 1}
.lekciya__t .nad{color:var(--oranzh)}
.lekciya__nazv{margin-top:20px;font-family:'Golos Text',sans-serif;font-weight:700;font-size:var(--zag-2);
  line-height:var(--zag-2-lh)}

/* ==========================================================================
   06 · ДЛЯ КОГО
   ========================================================================== */
.komu{padding:48px 0 52px}
.komu__setka{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:34px}
.komu__k{background:var(--plita);border:1px solid var(--ramka);border-radius:var(--radius);padding:26px}
.komu__k i{display:block;width:56px;height:4px;border-radius:2px;margin-bottom:26px}
.komu__k h3{font-size:var(--zag-3);line-height:34px}
.komu__k .zachem{margin-top:14px;font-size:var(--melko);line-height:26px;color:var(--sery-2)}
.komu__k hr{margin:22px 0 20px;border:0;border-top:1px solid var(--ramka)}
.komu__k blockquote{margin:0;font-size:var(--melko);line-height:28px;color:#E6E6E6}
.komu__k cite{display:block;margin-top:14px;font-style:normal;font-weight:500;font-size:var(--melko)}

/* ==========================================================================
   07 · УЧАСТИЕ И ТАРИФЫ
   ========================================================================== */
.tarify{padding:96px 0 104px}
.tarify__setka{display:grid;grid-template-columns:minmax(0,420fr) minmax(0,420fr) minmax(0,520fr);gap:24px;margin-top:72px;align-items:stretch}
.tarif{position:relative;display:flex;flex-direction:column;background:var(--plita);
  border:1px solid var(--ramka);border-radius:var(--radius);padding:28px}
.tarif--o{border-color:#3A2410}
.tarif__portal{width:100%;margin-bottom:30px}
.tarif__lenta{display:block;margin-bottom:22px;padding:9px 0;border-radius:19px;background:#160D04;
  border:1px solid #4A2E10;text-align:center;font-family:'Golos Text',sans-serif;font-weight:500;
  font-size:var(--melko);letter-spacing:.09em;text-transform:uppercase;color:var(--oranzh)}
.tarif .nad{letter-spacing:.09em}
.tarif h3{margin-top:10px;font-family:'Golos Text',sans-serif;font-weight:900;font-size:var(--zag-2);
  line-height:var(--zag-2-lh);text-transform:uppercase}
.tarif__smysl{margin-top:14px;font-size:var(--melko);line-height:26px;color:var(--sery)}
.tarif hr{margin:26px 0;border:0;border-top:1px solid var(--ramka)}
.tarif__cena{font-family:'Golos Text',sans-serif;font-weight:900;font-size:clamp(40px, 1.36vw + 31.5px, 56px);line-height:1.1}
.tarif__lestnica{margin-top:8px;font-size:var(--melko);line-height:26px;color:var(--sery-3)}
.tarif__lestnica b{font-weight:500}
.tarif__srok{display:inline-block;margin-top:6px;color:var(--sery-2)}
.tarif__sostav{margin-top:28px;flex:1}
.tarif__sostav li{position:relative;padding-left:24px;margin-bottom:12px;font-size:var(--melko);
  line-height:26px;color:#E6E6E6}
.tarif__sostav li::before{content:"";position:absolute;left:1px;top:9px;width:8px;height:8px;border-radius:50%}
.tarif--m .tarif__sostav li::before{background:var(--malina)}
.tarif--s .tarif__sostav li::before{background:var(--golub)}
.tarif--o .tarif__sostav li::before{background:var(--oranzh)}
.tarif--m .tarif__lestnica b{color:var(--malina)}
.tarif--s .tarif__lestnica b{color:var(--golub)}
.tarif--o .tarif__lestnica b{color:var(--oranzh)}
.tarif--o .tarif__cena{color:var(--oranzh)}
.tarif .neon{margin-top:18px}
.vypusknikam{margin-top:28px;text-align:center;font-size:var(--melko);color:var(--sery-2)}

.zhurnal{display:grid;grid-template-columns:460px minmax(0,1fr);gap:48px;align-items:center;margin-top:56px;
  padding:40px;background:var(--plita);border:1px solid #3A2410;border-radius:var(--radius)}
.zhurnal img{border-radius:16px}
.zhurnal .nad{color:var(--oranzh)}
.zhurnal h3{margin-top:18px;font-family:'Golos Text',sans-serif;font-weight:900;font-size:clamp(26px, 1.87vw + 19.3px, 48px);line-height:1.17;
  text-transform:uppercase}
.zhurnal p{margin-top:22px;font-size:var(--tekst);line-height:30px;color:var(--sery)}
.zhurnal__niz{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:30px;
  padding-top:26px;border-top:1px solid #3A2410}
.zhurnal__cena{font-family:'Golos Text',sans-serif;font-weight:700;font-size:var(--zag-3);
  line-height:var(--zag-3-lh);color:var(--oranzh)}

/* ==========================================================================
   08 · ФОРМАТ
   ========================================================================== */
.format{padding:56px 0 64px}
.format__shapka{display:flex;justify-content:space-between;align-items:flex-start;gap:40px}
.format__pod{margin-top:42px;font-family:'Golos Text',sans-serif;font-weight:700;
  font-size:clamp(22px, 0.51vw + 20.2px, 28px);line-height:1.28}
.setka-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;margin-top:34px}
.net-k i{display:block;width:100%;height:2px;background:var(--malina);margin-bottom:30px}
.net-k svg{width:17px;height:17px;margin-bottom:22px;stroke:var(--malina)}
.net-k p{font-size:clamp(18px, 0.34vw + 16.8px, 22px);line-height:1.45;color:#E6E6E6}
.para{background:var(--plita);border:1px solid var(--ramka);border-radius:var(--radius-s);padding:28px}
.para .nad{letter-spacing:.1em}
.para__bylo{margin-top:10px;font-size:var(--melko);line-height:26px;color:var(--sery-3)}
.para__duga{margin:22px 0;stroke:var(--golub)}
.para__stalo{margin-top:10px;font-size:var(--melko);line-height:26px;font-weight:500}

/* ==========================================================================
   09 · СПИКЕРЫ
   ========================================================================== */
.spikery{padding:56px 0 64px}
.razdel{display:flex;align-items:baseline;justify-content:space-between;gap:24px;
  margin:44px 0 24px;padding-top:22px;border-top:1px solid var(--ramka)}
.razdel h3{font-family:'Golos Text',sans-serif;font-weight:700;font-size:22px;letter-spacing:.18em;
  text-transform:uppercase}
.razdel span{font-size:var(--melko);color:var(--sery-3)}

.spiker{position:relative;background:var(--plita);border:1px solid var(--ramka);
  border-radius:var(--radius);padding:28px;overflow:hidden}
.spiker__verh{position:relative;margin:26px 0 40px}
.spiker__foto{position:relative;z-index:2;background:var(--plita-2);border:1px solid #202020}
.spiker__znak{position:absolute;z-index:1;height:auto;pointer-events:none}
.spiker .nad{letter-spacing:.07em}
.spiker h4{margin-top:10px;font-family:'Golos Text',sans-serif;font-weight:700;font-size:var(--zag-3);
  line-height:32px}
.spiker__bio{margin-top:14px;font-size:var(--melko);line-height:26px;color:var(--sery-2)}
.spiker__tema{margin-top:16px;font-size:var(--melko);line-height:26px;color:#E6E6E6;font-weight:500}

/* ТЕРАПЕВТЫ · арка. Макет: портрет 250×310 в точке 101,54; кольца большие
   251×242 в 9,15; малые 131×126 в 279,226. Оба кольца под портретом. */
.spiker--ter .spiker__verh{margin-top:26px}
.spiker--ter .spiker__foto{width:62.97%;aspect-ratio:250/310;object-fit:cover;
  border-radius:50% 50% 0 0 / 40.3% 40.3% 0 0;margin-left:18.39%}
.spiker--ter .spiker__znak--bol{left:-4.79%;top:-12.58%;width:63.22%}
.spiker--ter .spiker__znak--mal{left:63.22%;top:55.48%;width:33%}
.spiker--ter .nad{color:var(--malina)}

/* МОДЕРАТОРЫ · круг. Макет: портрет 300×300 в 44,30; крест большой 247×242
   в 234.6,−28.9 (поворот 16,7°); малый 124×122 в 13,238. Кресты поверх. */
.spiker--mod .spiker__verh{margin-top:2px}
.spiker--mod .spiker__foto{width:75.57%;aspect-ratio:1;object-fit:cover;
  border-radius:50%;margin-left:4.03%}
/* Кресты уходят ПОД портрет (Тина 02.11: «наложение исправь там, где
   крестики на рукав заходят»). В макете они лежали поверх круга, и малый
   крест ложился модератору на плечо — на телефоне после увеличения
   портрета это стало видно в упор, но дефект был и на десктопе.
   Под портретом крест выглядывает сверху-справа и снизу-слева — так же,
   как кольца у терапевтов и полукруги у докладов. */
.spiker--mod .spiker__znak--bol{left:52.04%;top:-19.63%;width:62.32%}
.spiker--mod .spiker__znak--mal{left:-3.78%;top:69.33%;width:31.28%}
.spiker--mod .nad{color:var(--golub)}

/* ДОКЛАДЫ · скруглённый квадрат. Макет: портрет 200×200 в 66,58; полукруги
   большие 208×104 в 28,−7 (поворот 180°); малые 78×156 в 262,83 (поворот
   90°). Поле карточки здесь 278. Полукруги под портретом. */
.spiker--dok .spiker__verh{margin-top:30px}
.spiker--dok .spiker__foto{width:71.94%;aspect-ratio:1;object-fit:cover;
  border-radius:11%;margin-left:13.67%}
.spiker--dok .spiker__znak--bol{left:0;top:-32.5%;width:74.82%}
.spiker--dok .spiker__znak--mal{left:84.17%;top:12.5%;width:28.06%}
.spiker--dok .nad{color:var(--oranzh)}

/* ==========================================================================
   10 · ЧТО ВЫ УНЕСЁТЕ
   ========================================================================== */
.unesu{padding:44px 0 44px}
.unesu__setka{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px 20px;margin-top:24px}
.unesu__p{padding-top:22px;border-top:1px solid var(--ramka)}
.unesu__p svg{display:block;height:30px;margin-bottom:16px}
.unesu__p h3{font-family:'Golos Text',sans-serif;font-weight:700;font-size:var(--zag-3);line-height:32px}
.unesu__p p{margin-top:10px;font-size:var(--melko);line-height:26px;color:var(--sery-2)}

/* ==========================================================================
   11 · FAQ
   ========================================================================== */
.faq{padding:48px 0 52px}
.faq__setka{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 64px;margin-top:28px}
.faq__v{padding:20px 0 22px;border-top:1px solid var(--ramka)}
.faq__v h3{font-family:'Golos Text',sans-serif;font-weight:700;font-size:var(--zag-3);line-height:32px}
.faq__v p{margin-top:10px;font-size:var(--melko);line-height:28px;color:var(--sery-2)}

/* ==========================================================================
   12 · ФИНАЛЬНЫЙ ПРИЗЫВ
   ========================================================================== */
.final{padding:64px 0 72px;text-align:center}
.final h2{margin-top:18px;font-size:clamp(28px, 2.72vw + 18.2px, 60px);line-height:1.13}
.final__lid{margin:34px auto 0;font-size:19px;line-height:29px;color:var(--sery)}
/* Кнопка финального экрана: 470×76 по макету (узел 400:51), а не по тексту */
.final .btn{margin-top:56px;width:470px;max-width:100%;min-height:76px;padding:0 44px;
  font-size:clamp(18px, 0.51vw + 16.2px, 24px)}

/* ==========================================================================
   13 · ПОДВАЛ
   ========================================================================== */
.podval{padding:52px 0 44px;border-top:1px solid var(--ramka)}
.podval__setka{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);gap:40px}
.podval h4{font-family:'Golos Text',sans-serif;font-weight:700;font-size:var(--melko);letter-spacing:.14em;
  text-transform:uppercase;color:var(--sery-3);margin-bottom:18px}
.podval li{margin-bottom:12px;font-size:var(--melko);color:var(--sery)}
.podval a:hover{color:var(--bel)}
.podval__niz{display:flex;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-top:56px;
  padding-top:26px;border-top:1px solid var(--ramka);font-size:var(--melko);color:var(--sery-3)}
.podval__logo img{height:38px;margin-bottom:16px}

/* ==========================================================================
   ПЛАНШЕТ 768–1199
   ========================================================================== */
@media (max-width:1199px){
  .shapka__nav{display:none}
  .burger{display:flex}
  .shapka__yaz{display:none}
  /* подпись блока «Формат» уезжала за правый край: флекс без переноса */
  .format__shapka{flex-direction:column;gap:14px}
  .format__shapka .nad{max-width:none}

  .geroy{min-height:auto;padding-bottom:56px}
  .geroy__foto{position:relative;width:100%;height:340px;border-radius:0 0 28px 28px;margin-bottom:-40px}
  .geroy__foto::after{background:linear-gradient(0deg,#050505 0%,rgba(5,5,5,0) 58%)}
  .geroy__t{padding-top:48px;max-width:none}
  /* На телефоне дата ложится в две строки, как просила владелица:
     «29 — 30 ЯНВАРЯ» и «2027 · ОНЛАЙН». Вертикальная колонка из четырёх
     строк занимала треть первого экрана. */
  /* Обе кнопки первого экрана одной ширины: верхняя растягивалась
     по тексту до края, нижняя стояла по своему содержимому и выглядела
     случайной (Тина 01.11: «кнопки должны быть одинаковые как верхняя»). */
  .geroy__knopki{flex-direction:column;gap:12px}
  .geroy__knopki .btn{width:100%}
  /* Поля 34 были рассчитаны на кнопку по содержимому. У кнопки во всю
     ширину они съедали 68 px, и «Купить билет · 45 € до 15 ноября»
     (293 px) не влезал в строку. При 24 влезает с 393 и выше;
     на узких экранах текст переносится по центру, а не уступом. */
  .btn{padding:0 24px;text-align:center}
  .geroy__data{position:static;margin-top:30px;padding-left:22px;
    display:flex;flex-wrap:wrap;align-items:baseline;column-gap:12px}
  .geroy__data b{display:inline;white-space:nowrap}
  /* Вторая строка — «2027 · ОНЛАЙН» — отдельной строкой по общей базовой
     линии. Раньше «ОНЛАЙН» подтягивался отрицательным отступом −30 и ехал
     относительно года: отсюда «криво и неровно». */
  .geroy__data-niz{display:flex;align-items:baseline;gap:14px;
    flex:0 0 100%;margin-top:8px}
  .geroy__data i{margin-top:0;font-size:26px;line-height:1.06}
  .geroy__data u{display:inline-block;position:relative;margin:0;
    padding:0 0 0 22px;border-top:0;line-height:1.06}
  .geroy__data u::before{position:absolute;left:0;top:50%;translate:0 -50%;
    width:10px;height:10px}
  .dekor--kolca{right:-60px;top:calc(-80px + var(--nadpis, 0px));width:280px}
  .dekor--dugi{right:-80px;bottom:auto;top:calc(200px + var(--nadpis, 0px));width:220px}
  /* крест возвращается на фото: на узком экране снимку не хватало цвета */
  /* Подняты на 76 px — это ровно 2 см в мере CSS (Тина 02.11).
     Выше нельзя: верх снимка в 22 px над крестом, дальше он выйдет
     на чёрное поле над фотографией. */
  .dekor--krest{display:block;left:6%;right:auto;top:calc(22px + var(--nadpis, 0px));width:15%;max-width:120px}
  .dekor--krest2{display:block;position:absolute;left:23%;top:calc(76px + var(--nadpis, 0px));width:8%;max-width:64px;z-index:1}
  .cifry{flex-wrap:wrap;gap:22px 0}
  .cifry li{flex:0 0 50%;border-right:0;padding-right:16px}

  .golosa{min-height:auto}
  .golosa__skulptura,.golosa__proem,.golosa__otr{display:none}
  .golosa__kolca{right:-120px;top:-80px;width:460px;opacity:.5}
  .golosa__citata{margin:40px 0 0;max-width:none}
  .golosa__niz{gap:32px}
  .golosa__avtor{margin-left:0}

  .setka-3{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .setka-4{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .spikery .setka-3,.spikery .setka-4{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .vert__raspisanie{grid-template-columns:minmax(0,1fr);gap:40px}
  .vert__niz{grid-template-columns:minmax(0,1fr);gap:36px}
  .vert__skulptura{position:relative;width:100%;border-radius:20px;margin-bottom:24px}
  .vert__skulptura::after{background:none}
  .vert__t{padding-top:0;max-width:none}
  .pravila{grid-template-columns:minmax(0,1fr);gap:28px}

  .lekciya{grid-template-columns:minmax(0,1fr);gap:34px;margin-top:56px}
  .lekciya--pravo .lekciya__foto{order:0}
  /* В одну колонку название возвращается под портреты — как у лекции без
     биографий. Поднимать его наверх имеет смысл только там, где оно стоит
     над двумя колонками досье, то есть на десктопе. */
  .lekciya--bio .lekciya__t{order:0}
  .komu__setka{grid-template-columns:minmax(0,1fr);gap:20px}
  .tarify__setka{grid-template-columns:minmax(0,1fr);gap:20px}
  /* одна колонка — портал по центру, высоту считает portaly() в main.js */
  .tarif__portal{display:block;margin-left:auto;margin-right:auto;height:auto}
  .zhurnal{grid-template-columns:minmax(0,1fr);gap:28px;padding:28px}
  .faq__setka{grid-template-columns:minmax(0,1fr);gap:0}
  .unesu__setka{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .podval__setka{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
}

/* ==========================================================================
   ТЕЛЕФОН <768
   ========================================================================== */
@media (max-width:767px){
  :root{--radius:20px}
  /* на мобильном паттерн с мелким текстом не применяем */
  .pole-pat::before{display:none}

  :root{--shapka-h:68px}
  .shapka .v{min-height:68px;gap:14px}
  .shapka__logo img{height:28px}
  .shapka__btn{display:none}

  .geroy__foto{height:240px}
  .geroy__knopki{gap:12px}
  .cifry li{flex:0 0 50%;padding-right:14px}
  .dekor--kolca{width:190px;right:-50px;top:calc(-50px + var(--nadpis, 0px))}
  /* Отступ считается от секции, а надзаголовок встал выше снимка —
     значит смещение на его высоту нужно и здесь. Без него дуги висели
     на 106 px выше и ложились на лицо статуи. */
  /* Дуги привязаны к низу снимка: 240 высота снимка минус 124 высота дуг
     плюс 20 выпуска под край. Ниже опускать нельзя — на 320 и 360
     они ложатся на «КОНФЕРЕНЦИЯ СЛУЧАЕВ». */
  .dekor--dugi{width:130px;right:-44px;top:calc(136px + var(--nadpis, 0px))}

  .golosa__kolca{width:320px;right:-100px;opacity:.4}
  /* Порядок на телефоне (Тина 02.11): сперва фото Евгения с подписью,
     затем «Здесь откровенно говорят о терапии» с абзацем, и только
     потом кнопка мнений. */
  .golosa__niz{flex-direction:column;align-items:stretch;gap:26px}
  .golosa__avtor{order:1;margin:0 auto;text-align:center}
  .golosa__pod{order:2}
  /* Круг вырос с 48 до макетного 61, и подписи не хватило 5 px.
     Отыграны зазором 16 → 12 и трекингом .1 → .05em: строке нужно
     было 353 при 348. Кегль не трогаю — он и так на нижней границе. */
  .golosa__ssylka{order:3;justify-content:flex-start;gap:12px;letter-spacing:.05em}

  .setka-3,.setka-4,.unesu__setka,.podval__setka{grid-template-columns:minmax(0,1fr)}
  /* На телефоне линия между названием дня и счётом не помещается:
     ставим их в две строки, а не в ряд. */
  .den{flex-direction:column;align-items:flex-start;gap:6px}
  .den i{display:none}
  .den b{font-size:20px}
  .den span{letter-spacing:1.2px}
  /* спикеры на телефоне по двое — распоряжение владелицы */
  /* Один спикер в ряд (Тина 01.11): «не красиво, когда текст про них
     так переносится». В колонке 169 биография рвалась по слогам через
     строку. Поля и кегли возвращены к обычным, подгонка под узкую
     колонку больше не нужна. */
  .spikery .setka-3,.spikery .setka-4{grid-template-columns:minmax(0,1fr);gap:16px}
  /* колонка узкая, и каждый лишний пиксель решает, влезет ли
     «аккредитованный» целиком или переломится посередине */
  .spikery .spiker{padding:20px 20px 24px}
  .spikery .spiker h4{font-size:var(--zag-3);line-height:1.3}
  .spikery .spiker__bio,.spikery .spiker__tema{line-height:26px}
  .spikery .nad{font-size:var(--melko);line-height:22px;letter-spacing:.07em}
  .spikery .spiker__verh{margin-bottom:30px}
  /* Портрет на телефоне — 86 % поля карточки и ровно по центру
     (Тина 02.11: «фото сделай больше и по центру»). Одна доля на все три
     вида, чтобы карточки читались как один ряд. Левое поле у каждого своё,
     потому что центр композиции со знаками у видов разный: у терапевта
     49,88 %, у модератора 50 %, у доклада 49,64 % — из макета. Знаки стоят
     на макетных местах: они центрированы вместе с портретом, двигать их
     не нужно, портрет растёт от общего центра. */
  .spikery .spiker__foto{width:86%}
  .spikery .spiker--ter .spiker__foto{margin-left:6.88%}
  .spikery .spiker--mod .spiker__foto{margin-left:7%}
  .spikery .spiker--dok .spiker__foto{margin-left:6.64%}
  .spikery .spiker--mod .spiker__znak--bol{left:60.23%}
  .spikery .spiker--mod .spiker__znak--mal{left:4.41%}
  /* Телефон: расписание читается как «день → три зала подряд», связь держит
     линия слева, а не совпадение колонок (Тина 01.11: «исчезла инфографика»). */
  .vert__raspisanie{grid-template-columns:minmax(0,1fr);gap:34px}
  .vert__zaly{grid-template-columns:minmax(0,1fr);gap:0;margin-top:16px;
    border-left:1px solid var(--ramka-2);padding-left:22px}
  .vert__zal{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);
    column-gap:14px;align-items:baseline;padding:14px 0;border-bottom:1px solid var(--ramka)}
  .vert__zal:last-child{border-bottom:0;padding-bottom:0}
  .vert__zal::before{content:"";position:absolute;left:-26px;top:22px;width:9px;height:9px;
    border-radius:50%;background:var(--sery-3)}
  .vert__zal--m::before{background:var(--malina)}
  .vert__zal--s::before{background:var(--golub)}
  .vert__zal--o::before{background:var(--oranzh)}
  .vert__zal b{grid-row:1/3;font-size:26px}
  .vert__zal i{margin-top:0}
  .vert__zal u{margin-top:2px}

  .vert-knopka__btn{height:66px}
  .vert-knopka__btn i{width:44px;height:44px;top:11px}

  /* Лекторы на телефоне — по одному в ряд: в паре арка сужалась вдвое
     и голова резалась вертикальной полосой. Распоряжение Тины 01.11:
     «лучше по одному их показать, чем так сплющить головы». */
  .lekciya__foto,
  .lekciya--bio .lekciya__foto{display:flex;flex-direction:column;align-items:stretch;gap:16px}
  /* На телефоне колонка одна, так что обёртка портрета равна полю карточки
     и все доли знака остаются прежними. */
  .lekciya__portret{max-width:none}
  /* Лектор на телефоне — такая же карточка, как у спикеров (Тина 02.11:
     «сделай им карточки в мобильной версии, как у спикеров»). Раньше
     портрет и знак лежали прямо на фоне секции: знак торчал углом,
     а фото висело у левого края без опоры. */
  .lekciya__arka{max-width:none;padding:20px 20px 24px}
  /* Доля портрета та же, что у спикеров-терапевтов, и по центру карточки. */
  .lekciya__portret > img:not(.lekciya__znak){display:block;max-width:none;
    width:62.97%;margin-inline:auto}
  /* Знак выглядывает из-за портрета справа и сверху, как кольцо у спикеров,
     а не висит отдельной фигурой. Доли считаются от поля карточки (343),
     а портрет — от её содержимого (303), поэтому 55,7 % знака равны
     62,97 % портрета: знак и лицо одной меры, как в карточке спикера. */
  .lekciya__znak{width:55.7%;left:38.8%;translate:0 -21.5%}
  .lekciya__arka--odin .lekciya__znak{left:38.8%}
  /* Зеркальная доля: справа знак не доходил до края поля 19 px из 343,
     значит слева он встаёт на те же 5,5 %. */
  .lekciya__znak--levo{left:5.5%}

  /* Тариф на телефоне должен умещаться в экран вместе с картинкой
     (кнопка может уехать) — распоряжение Тины 01.11. Поэтому поля внутри
     карточки поджаты, а высоту портала считает vmestit() в main.js. */
  /* Выемка и кнопка в карточке случая заданы в пикселях, и на узкой
     карточке та же сотня пикселей съедает треть угла вместо пятой части,
     как на десктопе (107 из 578 = 18,5 %; 107 из 348 = 31 %).
     Уменьшаем в той же пропорции: 69 из 348 — это 20 %. Кнопка при этом
     остаётся 44 — меньше нельзя, палец не попадёт. Все числа пересчитаны
     от макетных одним множителем 0,647. */
  .sluchay__vyemka{width:70px;height:70px;border-top-left-radius:19px;border-bottom-right-radius:22px}
  /* внешние углы выреза — тем же множителем 0,647, что и всё остальное */
  .sluchay{--ug:13px}
  .sluchay__knopka{right:4px;bottom:4px;width:44px;height:44px}
  .sluchay__knopka svg{width:12px;height:12px}
  /* отступы под выемку пересчитаны: заходит она теперь на 69 − 36 = 33 */
  .sluchay__kto{padding-right:40px}
  .sluchay.otkryt .sluchay__raskryt{padding-bottom:42px}

  .tarif{padding:20px}
  .tarif__portal{display:block;margin:0 auto 18px;height:auto}
  .tarif h3{margin-top:8px}
  .tarif__smysl{margin-top:10px;line-height:25px}
  .tarif hr{margin:16px 0}
  .tarif__sostav{margin-top:16px}
  .tarif__sostav li{margin-bottom:9px;line-height:25px}
  .tarif__lestnica{line-height:25px}
  .neon{height:62px}
  .neon i{width:46px;height:46px;top:8px}
  .neon span{padding-right:46px}

  .zhurnal__niz{flex-direction:column;align-items:flex-start}

  .format__pod{margin-top:40px}
  /* На телефоне крест встаёт в одну строку с текстом, а не отдельным
     этажом над ним (Тина 01.11). Линия остаётся во всю ширину сверху.
     Сдвиг креста 5,5 = (28 строки − 17 креста) / 2: так он приходится
     ровно на середину первой строки. */
  .net-k{display:grid;grid-template-columns:auto minmax(0,1fr);
    column-gap:12px;align-items:start}
  .net-k i{grid-column:1/-1;margin-bottom:16px}
  .net-k svg{grid-column:1;margin:5.5px 0 0}
  .net-k p{grid-column:2;margin:0;font-size:var(--tekst);line-height:28px}


  .razdel{margin:56px 0 24px;flex-direction:column;gap:6px}
  .razdel h3{font-size:var(--melko);letter-spacing:.14em}

  /* Финальный заголовок на телефоне по раскладке владелицы (02.11):
     «ВЫ НЕ ДОЛЖНЫ ОСТАВАТЬСЯ» от левого края, «НАЕДИНЕ» малиновым
     остаётся слева, а «СО СЛОЖНЫМИ СЛУЧАЯМИ» прижат вправо и начинается
     на той же строке. Держится на обтекании: «НАЕДИНЕ» обтекаемый слева,
     поэтому первая строка правого блока («СО») встаёт рядом с ним,
     а следующие уходят под него во всю ширину. */
  .final__zag{text-align:left}
  .final__a{display:block}
  .final__br{display:none}
  .final__b{float:left;margin-right:.32em}
  .final__c{display:block;text-align:right}
  .final .btn{width:100%;min-height:69px;padding:0 20px}
  /* Лид под заголовком — по левому краю (Тина 02.11), вровень
     с «ВЫ НЕ ДОЛЖНЫ ОСТАВАТЬСЯ». По центру он не выравнивается. */
  .final__lid{font-size:var(--melko);line-height:27px;text-align:left}

  .podval__niz{flex-direction:column;gap:10px}
}

/* Дни в две колонки там, где это реально влезает: замер показал, что
   при колонке 260 названия залов укладываются максимум в две строки,
   а при 164 (телефон 393) доходят до пяти. Поэтому две колонки —
   от 600 px и только пока залы идут строками. */
@media (min-width:600px) and (max-width:767px){
  .vert__raspisanie{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px}
}

/* уважаем системную настройку «меньше движения» */
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms !important;transition-duration:.01ms !important}
}


/* ==========================================
   СТИЛИ ДЛЯ МОДАЛЬНОГО ОКНА И КНОПОК
   ========================================== */

/* 1. Сброс для кнопок тарифов */
button.neon {
  border: 0;
  padding: 0;
  font-family: inherit;
  cursor: pointer;
}

/* 2. Базовые стили модального окна */
.modal {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: none;
}
.modal.is-open {
  display: block;
}
.modal__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.7);
  z-index: 1;
}
.modal__content {
  position: relative;
  z-index: 2;
  max-width: 520px;
  margin: 5vh auto;
  padding: 32px;
  background: #ffffff;
  border-radius: 16px;
  max-height: 90vh;
  overflow-y: auto;
  color: #333;
  animation: modal-in 0.2s ease-out;
}
@keyframes modal-in {
  from { transform: translateY(-12px); opacity: 0; }
  to { transform: none; opacity: 1; }
}
.modal__close {
  position: absolute;
  top: 12px;
  right: 16px;
  background: none;
  border: 0;
  font-size: 28px;
  line-height: 1;
  cursor: pointer;
  color: #333;
  padding: 4px 8px;
}
.modal__title {
  margin: 0 0 8px;
  font-size: 24px;
  color: #000;
}
.modal__tariff {
  font-size: 16px;
  color: #777;
  margin-bottom: 20px;
}
.modal__tariff b {
  color: #FE0469;
}

/* 3. Поля ввода внутри белой модалки */
.modal__content .pole {
  background-color: #f4f4f4 !important;
  color: #000 !important;
  border: 1px solid #ddd;
  border-radius: 8px;
  padding: 14px 16px;
  width: 100%;
  box-sizing: border-box;
  font-size: 16px;
  margin-bottom: 16px;
  font-family: inherit;
}
.modal__content .pole::placeholder {
  color: #888;
}
.modal__content .pole:focus {
  outline: none;
  border-color: #FE0469;
  background-color: #fff !important;
}

/* ==========================================
   4. КРАСИВЫЕ РАДИОКНОПКИ (ПИЛЮЛИ)
   ========================================== */
.pole-radio {
  display: flex;
  gap: 12px;
  margin: 16px 0;
}

.pole-radio__item {
  position: relative;
  cursor: pointer;
}

/* Скрываем стандартную радиокнопку браузера */
.pole-radio__item input[type="radio"] {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

/* Визуальная часть (плашка) */
.pole-radio__item span {
  display: inline-flex;
  align-items: center;
  padding: 10px 18px;
  border-radius: 30px;
  font-size: 16px;
  transition: all 0.2s ease;
  border: 1px solid transparent;
  user-select: none;
}

/* ТЕМНАЯ ФОРМА (Соберите свой маршрут) */
.vert__forma .pole-radio__item span {
  color: #E6E6E6; 
  background: #141414; 
  border-color: #2A2A2A;
}
.vert__forma .pole-radio__item input:checked + span {
  color: #fff;
  border-color: #FE0469;
  background: rgba(254, 4, 105, 0.15);
}

/* СВЕТЛАЯ МОДАЛКА */
.modal__content .pole-radio__item span {
  color: #333; 
  background: #f4f4f4; 
  border-color: #ddd;
}
.modal__content .pole-radio__item input:checked + span {
  color: #FE0469;
  border-color: #FE0469;
  background: rgba(254, 4, 105, 0.05);
}

/* Иконка кружка перед текстом */
.pole-radio__item span::before {
  content: "";
  display: inline-block;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  border: 2px solid #666;
  margin-right: 8px;
  transition: all 0.2s;
}
.modal__content .pole-radio__item span::before {
  border-color: #999;
}
.vert__forma .pole-radio__item input:checked + span::before {
  background: #FE0469;
  border-color: #FE0469;
  box-shadow: inset 0 0 0 2px #141414;
}
.modal__content .pole-radio__item input:checked + span::before {
  background: #FE0469;
  border-color: #FE0469;
  box-shadow: inset 0 0 0 2px #fff;
}

/* 5. Кнопка "Оформить" в модалке */
.modal__content .btn {
  width: 100%;
  padding: 16px;
  font-size: 18px;
  border-radius: 50px;
  margin-top: 8px;
  margin-bottom: 24px;
}

/* 6. Чекбокс согласия */
.modal__content .soglasie {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  font-size: 14px;
  color: #555;
  line-height: 1.4;
  cursor: pointer;
  margin-bottom: 8px;
}
.modal__content .soglasie input[type="checkbox"] {
  width: 20px;
  height: 20px;
  margin: 2px 0 0 0;
  accent-color: #FE0469;
  cursor: pointer;
  flex-shrink: 0;
}
.modal__content .soglasie a {
  color: #FE0469;
  text-decoration: underline;
}

/* На телефоне модалка на весь экран */
@media (max-width: 767px) {
  .modal__content {
    margin: 0;
    border-radius: 0;
    max-height: 100vh;
    height: 100vh;
  }
}

/* ==========================================
   СОСТОЯНИЕ УСПЕХА ПОСЛЕ ОТПРАВКИ ФОРМЫ
   ========================================== */
.lead-form__success {
  text-align: center;
  padding: 28px 12px 8px;
  animation: lead-success-in 0.45s ease-out;
}
.lead-form__success-icon {
  width: 72px;
  height: 72px;
  margin: 0 auto 22px;
  border-radius: 50%;
  background: linear-gradient(135deg, #FE0469 0%, #FB7C28 100%);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 10px 28px rgba(254, 4, 105, 0.35);
}
.lead-form__success-title {
  font-family: 'Golos Text', sans-serif;
  font-weight: 700;
  font-size: 26px;
  line-height: 1.2;
  margin: 0 0 12px;
}
.lead-form__success-text {
  font-size: 17px;
  line-height: 1.5;
  margin: 0;
  opacity: 0.85;
}

.vert__forma .lead-form__success-title { color: #fff; }
.vert__forma .lead-form__success-text { color: #E6E6E6; }

.modal__content .lead-form__success-title { color: #111; }
.modal__content .lead-form__success-text { color: #555; }

@keyframes lead-success-in {
  from { opacity: 0; transform: translateY(12px) scale(0.96); }
  to   { opacity: 1; transform: none; }
}