/* Основание: сброс, типографика, доступность. */
*,*::before,*::after{box-sizing:border-box}
/* Прокрутка страницы плавная: щелчок по ссылке внутри страницы -
   «Открыть форму», «К программам» - раньше телепортировал, и человек
   терял место, где стоял. Плавный ход показывает, КУДА его перенесло.

   scroll-padding-top обязателен вместе с этим: шапка стоит поверх
   страницы, и без отступа якорь встаёт ровно под неё - заголовок
   раздела оказывается закрыт, и выглядит это как промах ссылки.
   Шапка занимает 109 пикселей - замерено в браузере, а не прикинуто.
   Первое значение (112) формально уводило цель из-под шапки, но
   оставляло над заголовком три пикселя: не перекрыто и при этом
   впритык, будто ссылка чуть промахнулась. 144 дают над заголовком
   строку воздуха.

   Отмену при просьбе уменьшить движение ставит правило ниже
   (scroll-behavior:auto !important). */
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:144px}
body{
  margin:0;background:var(--bg);color:var(--text);
  font-family:var(--ui);font-size:var(--step-0);line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img,video{max-width:100%;height:auto;display:block}

h1,h2,h3{font-family:var(--disp);font-weight:400;line-height:1.12;margin:0;text-wrap:balance}
h1{font-size:var(--step-4)}
h2{font-size:var(--step-3)}
h3{font-size:var(--step-1);font-weight:400}
p{margin:0 0 var(--gap-2)}
/* Колонка чтения. Строка длиннее 65 знаков утомляет: глаз теряет начало
   следующей строки. Правило действует и на тёмной температуре. */
.prose{max-width:var(--measure)}
.prose p,.prose li{color:var(--text-soft)}

a{color:inherit;text-decoration-color:color-mix(in srgb,var(--accent) 60%,transparent);
  text-underline-offset:3px}

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

.lbl{font-size:var(--step--1);font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;color:var(--accent)}

.wrap{max-width:var(--page);margin:0 auto;padding:0 var(--gap-3)}
.stack > * + *{margin-top:var(--gap-3)}

/* Цифры в акцидентном шрифте принудительно выровнены по высоте и ширине:
   цена и длительность должны читаться как данные, а не как декор. */
.num,.price,h1,h2,h3{font-variant-numeric:lining-nums tabular-nums}

/* Картинки и видео не выделяются и не перетаскиваются - просьба клиента
   15.09.2026: выделенная синим фотография или кадр, утащенный мышью,
   выглядят поломкой. Firefox свойство -webkit-user-drag не знает, там
   перетаскивание гасит скрипт в общей части шапки. На телефоне долгое
   нажатие на картинку больше не открывает меню сохранения. */
img,video,picture,svg{-webkit-user-select:none;user-select:none;
  -webkit-user-drag:none;-webkit-touch-callout:none}


/* Наведение только там, где оно существует: на телефоне hover эмулируется
   первым касанием и залипает после того, как палец убрали. */
@media (hover:hover){
  a:hover{text-decoration-color:var(--accent)}
}
