/* ============================================================
   Новая главная. БАЗА: дизайн-токены, сброс, контейнер.
   Шрифт: IBM Plex Sans / IBM Plex Mono (самохощены, Cyrillic+Latin).
   Источник значений: Figma (get_variable_defs + get_design_context).

   Стили разрезаны по файлам parts/*.css — по одному на блок страницы,
   чтобы параллельные ветки не дрались за один большой файл. Порядок
   каскада = алфавитный порядок имён (числовой префикс). Файлы склеиваются
   в assets/css/app.css автоматически (inc/assets.php); app.css —
   генерируемый, в git не хранится и руками не правится.
   Карта «блок ↔ файл» — в docs/new-homepage-parallel-work.md.
   ============================================================ */

/* ---- Шрифты ---------------------------------------------------------- */
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:400;font-display:swap;
  src:url("../fonts/ibm-plex-sans-cyrillic-400.woff2") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:400;font-display:swap;
  src:url("../fonts/ibm-plex-sans-latin-400.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:500;font-display:swap;
  src:url("../fonts/ibm-plex-sans-cyrillic-500.woff2") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:500;font-display:swap;
  src:url("../fonts/ibm-plex-sans-latin-500.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;
  src:url("../fonts/ibm-plex-mono-cyrillic-400.woff2") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;
  src:url("../fonts/ibm-plex-mono-latin-400.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;
  src:url("../fonts/ibm-plex-mono-cyrillic-500.woff2") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;
  src:url("../fonts/ibm-plex-mono-latin-500.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}

/* ---- Токены ---------------------------------------------------------- */
:root{
  /* Шрифты */
  --sx-font:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --sx-font-mono:"IBM Plex Mono",ui-monospace,"SF Mono",Menlo,Consolas,monospace;

  /* Цвета (Figma: get_variable_defs + пиксельные сэмплы макета) */
  --sx-white:#ffffff;
  --sx-black:#000000;
  --sx-btn-black:#222222;        /* Btn/Black */
  --sx-blue:#1e5bff;             /* акцент: EN, кнопки, ссылки, иконки */
  --sx-page-bg:#eff5ff;          /* фон страницы (светло-голубой) */
  --sx-ink:#0f172a;              /* основной тёмный текст (slate-900) */
  --sx-ink-soft:#475569;         /* вторичный текст (slate-600) */
  --sx-search-bg:#f2f2f2;        /* поле поиска */
  --sx-sep:#e6e6e6;              /* Separators/Vibrant */
  --sx-card-border:#e2e8f0;      /* бордеры карточек / разделители (slate-200) */
  --sx-tab-gray:#eff6ff;         /* Tab/Gray */

  /* Раскладка */
  --sx-maxw:1920px;
  --sx-gutter:40px;
}

/* ---- Сброс ----------------------------------------------------------- */
/* Сброс НАМЕРЕННО не глобальный. Шапка и подвал нового дизайна выводятся и на
   страницах старого шаблона december2018 — бок о бок с его вёрсткой. Глобальные
   `a{text-decoration:none}`, `ul{list-style:none}`, `p{margin:0}`, `img{display:block}`
   снесли бы там ссылки, списки и отступы во всём контенте сайта.
   Поэтому сброс живёт под `.sx-scope`: класс висит на <body> новой главной и на
   корневых элементах шапки и подвала (inc/header.php, inc/footer.php).
   Новые правила пишем ТОЛЬКО с этим префиксом — глобальное протечёт на старые
   страницы, и заметят это не сразу. */
html{-webkit-text-size-adjust:100%;}
/* margin — глобально: шапка и подвал идут во всю ширину, и дефолтные 8px тела
   в старом шаблоне дают белую рамку по краям. overflow-x — только на новой
   главной: clip создаёт контейнер для position:fixed/sticky, а в december2018
   на них завязана вёрстка. */
body{margin:0;}
body.sx{overflow-x:clip;}

/* Обёртка `:where()` — не для красоты: у неё НУЛЕВАЯ специфичность, поэтому
   `:where(.sx-scope) button` весит ровно столько же, сколько весил прежний
   глобальный `button` (0,0,1). Без неё селектор становится (0,1,1) и начинает
   перебивать одноклассовые правила блоков — так, например, `background:none`
   из сброса съел спрайт у `.sx-mh-tap` (иконки поиска и бургера в мобильной
   шапке стали невидимыми). Область действия сузили, вес каскада — нет. */
:where(.sx-scope,.sx-scope *,.sx-scope *::before,.sx-scope *::after){box-sizing:border-box;}

/* Типографика нового дизайна вынесена из `.sx` в `.sx-scope`: под шапкой на
   главной лежит светло-голубая `.sx-top`, и белый фон затёр бы её. */
.sx-scope{
  font-family:var(--sx-font);
  color:var(--sx-ink);
  font-size:16px;line-height:1.4;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
.sx{background:#fff;}

:where(.sx-scope) :where(img,svg,video){display:block;max-width:100%;}
:where(.sx-scope) a{color:inherit;text-decoration:none;}
:where(.sx-scope) button{font:inherit;color:inherit;cursor:pointer;background:none;border:0;padding:0;}
:where(.sx-scope) input{font:inherit;}
:where(.sx-scope) :where(ul,ol){margin:0;padding:0;list-style:none;}
:where(.sx-scope) :where(h1,h2,h3,h4,h5,h6,p){margin:0;}

/* ---- Контейнер ------------------------------------------------------- */
.sx-container{
  width:100%;max-width:var(--sx-maxw);
  margin-inline:auto;padding-inline:var(--sx-gutter);
}

/* Верхняя светло-голубая зона (хедер + герой); остальная страница — белая */
.sx-top{background:var(--sx-page-bg);padding-bottom:48px;}

/* маска-иконка: цвет через background-color (currentColor по умолчанию) */
.sx-mask{display:inline-block;background-color:currentColor;
  -webkit-mask-position:center;mask-position:center;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;}

/* ============================================================
   ХЕДЕР (Figma node 1:194, 1920×224)
   ============================================================ */
.sx-header{position:relative;z-index:10;}

/* — Утилит-строка — */
.sx-topbar{padding-block:8px;}
.sx-topbar__inner{display:flex;justify-content:flex-end;align-items:center;
  height:33px;gap:32px;}
.sx-topbar__access{display:inline-flex;align-items:center;gap:12px;
  font-family:var(--sx-font-mono);font-weight:500;font-size:16px;line-height:1.05;
  letter-spacing:.8px;text-transform:uppercase;color:var(--sx-ink);}
.sx-topbar__access .sx-mask{width:32px;height:26px;background-color:var(--sx-blue);
  -webkit-mask-image:url(../icons/glasses.svg);mask-image:url(../icons/glasses.svg);
  -webkit-mask-size:28px;mask-size:28px;}
.sx-lang{display:inline-flex;align-items:center;gap:4px;
  font-family:var(--sx-font-mono);font-weight:500;font-size:16px;line-height:1.05;
  letter-spacing:.8px;text-transform:uppercase;color:var(--sx-blue);}
.sx-lang .sx-mask{width:12px;height:12px;background-color:var(--sx-blue);
  -webkit-mask-image:url(../icons/chevron-down.svg);mask-image:url(../icons/chevron-down.svg);
  -webkit-mask-size:10px;mask-size:10px;}

/* — Карточка меню — */
.sx-nav{display:flex;align-items:stretch;gap:32px;padding:24px;
  background:var(--sx-white);border:1px solid var(--sx-card-border);border-radius:24px;
  box-shadow:0 20px 6px rgba(30,91,255,.02),0 9px 4.5px rgba(30,91,255,.03),0 2px 2.5px rgba(30,91,255,.03);}
.sx-logo{flex:none;display:flex;align-items:center;}
.sx-logo img{width:113px;height:127px;}
.sx-nav__main{flex:1 1 0;min-width:0;display:flex;flex-direction:column;
  gap:24px;justify-content:center;}

/* верхняя строка карточки: поиск + кнопка + контакты */
.sx-nav__top{display:flex;align-items:flex-start;justify-content:space-between;
  gap:24px;height:56px;}
.sx-search-row{display:flex;align-items:stretch;gap:24px;flex:1 1 auto;min-width:0;}
.sx-search{display:flex;align-items:center;justify-content:space-between;gap:12px;
  flex:1 1 auto;max-width:728px;min-width:0;height:56px;
  background:var(--sx-search-bg);border:1px solid var(--sx-sep);border-radius:12px;
  padding:13px 12px;}
.sx-search input{flex:1;min-width:0;border:0;background:none;outline:none;
  font-size:16px;letter-spacing:-.32px;color:var(--sx-ink);}
.sx-search input::placeholder{color:rgba(0,0,0,.5);}
/* лупа = сабмит формы (клик по ней ищет так же, как Enter) */
.sx-search__go{flex:none;display:inline-flex;align-items:center;justify-content:center;
  width:24px;height:24px;padding:0;border:0;background:none;cursor:pointer;}
.sx-search__ic{flex:none;width:24px;height:24px;}

.sx-btn-book{flex:none;position:relative;width:236px;height:56px;
  display:inline-flex;align-items:center;
  background:url(../icons/btn-book-bg.svg) center/100% 100% no-repeat;}
.sx-btn-book__t{margin-left:32px;font-weight:500;font-size:18px;line-height:1.05;
  letter-spacing:.9px;text-transform:uppercase;color:#fff;}
.sx-btn-book__arr{position:absolute;right:32px;top:50%;transform:translateY(-50%);
  width:32px;height:32px;}

.sx-contacts{flex:none;position:relative;display:flex;flex-direction:column;
  justify-content:center;gap:8px;}
.sx-contacts__phone{display:inline-flex;align-items:center;gap:8px;
  font-size:20px;letter-spacing:-.4px;color:var(--sx-ink);}
.sx-contacts__phone .sx-mask{width:8px;height:5px;background-color:var(--sx-ink);
  -webkit-mask-image:url(../icons/chevron-down.svg);mask-image:url(../icons/chevron-down.svg);
  -webkit-mask-size:contain;mask-size:contain;transition:transform .2s ease;}
.sx-contacts__hours{font-size:16px;letter-spacing:-.32px;color:var(--sx-ink-soft);}

/* — Выпадающая карточка контактов (Figma 1:1458, 236×241) —
   Открывается по наведению/фокусу на блоке контактов, как подменю .sx-menu__entry.
   Правый край выровнен по внешнему краю карточки меню (у .sx-nav padding 24px). */
.sx-cdd{position:absolute;top:100%;right:-24px;z-index:60;margin-top:10px;
  width:236px;display:flex;flex-direction:column;gap:16px;padding:16px;
  background:#fff;border-radius:12px;box-shadow:0 2px 10.5px rgba(0,0,0,.08);
  opacity:0;visibility:hidden;transform:translateY(8px);
  transition:opacity .18s ease,transform .18s ease,visibility 0s linear .18s;}
.sx-cdd::before{content:"";position:absolute;left:0;right:0;top:-10px;height:10px;} /* hover-мостик */
.sx-contacts:hover .sx-cdd,
.sx-contacts:focus-within .sx-cdd{opacity:1;visibility:visible;transform:none;
  transition:opacity .18s ease,transform .18s ease;}
.sx-contacts:hover .sx-contacts__phone .sx-mask,
.sx-contacts:focus-within .sx-contacts__phone .sx-mask{transform:rotate(180deg);}

.sx-cdd__item{display:flex;flex-direction:column;gap:8px;max-width:188px;} /* по макету текст уже колонки */
.sx-cdd__label{font-size:16px;line-height:1.2;letter-spacing:-.32px;color:rgba(0,0,0,.52);}
.sx-cdd__value{font-size:20px;line-height:1.2;letter-spacing:-.4px;color:var(--sx-black);
  white-space:nowrap;}
.sx-cdd__sep{height:1px;background:rgba(0,0,0,.1);}
.sx-cdd__social{display:flex;justify-content:space-between;margin-top:8px;} /* 16 + 8 = gap 24 по макету */
.sx-cdd__soc{flex:none;width:32px;height:32px;
  background:url(../icons/hdr-soc-row.svg) no-repeat;background-size:204px 32px;
  background-position:calc(var(--i) * -43px) 0;}

/* нижняя строка карточки: разделитель + меню */
.sx-nav__bottom{display:flex;flex-direction:column;gap:19px;}
.sx-nav__divider{height:1px;background:var(--sx-card-border);}
.sx-nav__menurow{display:flex;align-items:center;justify-content:space-between;
  gap:24px;height:27px;}
.sx-menu{display:flex;align-items:center;gap:40px;}
.sx-menu__item{display:inline-flex;align-items:center;gap:6px;
  font-family:var(--sx-font-mono);font-weight:400;font-size:16px;line-height:1.05;
  letter-spacing:.8px;text-transform:uppercase;color:var(--sx-ink);
  transition:color .15s ease;white-space:nowrap;}
.sx-menu__item:hover{color:var(--sx-blue);}
.sx-menu__item .sx-mask{width:16px;height:16px;background-color:currentColor;
  -webkit-mask-image:url(../icons/chevron-down.svg);mask-image:url(../icons/chevron-down.svg);
  -webkit-mask-size:11px;mask-size:11px;transition:transform .2s ease;}

/* выпадающее подменю верхнего меню (данные из Bitrix) */
.sx-header{position:relative;z-index:40;}          /* меню/дропдаун над героем */
.sx-menu__entry{position:relative;display:inline-flex;align-items:center;}
.sx-menu__entry .sx-menu__item{cursor:pointer;}
.sx-menu__entry:hover .sx-menu__item .sx-mask{transform:rotate(180deg);}
.sx-menu__dropdown{position:absolute;left:-12px;top:100%;z-index:60;margin-top:10px;
  min-width:260px;max-width:380px;max-height:min(72vh,560px);overflow-y:auto;
  display:flex;flex-direction:column;gap:2px;padding:12px;
  background:#fff;border:1px solid var(--sx-card-border);border-radius:16px;
  box-shadow:0 18px 44px rgba(8,20,45,.16);
  opacity:0;visibility:hidden;transform:translateY(8px);
  transition:opacity .18s ease,transform .18s ease,visibility 0s linear .18s;}
.sx-menu__dropdown::before{content:"";position:absolute;left:0;right:0;top:-12px;height:12px;} /* hover-мостик */
.sx-menu__entry:hover .sx-menu__dropdown,
.sx-menu__entry:focus-within .sx-menu__dropdown{opacity:1;visibility:visible;transform:none;
  transition:opacity .18s ease,transform .18s ease;}
.sx-menu__sub{display:block;padding:9px 12px;border-radius:10px;font-family:var(--sx-font);
  font-size:15px;line-height:1.3;letter-spacing:-.2px;text-transform:none;color:var(--sx-ink);
  transition:background .15s ease,color .15s ease;}
.sx-menu__sub:hover{background:#f1f5ff;color:var(--sx-blue);}
/* заголовок группы внутри дропдауна (Центры и службы / Институты / …) */
.sx-menu__group{padding:10px 12px 4px;font-family:var(--sx-font);font-size:13px;line-height:1.3;
  letter-spacing:.4px;text-transform:uppercase;color:var(--sx-ink-soft);font-weight:500;}
.sx-menu__group:not(:first-child){margin-top:6px;border-top:1px solid var(--sx-sep);}

/* подпункты в бургер-drawer */
.sx-drawer__subnav{display:flex;flex-direction:column;margin:2px 0 8px 6px;padding-left:14px;
  border-left:2px solid var(--sx-sep);}
.sx-drawer__subnav a{padding:9px 0;font-size:16px;line-height:1.3;letter-spacing:-.32px;color:var(--sx-ink-soft);}
.sx-drawer__subnav a:hover{color:#1e5bff;}
.sx-drawer__subgroup{display:block;padding:10px 0 4px;font-size:13px;letter-spacing:.4px;
  text-transform:uppercase;color:var(--sx-ink-soft);font-weight:500;}
.sx-lk{display:inline-flex;align-items:center;gap:8px;white-space:nowrap;
  font-family:var(--sx-font-mono);font-weight:400;font-size:16px;line-height:1.05;
  letter-spacing:.8px;text-transform:uppercase;color:var(--sx-ink);
  transition:color .15s ease;}
.sx-lk:hover{color:var(--sx-blue);}
.sx-lk__ic{flex:none;width:24px;height:24px;color:#4c7dff;} /* иконка ЛК: акцент @~80% (из макета) */

/* ============================================================
   ГЕРОЙ (Figma node 1:288, 1840×600)
   ============================================================ */
.sx-hero{display:flex;gap:24px;align-items:stretch;margin-top:48px;}

/* — Левая карточка-слайдер — */
.sx-hero__main{position:relative;flex:1 1 0;min-width:0;height:600px;overflow:hidden;
  background:linear-gradient(244.572deg,#f7f9fc 26.53%,#ffffff 98.703%);
  border:1px solid var(--sx-card-border);border-radius:24px;
  box-shadow:0 20px 12px rgba(30,91,255,.02),0 9px 9px rgba(30,91,255,.03),0 2px 5px rgba(30,91,255,.03);
  --sx-hero-lead:589px;} /* ширина колонки «индикатор + текст»; меняется по брейкпойнтам */
.sx-hero__dna{position:absolute;left:713px;top:-17px;width:632px;height:632px;
  object-fit:contain;opacity:.76;pointer-events:none;}
/* панель «текст + кнопка»: на десктопе прозрачна для раскладки — дети позиционируются как раньше */
.sx-hero__panel{display:contents;}
/* слайды лежат в одной grid-ячейке: карточка держит высоту самого длинного заголовка
   и не прыгает при автолистании (на планшете/телефоне высота карточки — по контенту) */
.sx-hero__lead{position:absolute;left:31px;top:75px;width:var(--sx-hero-lead);
  display:grid;} /* 75 = 31 (отступ) + 4 (индикатор) + 40 (зазор макета) */
.sx-hero__slider{position:absolute;left:31px;top:31px;width:var(--sx-hero-lead);
  display:flex;gap:12px;--sx-hero-slide:7s;} /* --sx-hero-slide — длительность слайда */
.sx-hero__slider span{position:relative;overflow:hidden;flex:1 1 0;height:4px;border-radius:4px;
  background:rgba(76,125,255,.4);cursor:pointer;}
/* полоска-таймер: заливается слева направо за --sx-hero-slide, по концу JS листает слайд */
.sx-hero__slider span::after{content:"";position:absolute;left:0;top:0;right:0;bottom:0;
  background:#4c7dff;border-radius:inherit;transform:scaleX(0);transform-origin:left center;}
.sx-hero__slider span.is-active::after{transform:scaleX(1);} /* без автоплея — просто активная точка */
.sx-hero__slider.is-auto span.is-active::after{animation:sx-hero-fill var(--sx-hero-slide) linear forwards;}
.sx-hero__slider.is-paused span.is-active::after{animation-play-state:paused;}
@keyframes sx-hero-fill{from{transform:scaleX(0);}to{transform:scaleX(1);}}
.sx-hero__heading{grid-area:1/1;display:flex;flex-direction:column;gap:24px;}
/* display:flex вместо display:none — неактивный слайд остаётся в потоке (держит высоту),
   но visibility:hidden убирает его и из отрисовки, и из дерева доступности.
   animation:none обязателен: без смены display анимация sx-fade из 40-animation.css
   не перезапускалась бы при листании — а так имя меняется none → sx-fade и слайд проявляется. */
.sx-hero__heading[hidden]{display:flex;visibility:hidden;animation:none;}
.sx-hero__title{font-weight:500;font-size:60px;line-height:1.07;letter-spacing:-2.4px;color:var(--sx-ink);}
.sx-hero__subtitle{font-weight:400;font-size:24px;line-height:1.4;letter-spacing:-.96px;color:var(--sx-ink-soft);}
.sx-hero__btn{position:absolute;left:31px;top:511px;height:56px;
  display:inline-flex;align-items:center;justify-content:center;gap:16px;
  padding:12px 32px;border:1px solid #4c7dff;border-radius:12px;
  color:#4c7dff;font-weight:500;font-size:18px;line-height:1.05;letter-spacing:.9px;text-transform:uppercase;
  transition:background .15s ease,color .15s ease;}
.sx-hero__btn:hover{background:#4c7dff;color:#fff;}
.sx-hero__nav{position:absolute;right:31px;top:495px;display:flex;gap:12px;}
.sx-hero__navbtn{width:120px;height:72px;display:inline-flex;align-items:center;justify-content:center;
  background:#fff;border:1px solid var(--sx-card-border);border-radius:8px;color:#4c7dff;cursor:pointer;
  transition:background .15s ease,border-color .15s ease;}
.sx-hero__navbtn:hover{background:#eef3ff;border-color:#4c7dff;}
.sx-hero__navbtn svg{width:16px;height:12px;}
.sx-hero__navbtn--next svg{transform:scaleX(-1);}

/* — Правый столбец —
   Ширина столбца в макетах пропорциональна контейнеру, а не фиксирована:
   1920 → 597/1840 = 32.45%, 1440 → 437/1360 = 32.1%. Держим долю (см. 22-resp-desktop-1600),
   иначе на 1440 столбец съедает карточку героя и ДНК уезжает за overflow:hidden. */
.sx-hero__side{flex:0 0 597px;display:flex;flex-direction:column;gap:24px;}

/* Анонс */
.sx-annonce{position:relative;width:100%;height:288px;}
/* вырез угла — той же svg-маской, что и рамка (обе тянутся 100%×100%),
   поэтому силуэт и обводка совпадают на любой ширине столбца */
.sx-annonce__clip{position:absolute;inset:0;overflow:hidden;background:#fff;
  -webkit-mask:url(../img/hero-announce-mask.svg) 0 0/100% 100% no-repeat;
          mask:url(../img/hero-announce-mask.svg) 0 0/100% 100% no-repeat;}
.sx-annonce__photo{position:absolute;top:0;right:0;width:min(242px,41%);height:100%;
  object-fit:cover;object-position:left center;}
.sx-annonce__body{position:absolute;left:23px;top:21px;width:min(280px,100% - 23px - 43%);
  display:flex;flex-direction:column;gap:16px;}
.sx-annonce__title{width:min(264px,100%);font-weight:500;font-size:24px;line-height:1.3;letter-spacing:-.72px;color:var(--sx-ink);}
.sx-annonce__date{font-weight:400;font-size:20px;line-height:1.2;letter-spacing:-.4px;color:var(--sx-ink-soft);}
.sx-annonce__btn{position:absolute;right:25px;bottom:25px;}
.sx-annonce__border{position:absolute;inset:0;pointer-events:none;
  background:url(../img/hero-announce-border.svg) 0 0/100% 100% no-repeat;}

/* Кнопка-стрелка (etc) — синий квадрат со стрелкой */
.sx-etc{flex:none;display:inline-flex;align-items:center;justify-content:center;
  width:32px;height:32px;background:#4c7dff;border-radius:8px;color:#fff;}
.sx-etc--outline{background:none;border:1px solid #4c7dff;color:#4c7dff;}
.sx-etc svg{width:7px;height:12px;display:block;}

/* Сетка 2×2 карточек */
.sx-hero__grid{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:138px 138px;gap:12px;}
.sx-hcard{position:relative;display:block;height:138px;padding:24px;
  background:url(../img/card-bg.svg) center/100% 100% no-repeat;}
.sx-hcard__label{font-weight:400;font-size:24px;line-height:1.4;letter-spacing:-.96px;color:var(--sx-ink);overflow-wrap:anywhere;}
.sx-hcard .sx-etc{position:absolute;right:24px;bottom:24px;}

/* ------------------------------------------------------------
   1440–1919: двухколоночная раскладка сохраняется, но всё внутри
   едет между двумя макетами — 1440 (Figma 49:481) и 1920 (1:288).
   Значения линейно интерполированы: clamp() попадает точно в обе точки.
     столбец 437 → 597 | лид 544 → 589 | ДНК 498 → 632
   Раньше столбец был жёстко 597px: на 1440 карточка героя ужималась
   до 739px и ДНК целиком уходила под overflow:hidden.
   ------------------------------------------------------------ */
@media (min-width:1440px) and (max-width:1919px){
  .sx-hero__side{flex-basis:32.45%;}
  .sx-hero__main{--sx-hero-lead:clamp(544px,calc(544px + (100vw - 1440px) * .09375),589px);}
  .sx-hero__dna{left:auto;height:auto;aspect-ratio:1;
    width:clamp(498px,calc(498px + (100vw - 1440px) * .27917),632px);
    right:clamp(-126px,calc(-84px - (100vw - 1440px) * .0875),-84px);
    top:clamp(-17px,calc(69px - (100vw - 1440px) * .17917),69px);}
}

/* ============================================================
   БЛОК 3 — Каталог направлений (Figma node 1:352)
   ============================================================ */
.sx-spec{background:#fff;margin-top:56px;padding-block:64px;}
.sx-spec__inner{display:flex;flex-direction:column;gap:40px;}
.sx-spec__title{font-weight:500;font-size:60px;line-height:1.07;letter-spacing:-2.4px;color:var(--sx-ink);}
.sx-spec__panel{display:flex;flex-direction:column;gap:40px;}

/* интро + поиск + чипсы */
.sx-spec__top{display:flex;gap:40px;align-items:flex-start;}
.sx-spec__intro{flex:none;width:441px;font-weight:400;font-size:24px;line-height:1.4;letter-spacing:-.96px;color:var(--sx-ink-soft);}
.sx-spec__find{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:16px;}
.sx-spec__search{display:flex;align-items:center;justify-content:space-between;gap:12px;height:56px;
  background:var(--sx-search-bg);border:1px solid var(--sx-sep);border-radius:12px;padding:13px 12px;}
.sx-spec__search input{flex:1;min-width:0;border:0;background:none;outline:none;font-size:16px;letter-spacing:-.32px;color:var(--sx-ink);}
.sx-spec__search input::placeholder{color:rgba(0,0,0,.5);}
/* лупа = сабмит формы (клик по ней ищет так же, как Enter) */
.sx-spec__search-go{flex:none;display:inline-flex;align-items:center;justify-content:center;
  width:24px;height:24px;padding:0;border:0;background:none;cursor:pointer;}
.sx-spec__search-ic{flex:none;width:24px;height:24px;}
.sx-spec__chips{display:flex;flex-wrap:wrap;gap:16px;}
/* чипсы «Реклама»: скошены только верх-лево и низ-право; два других угла скруглены.
   border-radius скругляет TR+BL, clip-path срезает фаску на TL+BR (перебивает радиус
   только на этих углах). Синяя рамка — двумя слоями (фон=рамка, ::before-вставка=заливка). */
.sx-adchip{position:relative;isolation:isolate;display:inline-flex;align-items:center;height:45px;padding:0 25px;
  background:rgba(30,91,255,.5);border-radius:0 8px 0 8px;
  clip-path:polygon(9px 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%,0 9px);
  font-family:var(--sx-font-mono);font-size:16px;line-height:1.05;letter-spacing:.5px;color:var(--sx-ink);}
.sx-adchip::before{content:"";position:absolute;inset:1.5px;z-index:-1;background:#fff;border-radius:0 6.5px 0 6.5px;
  clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);}

/* светло-синяя панель */
.sx-spec__body{position:relative;background:#eef7ff;border-radius:32px;overflow:hidden;
  padding:40px;display:flex;flex-direction:column;gap:40px;}
.sx-spec__tabs{display:flex;gap:16px;}
.sx-tab{display:inline-flex;align-items:center;justify-content:center;padding:12px 24px;border-radius:8px;
  font-family:var(--sx-font-mono);font-size:24px;line-height:1.1;letter-spacing:-1.2px;
  border:1px solid transparent;color:var(--sx-blue);}
.sx-tab.is-active{background:var(--sx-blue);color:#fff;}
.sx-tab:not(.is-active){border-color:var(--sx-blue);}

.sx-spec__cols{display:flex;gap:clamp(48px,12.5vw - 112px,128px);align-items:flex-start;} /* gap флюид: 48@1280 → 128@1920 (на 1920 = как в макете) */
.sx-spec__nav{flex:none;display:flex;gap:16px;align-items:flex-start;}
.sx-spec__nav-arrow{flex:none;width:45px;height:51px;}
.sx-spec__nav-list{display:flex;flex-direction:column;gap:40px;padding-top:8px;}
.sx-spec__nav-item{font-weight:400;font-size:24px;line-height:1.3;letter-spacing:-.72px;color:rgba(30,91,255,.5);transition:color .15s ease;}
.sx-spec__nav-item.is-active{font-weight:500;color:var(--sx-blue);}
.sx-spec__nav-item:hover{color:var(--sx-blue);}

.sx-spec__catalog{flex:1 1 0;min-width:0;
  background:#fff;border:1px solid var(--sx-card-border);border-radius:24px;padding:24px;
  box-shadow:0 4px 3.45px rgba(0,0,0,.05);}
/* панель категории = ряд колонок; неактивные скрыты (класс перебивает [hidden]) */
.sx-spec__cat{display:flex;gap:clamp(28px,8.125vw - 76px,80px);align-items:flex-start;} /* gap флюид: 28@1280 → 80@1920 */
.sx-spec__cat[hidden]{display:none;}
.sx-spec__col{display:flex;flex-direction:column;gap:40px;}
.sx-spec__col:first-child{flex:none;width:273px;}
.sx-spec__col:not(:first-child){flex:1 1 0;min-width:0;}
.sx-spec__group{display:flex;flex-direction:column;gap:12px;border-left:1px solid #000;padding-left:16px;}
.sx-spec__item{font-weight:400;font-size:20px;line-height:1.2;letter-spacing:-.4px;color:#000;overflow-wrap:anywhere;transition:color .15s ease;} /* длинные термины переносятся, а не вылезают/налезают */
.sx-spec__item:hover{color:var(--sx-blue);}

/* ============================================================
   БЛОК 4 — Наши специалисты (Figma node 1:535)
   ============================================================ */
.sx-docs{margin-top:96px;display:flex;flex-direction:column;gap:40px;}
.sx-docs__head{display:flex;align-items:center;justify-content:space-between;gap:24px;}
.sx-docs__title{font-weight:500;font-size:60px;line-height:1.07;letter-spacing:-2.4px;color:var(--sx-ink);}
.sx-docs__all{display:inline-flex;align-items:center;gap:16px;
  font-weight:500;font-size:18px;line-height:1.05;letter-spacing:.9px;text-transform:uppercase;color:#4c7dff;}

.sx-docs__carousel{display:flex;gap:32px;align-items:stretch;}
.sx-docs__stat{flex:none;width:391px;display:flex;flex-direction:column;justify-content:space-between;}
.sx-docs__stat-top{display:flex;flex-direction:column;gap:24px;}
.sx-docs__stat-intro{font-weight:400;font-size:24px;line-height:1.4;letter-spacing:-.96px;color:var(--sx-ink-soft);}
.sx-statbox{position:relative;width:349px;height:139px;overflow:hidden;border-radius:16px;
  background:var(--sx-blue);box-shadow:0 4px 6.9px rgba(0,0,0,.1);}
.sx-statbox__text{position:absolute;left:16px;top:16px;width:228px;display:flex;flex-direction:column;}
.sx-statbox__num{font-weight:500;font-size:32px;line-height:1.2;letter-spacing:-.64px;color:#fff;}
.sx-statbox__cap{font-weight:500;font-size:18px;line-height:1.3;letter-spacing:-.36px;color:rgba(255,255,255,.75);}
.sx-statbox__dna{position:absolute;left:262px;top:1px;width:128px;height:156px;}
.sx-docs__nav{display:flex;gap:12px;}
.sx-navbtn{width:120px;height:72px;display:inline-flex;align-items:center;justify-content:center;
  background:#fff;border:1px solid #4c7dff;border-radius:8px;color:#4c7dff;cursor:pointer;
  transition:opacity .15s ease,background .15s ease;}
.sx-navbtn:not(:disabled):hover{background:#eef3ff;}
.sx-navbtn:disabled{opacity:.35;cursor:default;}
.sx-navbtn svg{width:16px;height:12px;}
.sx-navbtn--next svg{transform:scaleX(-1);}

/* трек врачей — горизонтальная прокрутка (стрелками + тач), скроллбар скрыт */
.sx-docs__cards{flex:1 1 0;min-width:0;display:flex;gap:24px;
  overflow-x:auto;overflow-y:hidden;scrollbar-width:none;scroll-snap-type:x proximity;}
.sx-docs__cards::-webkit-scrollbar{display:none;}
.sx-doc{scroll-snap-align:start;}
.sx-doc{flex:none;filter:drop-shadow(0 4px 6.9px rgba(76,125,255,.1));}
.sx-doc__inner{position:relative;width:264px;height:390px;overflow:hidden;background:#e9eef5;
  -webkit-mask:url(../icons/doc-card-mask-tr.svg) center/100% 100% no-repeat;
  mask:url(../icons/doc-card-mask-tr.svg) center/100% 100% no-repeat;}
.sx-doc__photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:top center;}
.sx-doc__badges{position:absolute;left:8px;top:207px;display:flex;gap:6px;}
.sx-badge{display:inline-flex;align-items:center;gap:4px;padding:4px;border-radius:8px;
  background:rgba(255,255,255,.85);-webkit-backdrop-filter:blur(6.35px);backdrop-filter:blur(6.35px);
  font-size:16px;line-height:1.2;letter-spacing:-.32px;color:#000;}
.sx-badge img{width:16px;height:16px;}
.sx-doc__name{position:absolute;left:8px;right:8px;bottom:8px;height:143px;padding:16px;
  display:flex;gap:24px;align-items:stretch;
  background:#fff;border:1px solid var(--sx-card-border);border-radius:16px;}
.sx-doc__name-text{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:8px;}
.sx-doc__fio{font-weight:500;font-size:18px;line-height:1.3;letter-spacing:-.36px;color:var(--sx-ink);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.sx-doc__spec{font-weight:400;font-size:16px;line-height:1.2;letter-spacing:-.32px;color:var(--sx-ink-soft);
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;} /* реальные «должности» бывают длинные */
.sx-doc__more{display:inline-flex;flex:none;align-self:flex-end;}
/* вся карточка врача кликабельна (ТЗ §4.4): прозрачная ссылка-оверлей поверх */
.sx-doc__link{position:absolute;inset:0;z-index:3;}
.sx-doc:hover .sx-etc--outline{background:#4c7dff;color:#fff;}

/* ============================================================
   БЛОК 5 — Структура Клинического центра (Figma node 1:714)
   ============================================================ */
.sx-struct{margin-top:96px;display:flex;flex-direction:column;gap:40px;}
.sx-struct__head{display:flex;align-items:center;justify-content:space-between;gap:24px;}
.sx-struct__title{font-weight:500;font-size:60px;line-height:1.07;letter-spacing:-2.4px;color:var(--sx-ink);}
.sx-struct__all{display:inline-flex;align-items:center;gap:16px;line-height:1.05;
  font-weight:500;font-size:18px;letter-spacing:.9px;text-transform:uppercase;color:#4c7dff;}

.sx-struct__body{display:flex;gap:32px;align-items:flex-start;}
.sx-struct__map{position:relative;flex:none;width:min(1063px,60%);height:812px;border-radius:24px;overflow:hidden;background:#eef2f7;} /* карта флюид: не давит правый столбец на 1280–1600, на 1920 = 1063px */
.sx-struct__map img{width:100%;height:100%;object-fit:cover;}
.sx-struct__map-canvas{width:100%;height:100%;}
.sx-struct__map-canvas .ymaps-2-1-79-balloon{border-radius:12px;}
.sx-struct__side{flex:1 1 0;min-width:0;height:812px;display:flex;flex-direction:column;gap:32px;}
.sx-struct__lead{font-weight:400;font-size:24px;line-height:1.4;letter-spacing:-.96px;color:var(--sx-ink-soft);}
.sx-struct__search{flex:none;display:flex;align-items:center;justify-content:space-between;gap:12px;height:56px;
  background:var(--sx-search-bg);border:1px solid var(--sx-sep);border-radius:12px;padding:13px 12px;}
.sx-struct__search input{flex:1;min-width:0;border:0;background:none;outline:none;font-size:16px;letter-spacing:-.32px;color:var(--sx-ink);}
.sx-struct__search input::placeholder{color:rgba(0,0,0,.5);}
.sx-struct__search-ic{flex:none;width:24px;height:24px;}
/* Рамка списка учреждений — Figma node 1:774 (ED_main): белая карточка со скруглением 24 */
.sx-struct__list{flex:1 1 0;min-height:0;overflow-x:hidden;overflow-y:auto;display:flex;flex-direction:column;
  background:#fff;border:1px solid var(--sx-card-border);border-radius:24px;}
.sx-clinic[hidden]{display:none;} /* прячет поиск по списку */
.sx-balloon b{font-size:15px;color:#0f172a;}
.sx-balloon__addr{margin-top:4px;font-size:13px;line-height:1.35;color:#475569;}
.sx-balloon__links{margin-top:10px;display:flex;flex-wrap:wrap;gap:14px;}
.sx-balloon__links a{font-size:13px;color:#1e5bff;}
/* метка карты — синий кружок с номером (кастом, рендерится всегда) */
.sx-pin{position:absolute;left:-19px;top:-19px;width:38px;height:38px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:#1e5bff;color:#fff;font-weight:600;font-size:16px;line-height:1;
  border:2px solid #fff;box-shadow:0 2px 7px rgba(12,48,108,.4);cursor:pointer;}
/* синий балун — Figma node 1:727 (411×auto, паддинг 24, скругление 24) */
.sx-balloon2{position:absolute;width:411px;padding:24px;border-radius:24px;
  display:flex;flex-direction:column;gap:24px;
  background:#1e5bff;color:#fff;box-shadow:0 12px 32px rgba(12,48,108,.38);}
/* крестик: белый круг с синим крестом (крест вырезан fill-rule="evenodd" — сквозь него виден фон балуна) */
.sx-balloon2__close{position:absolute;right:6px;top:6px;display:flex;align-items:center;justify-content:center;
  width:32px;height:32px;padding:0;border:0;background:none;cursor:pointer;transition:opacity .15s;}
.sx-balloon2__close svg{display:block;width:26.67px;height:26.67px;}
.sx-balloon2__close:hover{opacity:.82;}
.sx-balloon2__top{display:flex;flex-direction:column;gap:8px;align-items:flex-start;}
.sx-balloon2__badge{display:inline-flex;align-items:center;padding:0 4px;border-radius:8px;
  background:rgba(255,255,255,.2);backdrop-filter:blur(15px);
  font-family:var(--sx-font-mono);font-size:18px;line-height:1.4;letter-spacing:-.36px;}
.sx-balloon2__text{display:flex;flex-direction:column;gap:12px;}
.sx-balloon2__name{font-weight:500;font-size:24px;line-height:1.3;letter-spacing:-.72px;}
.sx-balloon2__addr{font-size:16px;line-height:1.2;letter-spacing:-.32px;}
.sx-balloon2__links{display:flex;gap:16px;}
/* «Подробнее»: белая кнопка со скосами TL+BR (как чипы блока 3) и стрелкой */
.sx-balloon2__more{flex:1 1 auto;min-width:0;height:56px;display:inline-flex;align-items:center;justify-content:center;gap:22px;
  background:#fff;color:#000;font-weight:500;font-size:18px;line-height:1.05;letter-spacing:.9px;text-transform:uppercase;
  border-radius:0 8px 0 8px;
  clip-path:polygon(12px 0,100% 0,100% calc(100% - 12px),calc(100% - 12px) 100%,0 100%,0 12px);
  transition:background-color .15s;}
.sx-balloon2__more:hover{background:#e7eeff;}
.sx-balloon2__more-arr{flex:none;width:32px;height:32px;background-color:currentColor;
  -webkit-mask:url(../icons/arrow-right.svg) center/contain no-repeat;mask:url(../icons/arrow-right.svg) center/contain no-repeat;}
/* «Маршрут»: только иконка, без подписи */
.sx-balloon2__route{flex:none;width:56px;height:56px;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid #fff;border-radius:12px;transition:background-color .15s;}
.sx-balloon2__route:hover{background:rgba(255,255,255,.14);}
.sx-balloon2__route-ic{width:32px;height:32px;background-color:#fff;
  -webkit-mask:url(../icons/ic-route.svg) center/contain no-repeat;mask:url(../icons/ic-route.svg) center/contain no-repeat;}
.sx-balloon2__tail{position:absolute;left:50%;bottom:-7px;width:15px;height:15px;margin-left:-7px;
  background:#1e5bff;transform:rotate(45deg);border-radius:0 0 3px 0;}

/* Разделитель — псевдоэлемент, а не border: в макете линия не доходит до краёв рамки (отступ = паддинг карточки). */
.sx-clinic{position:relative;display:flex;flex-direction:column;gap:8px;padding:24px;}
.sx-clinic::after{content:"";position:absolute;left:24px;right:24px;bottom:0;height:1px;background:var(--sx-card-border);}
.sx-clinic:last-child::after,.sx-clinic.is-active::after{display:none;}
.sx-clinic__badge{align-self:flex-start;padding:0 4px;border-radius:8px;
  font-family:var(--sx-font-mono);font-size:18px;line-height:1.4;letter-spacing:-.36px;
  background:#bae2fc;color:#0f172a;}
.sx-clinic__name{margin-top:8px;font-weight:500;font-size:24px;line-height:1.3;letter-spacing:-1.2px;color:#0f172a;}
.sx-clinic__addr{display:inline-flex;align-items:center;gap:8px;font-size:16px;line-height:1.2;letter-spacing:-.32px;color:var(--sx-ink-soft);}
.sx-clinic__pin{flex:none;width:24px;height:24px;background-color:var(--sx-blue);
  -webkit-mask:url(../icons/ic-route.svg) center/contain no-repeat;mask:url(../icons/ic-route.svg) center/contain no-repeat;}
.sx-clinic.is-active{background:#1746c8;border-radius:24px;}
.sx-clinic.is-active .sx-clinic__name{color:#fff;}
.sx-clinic.is-active .sx-clinic__addr{color:#fff;}
.sx-clinic.is-active .sx-clinic__badge{background:rgba(255,255,255,.2);backdrop-filter:blur(15px);color:#fff;}
.sx-clinic.is-active .sx-clinic__pin{background-color:#fff;}
/* кнопка-оверлей поверх карты — только планшет/телефон (см. @media ниже) */
.sx-struct__map-btn{display:none;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  align-items:center;justify-content:center;width:min(280px,calc(100% - 48px));height:48px;white-space:nowrap;
  border:1px solid rgba(255,255,255,.85);border-radius:12px;background:transparent;
  font-family:var(--sx-font-mono);font-size:15px;line-height:1;letter-spacing:.5px;text-transform:uppercase;color:#fff;}

/* ============================================================
   БЛОК 6 — Почему нас выбирают (Figma node 1:903) — светлый бенто-грид
   ============================================================ */
/* Фигура stat/img-карточек: скруглённый прямоугольник с фаской на левом-верхнем
   и правом-нижнем углах (в макете это вектор Rectangle 15769766, один и тот же
   у stat и img). Замерено по экспорту: фаска 30px и радиус 24px на десктопе,
   25px/16px на планшете — поэтому размеры вынесены в две переменные, а точки
   polygon считаются из них.

   Стыки фаски с рёбрами скруглены тем же радиусом, что и обычные углы: чистый
   polygon(18px 0,…) давал слишком резкий срез. Дуга набрана тремя хордами по 15°
   (отклонение от окружности 0.2px при r=24) — так clip-path остаётся адаптивным
   (calc/%), чего не умеют ни path(), ни SVG-маска фиксированного размера.

   Коэффициенты при радиусе — геометрия угла 135°: точка на ребре отступает от
   вершины на r/tg67.5°=.414214r, точка на диагонали — на .292893r по каждой оси,
   две промежуточные точки дуги — центр r/sin67.5° плюс r·(cos,sin) для 15° и 30°. */
.sx-why{margin-top:96px;
  --sx-why-bevel:30px;
  --sx-why-round:24px;
  --sx-w-edge:calc(var(--sx-why-bevel) + var(--sx-why-round) * .414214);
  --sx-w-arc1a:calc(var(--sx-why-bevel) + var(--sx-why-round) * .155395);
  --sx-w-arc1b:calc(var(--sx-why-round) * .034074);
  --sx-w-arc2a:calc(var(--sx-why-bevel) - var(--sx-why-round) * .085786);
  --sx-w-arc2b:calc(var(--sx-why-round) * .133975);
  --sx-w-diaga:calc(var(--sx-why-bevel) - var(--sx-why-round) * .292893);
  --sx-w-diagb:calc(var(--sx-why-round) * .292893);
  --sx-why-bevel-clip:polygon(
    var(--sx-w-edge) 0, 100% 0,
    100% calc(100% - var(--sx-w-edge)),
    calc(100% - var(--sx-w-arc1b)) calc(100% - var(--sx-w-arc1a)),
    calc(100% - var(--sx-w-arc2b)) calc(100% - var(--sx-w-arc2a)),
    calc(100% - var(--sx-w-diagb)) calc(100% - var(--sx-w-diaga)),
    calc(100% - var(--sx-w-diaga)) calc(100% - var(--sx-w-diagb)),
    calc(100% - var(--sx-w-arc2a)) calc(100% - var(--sx-w-arc2b)),
    calc(100% - var(--sx-w-arc1a)) calc(100% - var(--sx-w-arc1b)),
    calc(100% - var(--sx-w-edge)) 100%,
    0 100%,
    0 var(--sx-w-edge),
    var(--sx-w-arc1b) var(--sx-w-arc1a),
    var(--sx-w-arc2b) var(--sx-w-arc2a),
    var(--sx-w-diagb) var(--sx-w-diaga),
    var(--sx-w-diaga) var(--sx-w-diagb),
    var(--sx-w-arc2a) var(--sx-w-arc2b),
    var(--sx-w-arc1a) var(--sx-w-arc1b));}
.sx-why__panel{position:relative;overflow:hidden;max-width:var(--sx-maxw);margin-inline:auto;
  border-radius:32px;padding:45px 40px;
  background:#dfe4ec url(../img/b6-bg.png) center/cover no-repeat;}
.sx-why__grid{display:grid;grid-template-columns:repeat(6,1fr);grid-template-rows:repeat(3,minmax(187px,auto));gap:8px;} /* ряд растёт под текст на узких десктопах, а не режет его (на 1920 контент влезает в 187px) */
.sx-why__head{display:flex;flex-direction:column;gap:24px;}
.sx-why__title{font-weight:500;font-size:60px;line-height:1.07;letter-spacing:-2.4px;color:var(--sx-ink);}
.sx-why__sub{font-weight:400;font-size:24px;line-height:1.4;letter-spacing:-.96px;color:#6a7889;max-width:474px;}

.sx-why-card{position:relative;border-radius:var(--sx-why-round);overflow:hidden;}
.sx-why-card__t{font-weight:500;font-size:24px;line-height:1.3;letter-spacing:-.72px;
  hyphens:auto;overflow-wrap:anywhere;} /* «Высокотехнологичная» не влезает в колонку уже с ~1780 — переносим по слогам, а не рубим посередине */
.sx-why-card__d{font-size:16px;line-height:1.2;letter-spacing:-.32px;}

/* текстовая карточка — тёмно-синяя.
   Колонка: текст сверху во всю ширину карточки (в макете 268px при 300px карточки),
   стрелка — последним элементом потока в правом-нижнем углу. Раньше стрелка была
   absolute, а описанию давали padding-right:44px «под стрелку» — из-за этого текст
   считался по 224px и на 1920 ломался на строку больше, чем в макете. */
.sx-why-card--text{display:flex;flex-direction:column;padding:16px;background:#0c306c;}
.sx-why-card--text .sx-why-card__t{color:#fff;}
.sx-why-card--text .sx-why-card__d{margin-top:8px;color:rgba(255,255,255,.65);}
.sx-why-card--text > .sx-why-card__more,
.sx-why-card--text > .sx-etc{margin-top:auto;align-self:flex-end;}
.sx-why-card--text .sx-etc--outline{border-color:rgba(255,255,255,.4);color:#fff;}
.sx-why-card__more::after{content:"";position:absolute;inset:0;z-index:1;} /* вся текст-карточка кликабельна (ТЗ §4.6) */

/* стат-карточка — белая, синее число; фаска левый-верх + правый-низ (TR/BL скруглены) */
.sx-why-card--stat{padding:24px;display:flex;flex-direction:column;gap:8px;justify-content:center;background:#fff;
  border-radius:0 var(--sx-why-round) 0 var(--sx-why-round);clip-path:var(--sx-why-bevel-clip);}
.sx-why-card__num{font-weight:500;font-size:60px;line-height:1.05;letter-spacing:-2.4px;color:var(--sx-blue);}
.sx-why-card--stat .sx-why-card__d{color:var(--sx-ink-soft);}

/* фото-карточка — та же фигура, что у стат-карточки (в макете обе на одном векторе) */
.sx-why-card--img{background:#cdd4de;border-radius:0 var(--sx-why-round) 0 var(--sx-why-round);clip-path:var(--sx-why-bevel-clip);}
.sx-why-card--img img{width:100%;height:100%;object-fit:cover;}

/* ============================================================
   БЛОК 7 — Как записаться на приём (Figma 1:984 — 1920, 49:1127 — 1440)
   ============================================================ */
.sx-book{margin-top:96px;}
.sx-book__inner{display:flex;flex-direction:column;gap:40px;}
.sx-book__title{font-weight:500;font-size:60px;line-height:1.07;letter-spacing:-2.4px;color:var(--sx-ink);}
.sx-book__row{display:flex;gap:32px;align-items:flex-start;}
/* Интро тянется 305px (макет 1440) → 391px (макет 1920) плавно, а не ступенькой: от её ширины
   зависит ширина карточки, а от карточки — кегль заголовка (лесенка в конце файла). Ступенька
   дала бы немонотонный кегль — при ресайзе заголовок скакал бы вверх-вниз. */
.sx-book__intro{flex:none;width:clamp(305px,calc(305px + (100vw - 1440px) * .17917),391px);
  font-weight:400;font-size:24px;line-height:1.4;letter-spacing:-.96px;color:#6a7889;}
.sx-book__cards{flex:1 1 0;min-width:0;display:grid;grid-template-columns:repeat(4,1fr);gap:24px;}

/* Скос правого верхнего угла — фигура из макета: срез по линии x+y=30 от угла, оба стыка
   скруглены R24. В макете он ОДИНАКОВ на 1920 и на 1440, то есть задан в абсолютных px и не
   тянется вместе с карточкой, — поэтому не одна растянутая маска, а три слоя (по умолчанию
   слои маски складываются по альфе): угловой тайл 64×64 справа сверху + две заливки на
   остальную площадь. Нахлёст в 1px убирает волосяной шов на дробной ширине карточки.
   Остальные три угла даёт border-radius. */
.sx-book-card{--sx-book-corner:64px;
  position:relative;overflow:hidden;min-height:326px;padding:24px;border-radius:24px;
  background:radial-gradient(120% 130% at 100% 0%,#f7fafc 0%,#edf2f6 62%);
  display:flex;flex-direction:column;gap:24px; /* gap — гарантированный зазор текст↔кнопка */
  -webkit-mask-image:url(../icons/book-card-cut-tr.svg),linear-gradient(#000,#000),linear-gradient(#000,#000);
          mask-image:url(../icons/book-card-cut-tr.svg),linear-gradient(#000,#000),linear-gradient(#000,#000);
  -webkit-mask-position:right top,left top,left bottom;
          mask-position:right top,left top,left bottom;
  -webkit-mask-size:var(--sx-book-corner) var(--sx-book-corner),
                    calc(100% - var(--sx-book-corner) + 1px) var(--sx-book-corner),
                    100% calc(100% - var(--sx-book-corner) + 1px);
          mask-size:var(--sx-book-corner) var(--sx-book-corner),
                    calc(100% - var(--sx-book-corner) + 1px) var(--sx-book-corner),
                    100% calc(100% - var(--sx-book-corner) + 1px);
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;}
.sx-book-card__top{display:flex;flex-direction:column;}
/* nowrap + ellipsis как в макете: на узкой карточке бейдж иначе вылезает за padding */
.sx-book-card__badge{align-self:flex-start;max-width:100%;padding:4px 10px;border-radius:8px;
  font-family:var(--sx-font-mono);font-size:14px;line-height:1.2;text-transform:uppercase;letter-spacing:.4px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  background:#bae2fc;color:#0f172a;}
.sx-book-card__title{margin-top:12px;font-weight:500;font-size:32px;line-height:1.2;letter-spacing:-.64px;color:var(--sx-ink);}
.sx-book-card__divider{height:1px;background:#d8e2ec;margin-block:24px;}
.sx-book-card__desc{font-size:18px;line-height:1.3;letter-spacing:-.36px;color:var(--sx-ink-soft);}
/* flex:none — иначе кнопка сжимается: она flex-элемент в колонке, и когда текст карточки
   перерастал фиксированную высоту, 56px «съедались» до ~22px (было видно от ~1650 и ниже).
   min-height вместо height: в макете 1440 подпись переносится на 2 строки, а кнопка остаётся 56. */
.sx-book-card__btn{margin-top:auto;flex:none;display:flex;align-items:center;justify-content:center;
  min-height:56px;padding:6px 16px;text-align:center;
  border:1px solid #c5d6ea;border-radius:12px;
  font-weight:500;font-size:18px;line-height:1.05;letter-spacing:.9px;text-transform:uppercase;color:#4c7dff;
  transition:background .15s ease,color .15s ease;}
.sx-book-card__btn:hover{background:#4c7dff;color:#fff;border-color:#4c7dff;}

.sx-book-card.is-accent{background:radial-gradient(120% 130% at 100% 0%,#6b93ff 0%,#1e5bff 60%);}
.sx-book-card.is-accent .sx-book-card__title{color:#fff;}
.sx-book-card.is-accent .sx-book-card__desc{color:rgba(255,255,255,.85);}
.sx-book-card.is-accent .sx-book-card__badge{background:rgba(255,255,255,.16);color:#fff;}
.sx-book-card.is-accent .sx-book-card__divider{background:rgba(255,255,255,.25);}
.sx-book-card.is-accent .sx-book-card__btn{border-color:rgba(255,255,255,.5);color:#fff;}
.sx-book-card.is-accent .sx-book-card__btn:hover{background:#fff;color:var(--sx-blue);border-color:#fff;}

/* Лесенка кегля заголовка карточки: 32px (макет 1920) → 24px (макет 1440). Пороги не на глаз —
   посчитаны от ширины самого длинного заголовка («Личный кабинет») в IBM Plex Sans Medium с
   трекингом макета, чтобы он всегда влезал в одну строку: 32px требует 246px под текст,
   30px — 231, 28px — 215, 26px — 200, 24px — 175. Ширина под текст = ширина карточки − 48
   (padding), карточка = (vw − 80 − интро − 32 − 72) / 4. Трекинг: −2% (Headline 3), у 24px
   −5% как в токене Headline 4 макета 1440.
   Ниже 1440 колонок уже не 4 — там свои правила в 20/22-resp. */
@media (max-width:1750px){ .sx-book-card__title{font-size:30px;letter-spacing:-.6px;} }
@media (max-width:1649px){ .sx-book-card__title{font-size:28px;letter-spacing:-.56px;} }
@media (max-width:1569px){ .sx-book-card__title{font-size:26px;letter-spacing:-.52px;} }
@media (max-width:1489px){ .sx-book-card__title{font-size:24px;line-height:1.3;letter-spacing:-1.2px;} }
/* Две самые узкие 4-колоночные ступени: «Подберём специалиста» переставал влезать в бейдж и
   резался многоточием (нужно 196px при 190px внутренней ширины карточки). В макете 1440 тег
   тоже мельче, чем на 1920 (14px против 18px), так что уменьшаем и здесь. Только 4 колонки:
   ниже 1440 карточка снова широкая. */
@media (min-width:1440px) and (max-width:1569px){
  .sx-book-card__badge{padding:4px 6px;font-size:13px;}
}
/* ============================================================
   БЛОК 8 — Акции (Figma node 1:1053)
   ============================================================ */
.sx-promo{margin-top:96px;}
.sx-promo__row{display:flex;gap:16px;align-items:stretch;}

/* Большая промо-карточка: фото-фон + заголовок + фрост-подложка снизу */
.sx-promo-feat{position:relative;flex:none;width:753px;height:572px;border-radius:24px;overflow:hidden;}
.sx-promo-feat__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;}
/* Вырез под «Акции» в левом-верхнем углу. Раньше фото резалось clip-path'ом, но polygon умеет
   только острые углы, а в макете у выреза скруглены и стык скоса, и ступенька у левого края.
   Поэтому кладём поверх фото белую фигуру, экспортированную из Figma: фон секции белый, так что
   она читается ровно как вырез. На каждый размер экрана свой файл (см. media-блоки ниже).
   z-index 1 — выше фото (0), ниже заголовка и фрост-подложки (2). */
.sx-promo-feat::before{content:"";position:absolute;z-index:1;top:0;left:0;pointer-events:none;
  width:356px;height:134px;
  background:url(../img/b8-feat-cut-1920.svg) 0 0/100% 100% no-repeat;}
.sx-promo-feat__title{position:absolute;z-index:2;top:2px;left:2px;
  font-weight:500;font-size:60px;line-height:1;letter-spacing:-2.4px;color:var(--sx-ink);}
/* фрост-подложка: скос 45° (~37.5px) в правом-верхнем углу — CSS-маской поверх border-radius */
.sx-promo-feat__sub{position:absolute;z-index:2;left:16px;right:16px;bottom:16px;
  display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:24px;border-radius:24px;
  border:1px solid rgba(226,232,240,.5);
  background:rgba(255,255,255,.5);-webkit-backdrop-filter:blur(48px);backdrop-filter:blur(48px);
  --feat-cut:27px;
  -webkit-mask:linear-gradient(225deg,transparent 0 var(--feat-cut),#000 var(--feat-cut)) 0 0/100% 100% no-repeat;
  mask:linear-gradient(225deg,transparent 0 var(--feat-cut),#000 var(--feat-cut)) 0 0/100% 100% no-repeat;}
.sx-promo-feat__name{font-weight:500;font-size:32px;line-height:1.18;letter-spacing:-.64px;color:var(--sx-ink);}
.sx-promo-feat__desc{margin-top:8px;font-size:20px;line-height:1.2;letter-spacing:-.4px;color:var(--sx-ink-soft);max-width:423px;}

/* Сетка промо + CTA */
.sx-promo__grid{flex:1 1 0;min-width:0;display:grid;
  grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(2,278px);gap:16px;}

/* Промо-плитка: чистое фото сверху + фрост-подложка снизу + живой текст */
.sx-promo-tile{position:relative;overflow:hidden;border-radius:24px;background:#eef2f7;}
/* фото — верхняя половина плитки (не пережато, видно полностью) */
.sx-promo-tile__photo{position:absolute;top:0;left:0;right:0;height:50%;object-fit:cover;z-index:0;}
/* подложка — нижняя половина, сдвинута на 15px вверх (нахлёст на фото); текст сверху */
.sx-promo-tile__sub{position:absolute;z-index:1;left:0;right:0;bottom:0;top:calc(50% - 15px);
  display:flex;align-items:flex-start;padding:20px;border-radius:24px;
  border:1px solid rgba(226,232,240,.5);
  background:rgba(255,255,255,.34);-webkit-backdrop-filter:blur(48px);backdrop-filter:blur(48px);}
.sx-promo-tile__text{display:flex;flex-direction:column;gap:8px;width:100%;}
/* заголовок плитки: 1 строка на широких, перенос на узких (чтобы не обрезался) */
.sx-promo-tile__name{font-weight:500;font-size:24px;line-height:1.1;letter-spacing:-.72px;color:var(--sx-ink);}
/* описание — с правым отступом, чтобы нижняя строка не заходила под стрелку */
.sx-promo-tile__desc{font-size:16px;line-height:1.2;letter-spacing:-.32px;color:var(--sx-ink-soft);padding-right:44px;}
/* стрелка плитки — в правый-нижний угол, вне потока (не отъедает ширину у текста) */
.sx-promo-tile__sub .sx-etc{position:absolute;right:16px;bottom:16px;}

/* CTA «Все акции»: тёмно-синяя карточка #0B2F6B + цельное фото справа + белый вырез правого-
   нижнего угла — готовая фигура из макета (SVG), кладётся ПОВЕРХ фото. Кнопка «Все акции» —
   отдельным слоем в вырезе. Размер фигуры фиксированный и свой на каждом брейкпоинте
   (design/promo-all: 1920 → 214×104, 1440 → 220×104, 768 → 56×55). */
.sx-promo-cta{position:relative;border-radius:24px;color:#fff;
  --sx-cta-cut-w:214px;--sx-cta-cut-h:104px;--sx-cta-cut-img:url(../img/b8-cta-cut-1920.svg);}
/* Белый прямоугольник в фоне карточки — строго под фигурой выреза. Он не виден (сверху лежит
   непрозрачное фото), но нужен ради скругления: иначе белая фигура и синий фон обрезаются
   радиусом карточки каждый со своим сглаживанием, и стык двух полупрозрачных краёв читается
   серой дугой по скруглению. Вылет на 2px — чтобы по правому и нижнему краю не оставалась
   щель в 1 device-px с синим. */
.sx-promo-cta__card{position:absolute;inset:0;overflow:hidden;border-radius:24px;
  background:
    linear-gradient(#fff,#fff) right -2px bottom -2px/calc(var(--sx-cta-cut-w) + 2px) calc(var(--sx-cta-cut-h) + 2px) no-repeat,
    #0b2f6b;}
/* Фото справа, цельным прямоугольником: 341×278 из макета = 48.12% ширины блока на 1920,
   то есть на этом брейкпоинте пиксель в пиксель; cover — чтобы на других не тянуло по осям.
   Фигура выреза не кладётся ПОВЕРХ фото, а ВЫРЕЗАЕТСЯ из него маской, и белое в вырезе даёт
   фон карточки. Иначе у скругления карточки и фото, и белая фигура обрезаются радиусом каждый
   со своим сглаживанием — по дуге проступал бирюзовый край фото (244,248,248 вместо белого).
   Вылет маски на 2px вправо-вниз: в самих SVG правый край фигуры стоит на 213.5 из 214, и в эту
   полупиксельную щель у края карточки тоже лезло фото. */
.sx-promo-cta__photo{position:absolute;right:0;top:0;width:48.12%;height:100%;object-fit:cover;z-index:0;
  -webkit-mask-image:var(--sx-cta-cut-img),linear-gradient(#000,#000);
          mask-image:var(--sx-cta-cut-img),linear-gradient(#000,#000);
  -webkit-mask-position:right -2px bottom -2px,0 0;
          mask-position:right -2px bottom -2px,0 0;
  -webkit-mask-size:calc(var(--sx-cta-cut-w) + 2px) calc(var(--sx-cta-cut-h) + 2px),100% 100%;
          mask-size:calc(var(--sx-cta-cut-w) + 2px) calc(var(--sx-cta-cut-h) + 2px),100% 100%;
  -webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-composite:xor;mask-composite:exclude;}
/* та же фигура ещё и слоем поверх — фолбэк для браузеров без mask-composite (там маска
   схлопывается в «показать всё», и вырез рисует уже этот слой). Где маска работает, он ложится
   белым по белому фону карточки и ничего не меняет. */
.sx-promo-cta__cut{position:absolute;z-index:1;right:-2px;bottom:-2px;pointer-events:none;
  width:calc(var(--sx-cta-cut-w) + 2px);height:calc(var(--sx-cta-cut-h) + 2px);
  background:var(--sx-cta-cut-img) 0 0/100% 100% no-repeat;}
.sx-promo-cta__content{position:relative;z-index:1;height:100%;display:flex;flex-direction:column;
  justify-content:space-between;padding:32px;}
.sx-promo-cta__title{font-weight:500;font-size:32px;line-height:1.18;letter-spacing:-.64px;max-width:274px;}
.sx-promo-cta__follow>p{font-size:16px;line-height:1.2;color:#fff;max-width:260px;}
.sx-promo-cta__social{margin-top:16px;display:flex;gap:12px;}
.sx-soc{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:12px;background:rgba(255,255,255,.22);transition:background .15s;}
.sx-soc:hover{background:rgba(255,255,255,.32);}
.sx-soc img{width:26px;height:26px;}
/* Десктоп: «ВСЕ АКЦИИ» + синий квадрат-стрелка в белом вырезе — по ПРАВОМУ краю и ниже центра
   (макет 49:1273: правый край вровень с краем карточки, 23px от низа, gap 16, текст #1E5BFF).
   Своего фона у кнопки нет — белым её подпирает .sx-promo-cta__cut под фото. */
.sx-promo-cta__btn{position:absolute;z-index:2;right:0;bottom:23px;
  display:inline-flex;align-items:center;gap:16px;}
.sx-promo-cta__btn-t{font-family:var(--sx-font-mono);text-transform:uppercase;font-weight:500;
  font-size:18px;line-height:1.05;letter-spacing:.9px;color:#1e5bff;white-space:nowrap;}
.sx-promo-cta__btn-arr{flex:none;width:40px;height:40px;border-radius:12px;background:#1e5bff;color:#fff;
  display:inline-flex;align-items:center;justify-content:center;transition:background .15s;}
.sx-promo-cta__btn:hover .sx-promo-cta__btn-arr{background:#1746c8;}
.sx-promo-cta__btn-arr svg{width:9px;height:16px;}

/* ============================================================
   БЛОК 9 — Комплексные программы (Figma node 1:1136)
   ============================================================ */
.sx-programs{margin-top:96px;display:flex;flex-direction:column;gap:40px;}
.sx-programs__head{display:flex;align-items:center;justify-content:space-between;gap:24px;}
.sx-programs__title{font-weight:500;font-size:60px;line-height:1.07;letter-spacing:-2.4px;color:var(--sx-ink);}
.sx-programs__all{display:inline-flex;align-items:center;gap:16px;
  font-weight:500;font-size:18px;line-height:1.05;letter-spacing:.9px;text-transform:uppercase;color:#4c7dff;}

.sx-programs__body{display:flex;gap:32px;align-items:stretch;}

/* — Левая колонка — */
.sx-programs__aside{flex:none;width:391px;display:flex;flex-direction:column;justify-content:space-between;gap:24px;}
.sx-programs__aside-top{display:flex;flex-direction:column;align-items:flex-start;gap:32px;}
.sx-programs__lead{font-weight:400;font-size:22px;line-height:1.4;letter-spacing:-.48px;color:var(--sx-ink-soft);}
.sx-programs__cta{flex:none;position:relative;width:331px;height:56px;
  display:inline-flex;align-items:center;justify-content:center;gap:16px;
  background:url(../icons/b9-cta.svg) center/100% 100% no-repeat;}
.sx-programs__cta-t{font-weight:500;font-size:18px;line-height:1.05;letter-spacing:.9px;text-transform:uppercase;color:#fff;}
.sx-programs__cta-arr{width:32px;height:32px;}
.sx-programs__nav{display:flex;gap:12px;}

/* — Правая часть — */
.sx-programs__main{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:32px;}
.sx-programs__tabs{display:flex;justify-content:flex-end;gap:16px;}
.sx-prog-tab{flex:none;height:50px;padding:0 24px;display:inline-flex;align-items:center;border-radius:16px;
  background:#fff;border:1px solid rgba(76,125,255,.4);white-space:nowrap;
  font-weight:400;font-size:24px;line-height:1.3;letter-spacing:-.4px;color:var(--sx-ink);transition:.15s ease;}
.sx-prog-tab.is-active{background:#4c7dff;border-color:#4c7dff;color:#fff;}

.sx-programs__cards{display:flex;gap:24px;align-items:stretch;}
.sx-prog-card{flex:1 1 0;min-width:0;display:flex;flex-direction:column;
  background:#eef2f7;border-radius:24px;overflow:hidden;}
/* скрытые карточки таба (display:flex выше перебивает [hidden] — возвращаем none) */
.sx-prog-card[hidden]{display:none;}
.sx-prog-card__img{width:100%;height:188px;object-fit:cover;}
.sx-prog-card__body{flex:1 1 auto;display:flex;flex-direction:column;padding:24px;}
.sx-prog-card__title{font-weight:500;font-size:24px;line-height:1.3;letter-spacing:-.72px;color:var(--sx-ink);}
.sx-prog-card__desc{margin-top:8px;font-size:16px;line-height:1.2;letter-spacing:-.32px;color:var(--sx-ink-soft);}
.sx-prog-card__more{margin-top:auto;padding-top:24px;align-self:flex-end;
  display:inline-flex;align-items:center;gap:16px;
  font-weight:500;font-size:16px;line-height:1.05;letter-spacing:.8px;text-transform:uppercase;color:#4c7dff;}

/* ============================================================
   БЛОК 10 — Отзывы пациентов (Figma 1:1218 — 1920, 49:1359 — 1440)
   ============================================================ */
.sx-reviews{margin-top:96px;display:flex;flex-direction:column;gap:40px;}
.sx-reviews__head{display:flex;align-items:center;justify-content:space-between;gap:24px;}
.sx-reviews__title{font-weight:500;font-size:60px;line-height:1.07;letter-spacing:-2.4px;color:var(--sx-ink);}
.sx-reviews__all{display:inline-flex;align-items:center;gap:16px;
  font-weight:500;font-size:18px;line-height:1.05;letter-spacing:.9px;text-transform:uppercase;color:#4c7dff;}

.sx-reviews__row{display:flex;gap:24px;align-items:stretch;}
.sx-rev-card{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:24px;
  padding:24px;background:#f7f9fc;border:.73px solid var(--sx-card-border);border-radius:24px;}
.sx-rev-card__head{display:flex;align-items:center;gap:16px;}

/* Источник отзыва (сайт/Яндекс/ДокДок/2ГИС): плитка 40×40, скругление 6px.
   Логотипы свёрстаны «в край» прямо в PNG, поэтому фон виден только под прозрачностью. */
.sx-rev-card__src{flex:none;display:block;width:40px;height:40px;border-radius:6px;overflow:hidden;background:#949494;}
.sx-rev-card__src--site{background:var(--sx-white);}
.sx-rev-card__src img{display:block;width:100%;height:100%;object-fit:cover;}

.sx-rev-card__name{font-size:24px;line-height:1.4;letter-spacing:-.96px;color:var(--sx-ink);}

/* Тело растягиваем, чтобы дата и «Отзыв проверен» стояли по нижнему краю
   во всех карточках ряда — тексты отзывов разной длины. */
.sx-rev-card__body{flex:1 1 auto;min-height:0;display:flex;flex-direction:column;}
.sx-rev-card__text{font-size:20px;line-height:1.2;letter-spacing:-.4px;color:var(--sx-ink);
  display:-webkit-box;-webkit-line-clamp:6;-webkit-box-orient:vertical;overflow:hidden;}
.sx-rev-card.is-expanded .sx-rev-card__text{display:block;-webkit-line-clamp:none;overflow:visible;}
/* Скрывается скриптом, когда текст и так помещается целиком (см. js/parts/40-reviews.js). */
.sx-rev-card__more{align-self:flex-start;font-size:20px;line-height:1.2;letter-spacing:-.4px;color:#4c7dff;cursor:pointer;}
.sx-rev-card__more[hidden]{display:none;}

.sx-rev-card__date{font-size:16px;line-height:1.2;letter-spacing:-.32px;color:var(--sx-btn-black);}
.sx-rev-card__verified{display:flex;align-items:center;gap:6px;padding:1px 2px;
  font-family:var(--sx-font-mono);font-size:18px;line-height:1.4;letter-spacing:-.36px;color:#b3b3b3;}
.sx-rev-card__check{flex:none;width:16px;height:16px;}
/* ============================================================
   БЛОК 11 — Новости и события (Figma node 1:1279)
   ============================================================ */
.sx-news{margin-top:96px;display:flex;flex-direction:column;gap:40px;}
.sx-news__head{display:flex;align-items:center;justify-content:space-between;gap:24px;}
.sx-news__title{font-weight:500;font-size:60px;line-height:1.07;letter-spacing:-2.4px;color:var(--sx-ink);}
.sx-news__all{display:inline-flex;align-items:center;gap:16px;
  font-weight:500;font-size:18px;line-height:1.05;letter-spacing:.9px;text-transform:uppercase;color:#4c7dff;}

.sx-news__body{display:flex;gap:40px;align-items:stretch;}
.sx-news__aside{flex:none;width:391px;display:flex;flex-direction:column;justify-content:space-between;gap:24px;}
.sx-news__lead{font-weight:400;font-size:22px;line-height:1.4;letter-spacing:-.44px;color:var(--sx-ink-soft);max-width:360px;}
.sx-news__nav{display:flex;gap:12px;}

.sx-news__cards{flex:1 1 0;min-width:0;display:flex;gap:24px;align-items:stretch;
  overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;}
.sx-news__cards::-webkit-scrollbar{display:none;}
.sx-news-card{position:relative;flex:none;width:248px;scroll-snap-align:start;display:flex;flex-direction:column;
  background:#eef2f7;border-radius:24px;overflow:hidden;}
.sx-news-card__media{position:relative;}
.sx-news-card__img{display:block;width:100%;height:190px;object-fit:cover;}
/* #Тэг лежит в .__body, но на десктопе/планшете абсолютом наложен на низ фото */
.sx-news-card__tag{position:absolute;left:24px;top:148px;
  display:inline-flex;align-items:center;padding:3px 10px;border-radius:8px;
  background:#bae2fc;font-weight:400;font-size:16px;line-height:1.2;letter-spacing:-.32px;color:var(--sx-ink);}
.sx-news-card__body{flex:1 1 auto;display:flex;flex-direction:column;padding:24px;}
.sx-news-card__title{font-weight:500;font-size:22px;line-height:1.4;letter-spacing:-.44px;color:#1e2537;}
.sx-news-card__date{margin-top:auto;padding-top:24px;font-size:16px;line-height:1.2;letter-spacing:-.32px;color:#b6c1cf;}

/* ============================================================
   ФУТЕР (Figma node 1:1345) — тёмно-синий на всю ширину
   ============================================================ */
.sx-footer{margin-top:96px;background:#0b2f6b;color:#f0f2f6;}
.sx-footer__inner{padding-top:62px;padding-bottom:40px;}
.sx-footer__top{display:flex;gap:96px;}

/* — Контакты — */
.sx-footer__contacts{flex:none;width:248px;display:flex;flex-direction:column;gap:24px;align-items:flex-start;}
.sx-foot-contact__label{font-size:16px;line-height:1.2;letter-spacing:-.32px;color:#788bad;}
.sx-foot-contact__value{display:inline-block;margin-top:8px;font-size:20px;line-height:1.2;letter-spacing:-.4px;color:#f0f2f6;}
.sx-foot-contact__note{margin-top:4px;font-size:16px;line-height:1.2;letter-spacing:-.32px;color:#f0f2f6;}
.sx-foot-director{display:inline-flex;align-items:center;justify-content:space-between;gap:16px;width:248px;
  padding:8px;background:#fff;border-radius:12px;}
.sx-foot-director__t{font-size:16px;line-height:1.2;letter-spacing:-.32px;color:#1e1e1e;}
.sx-foot-director__arr{flex:none;display:inline-flex;align-items:center;justify-content:center;
  width:38px;height:38px;border-radius:8px;background:#1e1e1e;color:#fff;}
.sx-foot-director__arr svg{width:7px;height:12px;}
.sx-foot-social{display:flex;gap:12px;}
.sx-foot-soc{flex:none;width:40px;height:40px;
  background:url(../icons/foot-soc-row.svg) no-repeat;background-size:248px 40px;
  background-position:calc(var(--i) * -52px) 0;}

/* — Колонки ссылок — */
.sx-footer__cols{flex:none;display:flex;gap:56px;}
.sx-foot-col{width:250px;}
.sx-foot-col__title{font-family:var(--sx-font-mono);font-weight:400;font-size:24px;line-height:1.4;
  letter-spacing:-1.2px;text-transform:uppercase;color:#fff;}
.sx-foot-col__list{margin-top:24px;display:flex;flex-direction:column;gap:18px;}
.sx-foot-col__list a{font-size:18px;line-height:1.33;letter-spacing:-.36px;color:#a6c8ff;transition:color .15s ease;}
.sx-foot-col__list a:hover{color:#fff;}

/* — Разделитель + нижняя строка — */
.sx-footer__divider{height:1px;background:#325083;margin-top:32px;}
.sx-footer__bottom{display:flex;align-items:center;gap:24px;margin-top:33px;}
.sx-footer__logo{flex:none;width:65px;height:73px;}
.sx-footer__legal{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:24px;}
.sx-footer__legal-row{display:flex;align-items:center;justify-content:space-between;gap:24px;}
.sx-footer__disclaimer{font-size:16px;line-height:1.2;letter-spacing:.4px;text-transform:uppercase;color:#788bad;}
.sx-footer__copy{font-size:16px;line-height:1.2;letter-spacing:-.32px;color:#788bad;}
.sx-footer__copy span{margin-left:24px;}
.sx-footer__iso{font-size:16px;line-height:1.2;letter-spacing:-.32px;color:#f0f2f6;}
.sx-footer__lang a{font-size:16px;line-height:1.2;letter-spacing:-.32px;color:#788bad;}
.sx-footer__lang{display:flex;gap:24px;}

/* ============================================================
   АДАПТИВ — Фаза B (планшет ≤768, моб. ≤480/375)
   ============================================================ */

/* — Шапка ≤768: лого + поиск/очки/телефон/бургер (Figma 49:2504 / 49:3549) — */
.sx-mobhead{display:none;}
/* Десктоп-меню (7 пунктов + ЛК) перестаёт помещаться ниже ~1280 → бургер-шапка */
@media (max-width:1279px){
  .sx-header{display:none;}
  .sx-mobhead{display:flex;align-items:center;justify-content:space-between;
    height:88px;padding:8px 24px;background:#fff;}
  .sx-mobhead__logo{flex:none;}
  .sx-mobhead__logo img{display:block;width:64px;height:72px;}
  /* каждая иконка = свой слайс спрайта во flex-ряду → скрытая BVI-иконка не оставляет дырку */
  .sx-mobhead__icons{position:relative;flex:none;display:flex;align-items:center;gap:12px;height:48px;}
  .sx-mh-tap{flex:none;width:48px;height:48px;
    background:url(../icons/mh-icons.svg) no-repeat;background-size:228px 48px;
    background-position:calc(var(--x) * -60px) 0;border:0;padding:0;cursor:pointer;}
}
@media (max-width:480px){
  .sx-mobhead{padding:8px 16px;}
}
/* Десктоп-меню на узких десктопах (1280–1440): сжать межпунктовый гэп, чтобы влезало */
@media (min-width:1280px) and (max-width:1440px){ .sx-menu{gap:16px;} }

/* — Контейнер: боковые отступы. Десктоп 40 / планшет 24 / моб. 16 — */
@media (max-width:1279px){ .sx-container{padding-inline:24px;} }
@media (max-width:767px){ .sx-container{padding-inline:16px;} }

/* — Герой ≤1279 (планшет): главная карточка сверху, ниже «анонс | сетка 2×2» в ряд.
   Внутри карточки — раскладка макета 768 (Figma 49:2582): текст слева узкой колонкой,
   ДНК справа и подрезана краем карточки. Кегль и колонка едут от 768 к тюнингу 1280,
   поэтому при сжатии страницы уезжает размер текста, а не картинка. — */
@media (max-width:1279px){
  .sx-hero{flex-direction:column;gap:24px;margin-top:24px;}
  .sx-hero__main{flex:none;height:auto;padding:24px;--sx-hero-lead:clamp(311px,46%,620px);}
  /* кадр 365×441 из макета: 365px@768 → 340px@1280, правый край всегда за границей карточки */
  .sx-hero__dna{left:auto;top:50%;transform:translateY(-50%);opacity:.7;
    width:clamp(340px,calc(365px - (100vw - 768px) * .0488),365px);
    height:auto;aspect-ratio:365/441;object-fit:cover;
    right:clamp(-48px,calc(-41px - (100vw - 768px) * .01367),-41px);}
  .sx-hero__slider{position:static;width:var(--sx-hero-lead);max-width:100%;}
  .sx-hero__panel{display:flex;flex-direction:column;gap:60px;margin-top:22px;
    width:var(--sx-hero-lead);max-width:100%;}
  .sx-hero__lead{position:static;width:100%;}
  .sx-hero__heading{gap:16px;}
  /* кегль/интерлиньяж линейно от макета 768 (21/16) к тюнингу 1280 (40/20) — clamp попадает в обе точки */
  .sx-hero__title{letter-spacing:-.045em;
    font-size:clamp(21px,calc(21px + (100vw - 768px) * .03711),40px);
    line-height:clamp(27.3px,calc(27.3px + (100vw - 768px) * .03105),43.2px);}
  .sx-hero__subtitle{letter-spacing:-.025em;
    font-size:clamp(16px,calc(16px + (100vw - 768px) * .0078),20px);
    line-height:clamp(20.8px,calc(20.8px + (100vw - 768px) * .01211),27px);}
  .sx-hero__btn{position:static;width:100%;height:auto;padding:20px 17px;}
  .sx-hero__nav{display:none;}
  .sx-hero__side{flex:initial;width:auto;flex-direction:row;gap:24px;align-items:stretch;}
  .sx-annonce{flex:1 1 0;width:auto;height:auto;min-width:0;}
  /* вырез угла тут не рисуем — обычная скруглённая карточка (маску и рамку выключаем) */
  .sx-annonce__clip{position:relative;-webkit-mask:none;mask:none;background:#fff;
    border:1px solid var(--sx-card-border);border-radius:24px;height:100%;min-height:160px;}
  .sx-annonce__border{display:none;}
  .sx-annonce__body{position:relative;left:auto;top:auto;width:auto;padding:24px;padding-right:124px;}
  .sx-annonce__title{width:auto;}
  .sx-annonce__photo{width:108px;}
  .sx-hero__grid{flex:1 1 0;min-width:0;grid-template-rows:1fr 1fr;}
  .sx-hcard{height:auto;}
}

/* — Герой ≤767 (моб.), макет 375 (Figma 49:1595): картинка сверху по центру,
   ниже — полупрозрачная панель с текстом и кнопкой, она наезжает на низ картинки.
   Индикатор уходит из панели и ложится поверх картинки в левый верхний угол. — */
@media (max-width:767px){
  .sx-hero__main{display:flex;flex-direction:column;padding:0;
    border-radius:16px;background:#f7f9fc;}
  /* 217/343 = 63.3% ширины карточки (макет 375), потолок 360px — иначе на 767
     картинка выглядела бы потерянной; верх подрезан карточкой на 10px, как в макете */
  .sx-hero__dna{position:static;order:-1;align-self:center;
    right:auto;top:auto;transform:none;margin-top:-10px;
    width:min(63.3%,360px);height:auto;aspect-ratio:217/262;
    object-fit:cover;opacity:.7;}
  .sx-hero__slider{position:absolute;left:16px;top:16px;right:16px;
    width:auto;max-width:none;gap:8px;}
  .sx-hero__panel{width:auto;max-width:none;gap:32px;margin-top:-42px;
    padding:16px;border-radius:16px;background:rgba(76,125,255,.04);
    -webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);}
  /* потолок строки: на 375 не срабатывает (колонка 309), на 700-широких телефонах
     не даёт заголовку 24px растянуться в нечитаемую строку на всю карточку */
  .sx-hero__lead{width:100%;max-width:420px;}
  .sx-hero__heading{gap:12px;}
  .sx-hero__title{font-size:24px;line-height:1.3;letter-spacing:-.72px;}
  .sx-hero__subtitle{font-weight:500;font-size:16px;line-height:1.3;letter-spacing:-.32px;}
  .sx-hero__btn{font-size:16px;letter-spacing:.8px;}
  .sx-hero__side{flex-direction:column;}
  .sx-annonce__photo{width:120px;}
  .sx-annonce__body{padding-right:136px;}
  /* карточки-ссылки 2×2: равные колонки (длинная «Телемедицина» не растягивала левую),
     стрелка уходит вниз, шрифт влезает в одну строку */
  .sx-hero__grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);}
  .sx-hcard{min-height:96px;padding:14px;}
  .sx-hcard__label{font-size:16px;letter-spacing:-.4px;}
  .sx-hcard .sx-etc{right:16px;bottom:16px;}
}
/* Герой ≤360 (узкие телефоны, SE): карточки в 1 столбец — «Телемедицина» в 2 колонки не влезает — */
@media (max-width:360px){
  .sx-hero__grid{grid-template-columns:1fr;}
}

/* — Блок 3 «Медицина будущего» ≤1279: стек + аккордеон-каталог (1 колонка) — */
.sx-spec__more{display:none;}
@media (max-width:1279px){
  .sx-spec{margin-top:0;padding-block:40px;}
  .sx-spec__inner{gap:24px;}
  .sx-spec__title{font-size:32px;line-height:1.1;letter-spacing:-1.28px;}
  .sx-spec__panel{gap:24px;}
  .sx-spec__top{flex-direction:column;gap:16px;align-items:stretch;} /* иначе поле поиска+чипы (max-content) раздували всю страницу по ширине */
  .sx-spec__intro{width:auto;font-size:18px;line-height:1.35;letter-spacing:-.36px;}
  .sx-spec__chips{flex-wrap:nowrap;overflow-x:auto;}
  .sx-adchip{flex:none;}
  .sx-spec__body{padding:16px;border-radius:24px;gap:16px;}
  .sx-spec__tabs{gap:12px;}
  .sx-tab{flex:1 1 0;padding:13px 16px;font-size:15px;letter-spacing:.5px;text-transform:uppercase;}

  /* категории — горизонтальная лента «чипов», под ними каталог активной категории */
  .sx-spec__cols{flex-direction:column;gap:16px;align-items:stretch;}
  .sx-spec__nav{align-items:stretch;}
  .sx-spec__nav-arrow{display:none;}
  .sx-spec__nav-list{flex-direction:row;gap:8px;padding-top:0;overflow-x:auto;scrollbar-width:none;}
  .sx-spec__nav-list::-webkit-scrollbar{display:none;}
  .sx-spec__nav-item{flex:none;padding:8px 16px;border:1px solid rgba(30,91,255,.4);border-radius:10px;
    font-size:16px;letter-spacing:-.32px;white-space:nowrap;color:var(--sx-blue);}
  .sx-spec__nav-item.is-active{background:var(--sx-blue);border-color:var(--sx-blue);color:#fff;}
  .sx-spec__catalog{display:flex;flex-direction:column;gap:20px;padding:20px;}
  .sx-spec__cat{flex-direction:column;gap:20px;}
  .sx-spec__col{width:auto;flex:none;gap:16px;}
  .sx-spec__col:not(:first-child){display:none;}  /* на моб. — первая колонка активной категории */
  .sx-spec__group{gap:10px;}
  .sx-spec__item{font-size:16px;line-height:1.25;letter-spacing:-.32px;}
  .sx-spec__more{display:inline-flex;align-self:flex-end;align-items:center;gap:12px;
    font-weight:500;font-size:16px;line-height:1.05;letter-spacing:.8px;text-transform:uppercase;color:var(--sx-blue);}
}
@media (max-width:767px){
  .sx-spec__title{font-size:28px;letter-spacing:-1.12px;}
}

/* — Блок 4 «Наши специалисты» ≤1279: интро на всю ширину, статбокс+карточки в скролл-ряд — */
@media (max-width:1279px){
  .sx-docs{margin-top:0;gap:24px;}
  .sx-docs__title{font-size:32px;line-height:1.1;letter-spacing:-1.28px;}
  .sx-docs__all{font-size:0;gap:0;}            /* скрыть «Все врачи» — оставить стрелку */
  .sx-docs__carousel{flex-wrap:wrap;gap:16px 24px;}
  .sx-docs__stat,.sx-docs__stat-top{display:contents;}
  .sx-docs__stat-intro{order:-1;flex:0 0 100%;width:100%;font-size:20px;letter-spacing:-.8px;}
  .sx-statbox{flex:none;order:0;}
  .sx-docs__nav{display:none;}
  .sx-docs__cards{order:0;flex:1 1 0;min-width:0;overflow-x:auto;}
}
@media (max-width:767px){
  .sx-docs__title{font-size:28px;letter-spacing:-1.12px;}
  .sx-statbox{flex:0 0 100%;width:100%;min-width:0;} /* статбокс «165» на всю ширину; min-width:0 — иначе флекс-минимум (min-content 369px) лез за экран на узких */
}

/* — Блок 5 «Структура» ≤1279: в столбик (лид → карта → вкладки → поиск → список) — */
@media (max-width:1279px){
  .sx-struct{margin-top:0;padding-block:40px;gap:24px;}
  .sx-struct__head{align-items:flex-start;}
  .sx-struct__title{font-size:32px;line-height:1.1;letter-spacing:-1.28px;}
  .sx-struct__all{font-size:0;gap:0;}            /* скрыть «Все подразделения» — оставить стрелку */
  .sx-struct__body{flex-direction:column;gap:16px;align-items:stretch;}
  .sx-struct__side{display:contents;}
  .sx-struct__lead{order:1;font-size:18px;line-height:1.35;letter-spacing:-.36px;}
  .sx-struct__map{order:2;width:auto;height:420px;border-radius:16px;}  /* живая интерактивная карта */
  .sx-struct__map-btn{display:none;}             /* карта интерактивная — оверлей-кнопка не нужна */
  .sx-struct__search{order:4;}
  .sx-struct__list{order:5;flex:none;min-height:0;overflow:visible;}
}
@media (max-width:767px){
  .sx-struct__title{font-size:28px;letter-spacing:-1.12px;}
  .sx-struct__map{height:300px;}
  .sx-struct__list{border-radius:16px;}
  .sx-clinic{padding:16px;gap:8px;}
  .sx-clinic::after{left:16px;right:16px;}
  .sx-clinic__badge{font-size:15px;}
  .sx-clinic__name{margin-top:4px;font-size:18px;line-height:1.25;letter-spacing:-.4px;}
  .sx-clinic.is-active,.sx-clinic:not(.is-active):hover{border-radius:16px;}
  /* балун 411px в макет телефона не влезает */
  .sx-balloon2{width:min(411px,calc(100vw - 56px));padding:16px;gap:16px;border-radius:16px;}
  .sx-balloon2__name{font-size:18px;line-height:1.25;letter-spacing:-.4px;}
  .sx-balloon2__addr{font-size:14px;}
  .sx-balloon2__badge{font-size:15px;}
  .sx-balloon2__links{gap:12px;}
  .sx-balloon2__more{height:48px;gap:12px;font-size:15px;letter-spacing:.75px;}
  .sx-balloon2__more-arr{width:24px;height:24px;}
  .sx-balloon2__route{width:48px;height:48px;}
  .sx-balloon2__route-ic{width:24px;height:24px;}
}

/* — Блок 6 «Почему нас выбирают» ≤1279: бенто 6×3 → 2 колонки, голова на всю ширину — */
@media (max-width:1279px){
  .sx-why{margin-top:0;padding-inline:24px;--sx-why-bevel:25px;--sx-why-round:16px;} /* фаска/радиус по планшетному вектору 49:3037 */
  .sx-why__panel{border-radius:24px;padding:24px;}
  .sx-why__grid{grid-template-columns:1fr 1fr;grid-template-rows:none;grid-auto-rows:auto;gap:8px;}
  /* сбрасываем инлайн-позиции бенто (в т.ч. span у фото-карточки surgery) явными longhand'ами */
  .sx-why__head,.sx-why-card{grid-column-start:auto !important;grid-column-end:auto !important;
    grid-row-start:auto !important;grid-row-end:auto !important;}
  .sx-why__head{grid-column:1/-1 !important;}
  .sx-why__title{font-size:32px;line-height:1.1;letter-spacing:-1.28px;}
  .sx-why__sub{font-size:18px;line-height:1.35;letter-spacing:-.36px;max-width:none;}
  .sx-why-card__num{font-size:48px;letter-spacing:-1.92px;}
  /* стрелка снова справа от описания и по его нижнему краю — так в макете 49:3068
     (на десктопе она под текстом, там карточка выше и места хватает) */
  .sx-why-card--text{display:block;}
  .sx-why-card--text .sx-why-card__d{padding-right:48px;} /* 32 кнопка + 16 отбивка */
  .sx-why-card--text > .sx-why-card__more,
  .sx-why-card--text > .sx-etc{margin-top:0;}
  .sx-why-card--text .sx-etc{position:absolute;right:16px;bottom:16px;}
  /* фото-карточки: img абсолютом, чтобы portrait b6-surgery не растягивал строку по своей высоте */
  .sx-why-card--img{min-height:150px;}
  .sx-why-card--img img{position:absolute;inset:0;}
}
/* — Блок 6, 768–1279: своя раскладка 2×6 (макет 49:3027). Порядок отличается и от
     десктопа, и от телефона, поэтому переставляем через order, а DOM не трогаем
     (на ≤767 он верный). Фото b6-diag и b6-lab в планшетном макете отсутствуют. — */
@media (min-width:768px) and (max-width:1279px){
  .sx-why-card{order:var(--sx-t-order,99);}
  .sx-why-card--t-hide{display:none;}
  .sx-why__head{gap:12px;margin-bottom:11px;} /* до карточек 19px: 11 + 8 gap сетки, как в макете */
}
/* — Блок 6 ≤767: текстовые + «+» + фото-команда во всю ширину; стат+фото — парами — */
@media (max-width:767px){
  .sx-why{padding-inline:16px;}
  .sx-why__title{font-size:28px;letter-spacing:-1.12px;}
  .sx-why-card--wide{grid-column:1/-1 !important;}
  /* «+» и фото-диагностика — ~80% ширины, по левому/правому краю (как в макете) */
  .sx-why-card--w80l{grid-column:1/-1 !important;width:80%;justify-self:start;}
  .sx-why-card--w80r{grid-column:1/-1 !important;width:80%;justify-self:end;}
  .sx-why-card__num{font-size:40px;letter-spacing:-1.6px;}
  .sx-why-card--img{min-height:120px;}
}

/* — Блок 7 «Как записаться» ≤1279: интро над карточками, карточки в 2 колонки — */
@media (max-width:1279px){
  .sx-book{margin-top:0;padding-block:40px;}
  .sx-book__inner{gap:24px;}
  .sx-book__title{font-size:32px;line-height:1.1;letter-spacing:-1.28px;}
  .sx-book__row{flex-direction:column;gap:24px;}
  .sx-book__intro{width:auto;font-size:18px;line-height:1.35;letter-spacing:-.36px;}
  .sx-book__cards{grid-template-columns:1fr 1fr;gap:16px;}
  .sx-book-card{min-height:230px;padding:20px;}
  .sx-book-card__title{font-size:28px;line-height:1.2;letter-spacing:-.56px;}
  .sx-book-card__divider{margin-block:16px;}
}
@media (max-width:767px){
  .sx-book__title{font-size:28px;letter-spacing:-1.12px;}
  .sx-book__cards{grid-template-columns:1fr;}
}

/* — Блок 8 «Акции» ≤1279: большая промо сверху, сетка ниже (3 кол. сохраняется) — */
@media (max-width:1279px){
  .sx-promo{margin-top:0;padding-block:40px;}
  .sx-promo__row{flex-direction:column;gap:16px;}
  .sx-promo-feat{flex:none;width:auto;height:auto;aspect-ratio:24/10;}
  .sx-promo-feat__desc{max-width:none;}
  /* вырез: берём фигуру из макета 1440, а не 768 — заголовок здесь ещё десктопный, 60px,
     и в вырез с макета 768 (177×68, он нарисован под заголовок 28px) не помещается */
  .sx-promo-feat::before{width:317px;height:134px;background-image:url(../img/b8-feat-cut-1440.svg);}
  /* плитки: фото во всю ширину (натуральная высота, не пережато), подложка под ним;
     высота плитки — авто (растёт под фото+текст), строки грида тоже авто */
  .sx-promo__grid{grid-template-rows:none;grid-auto-rows:auto;}
  .sx-promo-tile{display:flex;flex-direction:column;}
  .sx-promo-tile__photo{position:static;width:100%;height:auto;flex:none;}
  .sx-promo-tile__sub{position:static;top:auto;flex:1;margin-top:-15px;}
  /* вырез — фигура с макета 1440 (на ≤767 её перебивает вариант 768) */
  .sx-promo-cta{min-height:230px;--sx-cta-cut-w:220px;--sx-cta-cut-img:url(../img/b8-cta-cut-1440.svg);}
}
/* — Блок 8 ≤767: промо + плитки 2×2 + CTA на всю ширину — */
@media (max-width:767px){
  .sx-promo-feat{aspect-ratio:11/10;}
  /* заголовок и вырез — с макета 768 (Figma 49:3179): 28px, фигура 177×68 */
  .sx-promo-feat::before{width:177px;height:68px;background-image:url(../img/b8-feat-cut-768.svg);}
  .sx-promo-feat__title{font-size:28px;letter-spacing:-.56px;}
  .sx-promo-feat__sub{padding:8px;gap:8px;} /* по бокам от текста/кнопки 8px вместо 24 (заказчик) */
  .sx-promo-feat__name{font-size:24px;}
  .sx-promo-feat__desc{font-size:16px;
    display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;} /* макс 3 строки */
  .sx-promo__grid{grid-template-columns:1fr 1fr;grid-template-rows:none;grid-auto-rows:auto;gap:8px;}
  /* плитки 2-в-ряд по макету 49:2155: мелкие шрифты, растут под контент */
  .sx-promo-tile{grid-area:auto !important;aspect-ratio:auto;}
  .sx-promo-tile__text{min-width:0;}
  .sx-promo-tile__name,.sx-promo-tile__desc{overflow-wrap:break-word;} /* break-word: рвёт только реально не влезающее слово */
  .sx-promo-tile__sub{padding:12px;} /* уже подложка (макет ~8) → описанию хватает ширины, не рвёт слова */
  .sx-promo-tile__name{font-size:16px;letter-spacing:-.32px;-webkit-hyphens:auto;hyphens:auto;}
  .sx-promo-tile__desc{font-size:13px;line-height:1.25;letter-spacing:-.26px;padding-right:36px;
    -webkit-hyphens:auto;hyphens:auto;
    display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;} /* макс 3 строки, мягкие переносы */
  /* CTA: контент в поток (слева ~56%), стрелка-кнопка справа-внизу; «Все акции» текст скрыт */
  /* CTA по макету 49:2192: высота 202, соц-иконки 36px/gap16, стрелка-кнопка 40px */
  .sx-promo-cta{grid-area:auto !important;grid-column:1/-1 !important;min-height:202px;}
  .sx-promo-cta__content{padding:16px;}
  .sx-promo-cta__title{font-size:20px;letter-spacing:-.4px;max-width:56%;}
  .sx-promo-cta__follow>p{font-size:14px;line-height:1.25;max-width:56%;}
  .sx-promo-cta__social{gap:16px;}
  .sx-promo-cta__social .sx-soc{width:36px;height:36px;border-radius:10px;}
  .sx-promo-cta__social .sx-soc img{width:20px;height:20px;}
  /* Мобилка: вырез 66×66 — в него влезает только 40px-стрелка, текст «Все акции» скрыт */
  .sx-promo-cta{--sx-cta-cut-w:66px;--sx-cta-cut-h:66px;--sx-cta-cut-img:url(../img/b8-cta-cut-768.svg);}
  .sx-promo-cta__btn{right:0;bottom:0;gap:0;}
  .sx-promo-cta__btn-t{display:none;}
  .sx-promo-cta__btn-arr{width:40px;height:40px;border-radius:12px;}
}
/* — Блок 8: на узких экранах (<380) уменьшаем зазор соц-иконок CTA (по замечанию заказчика) — */
@media (max-width:379px){
  .sx-promo-cta__social{gap:8px;}
}

/* — Блок 9 «Комплексные программы» ≤1279: тело в столбец, карточки и табы — гориз. карусель — */
@media (max-width:1279px){
  .sx-programs{margin-top:0;padding-block:40px;gap:24px;}
  .sx-programs__title{font-size:32px;line-height:1.1;letter-spacing:-1.28px;}
  .sx-programs__body{flex-direction:column;gap:24px;}
  .sx-programs__aside{width:auto;flex-direction:row;flex-wrap:wrap;align-items:center;gap:24px;justify-content:space-between;}
  .sx-programs__aside-top{flex:1 1 320px;flex-direction:row;flex-wrap:wrap;align-items:center;gap:24px;}
  .sx-programs__lead{font-size:18px;line-height:1.35;letter-spacing:-.36px;}
  .sx-programs__nav{margin-left:auto;}
  .sx-programs__tabs{justify-content:flex-start;overflow-x:auto;scrollbar-width:none;}
  .sx-programs__tabs::-webkit-scrollbar{display:none;}
  .sx-prog-tab{height:44px;padding:0 18px;font-size:18px;}
  .sx-programs__cards{overflow-x:auto;scrollbar-width:none;gap:16px;scroll-snap-type:x proximity;}
  .sx-programs__cards::-webkit-scrollbar{display:none;}
  .sx-prog-card{flex:none;width:300px;scroll-snap-align:start;}
}
/* — Блок 9 ≤767: aside в столбец, кнопка на всю ширину, стрелки скрыты (тач-скролл) — */
@media (max-width:767px){
  .sx-programs__title{font-size:28px;letter-spacing:-1.12px;}
  .sx-programs__aside{flex-direction:column;align-items:stretch;}
  .sx-programs__aside-top{flex:none;flex-direction:column;align-items:stretch;gap:16px;} /* сброс flex-basis:320px с планшета — в колонке он давал ~175px пустоты по высоте */
  .sx-programs__cta{width:100%;max-width:331px;}
  .sx-programs__all{font-size:0;gap:0;} /* «Все программы» текст скрыт (шапка 367px не влезала в 375), остаётся стрелка — как у «Все врачи»/«Все новости» */
  .sx-programs__nav{display:none;}
  .sx-prog-card{width:260px;}
}

/* — Блок 10 «Отзывы» ≤1279: карточки-отзывы — горизонтальная карусель — */
@media (max-width:1279px){
  .sx-reviews{margin-top:0;padding-block:40px;gap:24px;}
  .sx-reviews__title{font-size:32px;line-height:1.1;letter-spacing:-1.28px;}
  .sx-reviews__row{overflow-x:auto;scrollbar-width:none;gap:16px;scroll-snap-type:x proximity;}
  .sx-reviews__row::-webkit-scrollbar{display:none;}
  .sx-rev-card{flex:none;width:340px;scroll-snap-align:start;border-radius:16px;} /* макет 768 — скругление 16 вместо 24 */
  .sx-rev-card__name{font-size:21px;letter-spacing:-1.05px;}
  .sx-rev-card__text,.sx-rev-card__more{font-size:18px;letter-spacing:-.36px;}
  .sx-rev-card__date{font-size:15px;letter-spacing:-.3px;}
  .sx-rev-card__verified{font-size:14px;letter-spacing:-.28px;}
}
@media (max-width:767px){
  .sx-reviews__title{font-size:28px;letter-spacing:-1.12px;}
  .sx-reviews__all{font-size:0;gap:0;} /* «Все отзывы» текст скрыт, остаётся стрелка — как у «Все программы» */
  .sx-rev-card{width:290px;}
  .sx-rev-card__name{font-size:20px;letter-spacing:-1px;}
  .sx-rev-card__text,.sx-rev-card__more{font-size:16px;letter-spacing:-.32px;}
}

/* — Блок 11 «Новости» ≤1279: тело в столбец, карточки — карусель — */
@media (max-width:1279px){
  .sx-news{margin-top:0;padding-block:40px;gap:24px;}
  .sx-news__title{font-size:32px;line-height:1.1;letter-spacing:-1.28px;}
  .sx-news__body{flex-direction:column;gap:24px;}
  .sx-news__aside{width:auto;flex-direction:row;align-items:center;justify-content:space-between;gap:24px;}
  .sx-news__lead{font-size:18px;line-height:1.35;letter-spacing:-.36px;max-width:none;}
  .sx-news__cards{flex:none;overflow-x:auto;scrollbar-width:none;gap:16px;scroll-snap-type:x proximity;}
  .sx-news__cards::-webkit-scrollbar{display:none;}
  .sx-news-card{flex:none;width:300px;scroll-snap-align:start;}
}
@media (max-width:767px){
  .sx-news__title{font-size:28px;letter-spacing:-1.12px;}
  .sx-news__all-t{display:none;}            /* в шапке остаётся только стрелка */
  .sx-news__aside{display:none;}            /* лид + стрелки на моб. скрыты */
  /* карточки → вертикальный список: мелкое фото слева + #Тэг/заголовок/дата справа */
  .sx-news__cards{flex-direction:column;overflow-x:visible;gap:20px;}
  .sx-news-card{flex:none;width:auto;flex-direction:row;gap:16px;align-items:flex-start;
    position:static;background:none;border-radius:0;overflow:visible;}
  .sx-news-card__media{flex:none;width:84px;height:84px;border-radius:12px;overflow:hidden;}
  .sx-news-card__img{height:100%;}
  .sx-news-card__body{flex:1 1 0;min-width:0;padding:0;gap:6px;}
  .sx-news-card__tag{position:static;align-self:flex-start;}
  .sx-news-card__title{font-size:16px;line-height:1.3;letter-spacing:-.32px;}
  .sx-news-card__date{margin-top:0;padding-top:0;color:#94a3b8;}
}

/* — Футер ≤1279: верх в столбец (контакты над колонками), колонки переносятся — */
@media (max-width:1279px){
  .sx-footer{margin-top:48px;}
  .sx-footer__top{flex-direction:column;gap:40px;}
  .sx-footer__contacts{width:auto;}
  .sx-footer__cols{flex-wrap:wrap;gap:32px 48px;}
  .sx-foot-col{width:auto;flex:1 1 180px;}
}
/* — Футер ≤767: колонки по 2 в ряд, нижняя строка в столбец — */
@media (max-width:767px){
  .sx-footer__inner{padding-top:40px;}
  .sx-footer__cols{gap:28px 24px;}
  .sx-foot-col{flex:1 1 40%;min-width:140px;}
  .sx-footer__bottom{flex-direction:column;align-items:flex-start;gap:24px;}
  .sx-footer__legal-row{flex-direction:column;align-items:flex-start;gap:8px;}
}

/* ============================================================
   АДАПТИВ — узкий десктоп/ноутбук 1280–1439
   (десктоп-база рассчитана на 1920; в этом диапазоне она сплющивалась.
    structure/spec/why починены флюидно в базе — здесь только реальные рефлоу.)
   ============================================================ */
@media (min-width:1280px) and (max-width:1439px){
  /* Хедер: 8 mono-пунктов + «Личный кабинет» не влезали в одну строку → ужимаем */
  .sx-nav{gap:24px;}
  .sx-menu{gap:14px;}
  .sx-menu__item,.sx-lk{font-size:14px;letter-spacing:.4px;}

  /* Герой: absolute-lead 589px резался в узкой левой карточке → стек как на планшете.
     Значения — конец флюидной шкалы 768→1280 из 20-resp-tablet-mobile.css, шов не виден. */
  .sx-hero{flex-direction:column;gap:24px;}
  .sx-hero__main{flex:none;height:auto;padding:24px;--sx-hero-lead:clamp(311px,46%,620px);}
  .sx-hero__dna{left:auto;right:-48px;top:50%;transform:translateY(-50%);opacity:.7;
    width:340px;height:auto;aspect-ratio:365/441;object-fit:cover;}
  .sx-hero__slider{position:static;width:var(--sx-hero-lead);max-width:100%;}
  .sx-hero__panel{display:flex;flex-direction:column;gap:60px;margin-top:22px;
    width:var(--sx-hero-lead);max-width:100%;}
  .sx-hero__lead{position:static;width:100%;}
  .sx-hero__heading{gap:16px;}
  .sx-hero__title{font-size:40px;line-height:1.08;letter-spacing:-1.6px;}
  .sx-hero__subtitle{font-size:20px;line-height:1.35;letter-spacing:-.6px;}
  .sx-hero__btn{position:static;width:100%;height:auto;padding:20px 17px;}
  .sx-hero__nav{display:none;}
  .sx-hero__side{flex:initial;width:auto;flex-direction:row;gap:24px;align-items:stretch;}
  .sx-annonce{flex:1 1 0;width:auto;height:auto;min-width:0;}
  .sx-annonce__clip{position:relative;-webkit-mask:none;mask:none;background:#fff;
    border:1px solid var(--sx-card-border);border-radius:24px;height:100%;min-height:160px;}
  .sx-annonce__border{display:none;}
  .sx-annonce__body{position:relative;left:auto;top:auto;width:auto;padding:24px;padding-right:124px;}
  .sx-annonce__title{width:auto;}
  .sx-annonce__photo{width:108px;}
  .sx-hero__grid{flex:1 1 0;min-width:0;grid-template-rows:1fr 1fr;}
  .sx-hcard{height:auto;}
}

/* ============================================================
   АДАПТИВ — десктоп/ноутбук 1280–1599: блоки, которые на 1920-базе
   тесны/налезают вплоть до ~1600 (стек / рефлоу / карусель); ≥1600 берёт базу.
   ============================================================ */
@media (min-width:1280px) and (max-width:1599px){

  /* Акции: фикс feat 753px душил сетку 3×2 → стек (верхний отступ сохраняем) */
  .sx-promo__row{flex-direction:column;gap:16px;}
  .sx-promo-feat{flex:none;width:auto;height:auto;aspect-ratio:24/10;}
  .sx-promo-feat__desc{max-width:none;}
  .sx-promo-feat::before{width:317px;height:134px;background-image:url(../img/b8-feat-cut-1440.svg);}
  .sx-promo__grid{grid-template-rows:none;grid-auto-rows:auto;}
  .sx-promo-tile{display:flex;flex-direction:column;}
  .sx-promo-tile__photo{position:static;width:100%;height:auto;flex:none;}
  .sx-promo-tile__sub{position:static;top:auto;flex:1;margin-top:-15px;}
  .sx-promo-cta{min-height:230px;--sx-cta-cut-w:220px;--sx-cta-cut-img:url(../img/b8-cta-cut-1440.svg);}

  /* Программы: aside 391px + ряд табов шире main → наложение на лид; рефлоу + карусели */
  .sx-programs__body{flex-direction:column;gap:24px;}
  .sx-programs__aside{width:auto;flex-direction:row;flex-wrap:wrap;align-items:center;gap:24px;justify-content:space-between;}
  .sx-programs__aside-top{flex:1 1 320px;flex-direction:row;flex-wrap:wrap;align-items:center;gap:24px;}
  .sx-programs__nav{margin-left:auto;}
  .sx-programs__tabs{justify-content:flex-start;overflow-x:auto;scrollbar-width:none;}
  .sx-programs__tabs::-webkit-scrollbar{display:none;}
  .sx-programs__cards{overflow-x:auto;scrollbar-width:none;gap:24px;scroll-snap-type:x proximity;}
  .sx-programs__cards::-webkit-scrollbar{display:none;}
  .sx-prog-card{flex:none;width:320px;scroll-snap-align:start;}

  /* Новости: чуть уже aside — карусель показывает больше карточек */
  .sx-news__aside{width:320px;}
  .sx-news__body{gap:32px;}
}

/* Как записаться: 4 в ряд держатся до 1440 включительно (макет 49:1127 — там ровно 4×236).
   Ниже 1440 карточка ушла бы в ~196px под текст и заголовок перестал бы влезать в строку,
   поэтому 1280–1439 — 2×2, и на широкой карточке заголовок возвращается к 28px. */
@media (min-width:1280px) and (max-width:1439px){
  .sx-book__cards{grid-template-columns:1fr 1fr;}
  .sx-book-card__title{font-size:28px;line-height:1.2;letter-spacing:-.56px;}
}


/* Отзывы: ниже 1600 карточка берёт типографику макета 1440 (49:1359) —
   тело 18px вместо 20px и «Отзыв проверен» 14px вместо 18px. */
@media (min-width:1280px) and (max-width:1599px){
  .sx-rev-card__name{letter-spacing:-1.2px;}
  .sx-rev-card__text,.sx-rev-card__more{font-size:18px;letter-spacing:-.36px;}
  .sx-rev-card__verified{font-size:14px;letter-spacing:-.28px;}
}
/* ============================================================
   ФУТЕР 1280–1919. Десктоп-раскладка требует inner ≥1818px:
   контакты 248 + gap 96 + (5×250 + 4×56) = 1818 → вьюпорт ≥1920.
   Ниже пятая колонка уезжала за край и обрезалась, потому что
   .sx-footer__cols{flex:none} не давал колонкам ужаться.
   ============================================================ */
/* 1600–1919: контакты слева (как в макете), колонки — грид во всю ширину */
@media (min-width:1600px) and (max-width:1919px){
  .sx-footer__top{gap:48px;}
  .sx-footer__cols{flex:1 1 auto;min-width:0;display:grid;
    grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:32px 40px;}
  .sx-foot-col{width:auto;min-width:0;}
}
/* 1280–1599: контакты + 5 колонок в один ряд уже не помещаются →
   контакты сверху (как на планшете), 5 колонок в ряд на всю ширину */
@media (min-width:1280px) and (max-width:1599px){
  .sx-footer__top{flex-direction:column;gap:40px;}
  /* контакты — в строку, иначе справа от них остаётся ~1000px пустоты */
  .sx-footer__contacts{width:auto;flex-direction:row;flex-wrap:wrap;align-items:flex-start;gap:24px 48px;}
  .sx-footer__cols{flex:1 1 auto;min-width:0;display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));gap:32px 40px;}
  .sx-foot-col{width:auto;min-width:0;}
}

/* ============================================================
   ТОЧЕЧНАЯ ДОВОДКА УЗКИХ ТЕЛЕФОНОВ (после всех ≤767-правил)
   ============================================================ */
@media (max-width:499px){
  .sx-annonce__title{font-size:16px;font-style:normal;font-weight:500;}
  .sx-annonce__date{font-size:15px;}
  .sx-promo-cta__content{padding-left:15px;padding-right:15px;}
  .sx-promo-feat__name{font-size:20px;}
}
/* Блок 7: на 500 и уже заголовок карточки 24px — на 28px «Личный кабинет» ломался на 2 строки */
@media (max-width:500px){
  .sx-book-card__title{font-size:24px;line-height:1.3;letter-spacing:-1.2px;}
}
/* Блок 8, узкие телефоны: заголовок «Акции» и вырез — с макета 375 (Figma 49:2136).
   Заголовок здесь КРУПНЕЕ, чем на 768 (32 против 28) — так в макетах, не опечатка:
   на телефоне карточка узкая и заголовок работает как акцент. */
@media (max-width:400px){
  .sx-promo-feat::before{width:164px;height:61px;background-image:url(../img/b8-feat-cut-375.svg);}
  .sx-promo-feat__title{font-size:32px;letter-spacing:-1.28px;}
}
@media (max-width:379px){
  .sx-statbox__dna{left:auto;right:-40px;}
}
@media (max-width:349px){
  .sx-statbox__dna{left:auto;right:-60px;} /* после ≤379, чтобы -60 победил на самых узких */
}

/* — Бургер-меню (drawer): панель справа + затемнение. Открытие/закрытие — app.js — */
/* overflow:hidden — закрытая панель уехала за правый край и на страницах старого
   шаблона тянула бы горизонтальный скролл: там нет body{overflow-x:clip}. */
.sx-drawer{position:fixed;inset:0;z-index:200;overflow:hidden;visibility:hidden;transition:visibility 0s linear .28s;}
.sx-drawer.is-open{visibility:visible;transition:visibility 0s;}
.sx-drawer__overlay{position:absolute;inset:0;background:rgba(8,20,45,.5);opacity:0;transition:opacity .25s ease;}
.sx-drawer.is-open .sx-drawer__overlay{opacity:1;}
.sx-drawer__panel{position:absolute;top:0;right:0;height:100%;width:min(86vw,380px);
  display:flex;flex-direction:column;gap:24px;padding:20px 24px 32px;background:#fff;
  overflow-y:auto;transform:translateX(100%);transition:transform .28s ease;
  box-shadow:-24px 0 60px rgba(8,20,45,.18);}
.sx-drawer.is-open .sx-drawer__panel{transform:none;}
.sx-drawer__head{display:flex;align-items:center;justify-content:space-between;}
.sx-drawer__logo img{display:block;width:56px;height:63px;}
.sx-drawer__close{flex:none;width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;
  border:0;background:#eef2f7;border-radius:12px;color:var(--sx-ink);cursor:pointer;}
.sx-drawer__close svg{width:18px;height:18px;}
.sx-drawer__book{display:inline-flex;align-items:center;justify-content:center;gap:12px;height:52px;
  background:#1e5bff;border-radius:16px;color:#fff;font-weight:500;font-size:18px;letter-spacing:.9px;text-transform:uppercase;}
.sx-drawer__book img{width:20px;height:20px;}
.sx-drawer__search{position:relative;}
.sx-drawer__search input{width:100%;height:48px;padding:0 44px 0 16px;border:1px solid var(--sx-card-border);
  border-radius:14px;background:#fff;font-family:inherit;font-size:16px;color:var(--sx-ink);}
/* лупа = сабмит: кнопка 44×44 ради тапа, иконка внутри стоит там же, где и раньше (центр в 26px от края) */
.sx-drawer__search-go{position:absolute;right:4px;top:50%;transform:translateY(-50%);
  width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;
  padding:0;border:0;background:none;cursor:pointer;}
.sx-drawer__search img{width:20px;height:20px;opacity:.6;}
.sx-drawer__nav{display:flex;flex-direction:column;}
.sx-drawer__nav a{padding:14px 0;border-bottom:1px solid var(--sx-sep);
  font-size:20px;letter-spacing:-.4px;color:var(--sx-ink);}
.sx-drawer__lk{display:inline-flex;align-items:center;gap:12px;font-size:18px;letter-spacing:-.36px;color:#4c7dff;}
.sx-drawer__lk svg{flex:none;width:22px;height:22px;}
.sx-drawer__util{margin-top:auto;padding-top:16px;display:flex;flex-wrap:wrap;align-items:center;gap:10px 20px;}
.sx-drawer__util a,.sx-drawer__util button{font-family:inherit;font-size:16px;letter-spacing:-.32px;
  color:var(--sx-ink-soft);background:none;border:0;padding:0;cursor:pointer;}
.sx-drawer__hours{flex-basis:100%;font-size:16px;color:var(--sx-ink-soft);}
@media (min-width:1280px){ .sx-drawer{display:none;} }
body.sx-noscroll{overflow:hidden;}

/* ============================================================
   HOVER — единые интерактивные состояния (аудит всех кнопок)
   ============================================================ */
.sx-etc,.sx-btn-book,.sx-lang,.sx-topbar__access,.sx-contacts__phone,
.sx-tab,.sx-prog-tab,.sx-adchip,.sx-clinic,.sx-struct__map-btn,.sx-hcard,
.sx-programs__cta,.sx-drawer__book,.sx-drawer__close,.sx-drawer__nav a,.sx-drawer__lk,
.sx-drawer__util a,.sx-drawer__util button,.sx-foot-soc,.sx-foot-director,
.sx-cdd__value,.sx-cdd__soc,
.sx-foot-contact__value,.sx-footer__lang a,.sx-hero__slider span,
.sx-docs__all,.sx-struct__all,.sx-programs__all,.sx-reviews__all,.sx-news__all,
.sx-spec__more,.sx-rev-card__more,.sx-doc__more,.sx-prog-card__more{
  transition:color .18s ease,background-color .18s ease,border-color .18s ease,
    opacity .18s ease,transform .18s ease,box-shadow .18s ease,filter .18s ease;}
.sx-etc,.sx-tab,.sx-prog-tab{cursor:pointer;}

/* стрелки-кнопки (.sx-etc) — везде: залитые темнеют, контурные заливаются */
.sx-etc:not(.sx-etc--outline):hover,a:hover .sx-etc:not(.sx-etc--outline),
button:hover .sx-etc:not(.sx-etc--outline){filter:brightness(.9);}
.sx-etc--outline:hover,a:hover .sx-etc--outline,button:hover .sx-etc--outline{background:#4c7dff;color:#fff;}
.sx-why-card--text:hover .sx-etc--outline{background:#fff;color:#1e5bff;border-color:#fff;}

/* карточки с фото — мягкий зум внутри (без клиппинга в каруселях) */
.sx-doc__photo,.sx-prog-card__img,.sx-news-card__img,.sx-promo-tile__photo{transition:transform .3s ease;}
.sx-doc:hover .sx-doc__photo,.sx-prog-card:hover .sx-prog-card__img,
.sx-news-card:hover .sx-news-card__img,.sx-promo-tile:hover .sx-promo-tile__photo{transform:scale(1.05);}
.sx-hcard:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(76,125,255,.13);}

/* «Все …» / «подробнее» / «показать» */
.sx-docs__all:hover,.sx-struct__all:hover,.sx-programs__all:hover,.sx-reviews__all:hover,
.sx-news__all:hover,.sx-doc__more:hover,.sx-prog-card__more:hover,.sx-spec__more:hover,
.sx-rev-card__more:hover{color:#1e5bff;}

/* табы */
.sx-tab:not(.is-active):hover{background:rgba(76,125,255,.1);}
.sx-prog-tab:not(.is-active):hover{border-color:#4c7dff;color:#4c7dff;}

/* кнопки */
.sx-btn-book:hover,.sx-programs__cta:hover,.sx-struct__map-btn:hover{filter:brightness(.95);}
.sx-drawer__book:hover{background:#1746c8;}
.sx-drawer__close:hover{background:#e2e8f0;}

/* карточка клиники — ховер повторяет активное состояние */
.sx-clinic__name,.sx-clinic__addr,.sx-clinic__badge,.sx-clinic__pin{
  transition:color .18s ease,background-color .18s ease;}
.sx-clinic:not(.is-active):hover{background:#1746c8;border-radius:24px;}
.sx-clinic:not(.is-active):hover::after{display:none;}
.sx-clinic:not(.is-active):hover .sx-clinic__name{color:#fff;}
.sx-clinic:not(.is-active):hover .sx-clinic__addr{color:#fff;}
.sx-clinic:not(.is-active):hover .sx-clinic__badge{background:rgba(255,255,255,.2);color:#fff;}
.sx-clinic:not(.is-active):hover .sx-clinic__pin{background-color:#fff;}

/* списки / чипы / текст-ссылки */
.sx-adchip:hover{opacity:.72;}
.sx-lang:hover,.sx-topbar__access:hover,.sx-contacts__phone:hover,
.sx-cdd__value:hover,
.sx-foot-contact__value:hover,.sx-footer__lang a:hover,
.sx-drawer__nav a:hover,.sx-drawer__lk:hover,.sx-drawer__util a:hover,
.sx-drawer__util button:hover{color:#1e5bff;}
.sx-foot-director:hover{background:#eaf0ff;}
.sx-foot-soc:hover,.sx-cdd__soc:hover{opacity:.7;}
.sx-hero__slider span:not(.is-active):hover{background:rgba(76,125,255,.7);}

/* ============================================================
   АНИМАЦИЯ — единый стандарт (смена контента + появление блоков)
   ============================================================ */
/* смена контента в табах/слайдере/категориях — мягкое появление */
@keyframes sx-fade{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}
[data-card-tab],[data-slide]{animation:sx-fade .35s ease;}

/* появление блоков при скролле (класс .sx-rv вешает JS → без JS всё видно) */
.sx-rv{opacity:0;transform:translateY(24px);
  transition:opacity .6s ease,transform .6s cubic-bezier(.2,.7,.2,1);}
.sx-rv.sx-rv-in{opacity:1;transform:none;}

/* уважение к prefers-reduced-motion: отключаем движение */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important;}
  .sx-rv{opacity:1!important;transform:none!important;}
  /* таймер героя не сводим к .001ms (иначе слайды замелькали бы) — просто выключаем автоплей */
  .sx-hero__slider.is-auto span.is-active::after{animation:none;transform:scaleX(1);}
}

/* ---- Временный плейсхолдер (до появления секций) --------------------- */
.sx-shell-note{max-width:760px;margin:80px auto;padding:32px 40px;
  border:1px dashed var(--sx-sep);border-radius:16px;
  font-family:var(--sx-font-mono);color:#555;text-align:center;line-height:1.6;}
.sx-shell-note b{color:var(--sx-ink);}

/* ============================================================
   ВЕРСИЯ ДЛЯ СЛАБОВИДЯЩИХ (BVI) — панель + режим
   ============================================================ */
/* ВРЕМЕННО СКРЫТО по просьбе заказчика (2026-07-09): вернуть — удалить строку ниже */
[data-act="bvi"]{display:none!important;}
.sx-bvi-bar{position:sticky;top:0;z-index:300;background:#1a1a1a;color:#fff;border-bottom:2px solid #fff;}
.sx-bvi-bar__in{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;max-width:1280px;margin:0 auto;padding:10px 16px;}
.sx-bvi-bar__t{font-size:15px;opacity:.85;}
.sx-bvi-b{min-width:36px;height:36px;padding:0 10px;border:1px solid #999;border-radius:6px;background:#fff;color:#000;cursor:pointer;line-height:1;font-family:inherit;}
.sx-bvi-b.is-active{outline:3px solid #ffd400;outline-offset:1px;}
.sx-bvi-b--fs1{font-size:14px;} .sx-bvi-b--fs2{font-size:18px;} .sx-bvi-b--fs3{font-size:22px;}
.sx-bvi-sw{width:36px;}
.sx-bvi-sw--wb{background:#fff;} .sx-bvi-sw--bw{background:#000;} .sx-bvi-sw--blue{background:#9dd1ff;} .sx-bvi-sw--beige{background:#f7f3d6;}
.sx-bvi-bar__exit{margin-left:auto;height:36px;padding:0 14px;border:0;border-radius:6px;background:#ffd400;color:#000;cursor:pointer;font-family:inherit;font-size:15px;}
.sx-bvi-b:hover,.sx-bvi-bar__exit:hover{filter:brightness(.92);}

/* Схемы цвета */
html.sx-bvi{--bvi-bg:#fff;--bvi-fg:#000;}
html.sx-bvi[data-bvi-scheme="bw"]{--bvi-bg:#000;--bvi-fg:#fff;}
html.sx-bvi[data-bvi-scheme="blue"]{--bvi-bg:#9dd1ff;--bvi-fg:#063462;}
html.sx-bvi[data-bvi-scheme="beige"]{--bvi-bg:#f7f3d6;--bvi-fg:#4d3b1f;}

/* Применяем схему к контенту (панель BVI не трогаем) */
html.sx-bvi body{background:var(--bvi-bg)!important;}
html.sx-bvi .sx-top,html.sx-bvi .sx-main,html.sx-bvi .sx-footer,html.sx-bvi .sx-mobhead,html.sx-bvi .sx-drawer__panel{background:var(--bvi-bg)!important;}
html.sx-bvi .sx-top *,html.sx-bvi .sx-main *,html.sx-bvi .sx-footer *,html.sx-bvi .sx-mobhead *,html.sx-bvi .sx-drawer *{
  background-color:transparent!important;background-image:none!important;box-shadow:none!important;
  color:var(--bvi-fg)!important;border-color:var(--bvi-fg)!important;fill:var(--bvi-fg)!important;stroke:var(--bvi-fg)!important;}
html.sx-bvi .sx-main a,html.sx-bvi .sx-footer a,html.sx-bvi .sx-top a{text-decoration:underline!important;}
/* чисто декоративное — убрать */
html.sx-bvi .sx-hero__dna,html.sx-bvi .sx-statbox__dna,html.sx-bvi .sx-mask,
html.sx-bvi .sx-promo-feat__bg,html.sx-bvi .sx-promo-feat::before,
html.sx-bvi .sx-promo-cta__photo,html.sx-bvi .sx-annonce__border,
html.sx-bvi .sx-struct__map{display:none!important;}
/* масштаб (px-дизайн → zoom контента; панель BVI без зума) */
html.sx-bvi[data-bvi-fs="2"] .sx-top,html.sx-bvi[data-bvi-fs="2"] .sx-main,html.sx-bvi[data-bvi-fs="2"] .sx-footer,html.sx-bvi[data-bvi-fs="2"] .sx-mobhead{zoom:1.18;}
html.sx-bvi[data-bvi-fs="3"] .sx-top,html.sx-bvi[data-bvi-fs="3"] .sx-main,html.sx-bvi[data-bvi-fs="3"] .sx-footer,html.sx-bvi[data-bvi-fs="3"] .sx-mobhead{zoom:1.4;}
/* изображения выкл */
html.sx-bvi[data-bvi-img="off"] .sx-main img,html.sx-bvi[data-bvi-img="off"] .sx-top img,html.sx-bvi[data-bvi-img="off"] .sx-footer img{display:none!important;}