/* Главная POLEZIUM: то, чего нет в sp.css прототипа. sp.css описывает блоки в утверждённом порядке, а владелец
   переставляет блоки и добавляет свои — отсюда классы отступов под волны и стили «Подборки», «Текста и фото»,
   «Объявления» (эскиз podborka-na-glavnoy.html). Цвета — только токены sp.css. */

/* Капли сверху налезают на блок: отступ, как у «Географии» под фасовкой в прототипе. */
.band.pz-after-drips{padding-top:calc(var(--sec) + 90px)}
/* Под блоком поднимается волна следующего: блокам с коротким низом в прототипе (фасовка, заявка, свои) нужен запас. */
.fas.pz-wave-below,.req.pz-wave-below,.tph.pz-wave-below,.ann.pz-wave-below{padding-bottom:calc(var(--sec) + 92px)}

/* Подборка товаров — эскиз podborka-na-glavnoy.html */
.sel-sec{padding:calc(var(--sec) + 8px) 0 calc(var(--sec) + 92px)}
.sel-grid{display:grid;grid-template-columns:repeat(4, minmax(0, 1fr));gap:20px}
.sel-grid .tile{grid-template-columns:104px minmax(0, 1fr);min-height:216px}
.sel-grid .tile-short{color:var(--moss)}
.sel-foot{margin-top:26px}

/* Текст и фото: фото слева или справа; без фото — один столбец текста */
.tph{padding:calc(var(--sec) + 8px) 0 calc(var(--sec) + 64px)}
.tph-in{display:grid;grid-template-columns:minmax(0, 6fr) minmax(0, 6fr);gap:clamp(32px, 4.5vw, 72px);align-items:center}
.tph-left .tph-pic{order:-1}
.tph-solo{grid-template-columns:minmax(0, 1fr)}
.tph-solo .tph-pic{display:none}
.tph-txt h2{max-width:20ch}
.tph-txt p{margin-top:14px;max-width:60ch;font-size:var(--fs-text);color:var(--moss-2)}
.tph-pic{aspect-ratio:4 / 3;border-radius:var(--r);overflow:hidden}
.tph-pic img{width:100%;height:100%;object-fit:cover}

/* Объявление: одна строка и ссылка. Строка — ступень подзаголовка: заголовком раздела она не является */
.ann{padding:calc(var(--sec) - 16px) 0 calc(var(--sec) - 8px)}
.ann-in{display:flex;flex-wrap:wrap;align-items:baseline;gap:12px 28px}
.ann-t{font-family:var(--font-head);font-size:var(--fs-h3);font-weight:600;color:var(--moss);max-width:60ch}

/* Отфильтрованная плитка не занимает места — и в сетке подборки тоже */
.grid > .tile[hidden],.sel-grid > .tile[hidden]{display:none}

@media (max-width:1180px){
  .sel-grid{grid-template-columns:repeat(2, minmax(0, 1fr))}
}
@media (max-width:900px){
  .tph-in{grid-template-columns:minmax(0, 1fr)}
  .tph-left .tph-pic{order:0}
}
@media (max-width:600px){
  .sel-grid{grid-template-columns:minmax(0, 1fr)}
  .sel-grid .tile{grid-template-columns:96px minmax(0, 1fr);min-height:0}
  .sel-grid .tile-short{display:block}
  /* отступ под каплями на телефоне не уменьшаем: капли той же высоты, и у .geo в прототипе там те же +90px */
}
