/* Страница «Цены и условия» (кадры «Цены · 1920 / 768 / 390») и общий первый экран внутренних страниц.
   Блоки главной (bani, cifry, vizit, bron) подключены как есть; здесь — только то, чего на главной нет. */

/* ===== «Первый экран · страница»: 1920 — 640, 768 — 560, 390 — 844; фото, затемнения и «Факты · стекло» — как у главной (hero.css) ===== */
.hero--page .hero__in { min-height: 844px; }
.hero--page .hero__content { align-items: flex-start; gap: 24px; padding-bottom: 96px; }
.phero__text { display: flex; flex-direction: column; align-items: flex-start; align-self: stretch; }

/* «Крошки / На фото»: 14/20, промежуток 8; «Главная» и шеврон — вполсилы, текущая — белая */
.crumbs__list { display: flex; align-items: center; gap: 8px; }
.crumbs__item { display: flex; align-items: center; gap: 8px; font: 400 14px/20px var(--f-sans); color: var(--c-text-light); }
.crumbs__link { color: var(--c-text-dim); text-decoration: none; }
.crumbs__link:hover { text-decoration: underline; text-underline-offset: 3px; }
.crumbs__sep { width: 14px; height: 14px; color: var(--c-text-dim); }
/* крошки на фото первого экрана: мягкая тень под текстом (светлые места фото давали контраст 2,3–3,9) */
.hero .crumbs { text-shadow: 0 1px 2px rgba(0, 0, 0, .7), 0 0 6px rgba(0, 0, 0, .5), 0 0 12px rgba(0, 0, 0, .4); }
.hero .crumbs__sep { filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .6)); } /* разделители — svg, text-shadow на них не действует */

.phero__h1 { margin-top: 16px; font: 400 40px/46px var(--f-serif); }
.phero__lead { margin-top: 12px; max-width: 350px; color: var(--c-text-dim); font: 400 17px/25px var(--f-sans); }

@media (min-width: 768px) {
  .hero--page .hero__in { min-height: 560px; }
  .hero--page .hero__content { gap: 32px; padding-bottom: 48px; }
  .phero__h1 { margin-top: 24px; font-size: 56px; line-height: 64px; }
  .phero__lead { margin-top: 16px; max-width: 560px; font-size: 20px; line-height: 30px; }
}
@media (min-width: 1200px) {
  .hero--page .hero__in { min-height: 640px; }
  .hero--page .hero__content { padding-bottom: 64px; }
  .phero__h1 { max-width: 900px; font-size: 72px; line-height: 80px; }
  .phero__lead { max-width: 640px; }
}

/* «Услуги · 768», «Беседки · 768»: содержимое начинается на 40 ниже шапки (Содержимое y93, Текст y40) — блок растёт: 609 и 579 вместо 560; остальные страницы 560 */
@media (min-width: 768px) and (max-width: 1199px) {
  .hero--pt .hero__content { padding-top: 40px; }
}

/* плашка фактов не сжимается и не переносит значения (в кадре «Контакты · 768» она на 6 px шире контейнера — так и оставлено) */
.hero--page .facts { flex: none; }
.hero--page .fact__value { white-space: nowrap; }
/* «Как добраться» 768–1199: середина затемнения α0,5 (stop 0,26, rgb 10,18,13) — как в кадре, ради контраста крошек */
@media (min-width: 768px) and (max-width: 1199px) {
  .hero--dim::before {
    background:
      linear-gradient(to right, rgba(31, 45, 34, .6) 0%, rgba(31, 45, 34, .35) 35%, rgba(31, 45, 34, 0) 60%),
      linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(10, 18, 13, .5) 26%, rgba(0, 0, 0, .88) 100%);
  }
}

/* Первый экран новых страниц: в части кадров «Затемнение» темнее остальных (0,22 в середине) — точки 0 → 0,35 · 26 % → 0,65 (rgb 10,18,13) · 100 % → 0,88 (rgb 8,15,10).
   Какой кадр — по ширине: hero--dk-m (<768), hero--dk-t (768–1199), hero--dk-d (≥1200); список по страницам — hero_mod в inc/pages.php (читано из Figma 10.10.2026). */
@media (max-width: 767px) {
  .hero--dk-m::before { background: linear-gradient(to bottom, rgba(0, 0, 0, .35) 0%, rgba(10, 18, 13, .65) 26%, rgba(8, 15, 10, .88) 100%); }
}
@media (min-width: 768px) and (max-width: 1199px) {
  .hero--dk-t::before {
    background:
      linear-gradient(to right, rgba(31, 45, 34, .6) 0%, rgba(31, 45, 34, .35) 35%, rgba(31, 45, 34, 0) 60%),
      linear-gradient(to bottom, rgba(0, 0, 0, .35) 0%, rgba(10, 18, 13, .65) 26%, rgba(8, 15, 10, .88) 100%);
  }
}
@media (min-width: 1200px) {
  .hero--dk-d::before {
    background:
      linear-gradient(to right, rgba(31, 45, 34, .6) 0%, rgba(31, 45, 34, .35) 35%, rgba(31, 45, 34, 0) 60%),
      linear-gradient(to bottom, rgba(0, 0, 0, .35) 0%, rgba(10, 18, 13, .65) 26%, rgba(8, 15, 10, .88) 100%);
  }
}

/* Кедровая 390: фото под крошками светлое (медиана контраста 4,0–4,6) — мягкая полоса α0,30 поверх обычного затемнения; привязана к низу кадра, как и крошки (содержимое прижато книзу; крошки на 520–650 от низа: 320 — выше, 390–767 — ниже) */
@media (max-width: 767px) {
  .hero--crumbs-dk::before {
    background:
      linear-gradient(to bottom, rgba(0, 0, 0, 0) calc(100% - 750px), rgba(0, 0, 0, .3) calc(100% - 670px), rgba(0, 0, 0, .3) calc(100% - 520px), rgba(0, 0, 0, 0) calc(100% - 440px)),
      linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .22) 26%, rgba(0, 0, 0, .88) 100%);
  }
}

/* Страницы бань ≥768: то же под крошками (они на 144–188 от верха, содержимое сверху вниз по высоте шапки) — полоса α0,20 поверх обычного затемнения слева и снизу */
@media (min-width: 768px) {
  .hero--crumbs-dk::before {
    background:
      linear-gradient(to bottom, rgba(0, 0, 0, 0) 90px, rgba(0, 0, 0, .2) 140px, rgba(0, 0, 0, .2) 190px, rgba(0, 0, 0, 0) 260px),
      linear-gradient(to right, rgba(31, 45, 34, .6) 0%, rgba(31, 45, 34, .35) 35%, rgba(31, 45, 34, 0) 60%),
      linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, .22) 26%, rgba(0, 0, 0, .88) 100%);
  }
}

/* ===== «Цены · таблица»: 1920 — ряды с шапкой колонок, 768 — ряды в две строки, 390 — карточки ===== */
.pbani__table { display: flex; flex-direction: column; gap: 16px; }
.ptable, .pgroup, .price { font-variant-numeric: tabular-nums; }
.ptable__head { display: none; }
.ptable__rows { display: flex; flex-direction: column; gap: 12px; }

/* «Цены · строка» — Карточка (390): фото 350×180 сверху, тело с полями 20/20/24/20, сетка 2×2 (145 + 20 + 145, ряды через 16), кнопка во всю ширину */
.prow { display: flex; flex-direction: column; border-radius: var(--r-l); background: var(--c-bg-milk); overflow: hidden; }
.prow__photo { display: block; height: 180px; }
.prow__photo img { width: 100%; height: 100%; object-fit: cover; }
.prow__name { display: flex; flex-direction: column; gap: 4px; padding: 20px 20px 0; }
.prow__title { margin: 0; font: 400 24px/30px var(--f-serif); color: var(--c-text); }
.prow__feature { margin: 0; font: 400 13px/17px var(--f-sans); color: var(--c-text-2); }
.prow__cells { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 20px; padding: 16px 20px 0; }
.prow__btn { display: flex; margin: 16px 20px 24px; }

/* «Цены · ячейка»: подпись колонки 12/15, значение Prata, подпись 14/20 */
.pcell { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.pcell__col { font: 600 12px/15px var(--f-sans); letter-spacing: 1.8px; text-transform: uppercase; color: var(--c-text-2); }
/* до 375 «от 12 000 ₽» не должно рваться: кегль сжимается вместе с шириной ячейки ((экран − 100) / 2) */
.pcell__val { font: 400 min(24px, calc((100vw - 100px) / 12))/32px var(--f-digits); white-space: nowrap; color: var(--c-text); }
.pcell__note { font: 400 14px/20px var(--f-sans); color: var(--c-text-2); }

/* на карточках 390 подпись «за 3 часа» не нужна (кадры 10.10) */
@media (max-width: 767px) { .pcell--h3 .pcell__note { display: none; } }

.pnote { display: flex; align-items: center; gap: 8px; margin: 0; font: 400 15px/21px var(--f-sans); color: var(--c-text-2); }
.pnote .icon { width: 20px; height: 20px; }

/* 768–1319: «Планшет» — таблица на молочной плашке; строка: фото 96×72, название, кнопка; ниже четыре ячейки */
@media (min-width: 768px) {
  .ptable { padding: 8px 24px 16px; border-radius: var(--r-l); background: var(--c-bg-milk); }
  .ptable__rows { gap: 0; }
  .prow {
    display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 16px;
    padding: 24px 0; border-top: 1px solid var(--c-line); border-radius: 0; background: none; overflow: visible;
  }
  .prow:first-child { border-top: 0; }
  .prow__id { display: flex; align-items: center; gap: 16px; min-width: 0; }
  .prow__photo { flex: none; width: 96px; height: 72px; border-radius: var(--r-s); overflow: hidden; }
  .prow__name { flex: 1; min-width: 0; padding: 0; }
  .prow__feature { font-size: 15px; line-height: 21px; }
  .prow__cells { grid-column: 1 / -1; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; padding: 0; }
  .prow__id { grid-column: 1; grid-row: 1; }
  .prow__btn { display: inline-flex; grid-column: 2; grid-row: 1; margin: 0; }
  .prow__cells { grid-row: 2; }
  .pcell__val { font-size: 18px; line-height: 24px; }
}
/* ≥1320 — «Ряд»: шапка колонок БАНЯ · ГОСТЕЙ · 2 ЧАСА · ДОП. · 3 ЧАСА · ЧАН; колонки 452 / 4×176 / 164 на 1920 */
@media (min-width: 1320px) {
  .ptable { padding: 16px 40px 24px; }
  .ptable__head, .prow { display: grid; grid-template-columns: minmax(0, 1fr) repeat(4, 176px) 164px; gap: 0; } /* ячейки и кнопка как в кадре (176 / 164), «Баня» берёт остаток: 452 на 1920, уже — но ячейки не сжимаются */
  .ptable__head { align-items: center; height: 48px; font: 600 13px/16px var(--f-sans); letter-spacing: 2px; text-transform: uppercase; color: var(--c-text-2); }
  .ptable__head span { min-width: 0; }
  .prow:first-child { border-top: 1px solid var(--c-line); }
  .prow__id { gap: 20px; }
  .prow__cells { display: contents; }
  .prow__id, .prow__btn { grid-column: auto; grid-row: auto; }
  .prow__btn { justify-self: end; }
  .pcell__val { font-size: 24px; line-height: 32px; }
  /* подпись колонки есть в шапке — в ячейке только для чтения с экрана */
  .pcell__col { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}

/* лид блока на всех ширинах 18/26 (в кадрах «Цены»; у «Трёх бань» на 390 — 16/22) */
.pbani .bani__lead, .puslugi .bani__lead { font-size: 18px; line-height: 26px; }

/* ===== «Беседки»: карточка бань без номера и без вместимости (в кадрах слой скрыт); фото 310 на планшете — как у бань (bani.css) ===== */
@media (min-width: 1200px) {
  /* в кадре 1920 фото 704 при ширине карточки 1400: на сайте фото занимает остаток (824), а высота карточки — от текста (404), как в кадре */
  .banya--besedka .banya__photo { position: relative; width: auto; }
  .banya--besedka .banya__photo img { position: absolute; inset: 0; }
}

/* ===== «На компанию»: «Цифры» главной ниже — 285 на 1920 (поля 64, ряд 157), без минимальной высоты 300 ===== */
@media (min-width: 1200px) {
  .cifry--page .cifry__in { min-height: 0; padding-block: 64px; }
}

/* «Декор · шайка» (ТЗ-гравюры-внутренние, п. 6), .45: справа у заголовка; с 1870 в поле (как самовар главной), на 1200–1869 внутри контейнера */
.puslugi__shayka { position: absolute; z-index: -1; right: 4px; top: 0; width: 71px; opacity: .45; pointer-events: none; }
.puslugi__shayka img { width: 100%; height: auto; }
@media (min-width: 768px) { .puslugi__shayka { right: 48px; top: 2px; width: 136px; } }
@media (min-width: 1200px) { .puslugi__shayka { right: max(40px, 50% - 700px); top: 4px; width: 180px; } }
@media (min-width: 1870px) { .puslugi__shayka { right: max(16px, 50% - 880px); width: 220px; } }

/* ===== «Услуги»: «Прайс · группа» — фото, заголовок со значком, строки по 48 ===== */
.pgroups { display: flex; flex-direction: column; gap: 40px; }
.pgroup { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.pgroup__photo { display: block; height: 160px; border-radius: var(--r-m); overflow: hidden; }
.pgroup__photo img { width: 100%; height: 100%; object-fit: cover; }
.pgroup__title { display: flex; align-items: center; gap: 8px; margin: 0; font: 600 17px/22px var(--f-sans); color: var(--c-text); }
.pgroup__title .icon { width: 24px; height: 24px; color: var(--c-sage); }
.price { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 48px; padding: 12px 0; border-bottom: 1px solid var(--c-line); } /* «Прайс · строка» (19.10): промежуток 16, высота по содержимому, не меньше 48; подпись переносится, цена нет */
.price__name { flex: 1; min-width: 0; font: 400 16px/22px var(--f-sans); color: var(--c-text); }
.price__val { flex: none; font: 600 15px/20px var(--f-sans); color: var(--c-text); white-space: nowrap; }
@media (min-width: 768px) {
  .pgroups { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 40px 32px; }
  .pgroup__photo { height: 200px; }
}
@media (min-width: 1320px) {
  .pgroups { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* ===== «Условия»: раскладка «Перед визитом» с двумя столбцами пунктов и одним раскрытым вопросом ===== */
.pusl__in { gap: 32px; }
.pusl__cols { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; }
.pusl__col { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.pusl__coltitle { margin: 0; font: 600 18px/26px var(--f-sans); color: var(--c-text); }
.pusl__list { display: flex; flex-direction: column; gap: 12px; }
.pitem { display: flex; align-items: flex-start; gap: 8px; font: 400 16px/22px var(--f-sans); color: var(--c-text); }
.pitem .icon { width: 28px; height: 28px; }
.pitem span { padding-top: 0; min-width: 0; }
@media (min-width: 768px) {
  .pusl__cols { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 40px; }
}
@media (min-width: 1200px) {
  .pusl__in { grid-template-columns: minmax(0, 1fr) 579px; column-gap: 21px; row-gap: 32px; }
  .pusl__in .vizit__head { grid-column: 1; grid-row: 1; }
  .pusl__cols { grid-column: 1; grid-row: 2; }
  .pusl__faq { grid-column: 1; grid-row: 3; }
  .pusl__in .vizit__photo { grid-column: 2; grid-row: 1 / span 3; }
}