/* =============================================================================
   ДенталКит — дизайн-система
   Направление: «Забота» (раунд 1, вариант 2), утверждено 2026-10-07
   из Common info/Design/ds-candidates/candidates-2026-10-07.html.
   Шрифты пересмотрены 2026-10-07: Ubuntu + Open Sans, акцент Caveat
   (ds-candidates/accent-fonts-2026-10-07.html).

   Каждая страница оборачивает контент в <div class="pb-scope"> и подключает
   этот файл одним <link>. Правила не инлайнить в страницу, токены локально
   не переопределять.

   Разделы:  FONTS  →  TOKENS  →  BASE  →  COMPONENTS
   COMPONENTS — CSS секций собранных страниц (сами страницы остаются чистым
   HTML). Устойчивые части потом выносит в блоки `extract-to-library`.
   ============================================================================= */


/* =============================================================================
   FONTS
   Ubuntu — заголовки, кнопки, меню и цифры; Open Sans — текст;
   Caveat — одна рукописная акцентная строка на экран.
   ============================================================================= */

@import url("https://fonts.googleapis.com/css2?family=Ubuntu:wght@500;700&family=Open+Sans:ital,wght@0,400;0,600;1,400&family=Caveat:wght@700&display=swap");


/* =============================================================================
   TOKENS
   ============================================================================= */

.pb-scope {
  /* ---- Основные шесть ---------------------------------------------------- */
  --bg:       oklch(97.5% 0.014 225);  /* фон страницы, светлый лёд              */
  --surface:  oklch(99.5% 0.004 225);  /* карточки, шапка, панели                */
  --fg:       oklch(30% 0.035 240);    /* заголовки и основной текст, 12.7:1     */
  --muted:    oklch(48% 0.03 240);     /* подписи, вторичный текст, 6.1:1        */
  --border:   oklch(90% 0.02 228);     /* декоративная линия между блоками        */
  --accent:   oklch(55% 0.12 235);     /* кнопка, крупный акцентный текст         */

  /* ---- Цвета логотипа ----------------------------------------------------- */
  --brand:      #00A8D8;               /* циан логотипа: волна, мелкие маркеры.
                                          Текст и заливку с белым текстом им не
                                          делать — белый на нём 2.7:1           */
  --brand-ice:  #C0E4F0;               /* светлая волна логотипа: линии, фон      */
  --brand-grey: #787878;               /* серый логотипа: нейтральные иконки       */

  /* ---- Производные -------------------------------------------------------- */
  --accent-deep:    oklch(47% 0.11 237);  /* наведение на кнопку; мелкий акцентный
                                             текст на --bg (ссылки) — 6.6:1      */
  --mist:           oklch(93% 0.03 225);  /* кружки под иконки, вторичная кнопка */
  --mist-hover:     oklch(88% 0.045 225);
  --border-control: oklch(64% 0.04 232);  /* видимая граница поля ввода, ≥3:1    */
  --on-accent:      oklch(99.5% 0.004 225);

  /* ---- Состояния ---------------------------------------------------------- */
  --danger: oklch(53% 0.16 25);
  --ok:     oklch(55% 0.12 155);

  /* ---- Шрифты ------------------------------------------------------------- */
  --font-display: "Ubuntu", "Open Sans", system-ui, sans-serif;  /* заголовки           */
  --font-ui:      "Ubuntu", "Open Sans", system-ui, sans-serif;  /* кнопки, меню, плашки, подписи полей */
  --font-body:    "Open Sans", system-ui, sans-serif;            /* текст               */
  --font-accent:  "Caveat", "Ubuntu", cursive;                   /* рукописная строка    */
  --font-num:     "Ubuntu", "Open Sans", system-ui, sans-serif;  /* цифры и факты        */

  --w-display: 700;
  --w-ui:      500;
  --w-accent:  700;
  --w-num:     700;

  /* ---- Типошкала ---------------------------------------------------------- */
  --fs-d1:     clamp(36px, 4vw, 56px);   /* H1 первого экрана                   */
  --fs-d2:     clamp(28px, 2.8vw, 40px); /* H2 разделов                         */
  --fs-h3:     22px;                     /* заголовок карточки                  */
  --fs-accent: clamp(28px, 2.6vw, 36px); /* рукописная строка: у Caveat мелкое очко, поэтому крупнее */
  --fs-num:    30px;                     /* цифры в панели преимуществ           */
  --fs-lead:   17px;
  --fs-body:   17px;
  --fs-small:  15px;
  --fs-cap:    13px;
  --lh-display: 1.06;
  --lh-body:    1.6;
  --tr-display: -0.01em;

  /* ---- Отступы ------------------------------------------------------------ */
  --sp-1: 8px;
  --sp-2: 12px;
  --sp-3: 20px;
  --sp-4: 36px;
  --sp-5: 56px;
  --sp-6: 80px;
  --sp-section: clamp(56px, 7vw, 96px);
  --maxw: 1240px;
  --gutter: clamp(20px, 4vw, 64px);

  /* ---- Радиусы ------------------------------------------------------------ */
  --r-field: 18px;
  --r-card:  28px;
  --r-panel: 36px;
  --r-pill:  999px;
  --r-leaf:  220px 32px 220px 32px;      /* фирменная форма фото «лист»           */

  /* ---- Тени: мягкие, с голубым оттенком, никогда не чёрные ----------------- */
  --shadow-s:      0 6px 18px -10px oklch(45% 0.09 235 / .35);
  --shadow-l:      0 24px 48px -24px oklch(45% 0.09 235 / .45);
  --shadow-accent: 0 12px 24px -12px oklch(50% 0.12 235 / .7);

  /* ---- Движение ----------------------------------------------------------- */
  --dur:  200ms;
  --ease: cubic-bezier(.2, .7, .2, 1);
  --lift: -1px;                           /* кнопки; карточки поднимаются на 3px */
}

/* ---- Тема «Юнастом» --------------------------------------------------------
   Только цвета, вся остальная система та же. Включается классом на обёртке:
   <div class="pb-scope theme-yunastom"> (сейчас — вариант главной Directions/home/Dev/v3).
   Источник — логотип logo-yunastom-color.png: бирюза #0099A8 и графит #2B2A29.
   Контраст: белый на --accent 4.7:1, --fg на --bg 13.4:1, --muted 6.3:1,
   --accent-deep на --bg 6.3:1, граница поля 3.5:1. */
.pb-scope.theme-yunastom {
  --bg:       oklch(97.6% 0.012 200);   /* светлая бирюзовая дымка               */
  --surface:  oklch(99.5% 0.004 200);
  --fg:       oklch(28.6% 0.004 68);    /* графит логотипа #2B2A29              */
  --muted:    oklch(47% 0.018 205);
  --border:   oklch(90% 0.02 200);
  --accent:   oklch(54% 0.1 207);       /* бирюза логотипа, затемнена под белый текст */

  --brand:      #0099A8;                /* бирюза логотипа: волна, звёзды, маркеры.
                                           Белый на нём 3.4:1 — кнопки им не заливать */
  --brand-ice:  oklch(90% 0.045 203);   /* светлая бирюза: линии, пятна          */
  --brand-grey: #2B2A29;                /* графит логотипа                       */

  --accent-deep:    oklch(46% 0.088 209);
  --mist:           oklch(93% 0.032 200);
  --mist-hover:     oklch(88% 0.048 201);
  --border-control: oklch(62% 0.045 207);
  --on-accent:      oklch(99.5% 0.004 200);

  --shadow-s:      0 6px 18px -10px oklch(42% 0.07 210 / .35);
  --shadow-l:      0 24px 48px -24px oklch(42% 0.07 210 / .45);
  --shadow-accent: 0 12px 24px -12px oklch(46% 0.09 207 / .7);
}


/* =============================================================================
   BASE — сброс внутри .pb-scope, типографика и UI-примитивы
   ============================================================================= */

.pb-scope,
.pb-scope *,
.pb-scope *::before,
.pb-scope *::after { box-sizing: border-box; }

.pb-scope {
  background: var(--bg);
  color: var(--fg);
  font: 400 var(--fs-body)/var(--lh-body) var(--font-body);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
.pb-scope :where(h1, h2, h3, h4, h5, p, ul, ol, figure, blockquote, dl, dd) { margin: 0; }
.pb-scope :where(ul, ol) { padding: 0; list-style: none; }
.pb-scope :where(img, svg, video) { display: block; max-width: 100%; }
.pb-scope img { height: auto; }
.pb-scope :where(button, input, select, textarea) { font: inherit; color: inherit; }
.pb-scope [hidden] { display: none !important; }

/* ---- Типографика ---------------------------------------------------------- */
.pb-scope :where(h1, h2, h3, h4) {
  font-family: var(--font-display);
  font-weight: var(--w-display);
  line-height: var(--lh-display);
  letter-spacing: var(--tr-display);
  text-wrap: balance;
}
.pb-scope h1 { font-size: var(--fs-d1); }
.pb-scope h2 { font-size: var(--fs-d2); line-height: 1.1; }
.pb-scope h3 { font-size: var(--fs-h3); line-height: 1.2; letter-spacing: 0; }
.pb-scope :where(h1, h2) .hl { color: var(--accent); }          /* выделенная часть заголовка */
.pb-scope p { color: var(--fg); }
.pb-scope .lead { font-size: var(--fs-lead); color: var(--muted); max-width: 48ch; }
.pb-scope .muted { color: var(--muted); }
.pb-scope small, .pb-scope .caption { font-size: var(--fs-cap); color: var(--muted); }

/* Рукописная акцентная строка Caveat: не больше одной на экран. Естественный наклон почерка Caveat
   допустим (выбор оператора); строку не поворачивать и не делать курсивом/искусственным наклоном */
.pb-scope .accent-line {
  display: block;
  font: var(--w-accent) var(--fs-accent)/1.15 var(--font-accent);
  color: var(--accent);
  font-style: normal;
  transform: none;
  margin-bottom: var(--sp-2);
}
/* Крупные цифры и короткие факты (5000+, «В кредит»): Ubuntu */
.pb-scope .num {
  font: var(--w-num) var(--fs-num)/1.1 var(--font-num);
  letter-spacing: -0.02em;
  color: var(--fg);
}

.pb-scope a { color: var(--accent-deep); text-decoration: none; }
.pb-scope a:hover { text-decoration: underline; text-underline-offset: 4px; }
.pb-scope :focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }

/* ---- Раскладка ------------------------------------------------------------ */
.pb-scope .container { width: 100%; max-width: var(--maxw); margin-inline: auto; padding-inline: var(--gutter); }
.pb-scope .section   { padding-block: var(--sp-section); }
.pb-scope .surface   { background: var(--surface); }

/* ---- Кнопки --------------------------------------------------------------- */
.pb-scope .btn {
  display: inline-flex;
  align-items: center;
  gap: var(--sp-2);
  height: 56px;
  padding: 0 28px;
  border: 0;
  border-radius: var(--r-pill);
  font: var(--w-ui) 17px/1 var(--font-ui);
  text-decoration: none;
  cursor: pointer;
  transition: background-color var(--dur) var(--ease), transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.pb-scope .btn:hover { text-decoration: none; }
.pb-scope .btn svg { width: 18px; height: 18px; flex: none; }
/* Основная: одна на экран */
.pb-scope .btn--primary { background: var(--accent); color: var(--on-accent); box-shadow: var(--shadow-accent); }
.pb-scope .btn--primary:hover { background: var(--accent-deep); transform: translateY(var(--lift)); }
.pb-scope .btn--secondary { background: var(--mist); color: var(--fg); }
.pb-scope .btn--secondary:hover { background: var(--mist-hover); }
/* Текстовая: стрелка в белом кружке */
.pb-scope .btn--ghost { background: transparent; color: var(--fg); padding: 0 6px 0 0; }
.pb-scope .btn--ghost .btn__icon {
  display: grid; place-items: center;
  width: 44px; height: 44px; border-radius: 50%;
  background: var(--surface); color: var(--accent); box-shadow: var(--shadow-s);
  transition: background-color var(--dur) var(--ease);
}
.pb-scope .btn--ghost:hover .btn__icon { background: var(--mist); }
.pb-scope .btn[disabled], .pb-scope .btn[aria-disabled="true"] { background: var(--border); color: var(--muted); box-shadow: none; cursor: not-allowed; transform: none; }

/* ---- Поле ввода ----------------------------------------------------------- */
.pb-scope .field { display: block; margin-bottom: var(--sp-2); }
.pb-scope .field__label { display: block; margin-bottom: var(--sp-1); font: var(--w-ui) 15px/1.3 var(--font-ui); color: var(--fg); }
.pb-scope .input {
  width: 100%;
  height: 56px;
  padding: 0 20px;
  border: 1.5px solid var(--border-control);
  border-radius: var(--r-field);
  background: var(--surface);
  font: 400 var(--fs-body)/1 var(--font-body);
  color: var(--fg);
  transition: border-color var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.pb-scope .input::placeholder { color: var(--muted); }
.pb-scope .input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 5px var(--mist); }
.pb-scope .input.is-error, .pb-scope .input[aria-invalid="true"] { border-color: var(--danger); }
.pb-scope .field__hint { margin-top: 6px; font-size: 14px; color: var(--muted); }
.pb-scope .field__hint--error { color: var(--danger); }

/* ---- Карточка ------------------------------------------------------------- */
.pb-scope .card {
  display: flex; flex-direction: column; gap: var(--sp-2);
  padding: 28px;
  border-radius: var(--r-card);
  background: var(--surface);
  box-shadow: var(--shadow-s);
  color: var(--fg);
  transition: transform var(--dur) var(--ease), box-shadow var(--dur) var(--ease);
}
.pb-scope a.card:hover { transform: translateY(-3px); box-shadow: var(--shadow-l); text-decoration: none; }
.pb-scope .card h3 { font-size: var(--fs-h3); }
.pb-scope .card p { font-size: 16px; color: var(--muted); }
.pb-scope .card__more { display: inline-flex; align-items: center; gap: var(--sp-1); text-align: left; font: var(--w-ui) 16px/1 var(--font-ui); color: var(--accent); }

/* ---- Иконка в кружке ------------------------------------------------------ */
.pb-scope .icon-dot {
  display: grid; place-items: center; flex: none;
  width: 52px; height: 52px; border-radius: 50%;
  background: var(--mist); color: var(--accent);
}
.pb-scope .icon-dot svg { width: 24px; height: 24px; }
.pb-scope .icon-dot--sm { width: 32px; height: 32px; }
.pb-scope .icon-dot--sm svg { width: 17px; height: 17px; }

/* ---- Плашка (чип) поверх фото или в тексте -------------------------------- */
.pb-scope .chip {
  display: inline-flex; align-items: center; gap: 10px;
  padding: 8px 16px 8px 8px;
  border-radius: var(--r-pill);
  background: oklch(99.5% 0.004 225 / .94);
  box-shadow: var(--shadow-s);
  font: var(--w-ui) 15px/1.2 var(--font-ui);
  color: var(--fg);
}

/* ---- Фото-«лист» ---------------------------------------------------------- */
.pb-scope .leaf { position: relative; overflow: hidden; border-radius: var(--r-leaf); box-shadow: var(--shadow-l); }
.pb-scope .leaf > img { width: 100%; height: 100%; object-fit: cover; }

@media (prefers-reduced-motion: reduce) {
  .pb-scope *, .pb-scope *::before, .pb-scope *::after { transition: none !important; animation: none !important; }
}


/* =============================================================================
   COMPONENTS
   CSS секций собранных страниц. Заполняется при сборке первой страницы
   (page-builder-orchestrator); устойчивые части затем выносит в библиотеку
   блоков `extract-to-library`.
   Первая страница: Directions/dch-clinic-ru-glavnaya-lending/Result/index.html (2026-10-07).
   ============================================================================= */

/* ---- Знак рубля -----------------------------------------------------------
   В Ubuntu нет глифа ₽ (рисуется «квадратик»), в Open Sans он пустой. Для одного
   символа U+20BD подставляем ₽ из PT Sans (ParaType, OFL): файлы — подмножество из
   одного знака, ~2 КБ. Остальной текст рисуется прежними шрифтами. Правила стоят
   после @import Google Fonts, поэтому для U+20BD браузер берёт их первыми. */
@font-face { font-family: "Ubuntu"; font-style: normal; font-weight: 500; font-display: swap; src: url("fonts/rub-ptsans-700.woff2") format("woff2"); unicode-range: U+20BD; }
@font-face { font-family: "Ubuntu"; font-style: normal; font-weight: 700; font-display: swap; src: url("fonts/rub-ptsans-700.woff2") format("woff2"); unicode-range: U+20BD; }
@font-face { font-family: "Open Sans"; font-style: normal; font-weight: 400; font-display: swap; src: url("fonts/rub-ptsans-400.woff2") format("woff2"); unicode-range: U+20BD; }
@font-face { font-family: "Open Sans"; font-style: normal; font-weight: 600; font-display: swap; src: url("fonts/rub-ptsans-700.woff2") format("woff2"); unicode-range: U+20BD; }

/* ---- Оболочка страницы ----------------------------------------------------
   Работает, только когда .pb-scope — прямой ребёнок body (отдельная страница).
   При встраивании в чужой сайт (Tilda) эти два правила ни на что не влияют. */
body:has(> .pb-scope) { margin: 0; }
html:has(body > .pb-scope) { scroll-behavior: smooth; scroll-padding-top: 104px; }
@media (prefers-reduced-motion: reduce) { html:has(body > .pb-scope) { scroll-behavior: auto; } }

.pb-scope { overflow-x: clip; }

/* ---- Дополнения примитивов (пакет ДС, components.css · BASE) -------------- */
.pb-scope .sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.pb-scope .skip-link { position: absolute; left: 16px; top: -64px; z-index: 60; padding: 12px 20px; border-radius: var(--r-pill); background: var(--surface); box-shadow: var(--shadow-l); font: var(--w-ui) 16px/1 var(--font-ui); color: var(--fg); }
.pb-scope .skip-link:focus { top: 12px; }
.pb-scope .btn { justify-content: center; white-space: nowrap; }
.pb-scope .btn--block { width: 100%; }
.pb-scope .btn--sm { height: 48px; padding: 0 22px; font-size: 16px; }
.pb-scope .icon-dot--lg { width: 56px; height: 56px; }
.pb-scope .icon-dot--lg svg { width: 28px; height: 28px; }
.pb-scope .icon-dot--surface { background: var(--surface); }
.pb-scope select.input {
  appearance: none; padding-right: 48px; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234F606D' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 18px center; background-size: 18px;
}
.pb-scope .check { display: flex; align-items: flex-start; gap: var(--sp-2); font-size: 14px; line-height: 1.5; color: var(--muted); cursor: pointer; }
.pb-scope .check input { flex: none; width: 22px; height: 22px; margin: 1px 0 0; accent-color: var(--accent); cursor: pointer; }
.pb-scope .check a { text-decoration: underline; text-underline-offset: 3px; }
.pb-scope .check.is-error { color: var(--danger); }
.pb-scope .check__hint { margin: 6px 0 0 34px; }
.pb-scope .field > label { display: block; }
.pb-scope .nowrap { white-space: nowrap; }
.pb-scope :where(p, li, figcaption, blockquote, .lead, .caption) { text-wrap: pretty; }
.pb-scope :where(.card, .doctor, .note, .finance__item) h3 { text-wrap: pretty; }
.pb-scope .surface .card { background: var(--bg); }

/* ---- Заголовок секции ----------------------------------------------------- */
.pb-scope .section { scroll-margin-top: 96px; }
.pb-scope .sec-head { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--sp-3) var(--sp-4); flex-wrap: wrap; margin-bottom: var(--sp-4); }
.pb-scope .sec-head > div { max-width: 760px; }
.pb-scope .sec-head .lead { margin-top: var(--sp-2); max-width: 60ch; }

/* ---- Шапка: строка адреса + липкая пилюля --------------------------------- */
.pb-scope .topline { display: flex; justify-content: space-between; gap: var(--sp-3); height: 42px; align-items: center; overflow: hidden; white-space: nowrap; font: 400 14px/1.4 var(--font-body); color: var(--muted); }
.pb-scope .topline__item { display: inline-flex; align-items: center; gap: var(--sp-1); min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.pb-scope .topline svg { width: 16px; height: 16px; flex: none; color: var(--accent); }
.pb-scope .site-head { position: sticky; top: -34px; z-index: 30; padding-bottom: var(--sp-1); }
.pb-scope .site-head > .container { position: relative; }
.pb-scope .site-bar { position: relative; z-index: 3; display: flex; align-items: center; gap: 20px; padding: 8px 10px 8px 12px; border-radius: var(--r-pill); background: var(--surface); box-shadow: var(--shadow-s); }
.pb-scope .site-head.is-stuck .site-bar { box-shadow: var(--shadow-l); }
.pb-scope .site-bar__brand { display: flex; align-items: center; gap: 10px; flex: none; font: var(--w-display) 20px/1 var(--font-display); color: var(--fg); }
.pb-scope .site-bar__brand:hover { text-decoration: none; color: var(--fg); }
.pb-scope .site-bar__brand img { width: 42px; height: 44px; }
.pb-scope .site-bar__brand small { display: block; margin-top: 4px; font: 400 12px/1 var(--font-body); color: var(--muted); }
/* Логотип-надпись (название внутри картинки): ширина по пропорциям, высота фиксирована */
.pb-scope .site-bar__brand.site-bar__brand--wordmark { margin-left: 16px; }  /* прямоугольная надпись не должна прижиматься к скруглению пилюли */
.pb-scope .site-bar__brand.site-bar__brand--wordmark img { width: auto; height: 40px; }
.pb-scope .site-footer__brand.site-footer__brand--wordmark img { width: auto; height: 52px; }  /* сильнее .site-footer__brand img ниже по файлу */
.pb-scope .site-bar__nav { display: flex; gap: 2px; margin-left: auto; }
.pb-scope .site-bar__nav a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 12px; border-radius: var(--r-pill); font: var(--w-ui) 16px/1 var(--font-ui); color: var(--fg); white-space: nowrap; transition: background-color var(--dur) var(--ease); }
.pb-scope .site-bar__nav a:hover { background: var(--mist); color: var(--fg); text-decoration: none; }
.pb-scope .site-bar__tel { display: inline-flex; align-items: center; gap: 10px; flex: none; padding: 6px 18px 6px 6px; border-radius: var(--r-pill); background: var(--mist); color: var(--fg); font: var(--w-display) 16px/1 var(--font-ui); white-space: nowrap; transition: background-color var(--dur) var(--ease); }
.pb-scope .site-bar__tel:hover { background: var(--mist-hover); color: var(--fg); text-decoration: none; }
.pb-scope .site-bar__tel > span { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: var(--surface); color: var(--accent); }
.pb-scope .site-bar__tel svg { width: 18px; height: 18px; }
.pb-scope .site-bar__burger { display: none; place-items: center; flex: none; width: 44px; height: 44px; border: 0; border-radius: 50%; background: var(--mist); color: var(--fg); cursor: pointer; transition: background-color var(--dur) var(--ease); }
.pb-scope .site-bar__burger:hover { background: var(--mist-hover); }
.pb-scope .site-bar__burger svg { width: 20px; height: 20px; }
.pb-scope .site-bar__drawer { position: absolute; left: var(--gutter); right: var(--gutter); top: calc(100% + var(--sp-1)); z-index: 2; padding: var(--sp-1); border-radius: var(--r-card); background: var(--surface); box-shadow: var(--shadow-l); }
.pb-scope .site-bar__drawer a { display: flex; align-items: center; min-height: 48px; padding: 0 18px; border-radius: var(--r-field); font: var(--w-ui) 17px/1 var(--font-ui); color: var(--fg); }
.pb-scope .site-bar__drawer a:hover { background: var(--mist); color: var(--fg); text-decoration: none; }

/* ---- Первый экран --------------------------------------------------------- */
.pb-scope .hero { position: relative; isolation: isolate; }
.pb-scope .hero__grid { position: relative; z-index: 2; display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: var(--sp-5); align-items: center; padding-block: 40px 56px; }
.pb-scope .hero__lead { margin-top: var(--sp-3); max-width: 52ch; }
.pb-scope .hero__theses { display: grid; gap: var(--sp-2); margin-top: var(--sp-3); }
.pb-scope .hero__theses li { display: flex; align-items: flex-start; gap: var(--sp-2); font-size: 17px; line-height: 1.45; }
.pb-scope .hero__theses .icon-dot { margin-top: -4px; }
.pb-scope .hero__actions { display: flex; align-items: center; gap: var(--sp-2) var(--sp-3); flex-wrap: wrap; margin-top: var(--sp-4); }
.pb-scope .hero__media { position: relative; }
.pb-scope .hero__blob { position: absolute; inset: -7% -10% -5% 8%; background: var(--mist); border-radius: 46% 54% 42% 58% / 52% 44% 56% 48%; }
.pb-scope .hero__photo { aspect-ratio: 1 / 1.02; max-height: 560px; width: 100%; }
.pb-scope .hero__photo > img { object-position: 64% 40%; }
.pb-scope .hero__chips { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.pb-scope .chip--tr { position: absolute; right: 20px; top: 20px; }
.pb-scope .chip--bl { position: absolute; left: 20px; bottom: 20px; }
.pb-scope .wave { position: absolute; left: 0; right: 0; bottom: 64px; z-index: 0; width: 100%; height: 140px; pointer-events: none; color: var(--brand-ice); }
/* Первый экран без панели под ним: волна живёт только в нижнем отступе и не заходит под текст и кнопки */
.pb-scope .hero--plain .hero__grid { padding-bottom: 72px; }
.pb-scope .hero--plain .wave { bottom: 24px; height: 72px; color: color-mix(in oklch, var(--brand) 65%, var(--brand-ice)); }
.pb-scope :is(.hero--plain, .section--wave) .wave path { stroke-width: 3; vector-effect: non-scaling-stroke; }
/* ≤ 1180px плашки встают под фото — волну опускаем, чтобы она шла ниже них */
@media (max-width: 1180px) { .pb-scope .hero--plain .wave { bottom: 4px; } }
/* Вторая волна — в секции (сейчас «О клинике»): зеркальная, только в нижнем отступе, под контентом */
.pb-scope .section--wave { position: relative; isolation: isolate; }
.pb-scope .section--wave > .container { position: relative; z-index: 1; }
.pb-scope .section--wave .wave { bottom: 12px; height: 72px; transform: scaleX(-1); color: color-mix(in oklch, var(--brand) 65%, var(--brand-ice)); }
@media (max-width: 1180px) { .pb-scope .section--wave .wave { bottom: 4px; height: 56px; } }
@media (max-width: 560px) { .pb-scope .section--wave .wave { height: 48px; } }
@media (max-width: 860px) {
  .pb-scope .hero--plain .hero__grid { padding-bottom: 56px; }
  .pb-scope .hero--plain .wave { bottom: 4px; height: 52px; }
}
.pb-scope .usp { position: relative; z-index: 2; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); padding: var(--sp-1); border-radius: var(--r-card); background: var(--surface); box-shadow: var(--shadow-l); }
.pb-scope .usp__cell { display: flex; align-items: flex-start; gap: 16px; padding: 18px 20px; }
.pb-scope .usp__cell + .usp__cell { box-shadow: inset 1px 0 0 var(--border); }
.pb-scope .usp__cell .num { display: block; }
.pb-scope .usp__cell .caption { display: block; margin-top: 3px; font-size: var(--fs-small); line-height: 1.35; }
.pb-scope .legal-band { margin-top: var(--sp-4); padding: 22px 28px; border-radius: var(--r-pill); background: var(--mist); text-align: center; font: var(--w-ui) clamp(17px, 1.7vw, 22px)/1.35 var(--font-ui); color: var(--fg); }

/* ---- «С чем вы пришли?» — карточки-двери ---------------------------------- */
.pb-scope .doors { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--sp-3); }
.pb-scope .door { gap: 14px; }
.pb-scope .door--urgent { background: var(--mist); box-shadow: none; }
.pb-scope .door--urgent .icon-dot { background: var(--surface); }
.pb-scope .door--urgent .door__fact { border-top-color: var(--mist-hover); }
.pb-scope .surface .door--urgent { background: var(--mist); }  /* на белой секции срочная карточка остаётся голубой */
.pb-scope .door h3 { margin-top: 6px; }
/* Подзаголовок карточки — одна фраза между названием и описанием */
.pb-scope .card p.door__sub { font: 400 16px/1.45 var(--font-body); color: var(--fg); }  /* не жирный — правка владельца 14.10 */
.pb-scope .door__fact { display: grid; gap: 4px; margin-top: auto; padding-top: var(--sp-3); border-top: 1px solid var(--border); }
.pb-scope .door__fact b { font: var(--w-num) 26px/1.1 var(--font-num); letter-spacing: -0.01em; color: var(--fg); }
.pb-scope .door__fact s { margin-left: 8px; font: 400 15px/1 var(--font-body); color: var(--muted); }
.pb-scope .door__fact span { font-size: 14px; line-height: 1.4; color: var(--muted); }
.pb-scope .door .card__more { margin-top: var(--sp-1); min-height: 44px; }
.pb-scope .door .card__more svg { width: 16px; height: 16px; }
.pb-scope .card__more { display: inline-flex; align-items: center; gap: var(--sp-1); text-align: left; font: var(--w-ui) 16px/1 var(--font-ui); color: var(--accent-deep); background: none; border: 0; padding: 0; cursor: pointer; }
.pb-scope .card__more:hover { text-decoration: underline; text-underline-offset: 4px; color: var(--accent-deep); }
.pb-scope .doors__note { margin-top: var(--sp-3); font-size: 14px; color: var(--muted); }
.pb-scope .doors__foot { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-2) var(--sp-4); margin-top: var(--sp-4); }
.pb-scope .doors__foot .doors__note { margin-top: 0; }

/* ---- Смета: крупная цифра + документ с правилами ------------------------ */
.pb-scope .estimate { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--sp-5); align-items: start; }
.pb-scope .estimate__copy { position: sticky; top: 120px; padding-top: var(--sp-3); }
.pb-scope .estimate__copy .lead { margin-top: var(--sp-3); max-width: 46ch; }
.pb-scope .estimate__copy .btn { margin-top: var(--sp-4); }
.pb-scope .stat { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: var(--sp-3); margin-top: var(--sp-5); padding-block: var(--sp-3); border-block: 1px solid var(--border); }
.pb-scope .stat__num { font: var(--w-num) clamp(64px, 7vw, 104px)/.9 var(--font-num); letter-spacing: -0.04em; color: var(--fg); font-variant-numeric: tabular-nums; }
.pb-scope .stat p { font: var(--w-ui) 18px/1.35 var(--font-ui); max-width: 26ch; }
.pb-scope .stat cite { display: block; margin-top: 8px; font: normal 400 13px/1.4 var(--font-body); color: var(--muted); }
.pb-scope .estimate-doc__rules { display: grid; gap: 14px; margin-top: 22px; padding-top: 22px; border-top: 1.5px solid var(--fg); }
.pb-scope .estimate-doc__rules li { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 12px; align-items: start; font-size: 15px; line-height: 1.5; }
.pb-scope .estimate-doc__rules b { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--mist); font: var(--w-num) 14px/1 var(--font-num); color: var(--accent-deep); }
.pb-scope .estimate-doc__rules strong { font-family: var(--font-ui); font-weight: var(--w-ui); }
.pb-scope .estimate-doc { position: relative; padding: 32px 32px 28px; border-radius: var(--r-card); background: var(--surface); box-shadow: var(--shadow-l), inset 0 0 0 1px var(--border); }
.pb-scope .estimate-doc__head { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-2); padding-bottom: 18px; border-bottom: 1.5px solid var(--fg); }
.pb-scope .estimate-doc__title { font: var(--w-display) 22px/1.2 var(--font-display); }
.pb-scope .estimate-doc__tag { padding: 6px 12px; border-radius: var(--r-pill); background: var(--mist); font: var(--w-ui) 13px/1 var(--font-ui); color: var(--fg); white-space: nowrap; }
.pb-scope .estimate-doc__rows { margin-top: 6px; }
.pb-scope .estimate-doc__row { display: grid; grid-template-columns: minmax(0, 1fr) 84px; align-items: center; gap: var(--sp-2); padding-block: 13px; border-bottom: 1px dashed var(--border); font-size: 15px; }
.pb-scope .estimate-doc__row b { justify-self: end; font: var(--w-num) 16px/1 var(--font-num); }
.pb-scope .estimate-doc__bar { display: inline-flex; align-items: flex-end; gap: 6px; justify-self: end; font: var(--w-num) 16px/1 var(--font-num); font-style: normal; color: var(--fg); }
.pb-scope .estimate-doc__bar::before { content: ""; width: 52px; height: 1em; border-bottom: 1.5px solid var(--border-control); }
.pb-scope .estimate-doc__bar::after { content: "₽"; }
.pb-scope .estimate-doc__bar--short::before { width: 36px; }
.pb-scope .estimate-doc__total { display: grid; grid-template-columns: minmax(0, 1fr) 84px; align-items: center; gap: var(--sp-2); padding-top: 16px; font: var(--w-display) 18px/1 var(--font-display); }
.pb-scope .estimate-doc__total .estimate-doc__bar { font-size: 18px; }
.pb-scope .estimate-doc__total .estimate-doc__bar::before { width: 72px; border-bottom: 2px solid var(--fg); }
.pb-scope .estimate-doc__sign { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-3); margin-top: 28px; }
.pb-scope .estimate-doc__sign span { padding-top: 8px; border-top: 1.5px solid var(--border-control); font-size: 13px; color: var(--muted); }
.pb-scope .estimate-doc__caption { margin-top: var(--sp-3); font-size: 15px; color: var(--muted); }

/* ---- Первый визит: горизонтальный степпер + короткая форма ------------------------- */
.pb-scope .stepper { position: relative; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: var(--sp-3); }
.pb-scope .stepper::before { content: ""; position: absolute; left: 26px; right: calc((100% - 4 * var(--sp-3)) / 5 - 26px); top: 25px; height: 2px; background: var(--brand-ice); }
.pb-scope .stepper__step { position: relative; }
.pb-scope .stepper__n { position: relative; display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: var(--surface); box-shadow: var(--shadow-s); font: var(--w-num) 20px/1 var(--font-num); color: var(--accent-deep); }
.pb-scope .stepper__step--key .stepper__n { background: var(--accent); color: var(--on-accent); }
.pb-scope .stepper__step h3 { margin-top: var(--sp-3); font-size: 19px; line-height: 1.3; }
.pb-scope .stepper__step p { margin-top: 6px; font-size: 16px; color: var(--muted); }
.pb-scope .plan-pair { display: flex; flex-wrap: wrap; gap: 6px; margin-top: var(--sp-2); }
.pb-scope .plan-pair span { padding: 7px 12px; border-radius: var(--r-pill); background: var(--surface); box-shadow: var(--shadow-s); font: var(--w-ui) 14px/1 var(--font-ui); }
.pb-scope .visit__notes { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--sp-3); margin-top: var(--sp-5); }
.pb-scope .note { display: flex; align-items: flex-start; gap: var(--sp-3); padding: 24px 28px; border-radius: var(--r-card); background: var(--surface); box-shadow: var(--shadow-s); }
.pb-scope .note h3 { font-size: 19px; line-height: 1.3; }
.pb-scope .note p { margin-top: 6px; font-size: 16px; color: var(--muted); }
.pb-scope .note blockquote { margin-top: 6px; font-size: 16px; }
.pb-scope .note cite { display: block; margin-top: 6px; font: normal 400 13px/1.4 var(--font-body); color: var(--muted); }
.pb-scope .quick-form { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: var(--sp-4); align-items: center; margin-top: var(--sp-5); padding: var(--sp-4); border-radius: var(--r-panel); background: var(--surface); box-shadow: var(--shadow-l); }
.pb-scope .quick-form h3 { font-size: 26px; line-height: 1.15; }
.pb-scope .quick-form__intro p { margin-top: var(--sp-2); color: var(--muted); }
.pb-scope .form-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0 var(--sp-2); }
.pb-scope .form-grid .field--wide { grid-column: 1 / -1; }
.pb-scope .form-foot { display: grid; gap: var(--sp-2); margin-top: var(--sp-1); }
.pb-scope .form-foot .caption { font-size: 14px; }

/* ---- Врачи ---------------------------------------------------------------- */
.pb-scope .team { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-3); }
.pb-scope .doctor { display: flex; flex-direction: column; overflow: hidden; border-radius: var(--r-card); background: var(--bg); box-shadow: var(--shadow-s); }
.pb-scope .doctor__photo { aspect-ratio: 4 / 5; overflow: hidden; background: var(--mist); }
.pb-scope .doctor__photo img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 18%; }
.pb-scope .doctor__body { display: flex; flex-direction: column; gap: 6px; flex: 1; padding: 24px 28px 28px; }
.pb-scope .doctor__role { font: var(--w-ui) 15px/1.3 var(--font-ui); color: var(--accent-deep); }
.pb-scope .doctor h3 { font-size: var(--fs-h3); }
.pb-scope .doctor p { font-size: 16px; color: var(--muted); }
.pb-scope .doctor p { margin-bottom: var(--sp-3); }
.pb-scope .doctor .btn { margin-top: auto; align-self: flex-start; }
/* Врачи на голубой секции: карточки и плашки направлений — белые, чтобы не слиться с фоном */
.pb-scope .section:not(.surface) .doctor, .pb-scope .section:not(.surface) .tag-list li { background: var(--surface); }
/* Два врача в ряд: горизонтальные карточки — фото слева во всю высоту, текст справа.
   ≤ 960px — по одной в ряд, ≤ 560px — снова вертикальные */
.pb-scope .team--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.pb-scope .team--2 .doctor { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); }
/* max-height: при раскрытом спойлере фото не тянется за карточкой (иначе cover режет кадр до фрагмента) */
.pb-scope .team--2 .doctor__photo { aspect-ratio: auto; min-height: 380px; max-height: 480px; }
.pb-scope .team--2 .doctor__body { padding: 28px 28px 28px 30px; }
.pb-scope .doctor__photo .obj-right { object-position: 86% 50%; }
/* Антонов: лицо на 59% ширины горизонтального кадра; 63% ставит его в центр узкой колонки фото */
.pb-scope .team--2 .doctor__photo .obj-right { object-position: 63% 50%; }
/* Чекалин: над головой четверть кадра стены — приближаем, низ кадра остаётся на месте */
.pb-scope .doctor__photo .obj-zoom { transform: scale(1.2); transform-origin: 50% 75%; }
/* Спойлер «Подробнее о враче»: в закрытом виде прижат к кнопке, поэтому у карточек
   ряда строки-спойлеры стоят на одной высоте; открытый растёт вниз и сдвигает кнопку */
.pb-scope .doctor__more { margin: auto 0 var(--sp-2); border-top: 1px solid var(--border); }
.pb-scope .doctor .doctor__more + .btn { margin-top: 0; }
.pb-scope .doctor__more summary { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-1); min-height: 52px; padding-top: 8px; list-style: none; cursor: pointer; font: var(--w-ui) 15px/1.3 var(--font-ui); color: var(--accent-deep); }
.pb-scope .doctor__more summary::-webkit-details-marker { display: none; }
.pb-scope .doctor__more-icon { display: grid; place-items: center; flex: none; width: 32px; height: 32px; border-radius: 50%; background: var(--mist); color: var(--accent-deep); transition: transform var(--dur) var(--ease), background-color var(--dur) var(--ease); }
.pb-scope .doctor__more-icon svg { width: 16px; height: 16px; }
.pb-scope .doctor__more summary:hover .doctor__more-icon { background: var(--mist-hover); }
.pb-scope .doctor__more[open] .doctor__more-icon { transform: rotate(180deg); }
.pb-scope .doctor__facts { padding: 6px 0 4px; }
.pb-scope .doctor__facts dt { font: var(--w-ui) 14px/1.3 var(--font-ui); color: var(--fg); }
.pb-scope .doctor__facts dd { margin: 4px 0 14px; font-size: 15px; line-height: 1.5; color: var(--muted); text-wrap: pretty; }
.pb-scope .doctor__facts dd:last-child { margin-bottom: 0; }
/* Перечни внутри спойлера: каждый пункт с новой строки, маркер — точка цвета логотипа */
.pb-scope .doctor__list { display: grid; gap: 4px; }
.pb-scope .doctor__list li { position: relative; padding-left: 16px; }
.pb-scope .doctor__list li::before { content: ""; position: absolute; left: 2px; top: calc(.75em - 2.5px); width: 5px; height: 5px; border-radius: 50%; background: var(--brand); }
.pb-scope .doctor__facts dd p { margin: 10px 0 0; font-size: 15px; line-height: 1.5; color: var(--muted); }
@media (max-width: 960px) {
  .pb-scope .team.team--2 { grid-template-columns: minmax(0, 1fr); }  /* сильнее общего .team из «Адаптива» */
  .pb-scope .team--2 .doctor { grid-template-columns: minmax(0, 300px) minmax(0, 1fr); }
}
@media (max-width: 560px) {
  .pb-scope .team--2 .doctor { display: flex; }
  .pb-scope .team--2 .doctor__photo { aspect-ratio: 4 / 5; min-height: 0; }
  .pb-scope .team--2 .doctor__photo .obj-right { object-position: 69% 50%; }
  .pb-scope .team--2 .doctor__body { padding: 22px 22px 24px; }
  .pb-scope .team--2 .doctor .btn { align-self: stretch; }
}
.pb-scope .tag-list { display: flex; flex-wrap: wrap; gap: var(--sp-1); margin-top: var(--sp-4); }
.pb-scope .tag-list li { display: inline-flex; align-items: center; gap: 10px; padding: 8px 16px; border-radius: var(--r-pill); background: var(--bg); font: var(--w-ui) 15px/1.2 var(--font-ui); }

/* ---- Отзывы --------------------------------------------------------------- */

.pb-scope .rating-band { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--sp-2) var(--sp-4); padding: 18px 20px 18px 28px; border-radius: var(--r-card); background: var(--surface); box-shadow: var(--shadow-s); }
.pb-scope .surface .rating-band { background: var(--bg); }  /* отзывы на белой секции */
.pb-scope .rating-band__score { display: flex; align-items: center; gap: var(--sp-2); }
.pb-scope .rating-band__num { font: var(--w-num) 44px/1 var(--font-num); letter-spacing: -0.03em; font-variant-numeric: tabular-nums; }
.pb-scope .stars { display: inline-flex; gap: 3px; color: var(--brand); }
.pb-scope .stars svg { width: 20px; height: 20px; }
.pb-scope .rating-band p b { display: block; font: var(--w-ui) 17px/1.3 var(--font-ui); }
.pb-scope .rating-band p span { display: block; margin-top: 2px; font-size: 14px; color: var(--muted); }
.pb-scope .reviews-lead { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: var(--sp-5); align-items: start; margin-top: var(--sp-5); }
.pb-scope .review { display: flex; flex-direction: column; gap: var(--sp-2); }
.pb-scope .review__tag { align-self: flex-start; padding: 6px 12px; border-radius: var(--r-pill); background: var(--mist); font: var(--w-ui) 13px/1 var(--font-ui); color: var(--fg); }
.pb-scope .review blockquote { font-size: 17px; line-height: 1.55; color: var(--fg); }
.pb-scope .review figcaption { font-size: 13px; color: var(--muted); }
.pb-scope .review--lead { position: relative; padding-top: 104px; }
.pb-scope .review--lead .review__tag { position: relative; z-index: 1; }
.pb-scope .review--lead::before { content: "\00AB"; position: absolute; left: -6px; top: -64px; font: var(--w-display) 180px/1 var(--font-display); color: var(--brand-ice); pointer-events: none; }
.pb-scope .review--lead blockquote { font: var(--w-ui) clamp(26px, 2.8vw, 40px)/1.22 var(--font-display); letter-spacing: -0.01em; text-wrap: balance; }
.pb-scope .review--lead figcaption { font-size: 15px; }
.pb-scope .reviews-lead__list { display: grid; }
.pb-scope .reviews-lead__list .review { padding-block: var(--sp-3); border-top: 1px solid var(--border); }
.pb-scope .reviews-lead__list .review:first-child { padding-top: 0; border-top: 0; }

/* ---- Фото + текст (split) ------------------------------------------------- */
.pb-scope .split { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: var(--sp-5); align-items: center; }
.pb-scope .split__media { position: relative; padding: 4% 6% 4% 0; }
.pb-scope .split__media .hero__blob { inset: 0 0 0 10%; }
.pb-scope .leaf--portrait { aspect-ratio: 4 / 5; max-height: 600px; }
.pb-scope .leaf--portrait > img { object-position: 50% 30%; }
.pb-scope .split__copy .lead { margin-top: var(--sp-3); }
.pb-scope .checks { display: grid; gap: 14px; margin-top: var(--sp-4); }
.pb-scope .checks li { display: flex; align-items: flex-start; gap: var(--sp-2); font-size: 17px; line-height: 1.45; }
.pb-scope .checks .icon-dot { margin-top: -4px; }
.pb-scope .split__actions { margin-top: var(--sp-4); }

/* ---- Виниры и коронки ----------------------------------------------------- */
.pb-scope .smile .lead { margin-top: var(--sp-3); }
.pb-scope .smile { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: var(--sp-5); align-items: center; }
.pb-scope .smile__steps { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-3) var(--sp-4); margin-top: var(--sp-4); }
.pb-scope .smile__steps li { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 14px; align-items: start; font-size: 16px; line-height: 1.45; }
.pb-scope .smile__steps b { display: block; font: var(--w-ui) 17px/1.3 var(--font-ui); }
.pb-scope .smile__steps span { color: var(--muted); }
.pb-scope .smile__n { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: var(--mist); font: var(--w-num) 16px/1 var(--font-num); color: var(--accent-deep); }
.pb-scope .smile__media { position: relative; padding: 4% 0 4% 6%; }
.pb-scope .smile__media .hero__blob { inset: 0 10% 0 0; }
.pb-scope .pricelist { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); margin-top: var(--sp-5); overflow: hidden; border-radius: var(--r-panel); background: var(--surface); box-shadow: var(--shadow-l); }
.pb-scope .pricelist__list { padding: 32px 36px; }
.pb-scope .pricelist__list h3 { font-size: var(--fs-h3); margin-bottom: 6px; }
.pb-scope .price-row { display: flex; align-items: baseline; justify-content: space-between; gap: var(--sp-2); padding-block: 15px; border-bottom: 1px solid var(--border); font-size: 17px; }
.pb-scope .price-row:last-of-type { border-bottom: 0; }
.pb-scope .price-row small { display: block; font-size: 14px; color: var(--muted); }
.pb-scope .price-row b { flex: none; font: var(--w-num) 22px/1.1 var(--font-num); white-space: nowrap; }
.pb-scope .pricelist__note { margin-top: var(--sp-2); font-size: 14px; color: var(--muted); }
.pb-scope .pricelist__aside { display: flex; flex-direction: column; gap: var(--sp-3); padding: 32px 36px; background: var(--mist); }
.pb-scope .calc { font-size: 16px; }
.pb-scope .calc b { display: block; margin-top: 6px; font: var(--w-num) 26px/1.15 var(--font-num); letter-spacing: -0.01em; }
.pb-scope .calc span { display: block; margin-top: 4px; font-size: 14px; color: var(--muted); }
.pb-scope .pricelist__aside .btn { margin-top: auto; align-self: flex-start; background: var(--surface); }
.pb-scope .pricelist__aside .btn:hover { background: var(--mist-hover); }

/* ---- Срочный приём -------------------------------------------------------- */
.pb-scope .band { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, .7fr); overflow: hidden; border-radius: var(--r-panel); background: var(--mist); }
.pb-scope .band__copy { padding: var(--sp-5); }
.pb-scope .band__copy .lead { margin-top: var(--sp-3); color: var(--fg); max-width: 56ch; }
.pb-scope .band__price { display: flex; align-items: center; gap: var(--sp-2); margin-top: var(--sp-3); font: var(--w-ui) 17px/1.4 var(--font-ui); }
.pb-scope .flow { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-1); margin-top: var(--sp-4); }
.pb-scope .flow li { display: inline-flex; align-items: center; gap: var(--sp-1); font: var(--w-ui) 15px/1.3 var(--font-ui); }
.pb-scope .flow li span { display: inline-flex; align-items: center; gap: 10px; padding: 6px 16px 6px 6px; border-radius: var(--r-pill); background: var(--surface); }
.pb-scope .flow li b { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--mist); font: var(--w-num) 14px/1 var(--font-num); color: var(--accent-deep); }
.pb-scope .band__actions { display: flex; flex-wrap: wrap; gap: var(--sp-2); margin-top: var(--sp-4); }
.pb-scope .band__actions .btn--secondary { background: var(--surface); }
.pb-scope .band__actions .btn--secondary:hover { background: var(--mist-hover); }
.pb-scope .band__aside { margin-top: var(--sp-3); font-size: 15px; color: var(--muted); }
.pb-scope .band__media { position: relative; min-height: 100%; }
.pb-scope .band__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 28%; }

/* ---- Акция: панель-талон с отрывным корешком ------------------------------ */
/* Слева аргументы, справа корешок с ценой и записью. Пунктир и два выреза
   цвета фона секции (--bg) — линия отрыва; на узком экране она горизонтальная. */
.pb-scope .promo { position: relative; display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, .75fr); overflow: hidden; border-radius: var(--r-panel); background: var(--surface); box-shadow: var(--shadow-l); }
.pb-scope .promo__copy { padding: var(--sp-5); }
.pb-scope .promo__copy .lead { margin-top: var(--sp-3); max-width: 52ch; }
.pb-scope .promo__facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-3) var(--sp-4); margin-top: var(--sp-4); padding-top: var(--sp-4); border-top: 1px solid var(--border); }
.pb-scope .promo__facts li { display: flex; align-items: center; gap: 14px; font: var(--w-ui) 17px/1.35 var(--font-ui); }
.pb-scope .promo__stub { position: relative; display: flex; flex-direction: column; align-items: flex-start; padding: var(--sp-5) var(--sp-4); border-left: 2px dashed var(--border-control); background: var(--mist); }
.pb-scope .promo__stub::before,
.pb-scope .promo__stub::after { content: ""; position: absolute; left: -19px; width: 36px; height: 36px; border-radius: 50%; background: var(--bg); box-shadow: inset 0 0 7px oklch(45% 0.09 235 / .22); }
.pb-scope .promo__stub::before { top: -18px; }
.pb-scope .promo__stub::after { bottom: -18px; }
.pb-scope .promo__tag { padding: 7px 14px; border-radius: var(--r-pill); background: var(--surface); font: var(--w-ui) 14px/1 var(--font-ui); color: var(--fg); }
.pb-scope .promo__price { display: grid; gap: 8px; margin-top: var(--sp-3); }
.pb-scope .promo__price b { font: var(--w-num) clamp(56px, 5.4vw, 80px)/.95 var(--font-num); letter-spacing: -0.035em; color: var(--fg); font-variant-numeric: tabular-nums; white-space: nowrap; }
.pb-scope .promo__price span { font-size: 15px; color: var(--muted); }
.pb-scope .promo__price s { font: var(--w-ui) 15px/1 var(--font-ui); text-decoration-thickness: 1.5px; }
.pb-scope .promo__incl { display: grid; gap: 10px; width: 100%; margin: var(--sp-3) 0 var(--sp-4); padding-top: var(--sp-3); border-top: 1px solid var(--mist-hover); }
.pb-scope .promo__incl li { display: flex; align-items: center; gap: 10px; font-size: 16px; line-height: 1.4; }
.pb-scope .promo__stub .btn { margin-top: auto; }
.pb-scope .promo__note { margin-top: var(--sp-2); font-size: 14px; color: var(--muted); }
@media (max-width: 1080px) {
  .pb-scope .promo { grid-template-columns: minmax(0, 1fr); }
  .pb-scope .promo__stub { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 0 var(--sp-4); align-items: start; border-left: 0; border-top: 2px dashed var(--border-control); }
  .pb-scope .promo__stub::before, .pb-scope .promo__stub::after { top: -19px; bottom: auto; }
  .pb-scope .promo__stub::before { left: -18px; }
  .pb-scope .promo__stub::after { left: auto; right: -18px; }
  .pb-scope .promo__tag { justify-self: start; }
  .pb-scope .promo__incl { grid-column: 2; grid-row: 1 / span 2; margin: 0; padding-top: 0; border-top: 0; }
  .pb-scope .promo__stub .btn { grid-column: 1 / -1; justify-self: start; width: auto; margin-top: var(--sp-4); }
  .pb-scope .promo__note { grid-column: 1 / -1; }
}
@media (max-width: 860px) {
  .pb-scope .promo__copy, .pb-scope .promo__stub { padding: var(--sp-4); }
}
@media (max-width: 680px) {
  .pb-scope .promo__facts { grid-template-columns: minmax(0, 1fr); gap: var(--sp-2); }
  .pb-scope .promo__stub { display: flex; }
  .pb-scope .promo__incl { margin: var(--sp-3) 0 0; padding-top: var(--sp-3); border-top: 1px solid var(--mist-hover); }
  .pb-scope .promo__stub .btn { width: 100%; margin-top: var(--sp-4); }
}
@media (max-width: 560px) {
  .pb-scope .promo__copy, .pb-scope .promo__stub { padding: var(--sp-3); }
}

/* ---- Вернуть зубы: сравнение способов ------------------------------------- */
.pb-scope .restore { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(0, .75fr); gap: var(--sp-5); align-items: start; }
.pb-scope .compare { width: 100%; border-collapse: separate; border-spacing: 0; overflow: hidden; border-radius: var(--r-card); background: var(--bg); }
.pb-scope .compare-note { margin-top: var(--sp-2); font-size: 14px; color: var(--muted); }
.pb-scope .compare th, .pb-scope .compare td { padding: 16px 20px; border-bottom: 1px solid var(--border); text-align: left; vertical-align: top; }
.pb-scope .compare thead th { font: var(--w-ui) 14px/1.3 var(--font-ui); color: var(--muted); }
.pb-scope .compare tbody th { font: var(--w-ui) 17px/1.3 var(--font-ui); }
.pb-scope .compare td { font-size: 16px; color: var(--muted); }
.pb-scope .compare td.compare__price { font: var(--w-num) 17px/1.3 var(--font-num); color: var(--fg); white-space: nowrap; }
.pb-scope .compare td.compare__price--soft { font: 400 15px/1.4 var(--font-body); color: var(--muted); white-space: normal; }
.pb-scope .compare tbody tr:last-child > * { border-bottom: 0; }
.pb-scope .finance { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--sp-3); margin-top: var(--sp-3); }
.pb-scope .finance__item { display: flex; align-items: flex-start; gap: var(--sp-2); padding: 20px 22px; border-radius: var(--r-card); background: var(--bg); }
.pb-scope .finance__item b { display: block; font: var(--w-ui) 17px/1.3 var(--font-ui); }
.pb-scope .finance__item span { display: block; margin-top: 4px; font-size: 15px; color: var(--muted); }
.pb-scope .restore__aside .leaf { aspect-ratio: 3 / 4; }
.pb-scope .restore__aside .leaf > img { object-position: 50% 22%; }
.pb-scope .restore__family { margin-top: var(--sp-3); }
.pb-scope .restore__family h3 { font-size: 19px; line-height: 1.3; }
.pb-scope .restore__family p { margin-top: 6px; font-size: 16px; color: var(--muted); }
.pb-scope .restore__family .btn { margin-top: var(--sp-3); }

/* ---- Клиника и дорога ----------------------------------------------------- */
.pb-scope .place { display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr); gap: var(--sp-4); align-items: stretch; }
.pb-scope .contact-card { display: flex; flex-direction: column; gap: var(--sp-3); padding: 36px; border-radius: var(--r-panel); background: var(--surface); box-shadow: var(--shadow-l); }
.pb-scope .contact-card__line { display: flex; align-items: flex-start; gap: var(--sp-2); font-size: 17px; line-height: 1.45; }
.pb-scope .contact-card__line b { display: block; font: var(--w-ui) 17px/1.35 var(--font-ui); }
.pb-scope .contact-card__line span { display: block; font-size: 15px; color: var(--muted); }
.pb-scope .contact-card__actions { display: flex; flex-wrap: wrap; gap: var(--sp-2); margin-top: auto; padding-top: var(--sp-2); }
.pb-scope .route { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--sp-3); }
.pb-scope .route figure { display: flex; flex-direction: column; gap: var(--sp-2); }
.pb-scope .route img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: var(--r-card); box-shadow: var(--shadow-s); }
.pb-scope .route figcaption { display: grid; grid-template-columns: 32px minmax(0, 1fr); gap: 10px; align-items: start; font-size: 15px; line-height: 1.45; }
.pb-scope .route figcaption b { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--mist); font: var(--w-num) 15px/1 var(--font-num); color: var(--accent-deep); }
.pb-scope .gallery-head { display: flex; align-items: baseline; justify-content: space-between; gap: var(--sp-2); flex-wrap: wrap; margin-top: var(--sp-6); margin-bottom: var(--sp-3); }
.pb-scope .gallery-head h3 { font-size: 26px; }
.pb-scope .gallery { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: 210px; gap: var(--sp-3); }
.pb-scope .gallery__item { position: relative; display: block; width: 100%; height: 100%; padding: 0; border: 0; overflow: hidden; border-radius: var(--r-card); background: var(--mist); cursor: zoom-in; }
.pb-scope .gallery__item img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--dur) var(--ease); }
.pb-scope .gallery__item:hover img { transform: scale(1.03); }
.pb-scope .gallery__item .chip { position: absolute; left: 14px; bottom: 14px; padding: 8px 14px; font-size: 14px; }
.pb-scope .gallery__item--wide { grid-column: span 2; }
.pb-scope .gallery__item--tall { grid-row: span 2; }
.pb-scope .gallery__item--big { grid-column: span 2; grid-row: span 2; }
.pb-scope .gallery__item--reception img { object-position: 50% 50%; }
.pb-scope .gallery__item--treatment img { object-position: 30% 50%; }

/* ---- Частые вопросы ------------------------------------------------------- */
.pb-scope .faq { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: var(--sp-5); align-items: start; }
.pb-scope .faq__head { position: sticky; top: 112px; }
.pb-scope .faq__head .lead { margin-top: var(--sp-3); }
.pb-scope .faq__head .btn { margin-top: var(--sp-4); }
.pb-scope .faq__list { display: grid; gap: var(--sp-2); }
.pb-scope .faq__item { border-radius: var(--r-card); background: var(--bg); transition: background-color var(--dur) var(--ease); }
.pb-scope .faq__item summary { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-2); min-height: 68px; padding: 16px 18px 16px 26px; list-style: none; font: var(--w-ui) 18px/1.35 var(--font-ui); cursor: pointer; border-radius: var(--r-card); }
.pb-scope .faq__item summary::-webkit-details-marker { display: none; }
.pb-scope .faq__item summary:hover .faq__icon { background: var(--mist); }
.pb-scope .faq__icon { display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: 50%; background: var(--surface); color: var(--accent); box-shadow: var(--shadow-s); transition: transform var(--dur) var(--ease), background-color var(--dur) var(--ease); }
.pb-scope .faq__icon svg { width: 18px; height: 18px; }
.pb-scope .faq__item[open] .faq__icon { transform: rotate(180deg); }
.pb-scope .faq__item p { padding: 0 26px 24px; font-size: 16px; line-height: 1.6; max-width: 64ch; }

/* ---- Финальный экран: запись ---------------------------------------------- */
.pb-scope .booking { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 460px); gap: var(--sp-5); align-items: start; padding: var(--sp-5); border-radius: var(--r-panel); background: var(--surface); box-shadow: var(--shadow-l); }
.pb-scope .booking .lead { margin-top: var(--sp-3); }
.pb-scope .booking__facts { display: grid; gap: var(--sp-3); margin-top: var(--sp-4); }
.pb-scope .booking__fact { display: flex; align-items: center; gap: 16px; font: var(--w-ui) 17px/1.3 var(--font-ui); color: var(--fg); }
.pb-scope a.booking__fact:hover { text-decoration: none; color: var(--fg); }
.pb-scope a.booking__fact:hover .icon-dot { background: var(--mist-hover); }
.pb-scope .booking__fact .caption { display: block; margin-top: 2px; font-family: var(--font-body); font-weight: 400; }
/* Мессенджеры: пилюли-ссылки WhatsApp · Telegram · MAX (финальный экран, карточка «Как добраться») */
.pb-scope .messengers { display: flex; flex-wrap: wrap; gap: var(--sp-1); margin-top: 10px; }
.pb-scope .messengers a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 18px; border-radius: var(--r-pill); background: var(--mist); font: var(--w-ui) 15px/1 var(--font-ui); color: var(--fg); transition: background-color var(--dur) var(--ease); }
.pb-scope .messengers a:hover { background: var(--mist-hover); color: var(--fg); text-decoration: none; }
.pb-scope .band__aside a { text-decoration: underline; text-underline-offset: 3px; }
.pb-scope .offer { display: flex; align-items: center; gap: var(--sp-2); margin-top: var(--sp-4); padding-top: var(--sp-3); border-top: 1px solid var(--border); font-size: 16px; }
.pb-scope .offer b { font-family: var(--font-ui); font-weight: var(--w-ui); }
.pb-scope .form-success { display: flex; flex-direction: column; align-items: flex-start; gap: var(--sp-2); padding: var(--sp-4) 0; }
.pb-scope .form-success .icon-dot { background: oklch(93% 0.04 155); color: var(--ok); }
.pb-scope .form-success h3 { font-size: 24px; }
.pb-scope .form-success p { color: var(--muted); }

/* ---- Диалог и просмотр фото ----------------------------------------------- */
.pb-scope .dialog-backdrop { position: fixed; inset: 0; z-index: 50; display: grid; place-items: center; padding: var(--sp-3); background: oklch(30% 0.035 240 / .42); }
.pb-scope.theme-yunastom .dialog-backdrop { background: oklch(28.6% 0.004 68 / .42); }
.pb-scope.theme-yunastom .promo__stub::before, .pb-scope.theme-yunastom .promo__stub::after { box-shadow: inset 0 0 7px oklch(42% 0.07 210 / .22); }
.pb-scope .dialog { position: relative; width: min(100%, 520px); max-height: calc(100vh - 40px); overflow: auto; padding: var(--sp-4); border-radius: var(--r-panel); background: var(--surface); box-shadow: var(--shadow-l); }
.pb-scope .dialog h2 { font-size: 28px; padding-right: 52px; }
.pb-scope .dialog .lead { margin-top: var(--sp-2); margin-bottom: var(--sp-3); }
.pb-scope .dialog__close { position: absolute; top: 20px; right: 20px; display: grid; place-items: center; width: 44px; height: 44px; border: 0; border-radius: 50%; background: var(--mist); color: var(--fg); cursor: pointer; transition: background-color var(--dur) var(--ease); }
.pb-scope .dialog__close:hover { background: var(--mist-hover); }
.pb-scope .dialog__close svg { width: 18px; height: 18px; }
.pb-scope .dialog--photo { width: min(100%, 1080px); padding: var(--sp-3); }
.pb-scope .dialog--photo img { width: auto; max-width: 100%; max-height: calc(100vh - 180px); margin-inline: auto; border-radius: var(--r-field); }
.pb-scope .dialog--photo figcaption { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-2); margin-top: var(--sp-2); font: var(--w-ui) 16px/1.3 var(--font-ui); }
.pb-scope .dialog__nav { display: flex; gap: var(--sp-1); }
.pb-scope .dialog__nav button { display: grid; place-items: center; width: 44px; height: 44px; border: 0; border-radius: 50%; background: var(--mist); color: var(--fg); cursor: pointer; }
.pb-scope .dialog__nav button:hover { background: var(--mist-hover); }
.pb-scope .dialog__nav svg { width: 18px; height: 18px; }
.pb-scope .dialog__nav .is-prev svg { transform: scaleX(-1); }

/* ---- Подвал --------------------------------------------------------------- */
.pb-scope .site-footer { padding-block: var(--sp-5); border-top: 1px solid var(--border); background: var(--surface); }
.pb-scope .site-footer__grid { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: var(--sp-4); align-items: start; }
.pb-scope .site-footer__brand { display: flex; align-items: center; gap: 12px; font: var(--w-display) 20px/1 var(--font-display); color: var(--fg); }
.pb-scope .site-footer__brand img { width: 48px; height: 50px; }
.pb-scope .site-footer__grid > div > p { margin-top: var(--sp-2); font-size: 15px; color: var(--muted); max-width: 40ch; }
.pb-scope .site-footer h3 { margin-bottom: var(--sp-2); font: var(--w-ui) 15px/1.3 var(--font-ui); color: var(--muted); }
.pb-scope .site-footer__list { display: grid; gap: 10px; font-size: 16px; }
.pb-scope .site-footer__list a { color: var(--fg); }
.pb-scope .legal-note { margin-top: var(--sp-4); padding-top: var(--sp-3); border-top: 1px solid var(--border); font: var(--w-ui) 15px/1.4 var(--font-ui); color: var(--muted); }
.pb-scope .legal-note p { color: var(--muted); }
.pb-scope .legal-note p + p { margin-top: 6px; font-family: var(--font-body); font-weight: 400; font-size: 13px; }

/* ---- Мобильная панель связи (≤ 860px) ------------------------------------- */
.pb-scope .dock { display: none; }

/* ---- Адаптив -------------------------------------------------------------- */
@media (max-width: 1180px) {
  .pb-scope .hero__chips { position: relative; inset: auto; display: flex; flex-wrap: wrap; gap: var(--sp-1); margin-top: var(--sp-3); }
  .pb-scope .hero__chips .chip { position: static; }
  .pb-scope .doors { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pb-scope .stepper { grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: var(--sp-4); }
  .pb-scope .stepper::before { display: none; }
}
@media (max-width: 1220px) {
  .pb-scope .site-bar { gap: 12px; }
  .pb-scope .site-bar__nav { display: none; }
  .pb-scope .site-bar__tel { margin-left: auto; }
  .pb-scope .site-bar__burger { display: grid; }
}
@media (max-width: 1080px) {
  .pb-scope .estimate, .pb-scope .reviews-lead, .pb-scope .faq, .pb-scope .restore { grid-template-columns: minmax(0, 1fr); }
  .pb-scope .faq__head, .pb-scope .estimate__copy { position: static; }
  .pb-scope .restore__aside { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: var(--sp-4); align-items: center; }
  .pb-scope .restore__family { margin-top: 0; }
  .pb-scope .band { grid-template-columns: minmax(0, 1fr); }
  .pb-scope .band__media { min-height: 0; aspect-ratio: 16 / 9; order: -1; }
  .pb-scope .place { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 960px) {
  .pb-scope .team { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pb-scope .booking, .pb-scope .quick-form, .pb-scope .pricelist { grid-template-columns: minmax(0, 1fr); }
  .pb-scope .booking { padding: var(--sp-4); gap: var(--sp-4); }
  .pb-scope .smile { grid-template-columns: minmax(0, 1fr); }
  .pb-scope .smile__media { max-width: 520px; }
  .pb-scope .gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-auto-rows: 180px; }
}
@media (max-width: 860px) {
  .pb-scope .topline__item--hours { display: none; }
  .pb-scope .hero__grid { grid-template-columns: minmax(0, 1fr); gap: var(--sp-4); padding-block: 24px 48px; }
  .pb-scope .usp { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pb-scope .usp__cell { padding: 14px; }
  .pb-scope .usp__cell + .usp__cell { box-shadow: none; }
  .pb-scope .legal-band { border-radius: var(--r-card); }
  .pb-scope .split { grid-template-columns: minmax(0, 1fr); gap: var(--sp-4); }
  .pb-scope .split__media { max-width: 520px; }
  .pb-scope .visit__notes, .pb-scope .finance { grid-template-columns: minmax(0, 1fr); }
  .pb-scope .rating-band { grid-template-columns: minmax(0, 1fr); padding: 22px; }
  .pb-scope .rating-band .btn { justify-self: start; }
  .pb-scope .band__copy { padding: var(--sp-4); }
  .pb-scope .site-footer__grid { grid-template-columns: minmax(0, 1fr); }
  .pb-scope .site-footer__list { gap: 0; }
  .pb-scope .site-footer__list a { display: inline-flex; align-items: center; min-height: 44px; }
  .pb-scope .site-footer { padding-bottom: calc(var(--sp-5) + 80px); }
  .pb-scope .dock { position: fixed; left: 10px; right: 10px; bottom: 10px; z-index: 40; display: grid; transform: translateY(calc(100% + 16px)); visibility: hidden; transition: transform var(--dur) var(--ease), visibility 0s linear var(--dur); grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; padding: 6px; border-radius: var(--r-pill); background: var(--surface); box-shadow: var(--shadow-l); }
  .pb-scope .dock.is-visible { transform: none; visibility: visible; transition: transform var(--dur) var(--ease); }
  .pb-scope .dock a, .pb-scope .dock button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 48px; padding: 0 10px; border: 0; border-radius: var(--r-pill); background: var(--mist); color: var(--fg); font: var(--w-ui) 15px/1 var(--font-ui); cursor: pointer; }
  .pb-scope .dock a:hover { background: var(--mist-hover); text-decoration: none; color: var(--fg); }
  .pb-scope .dock .dock__main { background: var(--accent); color: var(--on-accent); }
  .pb-scope .dock .dock__main:hover { background: var(--accent-deep); }
  .pb-scope .dock svg { width: 18px; height: 18px; flex: none; }
}
@media (max-width: 680px) {
  .pb-scope .stepper { grid-template-columns: minmax(0, 1fr); row-gap: var(--sp-3); }
  .pb-scope .stepper__step { display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 0 var(--sp-2); }
  .pb-scope .stepper__step h3 { margin-top: 12px; }
  .pb-scope .stepper__step > p, .pb-scope .stepper__step > .plan-pair { grid-column: 2; }
  .pb-scope .route { grid-template-columns: minmax(0, 1fr); }
  .pb-scope .route img { aspect-ratio: 4 / 3; }
  .pb-scope .restore__aside { grid-template-columns: minmax(0, 1fr); }
  .pb-scope .restore__aside .leaf { max-width: 420px; }
  .pb-scope .compare thead { display: none; }
  .pb-scope .compare, .pb-scope .compare tbody, .pb-scope .compare tr, .pb-scope .compare th, .pb-scope .compare td { display: block; }
  .pb-scope .compare tr { padding: 16px 20px; border-bottom: 1px solid var(--border); }
  .pb-scope .compare tbody tr:last-child { border-bottom: 0; }
  .pb-scope .compare th, .pb-scope .compare td { padding: 0; border: 0; }
  .pb-scope .compare td { margin-top: 4px; }
  .pb-scope .form-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 560px) {
  .pb-scope .topline { display: none; }
  .pb-scope .site-head { top: 0; padding-top: 10px; }
  .pb-scope .site-bar__brand small { display: none; }
  .pb-scope .site-bar__tel { padding: 4px; }
  .pb-scope .site-bar__tel .site-bar__tel-num { display: none; }
  .pb-scope .doors, .pb-scope .team { grid-template-columns: minmax(0, 1fr); }
  .pb-scope .usp { grid-template-columns: minmax(0, 1fr); }
  .pb-scope .usp__cell + .usp__cell { box-shadow: inset 0 1px 0 var(--border); }
  .pb-scope .btn { white-space: normal; text-align: center; line-height: 1.2; height: auto; min-height: 56px; padding-block: 12px; }
  .pb-scope .btn--sm { min-height: 48px; }
  .pb-scope .hero__actions .btn--primary { width: 100%; }
  .pb-scope .estimate-doc { padding: 24px 20px; }
  .pb-scope .estimate-doc__row { grid-template-columns: minmax(0, 1fr) 64px; }
  .pb-scope .stat { grid-template-columns: minmax(0, 1fr); gap: var(--sp-1); }
  .pb-scope .quick-form, .pb-scope .booking { padding: var(--sp-3); }
  .pb-scope .pricelist__list, .pb-scope .pricelist__aside { padding: 24px 22px; }
  .pb-scope .price-row { flex-wrap: wrap; }
  .pb-scope .smile__steps { grid-template-columns: minmax(0, 1fr); }
  .pb-scope .band__copy { padding: var(--sp-3); }
  .pb-scope .band__actions .btn { width: 100%; }
  .pb-scope .contact-card { padding: var(--sp-3); }
  .pb-scope .gallery { grid-template-columns: minmax(0, 1fr); grid-auto-rows: 220px; }
  .pb-scope .gallery__item--wide, .pb-scope .gallery__item--big { grid-column: auto; }
  .pb-scope .gallery__item--tall, .pb-scope .gallery__item--big { grid-row: auto; }
  .pb-scope .faq__item summary { padding-left: 20px; font-size: 17px; }
  .pb-scope .faq__item p { padding-inline: 20px; }
  .pb-scope .dialog { padding: var(--sp-3); }
}
@media (max-width: 400px) {
  .pb-scope .dock a, .pb-scope .dock button { padding: 0 6px; font-size: 14px; }
  .pb-scope .dock svg { display: none; }
}