/**
 * Минимальный CSS — только то, что нужно для каркаса Next.js.
 * Весь остальной CSS рендерится динамически из <style> блоков в headHtml
 * каждой страницы (как в оригинальном HTML-сайте).
 *
 * Важно: НЕ используем Tailwind Preflight — он бы перебил оригинальные стили
 * сайта (например, стили sidebar, hero, footer).
 */

html,
body {
  margin: 0;
  padding: 0;
  min-height: 100%;
}

/* Чтобы страница-рендерер не добавляла лишних отступов */
.page-renderer {
  display: contents;
}

/* ============================================================
   КРИТИЧЕСКИЕ CSS ШАПКИ — гарантированно на ВСЕХ страницах.
   Раньше эти правила приходили из headHtml каждой страницы,
   но из-за расхождений между страницами (на некоторых не было
   flex:none для .hdr-sober/.hdr-call) ширина навигации
   отличалась, и «три точки» появлялись непоследовательно.
   Теперь эти правила глобальны и одинаковы везде.
   ============================================================ */

/* Элементы шапки, которые НЕ должны сжиматься —
   иначе .hdr-sober и .hdr-call уступают место навигации,
   и на разных страницах доступная ширина .hdr-nav различается. */
.hdr-brand,
.hdr-sober,
.hdr-call {
  flex: none;
}

/* Горизонтальный padding шапки — 16px вместо 28px из headHtml.
   В headHtml каждой страницы задано `padding:11px 28px` для .hdr,
   что слишком растягивает шапку по краям на узких экранах и
   визуально не совпадает с отступами контента. Переопределяем
   только left/right, сохраняя вертикальный padding из headHtml.
   !important нужен потому, что headHtml загружается после globals.css
   (через HeadExtras → <style>), и без !important правило из headHtml
   побеждает по source order. */
.hdr {
  padding-left: 16px !important;
  padding-right: 16px !important;
}

/* Навигация: не переносить, позволять сжиматься, но не растягиваться */
.hdr-nav {
  flex-wrap: nowrap !important;
  overflow: visible;
  min-width: 0;
  flex: 0 1 auto;
}

/* Элементы, перемещённые в dropdown «три точки» — скрыть */
.hdr-nav .hn-item.moved-to-more {
  display: none !important;
}

/* ============================================================
   ШАПКА НА МОБИЛЬНЫХ — burger-меню всегда доступно.
   В headHtml каждой страницы (349 из 350) есть правило:
     @media(max-width:1023px){.hdr{display:none!important}}
   Оно скрывало шапку целиком на мобильных/планшетах —
   это работало, когда навигация шла через всегда открытый
   левый sidebar. Но теперь sidebar — это slide-out drawer
   (скрыт по умолчанию, открывается по клику на burger),
   а burger-кнопка (#hdrOpen) находится именно в шапке.
   Если шапка скрыта — burger недоступен, и пользователь
   не может открыть меню на мобильном. Поэтому шапка
   должна быть видима на ≤1023px всегда.
   ============================================================ */
@media (max-width: 1023px) {
  /* counteract @media(max-width:1023px){.hdr{display:none!important}}
     и дефолтное .hdr{transform:translateY(-100%)} (скрытие с экрана) */
  .hdr {
    display: flex !important;
    transform: translateY(0) !important;
  }
  /* Чтобы контент не залезал под фиксированную шапку */
  .content {
    padding-top: 68px;
  }
  /* На мобильном hero тоже не должен залезать под шапку */
  .hero {
    padding-top: 84px;
  }

  /* --- Скрываем «три точки» (#hdrMore) на мобильных ---
     JS hdr-more.js помечает #hdrMore классом .is-active, когда пункты
     навигации не помещаются в ширину и переносятся в dropdown.
     На мобильных ВСЕ пункты уходят в .moved-to-more (потому что
     .hdr-nav очень узкий), и кнопка «…» остаётся единственным видимым
     элементом навигации. Это бесполезно — навигация доступна через
     burger → drawer. Скрываем кнопку целиком. */
  .hn-item.hn-more {
    display: none !important;
  }

  /* --- Скрываем ВСЮ навигацию .hdr-nav на мобильных ---
     Раньше пункты .hn-item скрывались JS-скриптом hdr-more.js, который
     на DOMContentLoaded + 80ms добавлял класс .moved-to-more — и только
     тогда CSS-правило .moved-to-more{display:none!important} их пря-
     тало. Между первой отрисовкой и этим моментом (~80-150 мс) пункты
     были видны — пользователь видел «вспышку» меню при загрузке.

     На мобильных навигация в шапке не нужна вовсе: burger (#hdrOpen)
     открывает левый drawer (<aside class="rail">), где дублируются все
     ссылки. Скрываем .hdr-nav целиком через CSS — это срабатывает на
     первой отрисовке, без задержки. */
  .hdr-nav {
    display: none !important;
  }

  /* --- Скрываем телефонную ссылку .hdr-call на мобильных ---
     На мобильных шапка компактная: burger + лого. Телефон дублируется
     в FloatingCallButton (fab) и в drawer — в шапке он лишний,
     съедает место и вызывает визуальный шум. */
  .hdr-call {
    display: none !important;
  }

  /* --- Скрываем чип «Счётчик трезвости» (.hdr-sober) на мобильных ---
     Шапка на мобильном должна быть минимальной: burger + лого.
     Счётчик трезвости доступен с главной страницы (/#sobriety) и
     через drawer — в компактной шапке он съедает место и визуальный
     шум. Скрываем на ≤1023px. На десктопе остаётся видимым. */
  .hdr-sober {
    display: none !important;
  }
}

/* Стрелочки выпадающего меню в шапке — на одном уровне с текстом ссылок */
.hn-item {
  align-items: center;
}

/* Кнопка «Читать полностью» в отзывах: только если текст обрезается */
/* Специфика 0-2-0 — перепроверяем, что inline CSS в headHtml
   (.rtext-wrap .dc-more { display:none!important }) идентична,
   поэтому globals и inline равны; но для .open нужно 0-3-0,
   чтобы побить inline-правило .rtext-wrap .dc-more { display:none!important }. */
.rtext-wrap .dc-more {
  display: none !important;
}
.rtext-wrap.clamp .dc-more,
.rtext-wrap .dc-more.open {
  display: inline-flex !important;
}

/* Убираем градиентный ::after на обрезанных отзывах —
   пользователь попросил убрать полностью, «не можешь сделать красиво — не делай». */
.dc-rev-card .rtext-wrap.clamp::after,
.rev-text-wrap.clamp::after {
  display: none !important;
}

/* Скроллбар для всего сайта */
::-webkit-scrollbar {
  width: 10px;
  height: 10px;
}
::-webkit-scrollbar-track {
  background: transparent;
}
::-webkit-scrollbar-thumb {
  background: rgba(10, 75, 75, 0.25);
  border-radius: 5px;
}
::-webkit-scrollbar-thumb:hover {
  background: rgba(10, 75, 75, 0.45);
}

/* ============================================================
   ВЕРСИЯ ДЛЯ СЛАБОВИДЯЩИХ
   Включается классом .a11y на <html>.
   Параметры хранятся в data-атрибутах <html>:
     data-a11y-font (sm|md|lg)
     data-a11y-theme (bw|wb|yb)
     data-a11y-img (on|off)
     data-a11y-spacing (on|off)
   ============================================================ */

html.a11y {
  --a11y-bar-h: 46px;
  --a11y-fg: #000000;
  --a11y-bg: #ffffff;
  --a11y-border: rgba(0, 0, 0, 0.45);

  /* Переопределение переменных сайта (тема по умолчанию — чёрным по белому) */
  --ink: #000000;
  --ink-2: #000000;
  --ink-3: #000000;
  --healing: #000000;
  --healing-soft: #444444;
  --dawn: #000000;
  --dawn-deep: #000000;
  --mist: #ffffff;
  --surface: #ffffff;
  --muted: #222222;
  --line: rgba(0, 0, 0, 0.4);
  --shadow: none;
  --shadow-sm: none;

  scroll-behavior: auto !important;
}

html.a11y[data-a11y-theme='wb'] {
  --a11y-fg: #ffffff;
  --a11y-bg: #000000;
  --a11y-border: rgba(255, 255, 255, 0.45);
  --ink: #ffffff;
  --ink-2: #000000;
  --ink-3: #000000;
  --healing: #ffffff;
  --healing-soft: #bbbbbb;
  --dawn: #ffffff;
  --dawn-deep: #ffffff;
  --mist: #000000;
  --surface: #000000;
  --muted: #dddddd;
  --line: rgba(255, 255, 255, 0.45);
}

html.a11y[data-a11y-theme='yb'] {
  --a11y-fg: #ffe600;
  --a11y-bg: #000000;
  --a11y-border: rgba(255, 230, 0, 0.5);
  --ink: #ffe600;
  --ink-2: #000000;
  --ink-3: #000000;
  --healing: #ffe600;
  --healing-soft: #b8a800;
  --dawn: #ffe600;
  --dawn-deep: #ffe600;
  --mist: #000000;
  --surface: #000000;
  --muted: #d0c800;
  --line: rgba(255, 230, 0, 0.5);
}

/* Предсказуемость: убираем анимации/переходы */
html.a11y *,
html.a11y *::before,
html.a11y *::after {
  transition-duration: 0.01ms !important;
  animation-duration: 0.01ms !important;
  animation-iteration-count: 1 !important;
}

/* Чёткий фокус для клавиатуры */
html.a11y :focus-visible {
  outline: 3px solid currentColor !important;
  outline-offset: 2px !important;
}

/* ============================================================
   ФОТО ВРАЧЕЙ — увеличенный контейнер без обрезки сверху.
   Перекрывает inline-стили из pages.json (220×220, object-fit:cover).
   ============================================================ */

.doctor-photo {
  width: 220px !important;
  height: 300px !important;
}

.doctor-photo img {
  object-position: top center !important;
}

/* ============================================================
   КАРТОЧКИ ВРАЧЕЙ — кликабельность фото и hover-эффекты.
   Применяется к превью-карточкам (.doctor-card) и слайдеру на
   главной (article.doc). Гарантирует cursor:pointer на фото и
   лёгкий визуальный отклик при наведении.
   ============================================================ */

.doctor-card .doctor-ava,
.doctor-card a > .doctor-ava,
article.doc .ava {
  cursor: pointer;
  transition: transform .25s ease, box-shadow .25s ease, opacity .25s ease;
}

.doctor-card a[href]:hover .doctor-ava,
article.doc a[href]:hover .ava {
  transform: translateY(-3px);
  box-shadow: 0 8px 20px rgba(10, 75, 75, .18);
  opacity: .94;
}

.doctor-card .doctor-role a,
article.doc .role a {
  text-underline-offset: 2px;
}

.doctor-card .doctor-role a:hover,
article.doc .role a:hover,
.doctor-info a:hover {
  opacity: .75;
}

/* === Жёсткий контраст для проблемных секций (футер, меню, хедер) ===
   В этих секциях много захардкоженных цветов: тёмный футер/сайдбар со светлым
   текстом, светлый хедер с тёмным. Принудительно: фон секции = цвет темы,
   у потомков — текст = цвет темы, фон прозрачный, рамки = теме. */
html.a11y .contact,
html.a11y .rail,
html.a11y .disclaimer-bar,
html.a11y .hdr,
html.a11y .hn-dd,
html.a11y .mega-grid,
html.a11y .hero {
  background: var(--a11y-bg) !important;
  background-image: none !important;
  color: var(--a11y-fg) !important;
  box-shadow: none !important;
}
html.a11y .hdr {
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html.a11y .contact *,
html.a11y .rail *,
html.a11y .disclaimer-bar *,
html.a11y .hdr *,
html.a11y .hn-dd *,
html.a11y .mega-grid *,
html.a11y .hero * {
  color: var(--a11y-fg) !important;
  background-color: transparent !important;
  border-color: var(--a11y-border) !important;
}

/* SVG-иконки приводим к цвету текста (иначе белые/чёрные иконки исчезают) */
html.a11y svg [fill]:not([fill='none']):not([fill='NONE']) {
  fill: currentColor !important;
}
html.a11y svg [stroke]:not([stroke='none']):not([stroke='NONE']) {
  stroke: currentColor !important;
}
html.a11y svg path:not([fill]):not([stroke]),
html.a11y svg circle:not([fill]):not([stroke]),
html.a11y svg polygon:not([fill]):not([stroke]),
html.a11y svg rect:not([fill]):not([stroke]) {
  fill: currentColor !important;
}

/* Основной контент: страховка цвета текста (фоны остаются на переменных) */
html.a11y .content p,
html.a11y .content h1,
html.a11y .content h2,
html.a11y .content h3,
html.a11y .content h4,
html.a11y .content h5,
html.a11y .content h6,
html.a11y .content li,
html.a11y .content td,
html.a11y .content th,
html.a11y .content blockquote,
html.a11y .content label,
html.a11y .content strong,
html.a11y .content b {
  color: var(--a11y-fg) !important;
}

/* Ссылки — с подчёркиванием для читаемости */
html.a11y .content a {
  text-decoration: underline;
}

/* --- Масштаб шрифта (zoom масштабирует и px-текст) --- */
html.a11y[data-a11y-font='sm'] .content {
  zoom: 1;
}
html.a11y[data-a11y-font='md'] .content {
  zoom: 1.18;
}
html.a11y[data-a11y-font='lg'] .content {
  zoom: 1.4;
}
@supports not (zoom: 1) {
  html.a11y[data-a11y-font='md'] {
    font-size: 118%;
  }
  html.a11y[data-a11y-font='lg'] {
    font-size: 140%;
  }
}

/* --- Межбуквенный интервал --- */
html.a11y[data-a11y-spacing='on'] .content {
  letter-spacing: 0.06em;
  word-spacing: 0.12em;
  line-height: 1.9;
}

/* --- Скрытие изображений (иконки-SVG остаются) --- */
html.a11y[data-a11y-img='off'] .content img,
html.a11y[data-a11y-img='off'] .content picture {
  display: none !important;
}

/* --- Место под верхнюю панель настроек --- */
html.a11y .content {
  padding-top: var(--a11y-bar-h);
}
html.a11y .hdr {
  top: var(--a11y-bar-h);
}

@media (max-width: 1023px) {
  html.a11y {
    --a11y-bar-h: 92px;
  }
  html.a11y .hdr {
    top: 0;
  }
}

/* --- Верхняя панель настроек --- */
.a11y-bar {
  position: fixed;
  top: 0;
  left: var(--rail, 0);
  right: 0;
  z-index: 2147483647;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px 16px;
  min-height: var(--a11y-bar-h, 46px);
  padding: 6px 16px;
  background: var(--a11y-bg, #fff);
  color: var(--a11y-fg, #000);
  border-bottom: 2px solid var(--a11y-fg, #000);
  font-family: 'Onest', system-ui, sans-serif;
  font-size: 14px;
  line-height: 1.25;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18);
}
@media (max-width: 1023px) {
  .a11y-bar {
    left: 0;
    font-size: 13px;
  }
}
.a11y-title {
  font-weight: 700;
  white-space: nowrap;
}
.a11y-group {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.a11y-lbl {
  white-space: nowrap;
  opacity: 0.9;
}
.a11y-btn {
  font: inherit;
  line-height: 1;
  cursor: pointer;
  padding: 5px 10px;
  border: 1.5px solid currentColor;
  border-radius: 7px;
  background: transparent;
  color: inherit;
  white-space: nowrap;
}
.a11y-btn:hover {
  background: var(--a11y-fg, #000);
  color: var(--a11y-bg, #fff);
}
.a11y-btn[aria-pressed='true'] {
  background: var(--a11y-fg, #000);
  color: var(--a11y-bg, #fff);
}
.a11y-exit {
  margin-left: auto;
  font: inherit;
  font-weight: 600;
  cursor: pointer;
  padding: 6px 12px;
  border: none;
  border-radius: 7px;
  background: var(--a11y-fg, #000);
  color: var(--a11y-bg, #fff);
  white-space: nowrap;
}
.a11y-exit:hover {
  opacity: 0.8;
}

/* --- Контейнер переключателей в футере (прижим вправо) --- */
.foot-tools {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 14px;
}

/* --- Переключатель «Версия для слабовидящих» (в ряду юр. ссылок футера) --- */
.a11y-foot-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  background: transparent;
  border: none;
  color: var(--healing-soft);
  font: inherit;
  font-size: 13px;
  padding: 0;
  text-decoration: none;
  transition: opacity 0.2s;
}
.a11y-foot-link:hover {
  opacity: 0.7;
}
.a11y-foot-link svg {
  width: 15px;
  height: 15px;
  flex: none;
}

/* ============================================================
   ФУТЕР: КНОПКА TELEGRAM = ВЫСОТА КНОПКИ «ПЕРЕЗВОНИТЕ МНЕ»
   cb-submit-desktop имеет padding:14px 24px + inline-flex.
   Придаём .btn-ghost внутри .cc-card те же размеры, чтобы обе
   кнопки были одинаковой высоты.
   ============================================================ */
.cc-card .btn-ghost {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  padding: 14px 24px !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* ============================================================
   BREADCRUMBS — глобальные стили хлебных крошек.
   Генерируются серверно из URL для каждой страницы (см. src/lib/breadcrumbs.ts),
   поэтому стили должны быть доступны всегда, независимо от headHtml страницы.
   ============================================================ */
.breadcrumbs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  color: var(--muted, #4C6767);
  padding: 24px 0 0;
  margin-bottom: 24px;
  line-height: 1.5;
}
.breadcrumbs a {
  color: var(--muted, #4C6767);
  text-decoration: none;
  transition: color .15s ease;
}
.breadcrumbs a:hover {
  color: var(--healing, #12A4A4);
}
.breadcrumbs .bc-sep {
  opacity: .4;
  user-select: none;
}
.breadcrumbs .bc-current {
  color: var(--ink, #0A4B4B);
  font-weight: 600;
}
/* На мобильных — чуть компактнее */
@media (max-width: 680px) {
  .breadcrumbs {
    font-size: 13px;
    padding-top: 16px;
    margin-bottom: 16px;
  }
}

/* ============================================================
   BLOG CARD DATE (in /blog listing)
   ============================================================ */
.bc-date {
  font-size: 13px;
  color: var(--muted, #4C6767);
  margin: 4px 0 10px;
  line-height: 1.4;
}

/* ============================================================
   ARTICLE META BLOCK (date + author in blog articles)
   ============================================================ */
.article-meta-block {
  display: flex;
  align-items: center;
  gap: 16px;
  flex-wrap: wrap;
  margin: 0 0 20px;
  padding: 12px 0;
  border-bottom: 1px solid var(--line, rgba(10,75,75,.12));
  font-size: 14px;
  color: var(--muted, #4C6767);
  line-height: 1.5;
}

/* Article date line (in sub-hero) */
.article-date-line {
  margin: 8px 0 0;
  font-size: 14px;
  color: var(--muted, #4C6767);
  line-height: 1.5;
}

.am-date {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  white-space: nowrap;
}

.am-date::before {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3E%3Cpath stroke='currentColor' stroke-width='1.5' d='M2 4h12v10H2zM2 7h12M5 2v3M11 2v3'/%3E%3C/svg%3E") center/contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3E%3Cpath stroke='currentColor' stroke-width='1.5' d='M2 4h12v10H2zM2 7h12M5 2v3M11 2v3'/%3E%3C/svg%3E") center/contain no-repeat;
  flex-shrink: 0;
}

.am-author {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 500;
  color: var(--ink, #0A4B4B);
}

.am-author-img {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
  border: 2px solid var(--line, rgba(10,75,75,.12));
}

/* Responsive */
@media (max-width: 768px) {
  .article-meta-block {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
}


/* === Author Card (Blog Articles) === */
.author-card {
  margin: 0 0 28px;
  padding: 20px 24px;
  background: var(--surface, #FFFFFF);
  border: 1px solid var(--line, rgba(10,75,75,.12));
  border-radius: var(--r, 20px);
  position: relative;
  overflow: hidden;
}
.author-card::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 3px;
  background: linear-gradient(90deg, var(--healing, #12A4A4), var(--dawn, #F04438));
}
.author-card__inner {
  display: flex;
  align-items: center;
  gap: 16px;
}
.author-card__img {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
  border: 2px solid var(--line, rgba(10,75,75,.12));
  background: var(--mist, #EEF6F6);
}
.author-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.author-card__info {
  flex: 1;
  min-width: 0;
}
.author-card__label {
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--healing, #12A4A4);
  font-weight: 600;
  margin: 0 0 4px;
}
.author-card__name {
  font-size: 1rem;
  font-weight: 700;
  color: var(--ink, #0A4B4B);
  margin: 0 0 2px;
  line-height: 1.3;
}
.author-card__role {
  font-size: 13px;
  color: var(--muted, #4C6767);
  margin: 0;
}
@media (max-width: 680px) {
  .author-card__inner {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
  .author-card__img {
    width: 56px;
    height: 56px;
  }
}

/* === Share Button (Sobriety section) === */
.sobriety-share {
  display: flex;
  justify-content: center;
  margin-top: 32px;
  position: relative;
}
.share-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 28px;
  background: var(--healing, #12A4A4);
  color: #fff;
  border: none;
  border-radius: 100px;
  font-size: 15px;
  font-weight: 600;
  cursor: pointer;
  transition: background .2s, transform .15s;
  font-family: inherit;
}
.share-btn:hover {
  background: #0e8b8b;
  transform: translateY(-1px);
}
.share-btn svg {
  flex-shrink: 0;
}
.share-menu {
  position: absolute;
  bottom: calc(100% + 8px);
  left: 50%;
  transform: translateX(-50%) scale(0.95);
  background: var(--surface, #fff);
  border: 1px solid var(--line, rgba(10,75,75,.12));
  border-radius: 14px;
  padding: 8px 0;
  box-shadow: 0 8px 30px rgba(0,0,0,.12);
  opacity: 0;
  visibility: hidden;
  transition: opacity .2s, transform .2s, visibility .2s;
  z-index: 100;
  min-width: 180px;
}
.share-menu.open {
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) scale(1);
}
.share-option {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 18px;
  color: var(--ink, #0A4B4B);
  font-size: 14px;
  font-weight: 500;
  cursor: pointer;
  transition: background .15s;
  text-decoration: none;
  white-space: nowrap;
}
.share-option:hover {
  background: var(--mist, #EEF6F6);
}
.share-option svg {
  flex-shrink: 0;
  color: var(--healing, #12A4A4);
}
.share-option[data-platform="whatsapp"] svg { color: #25D366; }
.share-option[data-platform="vk"] svg { color: #0077FF; }
.share-option[data-platform="copy"] svg { color: var(--muted, #4C6767); }
@media (max-width: 680px) {
  .sobriety-share { margin-top: 24px; }
  .share-menu { min-width: 160px; }
  .share-option { padding: 8px 14px; font-size: 13px; }
}

/* ============================================================
   COOKIE BANNER v2 — компактное окно (152-ФЗ)
   Глобальные стили, перекрывающие инлайн-CSS из headHtml (pages.json).
   Старые правила .cookie{position:fixed;...}, .ck-t, .ck-row, .ck-ok, .ck-no
   заданы в <style> каждой страницы — чтобы их перебить, используем
   !important И более высокую специфичность (.cookie .ck-...).
   Подробная информация о cookie — на странице /privacy/.
   ============================================================ */

/* Карточка баннера — компактная, в углу */
.cookie {
  position: fixed !important;
  left: calc(var(--rail, 0px) + 20px);
  right: auto;
  bottom: 20px;
  z-index: 90;
  max-width: 320px;
  background: var(--surface, #ffffff);
  border: 1px solid var(--line, rgba(10,75,75,.12));
  border-radius: 14px;
  padding: 14px 16px 12px;
  box-shadow: 0 10px 30px rgba(10,75,75,.16);
  transform: translateY(160%);
  opacity: 0;
  pointer-events: none;
  transition: transform .45s cubic-bezier(.16,1,.3,1), opacity .4s;
  font-family: inherit;
  color: var(--ink, #0A4B4B);
}
.cookie.show {
  transform: none;
  opacity: 1;
  pointer-events: auto;
}

/* Заголовок: иконка + «Мы используем cookie» */
.cookie .ck-t {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
  font-size: 14px;
  color: var(--ink, #0A4B4B);
  margin: 0 0 6px;
}
.cookie .ck-t svg {
  width: 18px;
  height: 18px;
  flex-shrink: 0;
}

/* Краткое описание + ссылка на политику */
.cookie .ck-intro {
  font-size: 12px;
  color: var(--muted, #4C6767);
  line-height: 1.5;
  margin: 0 0 10px;
}
.cookie .ck-intro a {
  color: var(--healing, #12A4A4);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 2px;
  transition: color .15s;
  white-space: nowrap;
}
.cookie .ck-intro a:hover {
  color: var(--ink, #0A4B4B);
  text-decoration: none;
}

/* Ряд кнопок */
.cookie .ck-row {
  display: flex;
  gap: 8px;
  margin: 0;
}
.cookie .ck-ok,
.cookie .ck-no {
  font-family: inherit;
  font-size: 13px;
  font-weight: 700;
  padding: 9px 14px;
  border-radius: 10px;
  cursor: pointer;
  transition: background .2s, color .2s, border-color .2s, transform .12s;
  line-height: 1.2;
}
.cookie .ck-ok {
  flex: 1 1 auto;
  background: var(--ink, #0A4B4B);
  color: #fff;
  border: none;
}
.cookie .ck-ok:hover {
  background: var(--ink-2, #000);
  transform: translateY(-1px);
}
.cookie .ck-no {
  flex: 1 1 auto;
  background: transparent;
  color: var(--muted, #4C6767);
  border: 1px solid var(--line, rgba(10,75,75,.18));
}
.cookie .ck-no:hover {
  background: var(--mist, #EEF6F6);
  color: var(--ink, #0A4B4B);
  border-color: var(--line, rgba(10,75,75,.30));
}

/* Мобильные — баннер на всю ширину снизу, над disclaimer-bar */
@media (max-width: 1023px) {
  .cookie {
    left: 12px !important;
    right: 12px !important;
    bottom: 84px !important;
    max-width: none !important;
    padding: 12px 14px 10px;
  }
  .cookie .ck-intro {
    font-size: 11.5px;
  }
  .cookie .ck-ok,
  .cookie .ck-no {
    font-size: 12.5px;
    padding: 9px 12px;
  }
}
@media (max-width: 480px) {
  .cookie .ck-row {
    flex-direction: row;
  }
  .cookie .ck-ok,
  .cookie .ck-no {
    flex: 1 1 50%;
  }
}

/* Тёмная тема */
html.dark .cookie {
  background: var(--surface, #0E2626);
  border-color: var(--line, rgba(255,255,255,.12));
  box-shadow: 0 10px 30px rgba(0,0,0,.45);
}
html.dark .cookie .ck-t {
  color: var(--ink, #ffffff);
}
html.dark .cookie .ck-intro {
  color: var(--muted, #9DB5B5);
}
html.dark .cookie .ck-no {
  color: var(--muted, #9DB5B5);
  border-color: var(--line, rgba(255,255,255,.18));
}
html.dark .cookie .ck-no:hover {
  background: rgba(255,255,255,.06);
  color: var(--ink, #fff);
}

/* Версия для слабовидящих (html.a11y) */
html.a11y .cookie {
  background: var(--a11y-bg, #fff) !important;
  color: var(--a11y-fg, #000) !important;
  border: 2px solid var(--a11y-border, #000) !important;
  box-shadow: none !important;
}
html.a11y .cookie *,
html.a11y .cookie .ck-t,
html.a11y .cookie .ck-intro,
html.a11y .cookie .ck-no {
  color: var(--a11y-fg, #000) !important;
  background-color: transparent !important;
  border-color: var(--a11y-border, #000) !important;
}
html.a11y .cookie .ck-ok {
  background: var(--a11y-fg, #000) !important;
  color: var(--a11y-bg, #fff) !important;
  border: 2px solid var(--a11y-fg, #000) !important;
}

/* ============================================================
   END COOKIE BANNER v2
   ============================================================ */


/* price-extra-content - injected after price block */
.price-extra-block { padding: 0 0 92px 0 !important; }
.price-extra-content h2 { margin: 1.8em 0 0.7em; font-size: 1.45rem; line-height: 1.3; font-weight: 700; }
.price-extra-content h3 { margin: 1.4em 0 0.6em; font-size: 1.18rem; line-height: 1.35; font-weight: 600; }
.price-extra-content p { margin: 0.9em 0; line-height: 1.65; }
.price-extra-content p + p { margin-top: 1em; }
.price-extra-content strong { font-weight: 600; }
.price-extra-content ul, .price-extra-content ol { margin: 1em 0; padding-left: 1.4em; }
.price-extra-content li { margin: 0.4em 0; }
@media (max-width: 760px) {
  .acc-list { grid-template-columns: 1fr !important; }
}
.doctor-role a,
.doctor-card .doctor-role a {
  text-decoration: none !important;
}
@media (max-width: 768px) {
  .scroll-top {
    left: auto !important;
    right: 16px !important;
    bottom: 84px !important;
    transform: none !important;
  }
}
.doctor-card {
  cursor: pointer;
}