/* ═══════════════════════════════════════════════════════════════════════════
   СРЕЗЫ ФАХВЕРКА — страницы 7418 и 7419. 02.09.2026.
   Секции из includes/srez-sections.php: планировки, калькулятор, разрез стены,
   ответы на страхи, сравнение технологий, карта объектов, факты.
   Подключается ТОЛЬКО на этих двух страницах (includes/enqueue.php).

   🚨 ЗОЛОТАЯ ЗАЛИВКА. Карточка плана целиком — <a>, а правило
   `section a:not(.button):not([class*="btn"])…` в scandi.css задаёт не только
   `color`, но и `-webkit-text-fill-color: #a67c3a`. Заливка сильнее цвета
   и наследуется внутрь, поэтому каждый цвет текста задаём ПАРОЙ.

   🚨 ПРОПОРЦИЯ, А НЕ ВЫСОТА. Фиксированная высота кадра на широком экране
   превращает фото в полосу 4,5:1 («сосисочные баннеры», ловили в гиде).
   Везде aspect-ratio + height:auto.

   🚨 ПЛАН НЕЛЬЗЯ ОБРЕЗАТЬ. У планировок object-fit: contain, не cover:
   cover срезал бы комнаты по краям вместе с подписями площадей.

   🚨 Базовый CSS поэтажных планов (.scandi-plans-*) живёт в scandi-house.css,
   который грузится только на карточке дома (is_singular('houses')). На срезе
   его нет — поэтому у планов здесь собственная вёрстка, а не те же классы.
   ═══════════════════════════════════════════════════════════════════════════ */

.scandi-fv {
  --fv-ink: #1a1410;
  --fv-muted: #6b6155;
  --fv-gold: #a67c3a;
  --fv-card: #ffffff;
  --fv-line: rgba(166, 124, 58, 0.3);
  --fv-line-in: rgba(166, 124, 58, 0.16);
  --fv-wash: #f7f3ea;
}

/* ── общая шапка секции ─────────────────────────────────────────────────── */
.scandi-fv__head { max-width: 780px; margin: 0 0 clamp(20px, 2.4vw, 30px); }
.scandi-fv__eyebrow {
  display: inline-block; font-size: 12px; font-weight: 700; letter-spacing: .14em;
  text-transform: uppercase; margin-bottom: 10px;
  color: var(--fv-gold); -webkit-text-fill-color: var(--fv-gold);
}
.scandi-fv__title {
  font-size: clamp(24px, 2.6vw, 36px); line-height: 1.16; font-weight: 700; margin: 0 0 12px;
  text-wrap: balance; color: var(--fv-ink); -webkit-text-fill-color: var(--fv-ink);
}
.scandi-fv__lead {
  font-size: clamp(15px, 1.15vw, 17px); line-height: 1.55; margin: 0;
  color: var(--fv-muted); -webkit-text-fill-color: var(--fv-muted);
}

/* ── 1. Планировки ──────────────────────────────────────────────────────── */
.scandi-fv-plany__grid {
  display: grid; gap: 20px;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
.scandi-fv-plan {
  display: flex; flex-direction: column; overflow: hidden;
  background: var(--fv-card); border: 1px solid var(--fv-line); border-radius: 14px;
  box-shadow: 0 1px 3px rgba(120, 90, 50, .05);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
  text-decoration: none;
}
.scandi-fv-plan:hover {
  transform: translateY(-3px); border-color: rgba(166, 124, 58, .45);
  box-shadow: 0 6px 20px rgba(120, 90, 50, .1);
}
.scandi-fv-plan:focus-visible { outline: 2px solid var(--fv-gold); outline-offset: 3px; }
.scandi-fv-plan__media {
  /* 🚨 flex: 0 0 auto обязателен. Карточки — элементы grid со stretch, поэтому
     в ряду они выравниваются по самой высокой. Без этого кадр тянулся вместе
     с карточкой и пропорция уезжала с 1,33 до 1,27 — планы в одном ряду
     выходили разного размера. */
  flex: 0 0 auto;
  position: relative;
  display: block; width: 100%; height: auto; aspect-ratio: 4 / 3;
  background: var(--fv-wash); box-sizing: border-box;
}
/* 🚨 Картинку вынимаем из потока. В теме есть глобальное правило для img
   с height:auto — оно перебивало height:100%, и высоту кадра начинала
   задавать сама картинка: пропорция уезжала с 1,33 до 1,27, и в одном ряду
   планы выходили разной высоты. С absolute кадр держит 4:3 при любой
   картинке, а отступ даёт inset. */
.scandi-fv-plan__media img {
  position: absolute; inset: 10px;
  width: calc(100% - 20px); height: calc(100% - 20px);
  display: block; object-fit: contain;   /* план не обрезаем */
}
.scandi-fv-plan__body {
  display: flex; flex-direction: column; gap: 4px;
  padding: 13px 16px 15px; border-top: 1px solid var(--fv-line-in);
}
.scandi-fv-plan__title {
  font-size: 16px; font-weight: 600; line-height: 1.25;
  color: var(--fv-ink); -webkit-text-fill-color: var(--fv-ink);
}
.scandi-fv-plan__meta {
  font-size: 13.5px; color: var(--fv-muted); -webkit-text-fill-color: var(--fv-muted);
}

/* ── 2. Калькулятор ─────────────────────────────────────────────────────── */
.scandi-fv-calc__box {
  display: grid; gap: clamp(18px, 2.2vw, 28px); align-items: center;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
  background: var(--fv-card); border: 1px solid var(--fv-line);
  border-radius: 16px; padding: clamp(18px, 2.2vw, 28px);
}
.scandi-fv-calc__controls { display: flex; flex-direction: column; gap: 18px; }
.scandi-fv-calc__field { display: flex; flex-direction: column; gap: 8px; border: 0; padding: 0; margin: 0; }
.scandi-fv-calc__lbl {
  font-size: 13px; font-weight: 600; letter-spacing: .02em;
  color: var(--fv-muted); -webkit-text-fill-color: var(--fv-muted); padding: 0;
}
.scandi-fv-calc__field input[type="range"] { width: 100%; accent-color: var(--fv-gold); }
.scandi-fv-calc__out {
  font-size: 17px; font-weight: 700;
  color: var(--fv-ink); -webkit-text-fill-color: var(--fv-ink);
}
.scandi-fv-calc__field--set { flex-direction: row; flex-wrap: wrap; gap: 8px 18px; align-items: center; }
.scandi-fv-calc__field--set legend { width: 100%; }
.scandi-fv-calc__field--set label {
  display: inline-flex; align-items: center; gap: 7px; font-size: 14.5px; cursor: pointer;
  color: var(--fv-ink); -webkit-text-fill-color: var(--fv-ink);
}
.scandi-fv-calc__field--set input { accent-color: var(--fv-gold); }
.scandi-fv-calc__result {
  display: flex; flex-direction: column; gap: 8px;
  background: var(--fv-wash); border-radius: 12px; padding: clamp(16px, 2vw, 22px);
}
.scandi-fv-calc__sum {
  font-size: clamp(26px, 3vw, 38px); font-weight: 700; line-height: 1.05;
  color: var(--fv-ink); -webkit-text-fill-color: var(--fv-ink);
}
.scandi-fv-calc__note {
  font-size: 13.5px; line-height: 1.45;
  color: var(--fv-muted); -webkit-text-fill-color: var(--fv-muted);
}

/* ── 3. Страхи ──────────────────────────────────────────────────────────── */
.scandi-fv-strahi__grid { display: grid; gap: 18px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.scandi-fv-strah {
  position: relative; background: var(--fv-card); border: 1px solid var(--fv-line);
  border-radius: 14px; padding: 20px 22px 22px;
}
.scandi-fv-strah__num {
  display: inline-flex; align-items: center; justify-content: center;
  width: 26px; height: 26px; border-radius: 50%; margin-bottom: 10px;
  background: var(--fv-wash); font-size: 13px; font-weight: 700;
  color: var(--fv-gold); -webkit-text-fill-color: var(--fv-gold);
}
.scandi-fv-strah__q {
  font-size: 17px; font-weight: 600; line-height: 1.28; margin: 0 0 8px;
  color: var(--fv-ink); -webkit-text-fill-color: var(--fv-ink);
}
.scandi-fv-strah__a {
  font-size: 15px; line-height: 1.55; margin: 0;
  color: var(--fv-muted); -webkit-text-fill-color: var(--fv-muted);
}

/* ── 4. Сравнение технологий ────────────────────────────────────────────── */
.scandi-fv-sravn__scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.scandi-fv-sravn__table {
  width: 100%; min-width: 720px; border-collapse: collapse;
  background: var(--fv-card); border: 1px solid var(--fv-line); border-radius: 14px;
}
.scandi-fv-sravn__table th,
.scandi-fv-sravn__table td {
  padding: 13px 16px; text-align: left; font-size: 14.5px; line-height: 1.4;
  border-bottom: 1px solid var(--fv-line-in); vertical-align: top;
  color: var(--fv-ink); -webkit-text-fill-color: var(--fv-ink);
}
.scandi-fv-sravn__table thead th {
  font-size: 13px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
  background: var(--fv-wash);
  color: var(--fv-muted); -webkit-text-fill-color: var(--fv-muted);
}
.scandi-fv-sravn__table tbody th {
  font-weight: 600;
  color: var(--fv-muted); -webkit-text-fill-color: var(--fv-muted);
}
.scandi-fv-sravn__table td.is-ours {
  font-weight: 700; background: rgba(166, 124, 58, .07);
  color: var(--fv-ink); -webkit-text-fill-color: var(--fv-ink);
}
.scandi-fv-sravn__table tbody tr:last-child th,
.scandi-fv-sravn__table tbody tr:last-child td { border-bottom: 0; }

/* ── 5. Факты ───────────────────────────────────────────────────────────── */
.scandi-fv-fakty__row { display: grid; gap: 16px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.scandi-fv-fakt {
  display: flex; flex-direction: column; gap: 4px; text-align: center;
  background: var(--fv-wash); border-radius: 12px; padding: 18px 14px;
}
.scandi-fv-fakt b {
  font-size: clamp(19px, 2vw, 26px); line-height: 1.1;
  color: var(--fv-ink); -webkit-text-fill-color: var(--fv-ink);
}
.scandi-fv-fakt span {
  font-size: 13.5px; line-height: 1.35;
  color: var(--fv-muted); -webkit-text-fill-color: var(--fv-muted);
}

/* ── адаптив ────────────────────────────────────────────────────────────── */
@media (max-width: 1100px) {
  .scandi-fv-plany__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
  .scandi-fv-calc__box { grid-template-columns: minmax(0, 1fr); }
  .scandi-fv-fakty__row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .scandi-fv-plany__grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .scandi-fv-strahi__grid { grid-template-columns: minmax(0, 1fr); }
  .scandi-fv-plan__body { padding: 12px 14px 14px; }
}

@media (prefers-reduced-motion: reduce) {
  .scandi-fv-plan { transition: none; }
  .scandi-fv-plan:hover { transform: none; }
}