/* =====================================================================
   Мобильная версия — общие компоненты (окно 6, 5.11; разбор и решения — docs/design/mobile-redesign-2026-11-05.md, П1).
   Подключается после chrome.css на всех страницах сайта (layout в server/src/web/index.js). ПК (≥ 1024 px) не меняется:
   всё про вид телефона — внутри @media (max-width: 1023px); снаружи — только то, что на ПК выглядит как раньше.
   Компоненты для страниц (П2–П6, окна 17 / 23 / 11): нижняя полоса (.mbar, своё действие — barText / barSub / barHref в layout),
   сетка игр (.m-grid2 + .gtile), ряд с прокруткой пальцем (.m-rail), аккордеон (details.m-acc), свёрнутый текст (details.m-clamp).
   Токены — vendor/aw-tokens.css; движение — transform / opacity, «меньше движения» — без движения.
   ===================================================================== */

/* ---------- Подвал: разделы — <details open>; на ПК раскрыты и не сворачиваются, вид — как был ---------- */
.foot-acc > summary { list-style: none; }
.foot-acc > summary::-webkit-details-marker { display: none; }
@media (min-width: 1024px) { .foot-acc > summary { pointer-events: none; } }

@media (max-width: 1023px) {
    /* ---------- Нижняя полоса: ☰ меню · чат · главное действие страницы — сразу, с первого экрана (бронь и меню ушли из шапки) ---------- */
    .mbar { left: calc(10px + env(safe-area-inset-left)); right: calc(10px + env(safe-area-inset-right)); bottom: calc(4px + env(safe-area-inset-bottom));
        justify-content: flex-start; gap: 8px; padding: 8px; border-radius: 22px; border-color: var(--aw-line-strong); transform: none; }
    .mbar-ic { position: relative; flex: none; width: 52px; height: 52px; display: grid; place-items: center; padding: 0; border-radius: 15px;
        border: 1px solid var(--aw-line); background: var(--aw-surface-3); color: var(--aw-text); cursor: pointer;
        transition: transform var(--aw-dur-fast) var(--aw-ease-spring); }
    .mbar-ic:active { transform: scale(0.94); }
    .mbar-ic:focus-visible, .mbar-go:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
    .mbar-ic svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
    .mbar-chat[hidden] { display: none; }   /* чат клуба выключен — chat.js прячет [data-chat-open] */
    .mbar-chat.is-open::after { content: ''; position: absolute; top: 9px; right: 9px; width: 8px; height: 8px; border-radius: 50%; background: var(--aw-ok); box-shadow: 0 0 0 2px #1f1f22; }
    .mbar-n { position: absolute; top: -6px; right: -6px; min-width: 22px; height: 22px; padding: 0 6px; display: grid; place-items: center; border-radius: 11px;
        background: #fff; color: var(--aw-accent); font: 700 0.72rem var(--aw-font-mono); }
    .mbar-n[hidden] { display: none; }
    .mbar-go { flex: 1; min-width: 0; height: 52px; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 0 7px 0 16px;
        border-radius: 15px; background: var(--aw-accent); color: #fff; box-shadow: var(--aw-shadow-accent); transition: transform var(--aw-dur-fast) var(--aw-ease-spring); }
    .mbar-go:active { transform: scale(0.97); }
    .mbar-go .mbar-txt { min-width: 0; font-size: 0.76rem; color: rgba(255, 255, 255, 0.86); }
    .mbar-go .mbar-txt b { color: #fff; font-size: 1rem; }
    .mbar-go .ic { flex: none; width: 38px; height: 38px; display: grid; place-items: center; border-radius: 11px; background: rgba(0, 0, 0, 0.18); }
    .mbar-go .ic svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
    .lite .mbar { background: rgba(14, 14, 17, 0.96); }

    /* там, где есть полоса, плавающая кнопка чата не нужна — чат в полосе (было: две красные кнопки друг над другом) */
    body:has(#bookForm) .chat-fab .chat-fab-dot { position: absolute; top: 10px; right: 10px; }   /* на брони кнопка — круглая иконка (site.css): точка «открыто» внутри круга */
    body:has(.mbar:not(.is-off)) .chat-fab { display: none; }
    /* полоса ушла (barHide: на экране форма со своим итогом) — кнопка чата круглой иконкой, chat.js поднимает её над итогом */
    .mbar.is-off { transform: translateY(calc(100% + 24px)); pointer-events: none; }
    body:has(.mbar.is-off) .chat-fab { padding: 0; width: 52px; justify-content: center; }
    body:has(.mbar.is-off) .chat-fab-t { display: none; }
    body:has(.mbar.is-off) .chat-fab .chat-fab-dot { position: absolute; top: 10px; right: 10px; }

    /* ---------- Шапка: логотип, язык и ☰ меню справа (владелец 6.11: «кнопка меню интуитивно ищется сверху» — раньше ☰ был в полосе);
       «Reservar» — в полосе. Меню — на весь экран сверху (chrome.css dialog.msheet), крестик — на месте ☰ ---------- */
    body:has(.mbar) .nav-right > .btn-sm { display: none; }
    .nav-burger { display: grid; place-items: center; }
    .nav-right .nav-burger { width: 44px; height: 44px; }   /* цель ≥ 44 px и на 320 (chrome.css до 359 px уменьшает иконки шапки до 38) */
    .nav-burger:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
    dialog.msheet .sheet-x { top: calc(20px + env(safe-area-inset-top)); right: 20px; width: 44px; height: 44px; }
    body:has(.mbar) .nav-right .lang { display: flex; }
    @media (max-width: 359px) { body:has(.mbar) .nav-right .lang { display: none; } }   /* 320: логотип и язык не помещаются — язык в меню */
    body:has(#bookForm) .nav-right > .btn-sm { display: none; }   /* на самой брони «Reservar» в шапке лишний */
    .nav-ico { width: 44px; height: 44px; }   /* цели ≥ 44 px (было 38–42) */
    .nav-right .btn-sm { min-height: 44px; }
    .nav-right .lang a { min-width: 40px; min-height: 38px; }

    /* ---------- Подвал: разделы свёрнуты (site.js), ссылки по 44 px; бронь — в полосе ---------- */
    .foot { padding-bottom: calc(104px + env(safe-area-inset-bottom)); }
    /* .foot-перед классом: pages.css (подключён в конце страницы) задаёт телефону две колонки подвала — разделы здесь во всю ширину */
    .foot .foot-grid { grid-template-columns: minmax(0, 1fr); gap: 8px; }
    .foot .foot-contact .foot-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    @media (max-width: 359px) { .foot .foot-contact .foot-list { grid-template-columns: minmax(0, 1fr); } }
    .foot-brand { max-width: none; margin-bottom: 8px; }
    body:has(.mbar) .foot-brand > .btn { display: none; }
    .foot-acc { border: 1px solid var(--aw-line); border-radius: var(--aw-radius-md); background: var(--aw-surface-1); }
    .foot-acc > summary { min-height: 52px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0 14px 0 16px; cursor: pointer; }
    .foot-acc > summary h3 { margin: 0; }
    .foot-acc > summary::after { content: '+'; flex: none; width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%;
        background: var(--aw-surface-3); color: var(--aw-accent-soft); font: 500 1.1rem/1 var(--aw-font-mono); }
    .foot-acc[open] > summary::after { content: '−'; }
    .foot-acc > nav { padding: 0 16px 8px; }
    .foot-acc > .foot-list { padding: 0 16px 14px; margin: 0; }
    .foot nav a { min-height: 44px; display: flex; align-items: center; padding: 0; }
    .foot-list a { display: inline-flex; align-items: center; min-height: 44px; max-width: 100%; overflow-wrap: anywhere; }   /* длинная почта переносится, а не раздвигает подвал */
    .foot-legal nav a, .foot-legal .foot-cookies { min-height: 44px; display: inline-flex; align-items: center; }

    /* ---------- Чат на весь экран: поля 16 px (iOS не приближает страницу), вырез и полоска «домой» ---------- */
    .chat-in, .chat-away input { font-size: 16px; }
    .chat-panel { padding-top: env(safe-area-inset-top); padding-bottom: env(safe-area-inset-bottom); }
}

/* =====================================================================
   Компоненты для страниц (П2–П6). Разметка — в комментариях; вид на ПК задаёт сама страница.
   ===================================================================== */

/* Сетка игр — /juegos, направления, бронь, подарок (решение 5.11, развилка 2.1): 2 колонки на телефоне, 3 на планшете.
   <div class="m-grid2"><a class="gtile" href="…"><span class="gtile-img"><img …></span>
     <span class="gtile-in"><b>Base Estelar</b><small>2–7 · 10+</small><span class="gtile-price">desde 23 €</span></span></a>…</div>
   Выбранная (бронь, подарок): .gtile.is-on или aria-pressed="true" / aria-checked="true" */
@media (max-width: 1023px) {
    .m-grid2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .gtile { position: relative; display: grid; align-content: start; overflow: hidden; border-radius: var(--aw-radius-lg); border: 1px solid var(--aw-line);
        background: var(--aw-surface-2); color: var(--aw-text); text-align: left; transition: transform var(--aw-dur-fast) var(--aw-ease-spring), border-color var(--aw-dur-fast) var(--aw-ease-out); }
    .gtile:active { transform: scale(0.98); }
    .gtile-img { display: block; aspect-ratio: 4 / 3; overflow: hidden; background: var(--aw-surface-3); }
    .gtile-img img { width: 100%; height: 100%; object-fit: cover; }
    .gtile-in { display: grid; gap: 2px; padding: 9px 10px 11px; }
    .gtile-in b { font-size: 0.95rem; line-height: 1.2; font-weight: 700; }
    .gtile-in small { font: 500 0.75rem var(--aw-font-mono); color: var(--aw-text-muted); }
    .gtile-price { font: 600 0.8rem var(--aw-font-mono); color: var(--aw-accent-soft); }
    .gtile:is(.is-on, [aria-pressed="true"], [aria-checked="true"]) { border: 2px solid var(--aw-accent); box-shadow: 0 0 0 4px var(--aw-accent-10); }
}
@media (min-width: 768px) and (max-width: 1023px) { .m-grid2 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* Ряд с прокруткой пальцем вместо каруселей со стрелками: край следующей карточки виден, страница вбок не едет.
   <div class="m-rail"><article>…</article>…</div> — ширину карточки задаёт страница (например, 72vw) */
@media (max-width: 1023px) {
    .m-rail { display: flex; gap: 12px; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; scrollbar-width: none;
        margin: 0 calc(-1 * var(--aw-gutter)); padding: 0 var(--aw-gutter) 4px; scroll-padding-inline: var(--aw-gutter); }
    .m-rail::-webkit-scrollbar { display: none; }
    .m-rail > * { flex: none; scroll-snap-align: start; }
}

/* Аккордеон (FAQ «3 и все», условия, способы добраться): <details class="m-acc"><summary>Вопрос</summary><div>Ответ</div></details>.
   Ответ остаётся в разметке — для SEO. На ПК — тот же вид (страница может переопределить). */
details.m-acc { border: 1px solid var(--aw-line); border-radius: var(--aw-radius-md); background: var(--aw-surface-1); }
details.m-acc + details.m-acc { margin-top: 8px; }
details.m-acc > summary { list-style: none; min-height: 56px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 14px 12px 16px; font-weight: 600; cursor: pointer; }
details.m-acc > summary::-webkit-details-marker { display: none; }
details.m-acc > summary::after { content: '+'; flex: none; width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%;
    background: var(--aw-surface-3); color: var(--aw-accent-soft); font: 500 1.1rem/1 var(--aw-font-mono); }
details.m-acc[open] > summary::after { content: '−'; }
details.m-acc > :not(summary) { padding: 0 16px 16px; color: var(--aw-text-muted); }

/* Длинный SEO-абзац на телефоне — 3 строки и «Leer más» (решение 5.11: тексты не удаляем, сворачиваем):
   <details class="m-clamp"><summary><span>Весь текст…</span><b>Leer más</b></summary></details>. На ПК — текст целиком, без «Leer más». */
details.m-clamp > summary { list-style: none; }
details.m-clamp > summary::-webkit-details-marker { display: none; }
details.m-clamp > summary > b { display: none; }
@media (max-width: 1023px) {
    details.m-clamp > summary { cursor: pointer; }
    details.m-clamp:not([open]) > summary > span { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
    details.m-clamp:not([open]) > summary > b { display: inline-flex; align-items: center; min-height: 44px; color: var(--aw-text); font-weight: 600; }
}
@media (min-width: 1024px) { details.m-clamp > summary { pointer-events: none; } }

/* =====================================================================
   П3 — главная и общий «хвост» страниц (окно 6, 5.11; макет 01-home.html, решения 6.1 и 7.1)
   ===================================================================== */
.faq-more[hidden], .h4-chips, .m-place { display: none; }   /* ПК: ничего из этого нет */
@media (max-width: 1023px) {
    /* первый экран: фото арены во всю ширину → заголовок → факты чипами → 4 направления сеткой 2×2 (было: 2,5 экрана карточек) */
    .hero4 { padding-top: calc(80px + var(--aw-space-5)); }   /* без фото арены (владелец 6.11): под шапкой (низ — 80 px) отступ --aw-space-5 */
    @media (max-width: 359px) { .hero4 { padding-top: calc(74px + var(--aw-space-5)); } }   /* 320: шапка ниже на 6 px */
    .h4-kicker { font-size: 0.66rem; letter-spacing: 0.12em; text-wrap: balance; }
    .h4-head { margin-bottom: 14px; }
    .h4-chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; list-style: none; margin: 0 0 18px; padding: 0; }
    .h4-chips li { min-height: 36px; display: inline-flex; align-items: center; gap: 6px; padding: 0 12px; border-radius: var(--aw-radius-pill);
        background: var(--aw-surface-2); border: 1px solid var(--aw-line-strong); font-size: 0.82rem; color: var(--aw-text-muted); }
    .h4-chips b { font-family: var(--aw-font-mono); font-weight: 600; color: var(--aw-text); }
    .cards4 { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .card4 { aspect-ratio: 4 / 5; border-radius: var(--aw-radius-lg); }
    .card4-body { padding: 12px; gap: 3px; }
    .card4-kicker { display: none; }
    .card4-title { font-size: 1.2rem; }
    .card4-sub { font-size: 0.78rem; line-height: 1.3; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
    .card4-cta { display: none; }
    .card4-go { top: 10px; right: 10px; width: 36px; height: 36px; }
    /* цифры «почему мы» — уже чипами на первом экране */
    #por-que .stats { display: none; }
    #por-que .reel-wrap { margin-top: 0; }
    /* «Qué es» / «Para quién»: фото ниже ростом */
    .duo { gap: 18px; }
    .duo-img { aspect-ratio: 16 / 10; border-radius: var(--aw-radius-xl); }
    /* FAQ: 3 вопроса и «Ver las N preguntas» (site.js) */
    .faq.is-cut > details:nth-child(n+4) { display: none; }
    .faq-more:not([hidden]) { display: flex; width: 100%; max-width: 860px; margin: -16px auto 32px; justify-content: center; }
    /* «хвост»: карточка места вместо «¿Listos para entrar en otro mundo?» — бронь уже в нижней полосе */
    body:has(.m-place) #reservar { display: none; }
    .m-place { display: block; margin-top: var(--aw-space-7); }
    .m-place-in { display: grid; gap: 10px; padding: 20px 18px; border-radius: var(--aw-radius-xl); background: var(--aw-surface-2); border: 1px solid var(--aw-line); }
    .m-place-addr { margin: 0; display: grid; gap: 2px; font-size: 1rem; color: var(--aw-text); }
    .m-place-addr span:first-child { font-family: var(--aw-font-display); font-weight: 600; font-size: 1.2rem; }
    .m-place-hours { margin: 0; font-size: 0.86rem; color: var(--aw-text-muted); }
    .m-place-cta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 6px; }
    .m-place-cta .btn { justify-content: center; padding-left: 12px; padding-right: 12px; }
    .m-place-cta .btn .ic { display: none; }
}
@media (min-width: 768px) and (max-width: 1023px) { .card4 { aspect-ratio: 4 / 3; } }

/* ---------- Цели нажатия ≥ 44 px (общая проверка после всех пачек, 5.11): логотип, язык, «Leer más», ссылки-названия игр, «Ver en Google» ----------
   Где вёрстка не должна сдвигаться — зона нажатия растёт отступом, а такой же отрицательный внешний отступ её компенсирует */
@media (max-width: 1023px) {
    .nav .nav-logo { min-height: 44px; }
    .nav-right .lang a { min-height: 44px; min-width: 44px; }
    .review-more, .igd-open, .igd-sound { min-height: 44px; }
    main .btn-sm { min-height: 44px; }
    .review figcaption a, .ask-alt a { display: inline-block; padding: 13px 6px; margin: -13px -6px; }
    main :is(h3, td, .dv-name) > a { display: inline-block; padding-block: 13px; margin-block: -13px; }
}

/* Бронь на телефоне: закреплённая внизу панель итога (владелец 6.11, iPhone Safari: «панель перекрывает форму, под ней просвечивает текст»).
   1) Фон — сплошной: стекло (--aw-glass, 40 %) с размытием просвечивало, особенно нижний отступ под safe-area — он уходит под плашку Safari.
   2) Поле при фокусе встаёт выше панели (запас прокрутки ≈ высота панели + safe-area), а не прямо под неё.
   3) Пока печатают (фокус в текстовом поле — открыта клавиатура), панель уезжает вниз и не закрывает поле; вернулась — как была.
   #bookForm — сильнее правил .book .summary в book-m.css; только transform и opacity, место панели не меняется (без сдвигов) */
@media (max-width: 1023px) {
    #bookForm .summary { background: #101013; -webkit-backdrop-filter: none; backdrop-filter: none; box-shadow: 0 -14px 30px -18px rgba(0, 0, 0, 0.9);
        transition: transform var(--aw-dur-base) var(--aw-ease-out), opacity var(--aw-dur-base) var(--aw-ease-out); }
    #bookForm :is(input, textarea, select, .chk, .fld-err) { scroll-margin-bottom: calc(150px + env(safe-area-inset-bottom)); }
    #bookForm:has(:is(input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]), textarea):focus) .summary {
        transform: translateY(calc(100% + 16px)); opacity: 0; pointer-events: none; }

    /* iOS 26 Safari (html.ios-float, vt.js): плавающие кнопки Safari уже подняли низ страницы — без второй добавки safe-area: нижняя полоса
       у самого низа видимой области, у итога брони снизу обычный отступ (раньше — пустая полоса ~34 px над строкой адреса) */
    .ios-float .mbar { bottom: 12px; }
    /* итоги брони и подарка — карточкой, скруглённой со всех сторон, чуть выше низа экрана и с отступом до следующего раздела
       (владелец 6.11, подарок: «такие блоки же круглые полностью» — низ был ровным: скругление только сверху, вплотную к краю).
       Сильнее правил book-m.css и gift-buy.css (окно 17): только вид, логика та же */
    #bookForm .summary, .gb-side > .gb-sum.gb-sum { bottom: calc(8px + env(safe-area-inset-bottom)); margin-inline: 0; margin-bottom: 16px;
        padding-bottom: 12px; border: 1px solid var(--aw-line-strong); border-radius: var(--aw-radius-xl); }
    .ios-float :is(#bookForm .summary, .gb-side > .gb-sum.gb-sum) { bottom: 8px; }
    .ios-float #bookForm .summary { padding-bottom: 12px; }
}

@media (prefers-reduced-motion: reduce) {
    .mbar-ic, .mbar-go, .gtile, #bookForm .summary { transition: none; }
    .mbar-ic:active, .mbar-go:active, .gtile:active { transform: none; }
}

/* Кнопка чата уходит вправо за край, пока лежит на поле формы или идёт ввод (chat.js keepClear → .is-away; владелец 6.11) */
.chat-fab { transition: transform var(--aw-dur-base) var(--aw-ease-out), opacity var(--aw-dur-base) var(--aw-ease-out); }
.chat-fab.is-away { transform: translateX(calc(100% + 28px)); opacity: 0; pointer-events: none; }
@media (prefers-reduced-motion: reduce) { .chat-fab { transition: none; } }
.sheet-in:focus { outline: none; }   /* окно в фокусе после касания (site.js openSheet) — без рамки; пункты — со своей */

/* ---------- Читаемость телефона (владелец 6.11: «много очень на телефоне нечитаемого текста»; окно 6 — аудит 320–430, оба клуба).
   Основной текст — не меньше 16 px и межстрочный ≥ 1,5; подписи и метки — не меньше 13 px; второстепенный серый — muted (поднят в токенах до 64 %,
   ≥ 4,5 : 1 на свечении); текст на фото — с затемнением под ним. Только размеры, цвет и подложки, вёрстка блоков та же.
   :root в начале — сильнее стилей страниц (directions.css, juegos-hero.css, book-m.css подключаются после этого файла) ---------- */
@media (max-width: 1023px) {
    :root { --aw-fs-xs: 0.8125rem; --aw-fs-sm: 0.9375rem; }   /* 13 и 15 px на телефоне (на ПК — прежние 0,72 / 0,85 rem) */
    /* основной текст */
    :root :is(.h4-lead, .foot-brand p) { font-size: 1rem; line-height: 1.55; }
    :root :is(.m-place-hours, .ask-alt, .price-unit, .dv-hook, main p.hint) { font-size: 0.9375rem; line-height: 1.5; }
    /* описание в карточке игры (2 колонки) — второстепенное, 14 px; html — сильнее правил сеток в directions.css (окно 23, 0,8 rem) */
    html:root main :is(.ev-grid, .aud-grid, .m-grid2, .game-grid) .game-body p, :root .game-body p { font-size: 0.875rem; line-height: 1.5; }
    :root .ilist p { font-size: 1rem; line-height: 1.55; }   /* пункты списков с иконками — основной текст */
    :root .gb-side > .gb-sum > .hint { font-size: 0.8125rem; }   /* «27 € por persona» в итоге подарка */
    /* подписи, метки, цифры — от 13 px */
    :root .mbar-go .mbar-txt { font-size: 0.8125rem; color: #fff; }   /* «45 min · desde N €» на красной кнопке — белый, не 86 % */
    :root :is(.foot h3, .eyebrow, .price-meta, .tags .tag, .tag, .gstage-kick, .dv-meta, .foot-pay, .foot-list span, .gtile-in small, .gtile-price, .dv-tier small,
        .gb-lbl, .kid-more, main th, .pv-step-n, .hs-games .gopt .gmeta, .gopt .gmeta, .gopt .gprice, .dcal-s small, .dcal-s i, .nav-right .lang a, .msheet .lang a) { font-size: 0.8125rem; }
    :root :is(.card4-sub, .h4-chips li) { font-size: 0.875rem; }
    :root :is(.top-badge, .dv-n, .bstep legend .mono) { font-size: 0.75rem; }   /* цифры в кружках и бейджи на фото — 12 px, места под них не больше */
    :root .foot-list span { color: var(--aw-text-muted); }   /* подписи «Instagram», «WhatsApp» в подвале были почти невидимы (faint, 28 %) */
    :root .foot-brand p { color: var(--aw-text-soft); }   /* текст о клубе в подвале — читаемый, не подпись */
    :root :is(.gopt .gmeta, .hs-games .gopt .gmeta) { background: rgba(0, 0, 0, 0.72); }   /* «6–12» на фото плитки брони — плотнее подложка (было 55 %, 2,6 : 1 на светлом кадре) */
    /* текст на фото — затемнение под ним */
    :root .sx-intro-media::after { background: linear-gradient(180deg, rgba(10, 10, 12, 0.35), rgba(10, 10, 12, 0.72) 55%, rgba(10, 10, 12, 0.82)); }
    :root .card4::before { background: linear-gradient(180deg, rgba(5, 5, 7, 0) 30%, rgba(5, 5, 7, 0.55) 58%, rgba(5, 5, 7, 0.92)); }
}

/* ---------- Окно 6, 11.11 (владелец, iPhone: «кнопка Reservar чёт высоко очень»; «за кнопкой идёт красный фон… а так серая страница») ----------
   Нижняя плашка — без своей подложки во всю ширину: только кнопки «💬» и «Reservar» поверх страницы (у каждой свой фон и тень);
   без подложки и её отступа 8 px кнопки стоят ниже; на iOS 26 (плавающая панель Safari, html.ios-float) — 8 px над панелью.
   Свечение «Reservar» — тень потише, без красного пятна на странице. ПК (≥ 1024) — плашки нет, как было */
@media (max-width: 1023px) {
    .mbar { padding: 0; background: none; border: 0; border-radius: 0; -webkit-backdrop-filter: none; backdrop-filter: none; box-shadow: none; }
    .mbar-ic { background: rgba(22, 22, 26, 0.94); border-color: var(--aw-line-strong); box-shadow: 0 8px 22px -10px rgba(0, 0, 0, 0.85); }
    .mbar-go { box-shadow: 0 10px 24px -12px rgba(0, 0, 0, 0.8), 0 6px 18px -12px rgba(255, 59, 78, 0.45); }
    /* Владелец 11.11: «Надо её ниже опустить» — вплотную к панели Safari. Панель свёрнута и страница дошла до низа экрана (html.ios-bar-min, vt.js) — над полоской «домой» */
    .ios-float .mbar { bottom: 2px; }
    .ios-float.ios-bar-min .mbar { bottom: calc(2px + env(safe-area-inset-bottom)); }
}
/* Отзывы на телефоне (владелец 11.11: «карточка очень высокая и почти пустая», «ниже пустой экран»): в ленте каждая карточка — по своему
   тексту, а не по самой длинной (с фото); автор — сразу под текстом, без пустоты до низа */
@media (max-width: 767px) {
    .reviews { align-items: flex-start; }
    .review .core { height: auto; min-height: 168px; }
}

/* ---------- Пустоты между блоками на телефоне (окно 35, 11.11; владелец: «найти свободные места на телефоне и поудалять»). ПК (≥ 1024 px) не меняется.
   :root — против pages.css, он подключён после этого файла ---------- */
@media (max-width: 1023px) {
    :root .ev-final { padding-top: 0; }             /* «Ver las 8 preguntas» → «¿Organizamos tu evento?»: было 32 + 48 + 64 = 144 px, стало 32 */
    :root .ev-final .final { margin-top: 0; }
    :root .final { padding: 44px 20px; }            /* внутри карточки сверху и снизу было по 72 px */
    :root .foot { margin-top: 32px; padding-top: 24px; }   /* перед подвалом было 96 + 64 = 160 px */
    body:has(.book) .foot { margin-top: 16px; }     /* бронь: у итога уже есть свой нижний отступ 16 px */
    :root .foot-legal { margin-top: 20px; padding-top: 16px; }
    body:has(.book) .foot-legal { margin-top: 0; padding-top: 0; border-top: 0; }   /* в подвале брони только эта строка: вторая линия и отступ не нужны */
}