/* ============================================================================
   Семья «plaza» — ереван-плаза.рф
   Слой 3: лейаут уникальной композиции поверх канона и скина.
   Цвета — только токены скина; собственные токены семьи объявлены ниже.
   ========================================================================= */

:root {
  --pz-photo-bg: #ede4d6;   /* подложка фото-рамок до подгрузки кадра */
  --pz-shadow: 0 18px 40px rgba(42, 27, 30, 0.09);
  --pz-shadow-soft: 0 8px 20px rgba(42, 27, 30, 0.06);
}

/* ── Общее ───────────────────────────────────────────────────────────────── */
.pz-h2 {
  /* канонный h2 несёт рамки сверху/снизу и центрирование — для семьи снимаем */
  border: 0;
  padding: 0;
  text-align: left;
  font-family: var(--ep-font-display);
  font-weight: 700;
  font-size: clamp(26px, 3vw, 38px);
  line-height: 1.12;
  color: var(--ep-ink);
  margin: 0 0 var(--ep-s4);
  text-wrap: balance;
}

.pz-h3 {
  border: 0;
  padding: 0;
  text-align: left;
  display: flex;
  align-items: center;
  gap: var(--ep-s2);
  font-family: var(--ep-font-body);
  font-weight: 700;
  font-size: 17px;
  line-height: 1.3;
  color: var(--ep-ink);
  margin: 0 0 var(--ep-s3);
}
.pz-h3 .ard-ico { color: var(--ep-bronze); }

.pz-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 26px;
  border-radius: var(--border-radius-min);
  font-family: var(--ep-font-body);
  font-weight: 700;
  font-size: 15px;
  text-decoration: none;
  border: 1px solid transparent;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.pz-btn--solid {
  background-color: var(--ep-garnet);
  border-color: var(--ep-garnet);
  color: var(--ep-white);
}
.pz-btn--solid:hover,
.pz-btn--solid:focus {
  background-color: var(--ep-garnet-hover);
  border-color: var(--ep-garnet-hover);
  color: var(--ep-white);
}
.pz-btn--ghost {
  background-color: transparent;
  border-color: var(--ep-stone);
  color: var(--ep-ink);
}
.pz-btn--ghost:hover,
.pz-btn--ghost:focus {
  border-color: var(--ep-garnet);
  color: var(--ep-garnet);
}

/* ── Шапка ───────────────────────────────────────────────────────────────── */
header .container > .d-flex {
  flex-wrap: wrap;
  row-gap: var(--ep-s2);
  column-gap: var(--ep-s3);
}
header nav ul { flex-wrap: wrap; }
.header-actions { gap: var(--ep-s3); }
.header-phone {
  gap: var(--ep-s2);
  color: var(--ep-ink);
  text-decoration: none;
  font-weight: 700;
  font-size: 16px;
  min-height: 44px;
  font-variant-numeric: tabular-nums;
}
.header-phone .ard-ico { color: var(--ep-bronze); }
.header-phone:hover { color: var(--ep-garnet); }
.header-cta {
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  padding: 0 20px;
  font-size: 14px;
}

/* ── Hero ────────────────────────────────────────────────────────────────── */
.pz-hero {
  margin-top: 55px;
  padding: var(--ep-s6) 0 0;
  background-color: var(--ep-tuff);
}
.pz-hero__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--ep-s5);
  align-items: center;
}
.pz-hero__title {
  margin: 0 0 var(--ep-s4);
  font-family: var(--ep-font-display);
  line-height: 1.05;
  text-wrap: balance;
}
.pz-hero__type {
  display: block;
  font-family: var(--ep-font-body);
  font-weight: 500;
  font-size: clamp(14px, 1.6vw, 17px);
  letter-spacing: 0.02em;
  color: var(--ep-muted);
  margin-bottom: var(--ep-s2);
}
.pz-hero__name {
  display: block;
  font-weight: 700;
  font-size: clamp(38px, 6vw, 68px);
  color: var(--ep-ink);
}
.pz-hero__lead {
  margin: 0 0 var(--ep-s4);
  max-width: 34em;
  font-size: 17px;
  line-height: 1.6;
  color: var(--ep-ink);
}
.pz-hero__meta {
  list-style: none;
  margin: 0 0 var(--ep-s5);
  padding: 0;
  display: grid;
  gap: var(--ep-s2);
}
.pz-hero__meta li {
  display: flex;
  align-items: flex-start;
  gap: var(--ep-s2);
  font-size: 15px;
  color: var(--ep-ink);
}
.pz-hero__meta .ard-ico {
  color: var(--ep-bronze);
  margin-top: 2px;
}
.pz-hero__cta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ep-s3);
  margin: 0 0 var(--ep-s5);
}
.pz-frame--hero {
  position: relative;
  width: 100%;
  padding-top: 66.67%;
  overflow: hidden;
  border-radius: var(--border-radius);
  background-color: var(--pz-photo-bg);
}
.pz-frame--hero img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  display: block;
}

/* ── Плитка ключевых фактов ──────────────────────────────────────────────── */
.pz-facts {
  padding: var(--ep-s5) 0 0;
  background-color: var(--ep-tuff);
}
/* Разделители сделаны зазором сетки на подложке-камне: при любом переносе
   строк линии остаются ровными, обрубков от nth-child-границ не бывает. */
.pz-facts__card {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 1px;
  background-color: var(--ep-stone);
  border: 1px solid var(--ep-stone);
  border-radius: var(--border-radius);
  box-shadow: var(--pz-shadow);
  overflow: hidden;
}
.pz-fact {
  padding: var(--ep-s4) var(--ep-s3);
  background-color: var(--ep-card);
}
.pz-fact__ico {
  color: var(--ep-bronze);
  margin-bottom: var(--ep-s2);
}
.pz-fact__label {
  margin: 0 0 var(--ep-s1);
  font-size: 13px;
  line-height: 1.35;
  color: var(--ep-muted);
}
.pz-fact__value {
  margin: 0;
  font-family: var(--ep-font-display);
  font-weight: 700;
  font-size: clamp(20px, 2.2vw, 26px);
  line-height: 1.2;
  color: var(--ep-ink);
  font-variant-numeric: tabular-nums;
}
.pz-fact__sub {
  margin: var(--ep-s1) 0 0;
  font-size: 13px;
  color: var(--ep-muted);
  font-variant-numeric: tabular-nums;
}

/* ── Характеристики и инфраструктура ─────────────────────────────────────── */
.pz-specs {
  padding: var(--ep-s6) 0 0;
}
.pz-specs__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--ep-s4);
  align-items: start;
}
.pz-specs__list {
  margin: 0;
  padding: var(--ep-s2) var(--ep-s4);
  background-color: var(--ep-card);
  border: 1px solid var(--ep-stone);
  border-radius: var(--border-radius);
}
.pz-specs__row {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--ep-s1);
  padding: 14px 0;
  border-bottom: 1px solid var(--ep-stone-soft);
}
.pz-specs__row:last-child { border-bottom: 0; }
.pz-specs__row dt {
  display: flex;
  align-items: center;
  gap: var(--ep-s2);
  font-size: 14px;
  color: var(--ep-muted);
}
.pz-specs__row dt .ard-ico { color: var(--ep-bronze); }
.pz-specs__row dd {
  margin: 0;
  font-size: 15px;
  font-weight: 500;
  color: var(--ep-ink);
  font-variant-numeric: tabular-nums;
}
.pz-specs__side {
  display: grid;
  gap: var(--ep-s4);
}
.pz-card {
  padding: var(--ep-s4);
  background-color: var(--ep-card);
  border: 1px solid var(--ep-stone);
  border-radius: var(--border-radius);
}
.pz-chips {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: var(--ep-s2);
}
.pz-chip {
  padding: 7px 14px;
  border: 1px solid var(--ep-stone);
  border-radius: var(--border-radius-min);
  background-color: var(--ep-stone-soft);
  font-size: 14px;
  color: var(--ep-ink);
}
.pz-sec {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 14px;
}
.pz-sec li {
  display: flex;
  align-items: flex-start;
  gap: var(--ep-s2);
  font-size: 15px;
  color: var(--ep-ink);
}
.pz-sec .ard-ico {
  color: var(--ep-bronze);
  margin-top: 2px;
}

/* ── О здании (тейки из params) ──────────────────────────────────────────── */
.pz-takes {
  padding: var(--ep-s6) 0 0;
}
.pz-takes__grid {
  display: grid;
  gap: var(--ep-s4);
}
.pz-takes__lead {
  margin: 0;
  padding-left: var(--ep-s4);
  border-left: 3px solid var(--ep-garnet);
  font-family: var(--ep-font-display);
  font-weight: 500;
  font-size: clamp(19px, 2.2vw, 25px);
  line-height: 1.35;
  color: var(--ep-ink);
  max-width: 30em;
}
.pz-takes__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--ep-s4);
}
.pz-takes__list li {
  padding: var(--ep-s4);
  background-color: var(--ep-card);
  border: 1px solid var(--ep-stone);
  border-radius: var(--border-radius);
  font-size: 15px;
  line-height: 1.6;
  color: var(--ep-ink);
}

/* ── Галерея ─────────────────────────────────────────────────────────────── */
.pz-gallery {
  padding: var(--ep-s6) 0 0;
}
.pz-gallery__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: var(--ep-s3);
}
.pz-frame--4x3 {
  position: relative;
  width: 100%;
  padding-top: 75%;
  overflow: hidden;
  border-radius: var(--border-radius);
  background-color: var(--pz-photo-bg);
}
.pz-frame--4x3 img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  display: block;
}

/* ── Финальный призыв ────────────────────────────────────────────────────── */
.pz-cta {
  padding: var(--ep-s6) 0;
}
.pz-cta__band {
  display: grid;
  gap: var(--ep-s4);
  padding: var(--ep-s5);
  background-color: var(--ep-stone-soft);
  border: 1px solid var(--ep-stone);
  border-radius: var(--border-radius);
}
.pz-cta__title { margin-bottom: var(--ep-s2); }
.pz-cta__note {
  margin: 0;
  font-size: 14px;
  color: var(--ep-muted);
}
.pz-cta__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--ep-s4);
}
.pz-cta__phone {
  display: inline-flex;
  align-items: center;
  gap: var(--ep-s2);
  min-height: 44px;
  font-weight: 700;
  font-size: 18px;
  color: var(--ep-ink);
  text-decoration: none;
  font-variant-numeric: tabular-nums;
}
.pz-cta__phone .ard-ico { color: var(--ep-bronze); }
.pz-cta__phone:hover { color: var(--ep-garnet); }

/* ── Перекраска канонной витрины и аналитики ─────────────────────────────── */
.office .title-color,
.about .title-color,
.contact .title-color {
  font-family: var(--ep-font-display);
  font-size: clamp(26px, 3vw, 38px);
}
/* Канон красит .office-card белым по акцентной заливке и держит
   .office-card p { color: aliceblue !important } — на светлой карточке
   подписи пропадают, поэтому цвета перебиваем явно. */
.office-card {
  background-color: var(--ep-card);
  border: 1px solid var(--ep-stone);
  border-radius: var(--border-radius);
  padding: var(--ep-s4);
  color: var(--ep-ink);
}
.office-card p {
  color: var(--ep-muted) !important;
  font-size: 14px;
}
.office-card p.color-secondary {
  color: var(--ep-garnet) !important;
  font-size: 17px;
  font-variant-numeric: tabular-nums;
}
.office-table {
  border-collapse: collapse;
  background-color: var(--ep-card);
  font-variant-numeric: tabular-nums;
}
.office-table thead td {
  background-color: var(--ep-stone-soft);
  font-weight: 700;
  font-size: 14px;
  color: var(--ep-ink);
}
.office-table td {
  border: 1px solid var(--ep-stone);
  padding: 12px 14px;
  font-size: 15px;
}
.histogram .bin:hover .stand { background-color: var(--ep-garnet); }
.about#_description .histogram { margin-top: var(--ep-s4); }

/* ── Адаптив: явный collapse у всех мультиколоночных блоков ──────────────── */
@media (min-width: 768px) {
  .pz-specs__row {
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    gap: var(--ep-s3);
    align-items: baseline;
  }
  .pz-takes__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 1199.98px) {
  .header-cta { display: none; }
  header nav ul li { margin-right: var(--ep-s2) !important; }
}

@media (min-width: 992px) {
  .pz-hero { padding-top: 64px; }
  .pz-hero__grid {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
    gap: var(--ep-s6);
  }
  .pz-specs__grid { grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr); gap: var(--ep-s5); }
  .pz-cta__band {
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
    align-items: center;
    padding: var(--ep-s6);
  }
  .pz-cta__actions { justify-content: flex-end; }
}

@media (prefers-reduced-motion: reduce) {
  .pz-btn { transition: none; }
}

/* карта Яндекса в канонном блоке контактов */
.pz-map {
  display: block;
  width: 100%;
  border: 0;
  border-radius: var(--border-radius);
}
