/* ================= ШЛИФОВКА СТИЛЯ (12.10.2026) =================
   Дима: «направление оставить, но сделать куда приятнее».
   Направление то же: лён + графит, Inter, тёмные киноблоки. Меняется только «отделка»:
   до этого у карточек было 5 разных стилей (радиусы 3/4/6/8/14/18 px, рамки, тяжёлые тени),
   кнопки — радиусы 6 px, фоны секций — три оттенка + белая полоса.
   Теперь одна система: один радиус, одна карточка (без рамки, мягкая тень), цвет акцента прежний,
   ровный фон, подписи читаемее. Кнопки и мелкие плашки — с прежними острыми углами (Дима 12.10).
   Включено для всех 12.10.2026. Селекторы с html:root — чтобы перебить секционные стили. */

html:root {
  --r: 16px;                 /* карточки, фото, блоки */
  --r-sm: 12px;              /* фото галереи */
  --card: #fffdf9;
  --card-shadow: 0 1px 2px rgba(31, 24, 12, 0.04), 0 14px 36px -18px rgba(31, 24, 12, 0.22);
  --card-shadow-hover: 0 1px 2px rgba(31, 24, 12, 0.05), 0 22px 44px -18px rgba(31, 24, 12, 0.3);
}

/* ---- Фон: светлые секции одного тона, без полос-разделителей ---- */
html:root body,
html:root .adv, html:root .vs, html:root .how, html:root .cases,
html:root .partners, html:root .faq, html:root .avail, html:root .calc-teaser,
html:root .gallery, html:root .stats, html:root .stories, html:root .about,
html:root .calc, html:root .docs-trust, html:root .brands {   /* .vat — тёмный блок, его фон не трогаем (13.10) */
  background-color: #efe9df;
  border-top: 0;
}

/* Белёсый тон для чередования: соседние светлые блоки — лён / белёсый / лён…
   (класс ставит site-src/build.py → alternate_backgrounds; Дима 13.10.2026: «чтобы блоки не сливались в один») */
html:root .bg-soft { background-color: #f8f5ef; }

/* ---- Заголовки секций ---- */
html:root .sec-eyebrow {
  font-size: 12px; font-weight: 600; letter-spacing: 0.14em; color: #8a8170;
}
html:root .h2 {
  font-size: clamp(34px, 4.3vw, 58px); line-height: 1.04; letter-spacing: -0.032em; font-weight: 700;
  text-wrap: balance;
}
html:root .sec-sub { font-size: 17px; line-height: 1.6; color: #4f493f; text-wrap: pretty; }
/* Тёмные блоки (Porsche, первый экран, автовозы, логистика, география, контакты, подвал, «Возврат НДС»):
   цвет подзаголовка выше — для светлых секций, тут возвращаем их собственный светлый (13.10). */
html:root :is(.block-1, .hero, .cinema-block, .logi, .geo, .cta, .ft) .sec-sub { color: var(--ink-2); }
/* тёмный блок «Возврат НДС»: подписи остаются светлыми (13.10) */
html:root .vat .sec-eyebrow { color: rgba(255, 253, 249, 0.65); }
html:root .vat .sec-sub { color: rgba(255, 253, 249, 0.72); }

/* ---- Единая карточка ---- */
html:root .adv-card,
html:root .cs-card,
html:root .vs-card, html:root .vs-grid, html:root .vs-table,
html:root .qa,
html:root .avail-car {
  border: 0;
  border-radius: var(--r);
  background: var(--card);
  box-shadow: var(--card-shadow);
  transition: box-shadow 0.35s var(--ease), transform 0.35s var(--ease);
}
html:root .avail-car { overflow: hidden; }
html:root .adv-card:hover,
html:root .cs-card:hover { box-shadow: var(--card-shadow-hover); transform: translateY(-2px); }
html:root .card-hi {   /* тёмный «остров» остаётся тёмным */
  border: 0; border-radius: var(--r); background: linear-gradient(135deg, #1c1c1c 0%, #181818 100%);
  box-shadow: 0 18px 40px -18px rgba(0, 0, 0, 0.45);
}
html:root .adv-grid { gap: 16px; }
html:root .card-no { color: #a39a88; }

/* FAQ: открытый вопрос — та же карточка, чуть плотнее тень */
html:root .faq-list { gap: 12px; }
html:root .qa:hover { box-shadow: var(--card-shadow-hover); }
html:root .qa[open] { background: var(--card); box-shadow: var(--card-shadow-hover); }

/* ---- «В наличии»: плашки без рамок (углы — как были) ---- */
html:root .avail-tags span { border: 0; background: rgba(31, 24, 12, 0.06); }
html:root .avail-specs { border: 0; }
html:root .avail-thumbs { background: transparent; }

/* ---- Галерея: фото без тёмной рамки ---- */
html:root .gallery-item { border: 0; border-radius: var(--r-sm); box-shadow: 0 10px 26px -16px rgba(31, 24, 12, 0.35); }
html:root .gallery-grid { gap: 14px; }

/* ---- Кнопки: углы и цвет как были (Дима 12.10: «края более заострённые, как было») ---- */
html:root .btn-ghost { border-color: rgba(31, 24, 12, 0.2); }
html:root .hero .btn-ghost, html:root .cta .btn-ghost, html:root .logi .btn-ghost { border-color: rgba(255, 255, 255, 0.24); }

/* ---- Тёмные блоки: читаемый вторичный текст ---- */
html:root .hero-lead { color: #c4beb3; }
html:root .hero-em { color: #77726a; }
html:root .meta-l { color: #9c968c; }

/* ---- Контакты (тёмный блок) — те же радиусы ---- */

/* Переход по якорю меню с другой страницы (/#calc): блок не прячется под шапкой (15.10.2026). */
html:root section[id] { scroll-margin-top: 72px; }

/* ================= ВПИСЫВАНИЕ БЛОКОВ В ВЫСОТУ ЭКРАНА (16.10.2026) =================
   Дима: «с планшета блоки не помещаются по высоте». Отступы секций были жёсткие 110–120 px
   при любой высоте экрана: на планшете лёжа (744–834 px) одни поля съедали треть экрана,
   и блок целиком не виден. Теперь поля и зазоры зависят от высоты экрана (на высоких
   экранах остаются как были), а на низких широких экранах блоки уплотнены.
   Телефоны (≤640) не трогаем — у них свои отступы в responsive.css. */
@media (min-width: 641px) {
  html:root .avail, html:root .adv, html:root .vat, html:root .vs, html:root .calc,
  html:root .how, html:root .gallery, html:root .cases, html:root .stories,
  html:root .partners, html:root .faq, html:root .cta, html:root .about, html:root .geo,
  html:root .stats, html:root .transit, html:root .docs-trust, html:root .livemap,
  html:root .calc-teaser, html:root .requisites {
    padding-top: clamp(56px, min(9vh, 8vw), 110px);
    padding-bottom: clamp(56px, min(9vh, 8vw), 110px);
  }
  html:root .brands { padding-top: clamp(56px, min(9vh, 8vw), 110px); }
  html:root .sec-head { margin-bottom: clamp(28px, 4.5vh, 64px); }
}
@media (min-width: 641px) {
  /* у этих блоков заголовок и так ближе к содержимому — не раздвигаем */
  html:root :is(.vs, .cases, .vat, .avail, .livemap, .docs-trust, .requisites) .sec-head { margin-bottom: clamp(24px, 3.5vh, 36px); }
}

/* Низкий широкий экран — планшет лёжа, ноутбук 1366×768: уплотняем содержимое блоков. */
@media (min-width: 900px) and (max-height: 860px) {
  html:root .hero { padding-top: 96px; }
  html:root .hero-h1 { margin-bottom: 28px; }
  html:root .hero-row { margin-bottom: 32px; }
  html:root .hero-meta-wrap { padding-top: 24px; padding-bottom: 48px; }
  html:root .card { padding: 24px 26px; }
  html:root .card-no { padding-bottom: 12px; margin-bottom: 14px; }
  html:root .vat-input, html:root .vat-out { padding: 22px 26px 24px; }
  html:root .vs-row, html:root .vs-mid .vs-mid-row { min-height: 60px; padding-top: 10px; padding-bottom: 10px; }
  html:root .vs-mid .vs-mid-head { min-height: 76px; }
  html:root .cs-card { padding: 20px 24px 22px; gap: 12px; }
  html:root .cs-head { padding-bottom: 10px; }
  html:root .gallery-item { aspect-ratio: 16 / 10; }
  html:root .calc-inputs, html:root .calc-result { padding: 26px 30px; }
  html:root .cb { margin-bottom: 14px; }
  html:root .cb label { margin-bottom: 7px; }
  html:root .pill { padding: 7px 12px; }
  html:root .cr-rows li { padding-top: 5px; padding-bottom: 5px; }
  html:root .cr-h { padding-bottom: 12px; margin-bottom: 10px; }
  html:root .cr-total { padding-top: 14px; margin-top: 10px; }
  html:root .cr-vat { padding: 10px 14px; margin-top: 10px; }
  html:root .cr-note { margin: 10px 0 14px; }
  /* заголовок блока шире — подзаголовок в 2 строки вместо 3 */
  html:root .sec-head { max-width: 920px; gap: 10px; }
  html:root .sec-sub { font-size: 16px; line-height: 1.5; }
  html:root .h2 { font-size: clamp(32px, 5.4vh, 58px); }
  html:root .vat-savings-big { font-size: clamp(40px, 7vh, 76px); }
  html:root .vat-compare { padding-top: 14px; }
  html:root .price { font-size: 34px; }
  html:root .cr-total-v { font-size: 32px; }
  html:root .dt-grid { grid-template-columns: repeat(4, 1fr); gap: 14px; }   /* «Документы»: на 1024 лёжа — в один ряд */
  html:root .livemap-canvas { height: clamp(320px, 48vh, 620px); }
}

/* Планшет стоя (720–980): ширины хватает на две колонки — калькуляторы и фото не тянутся в длинную ленту. */
@media (min-width: 720px) and (max-width: 980px) {
  html:root .avail-stage { aspect-ratio: 16 / 10; }
  html:root .calc-card { grid-template-columns: 1.1fr 1fr; }
  html:root .calc-inputs { border-right: 1px solid var(--line); border-bottom: 0; }
  html:root .calc-inputs, html:root .calc-result { padding: 26px 24px; }
  html:root .vat-grid { grid-template-columns: 1fr 1fr; gap: 14px; }
  html:root .vat-input, html:root .vat-out { padding: 22px 22px 24px; }
  html:root .vat-savings-big { font-size: 40px; }
  html:root .vat-comp-v { font-size: 17px; white-space: nowrap; }
  html:root .cr-total { display: block; }
  html:root .cr-total-l { display: block; margin-bottom: 6px; }
  html:root .cr-total-v, html:root .cr-vat b { white-space: nowrap; }
  html:root .cs-grid { grid-template-columns: repeat(2, 1fr); gap: 14px; }
  html:root .cs-card { padding: 20px 20px 22px; }
  /* сравнение «самому / через ВИГ» — две колонки рядом, подпись параметра у каждой строки */
  html:root .vs-grid { grid-template-columns: 1fr 1fr; }
  html:root .vs-col.is-good { border-top: 0; border-left: 1px solid var(--line); }
}