/* styles.css — вид Midnight. Всё из токенов (tokens.css), направление — design/direction.md. */

/* ───────── Сигнатура: проволочный куб ───────── */
.cube { position: relative; }
.cube__wire { position: absolute; left: 0; top: 0; max-width: none; overflow: visible; pointer-events: none; z-index: 2; }
.cube__wire path { fill: none; stroke: var(--signature-color); stroke-width: var(--signature-stroke); stroke-linejoin: miter; vector-effect: non-scaling-stroke; }
/* выдвижение: рамка прорисовывается → грань выезжает на глубину → фото оседает */
.cube__front, .cube__edges { stroke-dasharray: 1; stroke-dashoffset: 1; }
.cube__faces { fill: var(--signature-face); stroke: none; }
.cube__back, .cube__faces { opacity: 0; transform: translate(calc(-1 * var(--signature-depth)), calc(-1 * var(--signature-depth))); }
.cube .slot > img { transform: scale(1.04); transition: transform calc(var(--dur-extrude) * 1.6) var(--ease-out); }
.cube.is-built .cube__front { stroke-dashoffset: 0; transition: stroke-dashoffset var(--dur-reveal) var(--ease-out); }
.cube.is-built .cube__edges { stroke-dashoffset: 0; transition: stroke-dashoffset var(--dur-extrude) var(--ease-out) calc(var(--dur-reveal) * 0.6); }
.cube.is-built .cube__back, .cube.is-built .cube__faces { opacity: 1; transform: none; transition: transform var(--dur-extrude) var(--ease-out) calc(var(--dur-reveal) * 0.6), opacity var(--dur-micro) linear calc(var(--dur-reveal) * 0.6); }
.cube.is-built .slot > img { transform: none; }
.cube .slot { z-index: 1; }

/* ───────── Общее ───────── */
::selection { background: var(--accent); color: var(--on-accent); }
body { font-weight: 400; }
em { font-style: normal; color: var(--accent); }
.section { padding-block: var(--section); }
.eyebrow { font: 600 var(--step--1)/1.2 var(--font-body); letter-spacing: .16em; text-transform: uppercase; color: var(--accent); margin-bottom: var(--space-4); }
.eyebrow--rule { display: flex; align-items: center; gap: var(--space-4); }
.eyebrow--rule::after { content: ""; flex: 1; height: 1px; background: var(--accent); opacity: .6; }
.h2 { font-size: var(--step-4); font-weight: 800; letter-spacing: -0.035em; line-height: 1.02; }
.muted { color: var(--ink-muted); }
.arrow { font-family: var(--font-body); font-weight: 400; transition: transform var(--dur-micro) var(--ease-out); }
a:hover > .arrow { transform: translateX(4px); }
.link-arrow { display: inline-flex; gap: var(--space-3); align-items: center; padding-block: var(--space-2); font-weight: 600; font-size: var(--step-1); text-decoration: none; border-bottom: 1px solid currentColor; }

/* Кнопки */
.btn { border-radius: var(--radius-control); font-weight: 600; font-size: var(--step-0); }
.btn--primary:hover { background: var(--accent-hover); }
.btn--big { min-height: 60px; padding-inline: var(--space-6); font-size: var(--step-1); gap: var(--space-5); }

/* Шапка */
.header { background: var(--surface); border-bottom: 1px solid var(--line); }
.header__inner { min-height: var(--header-row); }   /* не замер: иначе шапка растёт на 1px при каждом resize (critique-3) */
.logo { display: block; flex: none; }
.logo img { width: 156px; height: auto; }
.nav__list { gap: clamp(var(--space-4), 2.2vw, var(--space-7)); }
.nav__list a { text-decoration: none; font-weight: 600; font-size: var(--step--1); letter-spacing: .02em; padding-block: var(--space-2); background: linear-gradient(var(--accent), var(--accent)) 0 100% / 0 2px no-repeat; transition: background-size var(--dur-micro) var(--ease-out); }
.nav__list a:hover { background-size: 100% 2px; }
.lang button { font-weight: 600; color: var(--ink); }
.lang button[aria-pressed="true"] { color: var(--accent); text-decoration: none; opacity: 1; }
.header__cta { min-height: 48px; }

/* ───────── 1. Первый экран ───────── */
.hero__title { font-size: clamp(2rem, 0.6rem + 3.4vw, 4rem); font-weight: 800; text-transform: uppercase; letter-spacing: -0.02em; line-height: 1; color: var(--accent); }
.hero__hours { margin-top: var(--space-2); color: var(--ink-muted); font-size: var(--step-1); font-variant-numeric: tabular-nums; }

/* ───────── 2. Шоу ───────── */
.show__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: clamp(var(--space-7), 5vw, var(--space-9)); align-items: start; }
.show__grid { align-items: stretch; }
.show__media { margin-right: var(--signature-depth); margin-bottom: var(--signature-depth); }
.show__media .slot { aspect-ratio: auto; height: 100%; min-height: 28rem; }
.show .h2 { font-size: var(--step-3); }
.acts { margin-top: var(--space-6); border-top: 1px solid var(--line); counter-reset: none; }
.acts li { display: grid; grid-template-columns: 3rem 1fr; gap: var(--space-4); padding-block: var(--space-4); border-bottom: 1px solid var(--line); }
.acts__n { font: 600 var(--step--1)/1.9 var(--font-body); color: var(--accent); font-variant-numeric: tabular-nums; letter-spacing: .08em; }
.acts h3 { font-size: var(--step-1); font-weight: 800; letter-spacing: -0.01em; }
.acts p { margin-top: var(--space-1); color: var(--ink-muted); font-size: var(--step--1); }
.show__quote { margin-top: var(--space-7); }
.show__quote p { font: 800 var(--step-2)/1.15 var(--font-display); letter-spacing: -0.02em; color: var(--accent); }
cite { display: block; margin-top: var(--space-3); font-style: normal; font-size: var(--step--1); color: var(--ink-muted); }

/* ───────── 3. Бар: фото на ночи, текст на сирени ───────── */
.bar { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.bar__night { position: relative; padding: var(--section) var(--space-9) calc(var(--section) + var(--signature-depth)) max(var(--gutter), (100vw - var(--container)) / 2); }
.bar__glass { width: 64%; margin-right: var(--signature-depth); }
.bar__cubes { position: relative; z-index: 3; width: 48%; margin: -40% calc(var(--signature-depth) + var(--space-3) - var(--space-9)) 0 auto; }   /* второй куб стопкой, как полки на стене: уходит в правый отступ тёмной половины и заходит только на угол коктейля, стакан открыт */
.bar__cubes .slot { box-shadow: 0 0 0 10px var(--surface); }   /* вырез — кадры не сливаются */
.bar__lilac { --signature-color: var(--lilac-line); --signature-face: color-mix(in oklab, var(--lilac-line) 22%, var(--lilac)); background: var(--lilac); color: var(--lilac-ink); padding: var(--section) max(var(--gutter), (100vw - var(--container)) / 2) var(--section) calc(var(--space-9) + var(--space-7)); display: flex; flex-direction: column; justify-content: center; }
.bar__lilac .eyebrow { color: var(--lilac-line); }
.bar__lilac .h2 { font-size: var(--step-4); }
.bar__lead { margin-top: var(--space-5); max-width: 32ch; font-size: var(--step-1); color: var(--lilac-muted); }
.menu-lines { margin-top: var(--space-7); border-top: 1px solid var(--lilac-line); }
.menu-lines li { display: grid; grid-template-columns: 3rem 1fr; gap: var(--space-4); padding-block: var(--space-4); border-bottom: 1px solid color-mix(in oklab, var(--lilac-line) 40%, transparent); font-size: var(--step-1); font-weight: 600; }
.menu-lines .acts__n { color: var(--lilac-line); }
.menu-lines b { font-weight: 800; font-family: var(--font-display); font-size: var(--step-0); letter-spacing: -0.01em; }
.bar__lilac .link-arrow { margin-top: var(--space-7); align-self: flex-start; }
.bar__lilac :focus-visible { outline-color: var(--lilac-ink); }

/* ───────── 4. Ночь ───────── */
.night__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(var(--space-7), 6vw, var(--space-10)); align-items: center; }
.night__lead { margin-top: var(--space-5); font-size: var(--step-1); color: var(--ink-muted); }
.clock { grid-column: 1 / -1; margin-top: var(--space-6); display: grid; align-items: end; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) minmax(0, 1fr); gap: calc(var(--space-6) + var(--signature-depth)); padding-bottom: var(--signature-depth); }
.clock li { display: grid; gap: var(--space-2); padding: var(--space-5); margin-right: var(--signature-depth); }
.clock b { font: 800 clamp(1.5rem, 2.4vw, 3.25rem)/1 var(--font-display); font-variant-numeric: tabular-nums; letter-spacing: -0.04em; }
.clock span { color: var(--ink-muted); font-size: var(--step-1); }
.clock__peak { --signature-color: var(--accent-hover); --signature-face: color-mix(in oklab, var(--accent) 45%, var(--surface)); background: var(--accent); color: var(--on-accent); }
.clock__peak { padding: var(--space-6) var(--space-7) var(--space-5); }
.clock__peak b { font-size: clamp(3rem, 0.5rem + 5.6vw, 7rem); }
.clock__peak span { color: var(--on-accent); font-weight: 600; }
.night__media { margin-right: var(--signature-depth); }

/* ───────── 5. Правила ───────── */
.rules { --signature-color: var(--lilac-line); --signature-face: color-mix(in oklab, var(--lilac-line) 22%, var(--lilac)); background: var(--lilac); color: var(--lilac-ink); }
.rules .eyebrow { color: var(--lilac-line); }
.rules__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(var(--space-7), 5vw, var(--space-9)); align-items: center; }
.rules__title { font-size: clamp(2.5rem, 0.8rem + 5.2vw, 6.5rem); font-weight: 800; letter-spacing: -0.04em; line-height: .98; }
.rules__lead { margin-top: var(--space-5); font-size: var(--step-1); color: var(--lilac-muted); max-width: 28ch; }
.rules__card { padding: clamp(var(--space-5), 4vw, var(--space-8)); margin-right: var(--signature-depth); }
.deposit { display: grid; gap: var(--space-1); }
.deposit__label { font-weight: 600; font-size: var(--step-1); }
.deposit__sum { font: 800 clamp(2rem, 0.9rem + 3.4vw, 4.25rem)/1 var(--font-display); letter-spacing: -0.04em; font-variant-numeric: tabular-nums; white-space: nowrap; }
.deposit__per { font-weight: 600; color: var(--lilac-muted); }
.rules__list { margin-top: var(--space-6); border-top: 1px solid var(--lilac-line); }
.rules__list > div { display: grid; grid-template-columns: minmax(7rem, 2fr) 3fr; gap: var(--space-4); padding-block: var(--space-4); border-bottom: 1px solid color-mix(in oklab, var(--lilac-line) 40%, transparent); }
.rules__list dt { font-weight: 600; }
.rules__list dd { margin: 0; color: var(--lilac-muted); }
.rules__contacts { margin-top: var(--space-5); display: flex; flex-wrap: wrap; gap: var(--space-3) var(--space-6); font-weight: 600; }
.rules__contacts a { text-underline-offset: 4px; }
.rules :focus-visible { outline-color: var(--lilac-ink); }

/* ───────── 6. Фото ───────── */
.photos__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(var(--space-7), 5vw, var(--space-9)); align-items: start; }
.photos__tall { margin-right: var(--signature-depth); }
.photos__title { font-size: var(--step-4); margin-bottom: var(--space-7); }
.photos__row { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: var(--space-7); align-items: center; margin-bottom: var(--space-8); }
.photos__row--shift { margin-left: 10%; }
.photos__wide { margin-right: var(--signature-depth); }
.photos__quote p { font-size: var(--step-1); font-weight: 600; line-height: 1.35; }

/* ───────── 7. Бронь — финал ───────── */
.booking { --signature-color: var(--lilac-line); --signature-face: color-mix(in oklab, var(--lilac-line) 22%, var(--lilac)); background: var(--lilac); color: var(--lilac-ink); }
.booking :focus-visible { outline-color: var(--lilac-ink); }
.booking__card :focus-visible { outline-color: var(--accent); }
.booking__title { font-size: clamp(2rem, 0.4rem + 6.4vw, 7rem); font-weight: 800; letter-spacing: -0.045em; line-height: .95; color: var(--lilac-ink); margin-bottom: var(--space-8); }
.booking__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(var(--space-7), 5vw, var(--space-9)); align-items: start; }
.booking__card { padding: clamp(var(--space-5), 3vw, var(--space-7)); margin-right: var(--signature-depth); background: var(--surface); color: var(--ink); container-type: inline-size; }
.form { max-width: none; }
.form__pair { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-4); }
.field label { font-size: var(--step--1); color: var(--ink-muted); font-weight: 600; }
.field input, .field select { font: inherit; color: var(--ink); width: 100%; min-height: 52px; padding: .7em .9em; background: var(--plane); border: 1px solid color-mix(in oklab, var(--accent) 45%, transparent); border-radius: 0; color-scheme: dark; }
.field select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--accent) 50%), linear-gradient(-45deg, transparent 50%, var(--accent) 50%); background-position: calc(100% - 22px) 50%, calc(100% - 16px) 50%; background-size: 6px 6px; background-repeat: no-repeat; }
.field input:hover, .field select:hover { border-color: var(--accent); }
.field input::placeholder { color: var(--ink-muted); }
.calc { display: grid; grid-template-columns: 1fr auto; align-items: baseline; gap: var(--space-1) var(--space-4); padding: var(--space-4) 0; border-block: 1px solid var(--line); }
.calc__label { font-weight: 600; }
.calc__sum { white-space: nowrap; font: 800 var(--step-2)/1 var(--font-display); color: var(--accent); font-variant-numeric: tabular-nums; letter-spacing: -0.02em; text-align: right; }
.calc__how { grid-column: 1 / -1; font-size: var(--step--1); color: var(--ink-muted); }
.form .btn { width: 100%; }
.form__status { font-weight: 600; color: var(--accent); }
.booking__media .slot { aspect-ratio: 16 / 9; }
.booking__phone { display: block; margin-top: var(--space-7); font: 800 clamp(1.75rem, 0.6rem + 3.3vw, 4rem)/1 var(--font-display); letter-spacing: -0.03em; text-decoration: none; white-space: nowrap; font-variant-numeric: tabular-nums; }
.booking__phone:hover { color: var(--lilac-line); }
.booking .muted, .booking .booking__hours { color: var(--lilac-muted); }
.booking__address { margin-top: var(--space-5); font-style: normal; display: grid; gap: var(--space-1); font-size: var(--step-1); }
.booking__links { margin-top: var(--space-5); display: flex; flex-wrap: wrap; gap: var(--space-3) var(--space-6); font-weight: 600; }
.booking__links a { text-underline-offset: 4px; text-decoration-color: var(--lilac-line); }
.booking__hours { margin-top: var(--space-5); color: var(--ink-muted); }

/* Подвал */
.footer { border-top: 1px solid var(--line); padding-block: var(--space-7) var(--space-8); }
.footer__inner { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-5) var(--space-7); }
.footer__logo { width: 120px; }
.footer__slogan { font: 800 var(--step-0)/1.2 var(--font-display); color: var(--accent); }
.footer__copy { margin-left: auto; color: var(--ink-muted); }

/* ───────── Мобильная композиция — кадры 02, 04, 06, 08, 09, 13, 14 ───────── */
@media (max-width: 900px) {
  .logo img { width: 116px; }
  .header__actions .lang { display: flex; }   /* кадры показывают язык в шапке */
  .header__actions .lang button { min-width: 32px; }
  .header__actions { gap: var(--space-1); }

  /* меню на весь экран — кадр 09 */
  .mobile-menu { position: fixed; inset: var(--header-h) 0 0 0; background: var(--surface); overflow: hidden auto; padding: var(--space-5) var(--gutter) var(--space-7); border-top: 1px solid var(--line); display: flex; flex-direction: column; }
  .mobile-menu[hidden] { display: none; }
  .mobile-menu ul { gap: 0; font-size: inherit; padding-right: var(--space-9); }
  .mobile-menu li a { display: block; padding-block: var(--space-4); border-bottom: 1px solid var(--line); text-decoration: none; font: 800 clamp(1.5rem, 7vw, 2.25rem)/1.1 var(--font-display); text-transform: uppercase; letter-spacing: -0.02em; color: var(--accent); }
  .mobile-menu__foot { order: 3; display: grid; gap: var(--space-4); margin-top: var(--space-6); }
  .mobile-menu__phone { font: 800 var(--step-1)/1 var(--font-display); text-decoration: none; font-variant-numeric: tabular-nums; }
  .mobile-menu .lang { display: none; }   /* языки уже в шапке */
  .mobile-menu__cube { position: absolute; right: calc(-1 * var(--space-7)); top: var(--space-6); width: var(--space-9); height: 46%; z-index: -1; }
  .mobile-menu > nav, .mobile-menu__foot { position: relative; z-index: 1; }

  /* герой — кадр 13: заголовок → куб → рейтинг → действие */

  /* шоу — кадр 06 */
  .show__grid { display: flex; flex-direction: column; gap: 0; }
  .show__text { display: contents; }
  .show .eyebrow { order: 1; } .show .h2 { order: 2; }
  .show__media { order: 3; margin-top: var(--space-6); margin-bottom: var(--signature-depth); }
  .show__media .slot { aspect-ratio: 3 / 2; height: auto; min-height: 0; }
  .acts { order: 4; } .show__quote { order: 5; }

  /* бар — кадр 02: весь на сирени, фото между вводом и списком */
  .bar { display: flex; flex-direction: column; background: var(--lilac); color: var(--lilac-ink); --signature-color: var(--lilac-line); padding: var(--section) var(--gutter); }
  .bar__night, .bar__lilac { display: contents; }
  .bar__lilac > * { order: 1; }
  .bar__glass { order: 2; width: auto; margin-top: var(--space-6); }
  .bar__glass .slot { aspect-ratio: 4 / 5; }
  .bar__cubes { display: none; }
  .menu-lines { order: 3; margin-top: calc(var(--space-6) + var(--signature-depth)); }
  .bar__lilac .link-arrow { order: 4; }

  /* ночь — кадр 14 */
  .night__grid { display: flex; flex-direction: column; align-items: stretch; gap: 0; }
  .night__text { display: contents; }
  .night .h2 { order: 1; }
  .clock { order: 2; grid-template-columns: 1fr; gap: calc(var(--space-3) + var(--signature-depth)); margin-top: var(--space-6); }
  .clock li { grid-template-columns: auto minmax(0, 1fr); align-items: baseline; gap: var(--space-4); padding: var(--space-4) var(--space-5); }
  .clock b { font-size: clamp(2rem, 9vw, 2.5rem); }
  .clock__peak b { font-size: clamp(2.5rem, 12vw, 3.25rem); }
  .clock span { font-size: var(--step-0); }
  .night__media { order: 3; margin-top: var(--space-5); }
  .night__lead { order: 4; margin-top: var(--space-5); }

  /* правила — кадр 04 */
  .rules__grid { grid-template-columns: 1fr; gap: var(--space-6); }
  .rules__list > div { grid-template-columns: 1fr; gap: var(--space-1); }

  /* фото — кадр 08 */
  .photos__grid { display: flex; flex-direction: column; align-items: stretch; gap: 0; }
  .photos__side { display: contents; }
  .photos__title { order: 1; margin-bottom: var(--space-6); }
  .photos__tall { order: 2; margin-bottom: calc(var(--space-6) + var(--signature-depth)); }
  .photos__tall .slot { aspect-ratio: 4 / 5; }
  .photos__row { order: 3; grid-template-columns: 1fr; gap: calc(var(--space-4) + var(--signature-depth)); margin: 0 0 var(--space-7); }
  .photos__row--shift { margin-left: 0; }
  .photos__side > .link-arrow { order: 4; align-self: flex-start; font-size: var(--step-0); }

  /* бронь — кадр 05 */
  .booking__title { margin-bottom: var(--space-6); }
  .sticky-cta.is-on.is-away { transform: translateY(calc(100% + 2 * var(--gutter))); }
  .booking__grid { grid-template-columns: 1fr; gap: calc(var(--space-7) + var(--signature-depth)); }
  .booking__phone { margin-top: var(--space-6); font-size: clamp(1.5rem, 7.4vw, 2.25rem); }
  .footer__copy { margin-left: 0; width: 100%; }
}

@media (max-width: 1100px) and (min-width: 901px) {
  .nav__list { gap: var(--space-4); }
  .header__cta { display: none; }
}

@media (max-width: 520px) {
  .calc { grid-template-columns: 1fr; }
  .calc__sum { text-align: left; font-size: clamp(1.5rem, 7vw, 2rem); }
}

@media (max-width: 420px) {
  .form__pair { grid-template-columns: 1fr 1fr; gap: var(--space-3); }
}

/* ───────── Плашка PowerUP (powerup-badge, не трогать) ───────── */
/* Плашка PowerUP — копия «Powered by Netlify» (пилюля, отступ 18px от угла, системный шрифт 13px)
   в фирменных цветах powerup-go.uz. Самодостаточна: не зависит от токенов проекта. Одна и та же во всех проектах —
   текст, цвета и размеры не менять без явной просьбы. */
.pu-badge {
  position: fixed; right: 18px; bottom: 18px; z-index: 60;
  display: flex; align-items: center; gap: 9px; white-space: nowrap;
  padding: 8px 12px 8px 16px;
  border: 1px solid rgba(212, 175, 55, 0.22); border-radius: 999px;
  background: linear-gradient(180deg, #151515, #050505);
  color: #F0F0F0; text-decoration: none;
  font: 600 13px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  letter-spacing: .01em; -webkit-font-smoothing: antialiased;
  transition: border-color .2s ease, bottom .5s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.pu-badge:hover { border-color: rgba(212, 175, 55, 0.55); }
.pu-badge:focus-visible { outline: 2px solid #D4AF37; outline-offset: 3px; }
.pu-badge__label { color: #D5D5D5; font-weight: 500; }
.pu-badge img { display: block; width: auto; height: 26px; max-width: none; flex: none; }
@media (prefers-reduced-motion: reduce) { .pu-badge { transition: none; } }

/* Если у сайта есть липкая нижняя панель (кнопки на телефоне) — поднять плашку над ней, пока панель видна.
   Пример для static-starter (.sticky-cta.is-on, высота ~76px):
   @media (max-width: 900px) { .sticky-cta.is-on:not(.is-away) ~ .pu-badge { bottom: 94px; } } */

@media (max-width: 900px) {
}

/* ───────── Заголовки по ширине колонки, а не экрана (critique-2: UZ и 960–1200) ───────── */
.container, .hero__text, .show__text, .bar, .bar__lilac, .night__text, .rules__head, .photos__side { container-type: inline-size; }
.hero__title { font-size: min(4rem, 10.2cqi); }
.h2, .bar__lilac .h2, .photos__title { font-size: min(var(--step-4), 12cqi); }   /* самое широкое слово «MC Kaamos» = 7.7em */
.show .h2 { font-size: min(var(--step-3), 12cqi); }
:lang(uz) .h2, :lang(uz) .bar__lilac .h2, :lang(uz) .photos__title { font-size: min(var(--step-4), 11cqi); }
:lang(uz) .show .h2 { font-size: min(var(--step-3), 11cqi); }
.rules__title { font-size: min(clamp(2.5rem, 0.8rem + 5.2vw, 6.5rem), 14cqi); }
:lang(uz) .rules__title { font-size: min(clamp(2.5rem, 0.8rem + 5.2vw, 6.5rem), 10cqi); }   /* «Kechangizdan» = 9.1em */
.booking__title { font-size: min(clamp(2rem, 0.4rem + 6.4vw, 7rem), 9.4cqi); }   /* «Забронировать» = 10.4em */
.calc { grid-template-columns: 1fr; }
.calc__sum, :lang(uz) .calc__sum { text-align: left; font-size: min(var(--step-3), 8.5cqi); }

/* ───────── Планшет 601–900: своя раскладка, не растянутый телефон (critique-2) ───────── */
@media (min-width: 601px) and (max-width: 900px) {
  .show__media .slot { aspect-ratio: 16 / 9; }
  .bar__glass { width: 64%; align-self: flex-start; }
  .bar__glass .slot { aspect-ratio: 3 / 4; }
  .night__media .slot { aspect-ratio: 16 / 10; }
  .clock { grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr) minmax(0, 1fr); align-items: end; }
  .clock li { grid-template-columns: 1fr; padding: var(--space-4); }
  .clock b { font-size: 1.75rem; }
  .clock__peak b { font-size: 2.75rem; }
  .photos__tall { width: 72%; }
  .photos__tall .slot { aspect-ratio: 4 / 5; }
  .photos__row { grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); align-items: center; gap: calc(var(--space-5) + var(--signature-depth)); }
}


/* Пока форма брони в кадре — плашка уезжает на всех ширинах (critique-3) */
.pu-badge { transition: border-color .2s ease, bottom .5s cubic-bezier(0.2, 0.8, 0.2, 1), transform .4s cubic-bezier(0.2, 0.8, 0.2, 1); }
body.form-in-view .pu-badge { transform: translateY(calc(100% + 40px)); }
/* Ссылка меню: текст и стрелка не разрываются (critique-3, 960) */
.bar__lilac .link-arrow { white-space: nowrap; font-size: min(var(--step-1), max(0.9375rem, 5.6cqi)); }

/* Секции: фото въезжает поворотом грани, затем дорисовывается рамка */
.cube .slot { transform-origin: 0 50%; transform: perspective(1600px) rotateY(-55deg); opacity: 0; transition: transform 900ms var(--ease-out), opacity 420ms var(--ease-out); }
.cube.is-built .slot { transform: none; opacity: 1; }

/* Финал: депозит + звонок; справа круглое фото гостей в кольцах логотипа — рифма с порталом */
.booking__ask { font-weight: 600; font-size: var(--step-1); }
.stepper { display: flex; align-items: center; gap: var(--space-5); margin-top: var(--space-3); }
.stepper__btn { width: 56px; height: 56px; display: grid; place-items: center; border: 2px solid var(--accent); background: none; color: var(--accent); font: 800 1.75rem/1 var(--font-display); transition: background-color var(--dur-micro) var(--ease-out), color var(--dur-micro) var(--ease-out); }
.stepper__btn:hover:not(:disabled) { background: var(--accent); color: var(--on-accent); }
.stepper__btn:disabled { opacity: .35; cursor: not-allowed; }
.stepper__value { min-width: 2ch; text-align: center; font: 800 var(--step-4)/1 var(--font-display); font-variant-numeric: tabular-nums; }
.booking__card .calc { margin-top: var(--space-5); }
.booking__actions { display: grid; gap: var(--space-3); margin-top: var(--space-5); }
.booking__actions .btn--big { justify-content: space-between; }
.btn--line { min-height: 52px; border: 1px solid color-mix(in oklab, var(--accent) 55%, transparent); color: var(--ink); background: none; }
.btn--line:hover { border-color: var(--accent); background: color-mix(in oklab, var(--accent) 12%, transparent); }
.booking__stage { --os: min(380px, 28vw); position: relative; display: grid; place-items: center; height: calc(var(--os) * 1.55); }
.orb { position: relative; z-index: 1; width: var(--os); aspect-ratio: 1; margin: 0; border-radius: 50%; overflow: hidden; box-shadow: 0 0 0 2px var(--lilac-line), 0 24px 60px color-mix(in oklab, var(--lilac-ink) 25%, transparent); }   /* круг — знак логотипа, единственный радиус сайта */
.orb img { width: 100%; height: 100%; object-fit: cover; }
.orb-rings { position: absolute; left: 50%; top: 50%; width: calc(var(--os) * 1.5); height: auto; max-width: none; transform: translate(-50%, -50%); pointer-events: none; overflow: visible; }
.orb-rings circle { fill: none; stroke: var(--lilac-line); stroke-width: 1.5px; vector-effect: non-scaling-stroke; transform-origin: 100px 100px; animation: ring-beat .94s ease-out infinite; }
.orb-rings circle:nth-child(2) { stroke-width: 3px; stroke-dasharray: 2 9; animation: ring-spin 40s linear infinite; }
.booking__info .booking__phone { margin-top: var(--space-5); }
.booking { overflow-x: clip; }

.photos__rating { margin-bottom: var(--space-5); color: var(--ink-muted); font-size: var(--step--1); }
.photos__rating b { color: var(--ink); font: 800 var(--step-2)/1 var(--font-display); margin-right: var(--space-2); }

@media (max-width: 900px) {
  .booking__stage { --os: min(60vw, 260px); }
  .photos__rating { order: 4; }
  /* липкая «Позвонить» и плашка PowerUP — одной полосой */
  .sticky-cta { right: calc(var(--gutter) + 184px); }
  .sticky-cta .btn { min-height: 46px; }
}

@media (prefers-reduced-motion: reduce) {
  .cube .slot { transform: none; opacity: 1; }
  .orb-rings circle, .hero__rings circle { animation: none; }
  .hero__title .line > span { transform: none !important; }
}

/* ═════════ Ревизия 4: первый экран по схеме ONLY/Loca — фото на весь экран, громкий заголовок, отсчёт, факты ═════════ */
.hero { position: relative; min-height: calc(100svh - var(--header-h)); display: grid; grid-template-rows: 1fr auto; overflow: hidden; isolation: isolate; }
.hero__photo { position: absolute; inset: 0; z-index: -2; }
.hero__photo img { width: 100%; height: 100%; object-fit: cover; object-position: 70% 40%; animation: hero-push 14s var(--ease-out) both; }
@keyframes hero-push { from { transform: scale(1.08); } to { transform: scale(1); } }
.hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, color-mix(in oklab, var(--surface) 92%, transparent) 0%, color-mix(in oklab, var(--surface) 70%, transparent) 38%, transparent 68%), linear-gradient(0deg, var(--surface) 0%, transparent 32%); }
/* кольца логотипа неоном поверх вывески — пульс в ритм зала */
.hero__rings { position: absolute; z-index: -1; left: 81%; top: 37%; width: min(44svh, 30vw); height: auto; transform: translate(-50%, -50%);   /* вокруг неоновой вывески на фото */ overflow: visible; pointer-events: none; mix-blend-mode: screen; }
.hero__rings circle { fill: none; stroke: var(--accent); stroke-width: 2px; vector-effect: non-scaling-stroke; transform-origin: 100px 100px; filter: drop-shadow(0 0 8px var(--accent)); animation: ring-beat .94s ease-out infinite; }
.hero__rings circle:nth-child(1) { opacity: .55; } .hero__rings circle:nth-child(2) { stroke-dasharray: 2 9; stroke-width: 3px; animation: ring-spin 40s linear infinite; } .hero__rings circle:nth-child(3) { animation-delay: .14s; }
@keyframes ring-beat { 0% { transform: scale(1.03); stroke-opacity: 1; } 100% { transform: scale(1); stroke-opacity: .55; } }
@keyframes ring-spin { to { transform: rotate(360deg); } }
.hero__body { align-self: center; padding-block: var(--space-6) var(--space-5); }
.hero__text { max-width: 44rem; }
.hero__title { margin-top: var(--space-4); font-size: min(clamp(2.75rem, 0.6rem + 5.2vw, 6rem), 13.8cqi); line-height: .92; letter-spacing: -0.035em; text-transform: uppercase; color: var(--accent); }
.hero__title .line { display: block; overflow: hidden; padding-bottom: .04em; }
.hero__title .line > span { display: inline-block; animation: line-up 900ms var(--ease-out) both; }
.hero__title .line:nth-child(2) > span { animation-delay: 120ms; } .hero__title .line:nth-child(3) > span { animation-delay: 240ms; }
@keyframes line-up { from { transform: translateY(105%); } to { transform: none; } }
.hero__lead { margin-top: var(--space-5); max-width: 30ch; font-size: var(--step-1); font-weight: 600; }
.tonight { margin-top: var(--space-5); }
.tonight__label { font: 600 var(--step--1)/1.2 var(--font-body); letter-spacing: .16em; text-transform: uppercase; color: var(--ink-muted); }
.tonight__cells { margin-top: var(--space-3); display: flex; align-items: center; gap: var(--space-2); }
.tonight__cells i { font: 800 var(--step-2)/1 var(--font-display); color: var(--accent); font-style: normal; animation: blink 1s steps(2) infinite; }
@keyframes blink { 50% { opacity: .25; } }
.tcell { min-width: 2.4ch; padding: var(--space-2) var(--space-3); border: 2px solid var(--accent); text-align: center; font: 800 clamp(1.5rem, 0.8rem + 1.6vw, 2.5rem)/1 var(--font-display); font-variant-numeric: tabular-nums; background: color-mix(in oklab, var(--surface) 55%, transparent); box-shadow: 0 0 24px color-mix(in oklab, var(--accent) 30%, transparent); }
.tonight__open { margin-top: var(--space-3); display: flex; align-items: center; gap: var(--space-3); font: 800 var(--step-2)/1.1 var(--font-display); color: var(--accent); }
.tonight__dot { width: 12px; height: 12px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 12px var(--accent); animation: ring-beat .94s ease-out infinite; }
.hero__action { margin-top: var(--space-5); display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-4) var(--space-7); }
.hero__more { border-bottom-color: var(--accent); font-size: var(--step-0); }
.hero .hero__facts { display: grid; grid-template-columns: repeat(6, auto); justify-content: space-between; gap: var(--space-4); padding-block: var(--space-4) 76px; border-top: 1px solid var(--line); }   /* снизу место под плашку PowerUP */
.hero__facts li { display: grid; gap: var(--space-1); padding-right: var(--space-4); }
.hero__facts li + li { padding-left: var(--space-5); border-left: 1px solid var(--line); }
.hero__facts b { font: 800 var(--step-0)/1.2 var(--font-display); letter-spacing: -0.01em; white-space: nowrap; }
.hero__facts b a { text-decoration: none; }
.hero__facts span { font-size: var(--step--1); color: var(--ink-muted); }

@media (max-width: 1200px) and (min-width: 901px) {
  .hero .hero__facts { grid-template-columns: repeat(3, auto); }
  .hero__facts li:nth-child(4) { padding-left: 0; border-left: 0; }
}
@media (max-width: 900px) {
  /* телефон: фото сверху, текст снизу — как у Loca; факты — сеткой 2×3 */
  .hero { min-height: 0; display: block; }
  .hero__photo { position: relative; inset: auto; display: block; aspect-ratio: 5 / 4; overflow: hidden; }
  .hero::before { inset: 0 0 auto 0; height: calc(100vw * .8); background: linear-gradient(0deg, var(--surface) 0%, transparent 45%); }
  .hero__rings { left: 80%; top: calc(100vw * .2); width: 40vw; }
  .hero__body { margin-top: calc(-1 * var(--space-8)); padding-block: 0 var(--space-6); position: relative; }
  .hero .eyebrow { display: none; }
  .hero__lead { margin-top: var(--space-3); }
  .tonight { margin-top: var(--space-4); }
  .tonight__cells { margin-top: var(--space-2); }
  .hero__title { font-size: min(4rem, 13.8cqi); }
  .hero__lead { font-size: var(--step-0); }
  .tcell { font-size: var(--step-2); }
  .hero__action { flex-direction: column; align-items: stretch; gap: var(--space-4); }
  .hero__action .btn { justify-content: center; }
  .hero__more { align-self: flex-start; }
  .hero .hero__facts { grid-template-columns: 1fr 1fr; justify-content: stretch; gap: var(--space-5) var(--space-4); padding-block: var(--space-5) var(--space-7); }
  .hero__photo img { object-position: 60% 22%; }
  .hero__facts li, .hero__facts li + li { padding: 0; border: 0; }
  .hero__facts b { white-space: normal; }
}
@media (min-width: 601px) and (max-width: 900px) {
  .hero__photo { aspect-ratio: 16 / 9; }
  .hero::before { height: calc(100vw * .5625); }
  .hero__rings { top: calc(100vw * .15); width: 28vw; }
  .hero__action { flex-direction: row; align-items: center; }
  .hero .hero__facts { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 600px) and (max-height: 700px) {
  /* маленький iPhone: кнопка брони в первом экране */
  .hero__photo { aspect-ratio: 16 / 11; }
  .hero::before { height: calc(100vw * .6875); }
  .hero__rings { top: calc(100vw * .17); width: 34vw; }
  .hero__lead { display: none; }
}
