/* ==========================================================================
   ПЕРЕПЛЁТ · Frames — попиксельная геометрия дизайнерских экранов Figma
   (Desktop-31 «Квизы», Desktop-7 «Реквизит», Desktop-23 «С вас — с нас»,
   Desktop-28/29 «Дела», Desktop-10 «Форма»).
   Единица 1u = 1px фрейма 1440 (--u в tokens.css). На экранах ≥1440 — 1:1 и
   по центру, 900…1440 — пропорционально, ниже 900 — мобильная раскладка из
   blocks.css. Минимальный кегль на странице — 12px. Подключается ПОСЛЕ blocks.css и переопределяет его.
   ========================================================================== */

/* Кадр макета: 1440u по центру; дети позиционируются в u от левого края кадра */
.frame {
  position: relative;
  width: calc(1440 * var(--u));
  max-width: 100%;
  margin-inline: auto;
}
/* Шрифт в единицах макета, но не мельче 12px (решение 08.09) */
.u10 { font-size: var(--fs-caption); }
.u12 { font-size: var(--fs-caption); }
.u13 { font-size: max(12px, calc(13 * var(--u))); }

@media (min-width: 900px) {

  /* Правка 10.09: текст под заголовком идёт во всю ширину блока — там, где
     блок одноколоночный. В двухколоночных (авторы, FAQ) ширину задаёт колонка,
     поэтому отдельных ограничений на .lead больше не нужно. */
  .section__head .lead, .cta-band .lead { max-width: none; }

  /* ==========================================================
     FRESH · Desktop-31. Заголовок 82, подзаголовки 48 (x=122 и 730),
     тексты 292u/13px, фото: (71.5,629.7) 457×324 · (512.5,589) 481×385 · (909.5,639.7) 459×352.
     ========================================================== */
  /* Правка 13.09: полароиды упирались в ленту следующей секции — даём низу воздух. */
  .fresh { padding-bottom: calc(44 * var(--u)); overflow: hidden; }
  /* max-width снят: он резал H2 до 914u, заголовок не доходил до правого края
     (замечание 10.09). Ограничение осталось только на лиде — строкой ниже. */
  .fresh .section__head { margin-bottom: calc(54 * var(--u)); }
  .fresh .section__head .lead { margin-top: calc(12 * var(--u)); }
  .fresh__grid {
    grid-template-columns: calc(608 * var(--u)) 1fr;
    gap: calc(28 * var(--u)) 0;
    max-width: none;
  }
  .fresh__item h3 { font-size: var(--fs-h3-lg); margin-bottom: calc(8 * var(--u)); line-height: var(--lh-display-lg); }
  .fresh__item p { max-width: min(100%, var(--fresh-copy-w, 22rem)); font-size: var(--fs-small); }
  /* три фото одной ширины по сетке текста: 122…1318u, по 384u с зазором 22u */
  .fresh__stage {
    height: calc(340 * var(--u));
    margin-top: calc(12 * var(--u));
    display: block;
  }
  .fresh__photo { position: absolute; margin: 0; width: calc(384 * var(--u)); }
  .fresh__photo--1 { left: calc(122 * var(--u)); top: calc(24 * var(--u)); transform: rotate(-3deg); z-index: 1; }
  .fresh__photo--2 { left: calc(528 * var(--u)); top: 0; padding: calc(10 * var(--u)) calc(10 * var(--u)) calc(12 * var(--u)); transform: rotate(2deg); z-index: 2; }
  .fresh__photo--2 img { aspect-ratio: 364 / 268; }
  .fresh__photo--3 { left: calc(934 * var(--u)); top: calc(24 * var(--u)); transform: rotate(3deg); z-index: 1; }
  .fresh__photo--1 img, .fresh__photo--3 img { aspect-ratio: 384 / 270; object-fit: cover; }
  .fresh__photo:hover { transform: rotate(0) scale(1.02); z-index: 3; }

  /* ==========================================================
     MECHANICS · Desktop-7. Ящики 309×411u, первый в x=122 y=271, шаг 316.
     Дворецкий 446×460u в точке (-223, 251). Подпись: заголовок 32 в (44u, 292u),
     текст 10px шириной ~200u.
     ========================================================== */
  .mechanics__stage {
    --crate-w: calc(309 * var(--u));
    --crate-h: calc(385 * var(--u));
    --track-left: min(max(var(--gutter), calc(50vw - var(--container) / 2)), calc(122 * var(--u)));
  }
  /* дворецкий лежит внутри ленты и уезжает вместе с первым ящиком */
  /* Перчатки обхватывают ящик снаружи: размах перчаток (строки 58…867 в butler.webp)
     = высота ящика + 20u, по 10u выше верхнего и ниже нижнего края (правка 09.09). */
  .mechanics__butler {
    left: calc(var(--track-left) - 400 * var(--u));
    top: calc(-9 * var(--u));
    width: calc(451 * var(--u));
  }
  .mechanics__track {
    gap: calc(8 * var(--u));
    padding: calc(30 * var(--u)) var(--gutter) calc(60 * var(--u)) var(--track-left);
    scroll-padding-left: var(--track-left);
  }
  .mechanics__track .crate { width: var(--crate-w); }
  .mechanics__track .crate__box { height: var(--crate-h); aspect-ratio: auto; }
  .crate__img { object-fit: fill; }
  /* Подпись под ящиком, а не поверх улик (решение 08.09) */
  .crate__label { padding: calc(14 * var(--u)) 0 0; width: 82%; margin-inline: auto; }
  .crate__label h4 { font-size: var(--fs-h4); margin-bottom: calc(6 * var(--u)); }
  .crate__label p { font-size: var(--fs-small); line-height: var(--lh-compact); max-width: none; }
  .mechanics .section__foot { margin-top: calc(30 * var(--u)); }

  /* ==========================================================
     TURNKEY · Desktop-23. Карточки 321 / 376 / 660u × 268u в x=115/461/862,
     зазоры 25u; третья уходит за правый край кадра (как во фрейме).
     ========================================================== */
  .turnkey { overflow: hidden; }
  /* Правка 10.09: было 321/376/660u — сумма 1407u при кадре 1200u, и третья
     карточка уезжала за правый край экрана. Те же пропорции, но во fr: блок
     вписан в контейнер, соотношение карточек сохранено. */
  .turnkey__grid {
    grid-template-columns: 321fr 376fr 660fr;
    gap: calc(25 * var(--u));
    margin-left: 0;
  }
  .turnkey__card { min-height: calc(268 * var(--u)); padding: calc(19 * var(--u)) calc(10 * var(--u)) calc(18 * var(--u)); }
  .turnkey__card-head { padding-bottom: calc(6 * var(--u)); margin-bottom: calc(22 * var(--u)); border-bottom-color: rgba(255, 255, 255, 0.7); }
  .turnkey__card-head .kicker { font-size: var(--fs-caption); letter-spacing: 0.06em; }
  .turnkey__card-head .num-plain { font-size: var(--fs-h3); }
  .turnkey__card .checklist { gap: calc(16 * var(--u)); }
  .turnkey__card .checklist li { font-size: var(--fs-small); line-height: var(--lh-compact); gap: calc(14 * var(--u)); }
  .turnkey__card .checklist__box { width: calc(21 * var(--u)); height: calc(21 * var(--u)); margin-top: 0; }
  .turnkey__card .checklist__box--checked::after { width: calc(26 * var(--u)); height: calc(26 * var(--u)); left: calc(-3 * var(--u)); top: calc(-9 * var(--u)); }
  .checklist--2col { grid-template-columns: calc(192 * var(--u)) 1fr; column-gap: 0; }
  .turnkey__card--photo { padding: calc(19 * var(--u)) calc(16 * var(--u)); }
  .turnkey__card--photo h3 { font-size: var(--fs-h3); line-height: var(--lh-display); margin-bottom: calc(6 * var(--u)); }
  .turnkey__card--photo .small { font-size: var(--fs-small); max-width: none; margin-bottom: calc(14 * var(--u)); }
  /* Карточка теперь во fr и уже, чем 660u из макета, поэтому композиция
     внутри задана в процентах от неё — пропорции макета сохраняются
     на любой ширине (правка 10.09). */
  /* Правка 13.09: карточка «Столько реквизита» — один широкий кадр фургона
     во всю ширину карточки, без подложек и рамок. */
  .turnkey__photos--van { margin-top: calc(16 * var(--u)); }
  .turnkey__photos--van img { aspect-ratio: 628 / 240; }
  .turnkey__note { margin-top: calc(24 * var(--u)); font-size: var(--fs-small); }

  /* ==========================================================
     CASES · Desktop-28/29. Карточка = polaroid.webp 432×539u, x=87/502/917.
     Фото (53,56) 322×245u; «Индия» 48px в (56,337); текст 13px 293u в (59,391);
     маркер 213×35u в (13,450).
     ========================================================== */
  .cases .section__head .lead { }
  .cases__grid {
    display: flex;
    gap: 0;
    margin-left: calc(-35 * var(--u));
  }
  .case { width: calc(432 * var(--u)); height: calc(539 * var(--u)); flex: 0 0 auto; }
  .case + .case { margin-left: calc(-17 * var(--u)); }
  .case__front {
    display: block;
    padding: 0;
    color: var(--ink-900);
    background: url("../assets/ui/polaroid-frame.webp") no-repeat center / 100% 100%;
    box-shadow: none;
  }
  /* Правка 10.09: оборот тоже стоял на polaroid-frame.webp, а в этой картинке
     серое окно снимка вшито — после переворота текст ложился поверх него.
     Оборот теперь просто лист бумаги, вписанный ровно в бумагу лицевой стороны
     (её границы сняты с альфы картинки: 4.69/2.56/2.97/5.48 %). */
  .case__back {
    display: block;
    color: var(--ink-900);
    background: none;
    background-color: #f6f5f2;
    background-image: var(--paper-texture);
    background-size: 180px 180px;
    box-shadow: none;
    inset: 2.56% 2.97% 5.48% 4.69%;
  }
  .case__body--back { padding: calc(22 * var(--u)) calc(24 * var(--u)) calc(18 * var(--u)); gap: calc(6 * var(--u)); }
  .case__back .kicker, .case__back .muted { color: var(--paper-fg-muted); }
  /* Правка 10.09: снимок был меньше окна, вырезанного в polaroid-frame.webp,
     и по краям торчала серая полоса — она и читалась как «обводка».
     Координаты сняты с самой картинки: окно 46/44u, 349x257u. */
  /* Доли от полароида 432×539, не от --u: иначе на 900–1279 карточка
     растягивается в сетке, а окно снимка остаётся мелким в углу. */
  .case__img {
    position: absolute;
    left: 10.65%; top: 8.16%;
    width: 80.79%; height: 47.68%;
    margin: 0;
    aspect-ratio: auto;
  }
  /* Загиб .curl на десктопе лезет с поля полароида на снимок — белый
     треугольник в углу фото. У рамки polaroid-frame.webp угол и так ровный. */
  .case .curl::before, .case .curl::after { content: none; }
  .case__stub-text { font-size: var(--fs-caption); }
  .case__title { position: absolute; left: 12.96%; top: 62.52%; font-size: var(--fs-h3-lg); line-height: var(--lh-display-lg); }
  .case__desc { position: absolute; left: 13.66%; top: 72.54%; width: 67.82%; font-size: var(--fs-small); line-height: var(--lh-compact); }
  /* Ширина у самой .case__link: иначе 57.4% у кнопки считается от shrink-wrap
     родителя (~85px), жёлтая плашка короче текста. В Safari ещё хуже. */
  .case__link { position: absolute; left: 3.01%; top: 83.49%; width: 57.4%; }
  /* Текст в плашке прижат влево с явным отступом: justify-content на <button>
     Safari игнорирует, поэтому позицию задаём паддингом (замечание 09.09). */
  .case__link .marker-link {
    width: 100%; min-height: calc(35 * var(--u)); white-space: nowrap;
    margin-left: 0;
    padding: 0 8% 0 4.2%;
    display: inline-flex; align-items: center; justify-content: flex-start;
    font-size: var(--fs-small);
  }
  .case__link .marker-link::before { transform: none; }
  /* Раньше отступы отсчитывались от края всей карточки, чтобы попасть внутрь
     бумаги на картинке рамки. Теперь .case__back сам и есть бумага — тело
     занимает его целиком, поля задаются паддингом выше (правка 10.09). */
  .case__body--back { position: absolute; inset: 0; display: flex; flex-direction: column; gap: calc(10 * var(--u)); }
  .case__body--back .case__title { position: static; }
  .case__body--back p { font-size: var(--fs-small); line-height: var(--lh-compact); }
  .case__back-actions { margin-top: auto; }
  .cases .section__foot { margin-top: calc(13 * var(--u)); }


  /* ==========================================================
     CALC · Desktop-10. Всё в u от левого края кадра 1440.
     ========================================================== */
  .calc .container { width: 100%; max-width: none; }
  /* Правое поле обязательно: без него .calc__ways (space-between) прижимал
     кнопку Telegram к самому краю экрана — «кнопка улетела», правка 10.09. */
  .calc .section__head { width: calc(1440 * var(--u)); max-width: 100%; margin: 0 auto; padding-left: calc(111 * var(--u)); padding-right: calc(111 * var(--u)); }
  .calc .section__head .lead { margin-top: calc(14 * var(--u)); }
  .calc__usp { gap: calc(24 * var(--u)); margin: calc(39 * var(--u)) 0 0 calc(-42 * var(--u)); }
  .calc__usp .tape {
    width: calc(200 * var(--u)); min-height: calc(42 * var(--u)); padding: 0.4rem 0.6rem;
    font-size: var(--fs-caption); letter-spacing: 0.02em; text-transform: none;
  }
  .calc__stage {
    width: calc(1440 * var(--u)); max-width: 100%;
    margin: 0 auto;
    padding: 0 0 calc(40 * var(--u));
    /* Папка2 во фрейме: 1919×1440u в (-139,0); видимая бумага — x 56…1497, y 258…1183.
       folder.webp = обрезанная по бумаге картинка, ставим её в эти координаты. */
    background-image: url("../assets/ui/folder.webp");
    /* Папка на всю ширину и выше блока: тёмные полосы слева, справа и сверху
       читались как артефакт под чёрной секцией (правка 09.09). */
    background-size: 100% calc(100% + 40 * var(--u));
    background-position: 0 calc(-40 * var(--u));
    background-repeat: no-repeat;
    overflow: hidden;
  }
  .calc__stage > .container { width: 100%; }
  .calc__folder {
    grid-template-columns: calc(638 * var(--u)) calc(575 * var(--u));
    gap: calc(37 * var(--u));
    margin-left: calc(86 * var(--u));
    padding: calc(45 * var(--u)) 0 0; /* верх панелей y=281 при старте сцены y=236 */
  }
  .calc__left { gap: calc(22 * var(--u)); }
  .calc__panel { padding: 0; }
  .calc__panel .caption { font-size: var(--fs-caption); line-height: var(--lh-caption); }

  /* Правка 10.09 (Диана): слева отступы были хорошие, справа всё теснило —
     14…25u против 22…29u. Все четыре панели приведены к 28u с обеих сторон,
     теперь подписи стоят вровень с суммой. */
  /* календарь: панель 638×296u */
  .calc__calendar { min-height: calc(296 * var(--u)); padding: calc(24 * var(--u)) calc(28 * var(--u)) calc(18 * var(--u)); gap: 0; position: relative; }
  /* Один месяц по центру со стрелками листания (правка 09.09) */
  .cal-wrap { display: block; }
  .cal-nav { margin-bottom: calc(10 * var(--u)); gap: calc(20 * var(--u)); }
  .cal-nav__title { font-size: var(--fs-h3); line-height: var(--lh-display); }
  .cal-nav__btn { width: calc(30 * var(--u)); height: calc(30 * var(--u)); min-width: 28px; min-height: 28px; font-size: max(14px, calc(20 * var(--u))); }
  .cal { --cell: calc(80 * var(--u)); }
  .cal__grid { grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 0; justify-content: stretch; }
  .cal__wd { font-size: var(--fs-caption); letter-spacing: 0.05em; padding-bottom: calc(6 * var(--u)); text-align: center; padding-left: 0; }
  .cal__day { width: 100%; height: calc(27 * var(--u)); font-size: var(--fs-small); letter-spacing: 0; justify-items: center; padding-left: 0; }
  .cal__day.is-scarce { background: rgba(0, 0, 0, 0.12); }
  .cal__day.is-booked::before, .cal__day.is-booked::after { width: calc(24 * var(--u)); left: 50%; margin-left: calc(-12 * var(--u)); }
  .cal__day svg { inset: auto; left: 50%; top: 50%; transform: translate(-50%, -50%); width: calc(30 * var(--u)); height: calc(30 * var(--u)); }
  .calc__cal-foot { grid-template-columns: 1fr; gap: calc(8 * var(--u)); padding-top: calc(14 * var(--u)); align-items: start; }
  .calc__cal-foot .caption { max-width: none; font-size: var(--fs-caption); line-height: var(--lh-caption); }
  .cal__legend { gap: calc(24 * var(--u)); font-size: var(--fs-caption); margin-right: 0; }
  .legend-swatch { width: calc(21 * var(--u)); height: calc(13 * var(--u)); }
  .legend-cross { width: calc(18 * var(--u)); height: calc(13 * var(--u)); }
  .calc__selected { margin-top: calc(10 * var(--u)); padding-top: calc(6 * var(--u)); font-size: var(--fs-caption); }

  /* количество: панель 638×194u */
  .calc__people { min-height: calc(194 * var(--u)); padding: calc(18 * var(--u)) calc(28 * var(--u)) calc(16 * var(--u)); }
  .calc__step { font-size: var(--fs-small); margin-bottom: calc(12 * var(--u)); padding-bottom: calc(7 * var(--u)); }
  .calc__people-row { margin-top: calc(6 * var(--u)); }
  .calc__people-input { font-size: var(--fs-h3); line-height: var(--lh-display); }
  .range { padding: calc(30 * var(--u)) 0 calc(28 * var(--u)); }
  .range__track { width: calc(593 * var(--u)); }
  .range__ticks span { height: calc(13 * var(--u)); margin-top: calc(-6.5 * var(--u)); }
  .range__ticks span::after { top: calc(10 * var(--u)); font-size: var(--fs-caption); letter-spacing: 0; }
  .range__thumb { width: calc(48 * var(--u)); height: calc(46 * var(--u)); top: calc(30 * var(--u)); margin: calc(-38 * var(--u)) 0 0 0; transform: translateX(-50%); }
  .calc__people > .caption:last-child { margin-top: calc(6 * var(--u)); }

  /* кастомный раунд: 638×90u */
  .calc__custom { min-height: calc(90 * var(--u)); padding: calc(18 * var(--u)) calc(28 * var(--u)) calc(14 * var(--u)); }
  .calc__custom .check { gap: calc(10 * var(--u)); }
  .calc__custom .check__box { width: calc(14 * var(--u)); height: calc(14 * var(--u)); margin-top: 0; }
  .calc__custom .check > span:not(.check__box) { font-size: var(--fs-caption); }
  .calc__custom .caption { margin-top: calc(11 * var(--u)); padding-left: calc(24 * var(--u)); max-width: calc(380 * var(--u)); }

  /* итог: 638×105u, контур */
  .calc__total { min-height: calc(105 * var(--u)); padding: calc(13 * var(--u)) calc(28 * var(--u)) calc(10 * var(--u)); }
  .calc__total > .caption.caps { font-size: var(--fs-caption); letter-spacing: 0.06em; }
  .calc__total-row { margin-top: calc(4 * var(--u)); }
  .calc__total-label, .calc__total-value { font-size: var(--fs-h3-lg); line-height: var(--lh-display-lg); }
  .calc__per-person { font-size: var(--fs-caption); margin-top: calc(2 * var(--u)); }

  /* лист 575×789u */
  .calc__sheet { min-height: calc(789 * var(--u)); padding: calc(33 * var(--u)) calc(24 * var(--u)) calc(40 * var(--u)) calc(24 * var(--u)); }
  .calc__sheet-title { font-size: var(--fs-h3); margin-bottom: calc(24 * var(--u)); line-height: var(--lh-display); }
  .calc__fields { width: calc(396 * var(--u)); padding-left: 0; gap: calc(12 * var(--u)); }
  .calc__sheet .field + .field { margin-top: 0; }
  .calc__sheet .input, .calc__sheet .select { min-height: calc(36 * var(--u)); padding: 0 calc(20 * var(--u)); font-size: var(--fs-small); }
  .calc__sheet .select { padding-right: calc(30 * var(--u)); }
  .calc__sheet .textarea { min-height: calc(65 * var(--u)); padding: calc(8 * var(--u)) calc(20 * var(--u)); font-size: var(--fs-small); }
  .calc__sheet .field__required::before { left: calc(-10 * var(--u)); top: calc(10 * var(--u)); font-size: var(--fs-caption); }
  .calc__consent { margin-top: calc(11 * var(--u)); font-size: var(--fs-caption); }
  .calc__consent .check__box { width: calc(15 * var(--u)); height: calc(15 * var(--u)); }
  /* Правка 13.09: текст кнопки должен ложиться в одну строку. Кегль масштабируется
     вместе с макетной сеткой (с полом в 10px), в одну строку — от 1280px, ниже
     разрешаем перенос: там кнопка ужимается сильнее, чем шрифт. */
  .calc__submit { width: calc(396 * var(--u)); min-height: calc(40 * var(--u)); margin-top: calc(16 * var(--u)); padding: 0 calc(8 * var(--u)); font-size: max(10px, calc(12.5 * var(--u))); letter-spacing: 0.04em; white-space: normal; line-height: var(--lh-ui); }
  .calc__sheet .form__submit { width: calc(396 * var(--u)); align-items: stretch; }
  .calc__sheet .form__note { width: 100%; }
  .calc__sheet-title--next { margin-top: calc(22 * var(--u)); margin-bottom: calc(18 * var(--u)); }
  .calc__next { gap: calc(14 * var(--u)); }
  .calc__next li { grid-template-columns: calc(22 * var(--u)) 1fr; }
  .calc__next .display { font-size: var(--fs-h3); line-height: var(--lh-display); }
  .calc__next p { font-size: var(--fs-small); line-height: var(--lh-body); max-width: calc(466 * var(--u)); }
  /* стикер 176×184u в (1197,266) = 436u от левого края листа и 16u выше; скрепка 27×90u в (1311,243) */
  /* Зина — горизонтальный стикер на всю ширину листа (правка 09.09) */
  .calc__sticker { position: relative; left: auto; right: auto; top: auto; width: 100%; min-height: calc(120 * var(--u)); margin-bottom: calc(22 * var(--u)); padding: calc(16 * var(--u)) calc(24 * var(--u)) calc(18 * var(--u)) calc(20 * var(--u)); --sticker-rotate: 0deg; grid-template-columns: calc(92 * var(--u)) minmax(0, 1fr); gap: calc(18 * var(--u)); }
  .calc__sticker .sticker__photo { width: calc(92 * var(--u)); height: calc(92 * var(--u)); min-height: 0; border-radius: 50%; margin: 0; box-shadow: none; object-fit: cover; align-self: center; }
  .calc__sticker .sticker__title { font-size: max(16px, calc(24 * var(--u))); margin-bottom: calc(5 * var(--u)); }
  .calc__sticker .sticker__text { font-size: var(--fs-lead); line-height: var(--lh-hand); }
  .calc__clip { left: calc(550 * var(--u)); right: auto; top: calc(-39 * var(--u)); width: calc(27 * var(--u)); height: calc(90 * var(--u)); z-index: 6; }
}

/* ==========================================================
   МОБИЛЬНАЯ РАСКЛАДКА: горизонтальные ленты вместо вертикальных стопок
   (фото «Квизов», отзывы, форматы в «Квиз, вечеринка…», ведущие)
   ========================================================== */
@media (max-width: 899px) {
  .fresh__stage {
    display: flex;
    gap: 1rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding: 1rem var(--gutter) 1.5rem;
    margin-inline: calc(50% - 50vw);
    width: 100vw;
    scrollbar-width: none;
  }
  .fresh__stage::-webkit-scrollbar { display: none; }
  .fresh__stage .fresh__photo { position: static; flex: 0 0 78vw; margin: 0; transform: none; scroll-snap-align: center; }
  /* Правка 13.09: у всех трёх кадров одна рамка. Крайние получили класс
     .polaroid и рисовали поля 12px против 8px у центрального — на ленте
     разнобой читался как сломанная вёрстка. */
  .fresh__stage .fresh__photo { padding: 8px 8px 10px; }
  .fresh__photo--2 img { aspect-ratio: 5 / 4; }

  .reviews__grid, .hosts__grid {
    display: flex;
    grid-template-columns: none;
    gap: 1rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding: 0.75rem var(--gutter) 1.5rem;
    margin-inline: calc(50% - 50vw);
    width: 100vw;
    max-width: none;
    scrollbar-width: none;
  }
  .reviews__grid::-webkit-scrollbar, .hosts__grid::-webkit-scrollbar { display: none; }
  /* Подсказка «листается»: последний элемент виден краем + стрелка над лентой */
  .scroll-hint {
    display: flex; align-items: center; gap: 0.5rem;
    font-size: var(--fs-caption); letter-spacing: 0.12em; text-transform: uppercase;
    color: var(--fg-muted); margin-bottom: 0.75rem;
  }
  .scroll-hint::after { content: "→"; animation: nudge 1.6s ease-in-out infinite; }
  .theme-paper .scroll-hint, .theme-warm .scroll-hint { color: var(--paper-fg-muted); }
  .review { flex: 0 0 82vw; scroll-snap-align: center; --rot: 0deg; }
  .host { flex: 0 0 60vw; scroll-snap-align: center; --rot: 0deg; }

  /* hero: полароиды в ленту */
  .hero__gallery {
    display: flex !important;
    gap: 1rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding: 1rem var(--gutter) 1.5rem;
    margin-inline: calc(50% - 50vw);
    width: 100vw;
    min-height: 0;
    max-width: none;
    scrollbar-width: none;
    align-items: flex-start;
  }
  .hero__gallery::-webkit-scrollbar { display: none; }
  .hero__gallery .hero__photo { position: static; flex: 0 0 70vw; width: auto; margin: 0; scroll-snap-align: center; }
  .hero__gallery .hero__tag { position: static; flex: 0 0 15rem; transform: rotate(-2deg); align-self: center; }
  .hero__gallery .hero__stamp { position: static; flex: 0 0 auto; align-self: center; margin: 0 1rem; }

  /* видео под формой открытых игр — в ленту */
  .proof__ugc {
    display: flex;
    gap: 1rem;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    padding: 0.5rem var(--gutter) 1.5rem;
    margin-inline: calc(50% - 50vw);
    width: 100vw;
    scrollbar-width: none;
  }
  .proof__ugc::-webkit-scrollbar { display: none; }
  .proof__ugc .ugc { flex: 0 0 58vw; scroll-snap-align: center; --rot: 0deg; display: block !important; }
}

/* ==========================================================================
   Дела на узком десктопе (900…1279). Карточка из макета — 432x539u, на таких
   ширинах она сжимается по высоте, и описание «Индии» не помещается на оборот.
   Показываем две карточки в ряд: пропорция полароида сохраняется, высоты хватает.
   Три в ряд — с 1280px, там оборот влезает целиком.
   ========================================================================== */
@media (min-width: 900px) and (max-width: 1099px) {
  /* frames перебивал 2 колонки из blocks.css, третья карточка жалась */
  .turnkey__grid { grid-template-columns: 1fr 1fr; }
  .turnkey__card--photo { grid-column: 1 / -1; }
}

@media (min-width: 900px) and (max-width: 1279px) {
  .cases__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.5rem;
    margin-left: 0;
    align-items: start;
  }
  /* Safari: height:auto + только absolute-дети схлопывают карточку.
     Ширина из сетки, высота — из пропорции полароида, грани заполняют inset. */
  .case {
    position: relative;
    width: 100%;
    height: auto;
    aspect-ratio: 432 / 539;
  }
  .case + .case { margin-left: 0; }
  .case .flip__inner { position: absolute; inset: 0; }
}

@media (min-width: 1280px) {
  .calc__submit { white-space: nowrap; }
}