/* Единый шаблон страницы новостройки. Брендбук wse.am, 18.09.2026 */

.zhk__loading { padding-block: 60px; color: var(--muted); }

/* ── герой ── */
.zhero { position: relative; min-height: clamp(460px, 64vh, 680px); display: flex; align-items: flex-end; background: var(--ink); overflow: hidden; }
.zhero__media { position: absolute; inset: 0; }
.zhero__media img, .zhero__media video { width: 100%; height: 100%; object-fit: cover; }
.zhero__media video { position: absolute; inset: 0; }
.zhero::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(18,19,26,.55) 0%, rgba(18,19,26,.15) 32%, rgba(18,19,26,.72) 78%, rgba(18,19,26,.94) 100%); }
.zhero__in { position: relative; z-index: 2; padding-block: clamp(26px, 5vh, 54px); color: #fff; display: grid; gap: 12px; }
.crumbs--light a, .crumbs--light span { color: rgba(255,255,255,.7); }
.crumbs--light a:hover { color: #fff; }
.zhero__tags { display: flex; gap: 6px; flex-wrap: wrap; }
.zhero .display { margin: 0; max-width: 16ch; }
.zhero__place { margin: 0; font-size: 14.5px; color: rgba(255,255,255,.78); max-width: 60ch; }
.zhero__btns { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 6px; }
.zhero__facts { display: flex; flex-wrap: wrap; gap: 14px 34px; margin: 14px 0 0; padding-top: 16px; border-top: 1px solid rgba(255,255,255,.18); }
.zhero__facts div { display: grid; gap: 2px; }
.zhero__facts dt { font-size: 12.5px; color: rgba(255,255,255,.62); }
.zhero__facts dd { margin: 0; font: 800 clamp(18px, 2vw, 24px)/1.1 var(--font-display); letter-spacing: -.03em; font-variant-numeric: tabular-nums; }
.zhero__facts .is-free dd { color: #8FE3BF; }
@media (max-width: 640px) {
  .zhero { min-height: 0; }
  .zhero__in { padding-block: 22px 26px; }
  .zhero .display { max-width: none; }
  .zhero__facts { gap: 12px 22px; }
  .zhero__btns .btn { flex: 1 1 100%; justify-content: center; }
}

/* ── о проекте ── */
.zfeat { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.zfeat span { font-size: 13px; font-weight: 600; padding: 8px 12px; border-radius: var(--r-pill); background: var(--card); border: 1px solid var(--line); color: var(--ink-2); }
.zfacts { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px 28px; margin: 0; }
.zfacts div { display: grid; gap: 3px; padding-top: 12px; border-top: 1px solid var(--line); }
.zfacts dt { font-size: 12.5px; color: var(--muted); }
.zfacts dd { margin: 0; font-size: 15px; line-height: 1.45; color: var(--ink); }

/* ── галерея ── */
.zgal { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
.zgal__i { position: relative; padding: 0; border: 0; border-radius: var(--r-lg); overflow: hidden; cursor: zoom-in; background: var(--ink); aspect-ratio: 4 / 3; }
.zgal__i img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease); }
.zgal__i:hover img { transform: scale(1.05); }
.zgal__i:first-child { grid-column: span 2; grid-row: span 2; aspect-ratio: auto; }
.zgal__i.is-film::after { content: "▶"; position: absolute; inset: 0; display: grid; place-items: center; font-size: 26px; color: #fff; background: rgba(18,19,26,.42); }
@media (max-width: 640px) {
  .zgal { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .zgal__i:first-child { grid-column: span 2; grid-row: auto; aspect-ratio: 16 / 10; }
}

/* ── схемы оплаты ── */
.zsch { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 12px; }
.zsch__c { background: var(--card); border: 1px solid var(--line); border-radius: var(--r-lg); padding: 16px 18px; display: grid; gap: 4px; align-content: start; }
.zsch__c b { font: 700 17px/1.2 var(--font-display); letter-spacing: -.02em; }
.zsch__d, .zsch__m { font-size: 13px; color: var(--muted); }
.zsch__c p { margin: 6px 0 0; font-size: 13.5px; line-height: 1.45; color: var(--ink-2); }

/* карта на странице ЖК */
#place .map { margin-top: 0; }
#place .map__side p { margin: 0; font-size: 14.5px; color: var(--ink-2); }

.zsrc { margin-top: 18px; max-width: 90ch; }
@media (min-width: 861px) { .subnav__cta { margin-right: 96px; } }