/**
 * @file layout.css — раскладка страницы: контейнер, шапка страницы, ритм секций, сетки 4/3/2/1, «герой».
 * Один контейнер (--ee-container, боковое поле --ee-gutter) для шапки, героя, секций Canvas, заголовков и подвала:
 * левый край текста, логотипа и карточек один и тот же на всех блоках при любой ширине окна.
 * Число колонок сеток — токен --ee-cols (src/theme.css): 1 / 2 / 3 / 4 по ширине окна (48 / 64 / 80 rem).
 * Границы @media (48, 64, 80 rem) — единственные «сырые» числа в CSS: переменные в условиях медиазапросов не работают.
 */
.container, .ee-container { box-sizing: border-box; width: 100%; max-width: var(--ee-container); margin-inline: auto; padding-inline: var(--ee-gutter); }

/* шапка страницы (не Canvas): крошки и заголовок на общей линии контейнера */
.ee-page-head { padding-block: var(--ee-s2) var(--ee-s5); }
.ee-breadcrumb { margin: 0 0 var(--ee-s2); font-size: var(--ee-fs-meta); line-height: var(--ee-lh-meta); }
.ee-breadcrumb ol { display: flex; flex-wrap: wrap; gap: 0 var(--ee-s2); margin: 0; padding: 0; list-style: none; color: var(--muted-foreground); }
.ee-breadcrumb li + li::before { content: "/"; margin-right: var(--ee-s2); color: var(--input); }
.ee-breadcrumb a { color: var(--muted-foreground); }
.ee-breadcrumb a:hover { color: var(--ee-btn-accent); }

/* область содержимого: блоки идут одним контейнером; между блоками — шаг секции */
.region-content { max-width: none; padding-inline: 0; padding-bottom: var(--ee-section-gap); }
.region-content > :not(section):not(.ee-hero) { box-sizing: border-box; max-width: var(--ee-container); margin-inline: auto; padding-inline: var(--ee-gutter); }
.region-content > * + * { margin-top: var(--ee-section-gap); }
.region-content > .ee-actions { margin-top: var(--ee-s5); }
.region-content > .ee-actions + * { margin-top: var(--ee-s5); }
.region-content > :first-child:not(.ee-hero) { margin-top: var(--ee-s5); }
/* блок-витрина (заголовок + представление): заголовок той же ступени H2, отступ под ним общий */
.region-content > [id^="block-"] > h2 { margin: 0 0 var(--ee-gap-heading-after); }
.region-content > [id^="block-"] > .views-element-container { padding: 0; }

/* секция Canvas (компонент «Секция»): контейнер, заголовок секции, сетка по числу колонок */
.ee-section { position: relative; }
.ee-section__bg { position: absolute; inset: 0; z-index: -1; overflow: hidden; }
.ee-section__bg img { width: 100%; height: 100%; object-fit: cover; }
.ee-section[data-bg="primary"] { background: var(--primary); color: var(--primary-foreground); }
.ee-section[data-bg="secondary"] { background: var(--secondary); color: var(--secondary-foreground); }
.ee-section[data-bg="accent"] { background: var(--accent); color: var(--accent-foreground); }
.ee-section[data-bg="muted"] { background: var(--muted); color: var(--muted-foreground); }
.ee-section[data-bg] { padding-block: var(--ee-s6); }
.ee-section__header { margin-bottom: var(--ee-gap-heading-after); }
.ee-section__footer { margin-top: var(--ee-s5); }
.ee-section__grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--ee-s4); min-width: 0; }
.ee-section__grid > * { min-width: 0; }
.region-content > .ee-section + .ee-section { margin-top: var(--ee-section-gap); }
@media (min-width: 48rem) {
  .ee-section__grid { gap: var(--ee-s5); }
  .ee-section__grid[data-cols="50-50"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ee-section__grid[data-cols="33-33-33"] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ee-section__grid[data-cols="75-25"] { grid-template-columns: minmax(0, 3fr) minmax(0, 1fr); }
  .ee-section__grid[data-cols="25-75"] { grid-template-columns: minmax(0, 1fr) minmax(0, 3fr); }
  .ee-section__grid[data-cols="67-33"] { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); }
  .ee-section__grid[data-cols="33-67"] { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); }
  .ee-section__grid[data-cols="50-25-25"] { grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) minmax(0, 1fr); }
  .ee-section__grid[data-cols="25-25-50"] { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) minmax(0, 2fr); }
  .ee-section__grid[data-cols="25-25-25-25"] { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@media (max-width: 47.99rem) {
  .ee-section__grid[data-mobile-cols="2"] { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ee-section__grid[data-mobile-cols="3"] { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* сетка карточек и каталогов: на всю ширину контейнера, колонки — токен --ee-cols */
.ee-grid, .ee-cards .view-content, .views-view-grid.horizontal, .views-view-grid.vertical, .view-content:has(> .views-row), .ee-catalog .ee-cards .view-content {
  display: grid; grid-template-columns: repeat(var(--ee-cols), minmax(0, 1fr)); gap: var(--ee-s4);
}
@media (min-width: 48rem) { .ee-grid, .ee-cards .view-content, .views-view-grid.horizontal, .view-content:has(> .views-row) { gap: var(--ee-s5); } }
.views-view-grid .views-row, .view-content > .views-row, .ee-cards .view-content > .views-row { display: contents; }
/* текстовые карточки (отзывы, вопросы) в четыре колонки получаются узкими и очень высокими: не больше трёх; на телефоне одна */
@media (min-width: 80rem) { .view-reviews-best, .view-reviews-teaser, .view-faq-listing, .view-event-reviews { --ee-cols: 3; } }
@media (max-width: 47.99rem) { .view-reviews-best, .view-reviews-teaser, .view-faq-listing, .view-event-reviews { --ee-cols: 1; } }
/* блоки на всю строку сетки: постраничная навигация и подпись */
.view-content + .pager, .view-content ~ nav.pager { margin-top: var(--ee-s5); }

/* «герой»: промо-блок на всю ширину; текст слева и картинка справа, на телефоне картинка сверху */
.ee-hero { border-bottom: var(--ee-line) solid var(--border); background: linear-gradient(180deg, var(--card), var(--background)); }
.ee-hero__inner { box-sizing: border-box; display: grid; align-items: center; gap: var(--ee-s5); max-width: var(--ee-container); margin-inline: auto; padding: var(--ee-s5) var(--ee-gutter) var(--ee-s6); }
.ee-hero__media { order: -1; }
.ee-hero__media img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; border-radius: var(--ee-radius-card); box-shadow: var(--shadow-lg); }
.ee-hero__text > * { margin: 0; }
.ee-hero__text > * + * { margin-top: var(--ee-gap-para); }
.ee-hero__text :is(h1, h2) { margin-bottom: var(--ee-gap-heading-after); }
.ee-hero__text p { font-size: var(--ee-fs-lead); line-height: var(--ee-lh-lead); color: var(--muted-foreground); max-width: var(--ee-measure); }
.ee-hero__cta { margin-top: var(--ee-s5); }
@media (min-width: 60rem) {
  .ee-hero__inner { grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: var(--ee-s6); padding-block: var(--ee-s6); }
  .ee-hero__media { order: 0; }
}