/* ═══════════════════════════════════════════════════════════════
   VIT LOGISTICS · DISTILL LAYER
   Загружается последним. Цель (по итогам дизайн-критики /impeccable):
   убрать «стекломорфизм по умолчанию» — контентные карточки становятся
   сплошным обсидианом с тонким золотым хайрлайном. Blur остаётся только
   на настоящих оверлеях (шапка, дровер, модалки, кнопки) и в опциональном
   режиме body.liquid-mode (осознанный выбор пользователя — не трогаем).
   Тише, премиальнее, легче для GPU/батареи.
   ═══════════════════════════════════════════════════════════════ */

/* ═══ ЗАГОЛОВКИ СЕКЦИЙ · CONTAINER QUERIES ═══
   Было: семь переопределений `.sec-h` (шесть в style.css + инлайн у отзывов),
   каждое лечило переполнение в конкретной секции конкретным медиазапросом.
   Причина у всех одна — заголовок стоит то в секции во всю ширину, то в
   колонке грида вполовину. Вьюпорт про это не знает, контейнер знает.

   Теперь размер считается от РЕАЛЬНОЙ ширины родителя (`cqi`), поэтому:
     · #partners / #services (широкие)  → ~60px
     · #schedule / #calc (колонки 1fr)  → ~40px
     · телефон                          → 30px
   Переполнение «Стоимость Доставки» на RU/GE закрыто самой механикой,
   а не подгонкой: узкий контейнер физически не получит крупный кегль.

   Фоллбек бесплатный: в браузере без поддержки `cqi` объявление
   невалидно и отбрасывается — применяются старые правила из style.css. */
.sec-ctx { container-type: inline-size; }
.sec-h { font-size: clamp(30px, 6.5cqi, 60px) !important; }

/* ═══ ВЕРТИКАЛЬНЫЙ РИТМ НА `lh` ═══
   Интервалы в блоке-шапке секции заданы долями строки САМОГО элемента,
   а не пикселями. Поэтому отступ автоматически следует за кеглем, который
   после правки выше зависит от ширины контейнера: широкая секция — крупный
   заголовок и большой воздух, узкая колонка — мельче и плотнее. Одно
   правило вместо подгонки в каждой секции.

   Взято `lh` (строка элемента), а НЕ `rlh` (строка корня), хотя предлагали
   второе: у корня `line-height:normal`, и чтобы `rlh` стал осмысленным,
   пришлось бы задать `:root{line-height:1.6}`. Замерено: 439 из 635
   текстовых элементов (69%) наследуют `normal` — их бы переверстало все,
   включая кнопки, ссылки и логотип. `lh` даёт тот же ритм без единого
   побочного эффекта.

   Было: margin-bottom у .sec-h — 8px в #partners/#services и
   clamp(36px,5vw,56px) в остальных, то есть ритма не было. */
.sec-label { margin-bottom: 1lh !important; }
.sec-h { margin-bottom: .75lh !important; }
/* сетка партнёров держала свой inline `margin-top:52px`, дублировавший
   отступ заголовка — гасим, иначе воздух удваивается */
.pcard-grid { margin-top: 0 !important; }

/* ═══ ДАННЫЕ — ОТДЕЛЬНЫЙ АЛФАВИТ ═══
   Роли шрифтов в дизайн-системе уже разведены: Bebas — крупные цифры
   витрины (220+ стран, цена, часы), JetBrains Mono — технические
   показания. Но Mono до сих пор применялся стихийно, и «показание
   прибора» визуально не отличалось от обычного текста.

   Правило: всё, что сайт ИЗМЕРИЛ (время, срок, курс, координата,
   трек-номер, остаток), набирается моноширинным с табличными цифрами.
   Всё, что сайт УТВЕРЖДАЕТ, остаётся в Golos. Читателю больше не надо
   вчитываться, чтобы понять, что перед ним.

   Замерено: у Golos Text разбег ширины цифр 6px, у Bebas и Mono — 0.
   Поэтому tabular-nums критичен именно для чисел в теле текста. */
.data-val,
.stable td:nth-child(2),          /* часы работы */
#SN1L,                            /* сколько осталось до закрытия */
#calc-eur-line,                   /* цена во второй валюте */
#calc-breakdown,                  /* разбивка расчёта */
.rv-date {                        /* даты отзывов */
  font-family: 'JetBrains Mono', monospace;
  font-variant-numeric: tabular-nums;
  letter-spacing: .2px;
}
/* Крупные витринные цифры остаются Bebas, но получают табличные знаки —
   счётчик 0→220 анимируется, и колонка не должна дёргаться */
.abv2-stat-n, #CRP, #live-clock, #live-clock2, .rt-days b {
  font-variant-numeric: tabular-nums;
}

/* ═══ ХОЛОСТОЙ ШИМЕР ═══
   Акценты заголовков несли градиент + background-clip:text + бесконечную
   анимацию `abv2Shimmer`. Прошлая чистка не удалила градиенты, а закрасила
   их сверху сплошной заливкой (`-webkit-text-fill-color`), поэтому машинерия
   осталась и продолжала работать вхолостую.

   Замерено в браузере: 10 анимаций крутятся непрерывно, ни одна не видна —
   заливка у всех сплошная золотая. Гасим анимацию и снимаем мёртвый
   градиент. Видимый результат не меняется ни на пиксель: тот же var(--gl).
   Заодно уходит запрещённый правилами `background-clip:text` из живого CSS. */
.abv2-title-em,
.sec-h em,
.lug-h-em,
.member-title-em,
.sp-h1-gold {
  animation: none !important;
  background: none !important;
  -webkit-background-clip: border-box !important;
  background-clip: border-box !important;
  -webkit-text-fill-color: currentColor !important;
  color: var(--gl) !important;
}

/* ═══ КОМПАКТНОСТЬ · ВЕРТИКАЛЬНЫЙ ВОЗДУХ ═══
   Замерено: страница 14306px = 15.9 экрана прокрутки. Секции с
   --sec-pad-y получали на десктопе по 120px сверху и снизу — 240px
   чистого отступа на секцию. Пользователь уставал долистывать.

   Сводим вертикальный воздух к единой, более плотной шкале. Ритм не
   убиваем: внутренние отступы блоков не трогаем, режем только
   межсекционные поля и разрывы «шапка секции → контент». */
:root{
  --sec-pad-y: clamp(44px, 4.6vw, 72px);   /* было clamp(72px,9vw,120px) */
}
/* секции со своими правилами padding — приводим к той же шкале */
.methods-section,
#partners,
#services,
.about-v2,
.membership-section{
  padding-top: var(--sec-pad-y) !important;
  padding-bottom: var(--sec-pad-y) !important;
}
/* разрыв между шапкой секции и содержимым */
.methods-head,
.routes-head,
.excl-head{ margin-bottom: clamp(20px, 2.4vw, 32px) !important; }
.sec-h{ margin-bottom: .6lh !important; }

/* Шапки секций съедали по 300-330px каждая: заголовок рендерился в 79px
   и переносился на две строки (162px). Уменьшаем витринный кегль —
   он остаётся крупным и премиальным, но перестаёт съедать экран. */
.abv2-title{
  font-size: clamp(30px, 4.1vw, 58px) !important;
  margin-bottom: 18px !important;
}
.abv2-lead{
  font-size: clamp(14px, 1.25vw, 16px) !important;
  line-height: 1.62 !important;
}
.abv2-eyebrow{ margin-bottom: 10px !important; }

/* Панорамный кадр в «Маршрутах» занимал 528px по высоте. Ограничиваем:
   кадр остаётся широким и брендовым, но не разгоняет секцию. */
.routes-visual{ aspect-ratio: auto !important; height: clamp(160px, 20vw, 300px) !important; }

/* Внутренние отступы карточек — самый плотный слой. Режем умеренно:
   тач-зоны и читаемость не трогаем, только избыточный воздух. */
.pcard-new{ padding: clamp(20px, 2vw, 28px) !important; }
.pcard-list{ gap: 9px !important; }
.excl-body{ padding: clamp(16px, 1.7vw, 20px) !important; }
.excl-d{ margin-bottom: 12px !important; }
.excl-meta, .excl-chips{ margin-bottom: 14px !important; }
/* лид в шапке офиса самый длинный на сайте — поджимаем разрыв под ним */
#branches .abv2-lead{ margin-bottom: 0 !important; }
#branches .abv2-head{ margin-bottom: clamp(18px, 2vw, 26px) !important; }
/* Найдено при замере компактности (дефекты существовали и раньше):
   кнопки партнёрских карточек — 39px, главные CTA первого экрана
   «Рассчитать стоимость» и «Отследить посылку» — 41px. Всё ниже
   тач-порога 44px. Чиним заодно. */
.pcard-btn,
.btn-gold,
.btn-ghost{ min-height: 44px !important; }

/* ═══ ОРБЫ И ДОСТУПНОСТЬ ═══
   Плавающие золотые орбы (.abv2-orb, дрейф 22-28с) не были покрыты
   ни одним правилом prefers-reduced-motion — пробел в существующих
   секциях. Закрываем глобально: при запросе на снижение движения орбы
   замирают, но остаются как статичная золотая подсветка. */
@media (prefers-reduced-motion: reduce){
  .abv2-orb{ animation: none !important; }
}

/* Контентные карточки (дефолтное состояние, вне liquid-mode) */
body:not(.liquid-mode) .hcard,
body:not(.liquid-mode) .abv2-card,
body:not(.liquid-mode) .abv2-stat,
body:not(.liquid-mode) .srv2,
body:not(.liquid-mode) .soc-card,
body:not(.liquid-mode) .pcard-new,
body:not(.liquid-mode) .method-card,
body:not(.liquid-mode) .sp-feat,
body:not(.liquid-mode) .lugela-inner,
body:not(.liquid-mode) .achip,
body:not(.liquid-mode) .reviews-grid > * {
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  /* gradient layered over a solid obsidian base = fully opaque, no glass.
     Shorthand + !important defeats per-card `background:` shorthands in
     style.css that otherwise reset the color to transparent. */
  background: linear-gradient(158deg, rgba(26,23,16,.5), rgba(9,8,6,.6)), #101010 !important;
}

/* Иерархия в сетке услуг: флагманская услуга (01) — тёплый золотой тон,
   чтобы 6 ячеек не читались как монотонный однородный грид. Структуру
   бордер-грида не трогаем (без риска для nth-child границ и мобильной раскладки). */
body:not(.liquid-mode) .srv2:first-child {
  background: linear-gradient(158deg, rgba(201,168,76,.09), rgba(9,8,6,.55)), #0f0d09 !important;
}

/* Тонкий золотой хайрлайн вместо мягкого стекла — один пиксель, спокойно */
body:not(.liquid-mode) .abv2-stat,
body:not(.liquid-mode) .srv2,
body:not(.liquid-mode) .soc-card,
body:not(.liquid-mode) .method-card,
body:not(.liquid-mode) .sp-feat {
  border: 1px solid rgba(201,168,76,.16);
}
