/* ============================================================
   FAMILY «facet» — сплит-hero на тёмном петроле, факт-полоса,
   бенто характеристик, два тёмных стейтмента, светлый триптих,
   фото-полоса. Использует токены скина (var(--k2-*)).
   Лейаут-дисциплина: паддинги секций 40–60px, каждое layout-
   семейство один раз, collapse <768px в этом же файле.
   ============================================================ */

/* ---------- facet-top: сплит-hero ---------- */
.facet-top {
  background: var(--k2-petrol);
  color: var(--k2-ivory);
  padding: 48px 0 40px;
}
.ft-grid {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: 40px;
  align-items: center;
}
.ft-h1 {
  font-family: var(--skin-font-display);
  font-weight: 800;
  font-size: clamp(34px, 4.6vw, 62px);
  line-height: 1.06;
  color: var(--k2-ivory);
  letter-spacing: -0.015em;
}
.ft-h1 span { display: block; color: var(--k2-gold); }
.ft-lead {
  margin-top: 20px;
  font-size: clamp(16px, 1.4vw, 19px);
  line-height: 1.55;
  color: var(--k2-ivory);
  max-width: 62ch;
}
.ft-address {
  margin-top: 16px;
  padding-left: 14px;
  border-left: 2px solid var(--k2-gold);
  color: var(--k2-dim);
  font-size: 14px;
  line-height: 1.5;
  max-width: 52ch;
}
.ft-cta {
  margin-top: 28px;
  display: flex;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
}
.ft-cta .btn { min-height: 44px; display: inline-flex; align-items: center; }
.ft-phone {
  font-family: var(--skin-font-display);
  font-weight: 700;
  font-size: clamp(19px, 1.8vw, 24px);
  color: var(--k2-ivory);
  text-decoration: none;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  font-variant-numeric: tabular-nums;
}
.ft-phone:hover { color: var(--k2-gold); }
.ft-photo-frame { border-radius: 8px; background: var(--k2-petrol-raise); }

@media (max-width: 991px) {
  .ft-grid { grid-template-columns: 1fr; gap: 28px; }
  .facet-top { padding: 36px 0 32px; }
}

/* ---------- facet-facts: факт-полоса на петроле ---------- */
.facet-facts {
  background: var(--k2-petrol);
  color: var(--k2-ivory);
  padding: 0 0 48px;
}
.ff-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
  gap: 12px;
  border-top: 1px solid var(--k2-line);
  padding-top: 28px;
}
.ff-cell {
  background: var(--k2-petrol-raise);
  border: 1px solid var(--k2-line);
  border-radius: 8px;
  padding: 18px 20px;
}
.ff-value {
  font-family: var(--skin-font-display);
  font-weight: 700;
  font-size: clamp(21px, 2vw, 27px);
  line-height: 1.15;
  color: var(--k2-ivory);
  font-variant-numeric: tabular-nums;
}
.ff-label {
  margin-top: 6px;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--k2-dim);
}
@media (max-width: 767px) {
  .ff-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---------- facet-specs: бенто характеристик ---------- */
.facet-specs { padding: 56px 0 8px; }
.facet-specs h2 {
  font-weight: 800;
  font-size: clamp(26px, 3vw, 38px);
  color: var(--k2-ink);
}
.fs-grid {
  margin-top: 28px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-auto-rows: minmax(128px, auto);
  gap: 12px;
}
.fs-photo { grid-row: span 2; border-radius: 8px; overflow: hidden; }
.fs-cell {
  border: 1px solid var(--k2-line-light);
  border-radius: 8px;
  padding: 20px 22px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  background: var(--k2-card);
}
.fs-cell--tint { background: var(--color-light); }
.fs-value {
  font-family: var(--skin-font-display);
  font-weight: 700;
  font-size: clamp(21px, 2.1vw, 29px);
  line-height: 1.15;
  color: var(--k2-ink);
  font-variant-numeric: tabular-nums;
}
.fs-label {
  margin-top: 6px;
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--k2-mute);
}
.fs-chips {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-content: center;
}
.fs-chip {
  border: 1px solid var(--k2-line-light);
  border-radius: 8px;
  padding: 10px 16px;
  font-size: 14px;
  color: var(--k2-ink);
  background: var(--k2-card);
}
.fs-chip b { font-weight: 600; }
@media (max-width: 991px) {
  .fs-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  .fs-grid { grid-template-columns: 1fr; }
  .fs-photo { grid-row: span 1; min-height: 200px; }
  .facet-specs { padding: 40px 0 8px; }
}

/* ---------- facet-statement: тёмный стейтмент (эйбр слева / текст на всю ширину) ---------- */
.facet-statement {
  background: var(--k2-petrol);
  color: var(--k2-ivory);
  margin-top: 56px;
  padding: 48px 0;
}
.fst-grid {
  display: grid;
  grid-template-columns: minmax(140px, 2fr) minmax(0, 10fr);
  gap: 24px;
  align-items: start;
}
.fst-label {
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--k2-dim);
  padding-top: 8px;
}
.fst-text {
  font-family: var(--skin-font-display);
  font-weight: 500;
  font-size: clamp(20px, 2.3vw, 28px);
  line-height: 1.4;
  color: var(--k2-ivory);
  max-width: 44ch;
}
.fst-cta { margin-top: 24px; }
.fst-cta .btn { min-height: 44px; display: inline-flex; align-items: center; }
@media (max-width: 767px) {
  .fst-grid { grid-template-columns: 1fr; gap: 12px; }
  .facet-statement { margin-top: 40px; padding: 40px 0; }
}

/* ---------- facet-cols: светлый триптих тезисов ---------- */
.facet-cols { padding: 56px 0 8px; }
.fc-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 32px;
}
.fc-col { border-left: 2px solid var(--k2-bronze); padding-left: 20px; }
.fc-label {
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--k2-mute);
}
.fc-text { margin-top: 10px; font-size: 16px; line-height: 1.6; color: var(--k2-ink); }
.fc-col > .fc-text:first-child { margin-top: 0; }
@media (max-width: 767px) {
  .fc-grid { grid-template-columns: 1fr; gap: 24px; }
  .facet-cols { padding: 40px 0 8px; }
}

/* ---------- канонная «Инфраструктура рядом» как тёмная полоса ---------- */
.infra {
  background: var(--k2-petrol);
  margin-top: 56px !important;
  padding: 48px 0 40px !important;
}
.infra .title-color { color: var(--k2-ivory); }
.infra .structure_item {
  background: transparent;
  border: 1px solid var(--k2-line);
  border-radius: 8px;
  width: auto;
  min-width: 0;
  padding: 10px 18px;
}
.infra .structure_item .text { color: var(--k2-ivory); }

/* ---------- facet-district: тёмный стейтмент безопасности + чипы из данных ---------- */
.facet-district {
  background: var(--k2-petrol);
  color: var(--k2-ivory);
  padding: 8px 0 56px;
}
.fd-grid {
  display: grid;
  grid-template-columns: minmax(0, 7fr) minmax(0, 5fr);
  gap: 40px;
  border-top: 1px solid var(--k2-line);
  padding-top: 36px;
  align-items: start;
}
.fd-label {
  font-size: 12px;
  font-weight: 500;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--k2-dim);
}
.fd-text {
  margin-top: 12px;
  font-family: var(--skin-font-display);
  font-weight: 500;
  font-size: clamp(18px, 1.9vw, 24px);
  line-height: 1.45;
  color: var(--k2-ivory);
  max-width: 46ch;
}
.fd-link {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  margin-top: 12px;
  color: var(--k2-gold);
  text-decoration: underline;
  text-underline-offset: 4px;
}
.fd-link:hover { color: var(--k2-gold-hover); }
.fd-chips { display: flex; flex-wrap: wrap; gap: 10px; }
.fd-chip {
  border: 1px solid var(--k2-line);
  border-radius: 8px;
  padding: 10px 16px;
  font-size: 14px;
  color: var(--k2-ivory);
}
@media (max-width: 767px) {
  .fd-grid { grid-template-columns: 1fr; gap: 20px; }
  .facet-district { padding-bottom: 44px; }
}

/* ---------- facet-photos: фото-полоса ---------- */
.facet-photos { padding: 56px 0 8px; }
.fp-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.fp-cell { border-radius: 8px; overflow: hidden; background: var(--color-light); }
@media (max-width: 991px) {
  .fp-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
  .facet-photos { padding: 40px 0 8px; }
}

/* ---------- канонные контакты: пустая колонка карты не оставляет дыру ---------- */
.row-map .col-md-6:empty { display: none; }
.row-map .col-md-6:first-child:last-child,
.row-map .col-md-6:has(+ .col-md-6:empty) {
  flex: 0 0 100%;
  max-width: 720px;
  margin: 0 auto;
}
