/* UFFIZI — лендинг. Макет: Figma «Uffizi», страница «Верстка», ширина 1920.
   Десктоп: 1rem = 10px макета. От 1920px и шире размеры 1:1 с макетом, контент
   стоит в рамке 1920 по центру, фоны разделов идут на всю ширину (края дорисованы).
   От 1100 до 1920px страница пропорционально уменьшается, чтобы макет помещался.
   Мобильная раскладка (до 1099px) — в конце файла. */

@font-face { font-family: "Cinzel"; src: url("../fonts/cinzel-regular.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Cinzel"; src: url("../fonts/cinzel-bold.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Geist"; src: url("../fonts/geist-var.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }
@font-face { font-family: "Playfair"; src: url("../fonts/playfair-500i.woff2") format("woff2"); font-weight: 500; font-style: italic; font-display: swap; }
@font-face { font-family: "Playfair"; src: url("../fonts/playfair-900i.woff2") format("woff2"); font-weight: 900; font-style: italic; font-display: swap; }

:root {
  --serif: "Cinzel", "Geist", Georgia, serif;
  --sans: "Geist", system-ui, -apple-system, "Segoe UI", sans-serif;
  --pf: "Playfair", Georgia, serif;
  --ink: #280a0b;
  --wine: #1b0809;
  --cream: #fff8ed;
  --gold: #d8b88f;
  --ease: cubic-bezier(.22, .61, .36, 1);
  --ease-io: cubic-bezier(.65, .05, .36, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { font-size: min(calc(100vw / 192), 10px); -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { margin: 0; background: var(--wine); color: var(--gold); font-family: var(--sans); font-size: max(1.6rem, 14px); line-height: 1.4; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
img, svg { display: block; max-width: 100%; }
img { height: auto; }
h1, h2, h3, h4, p, ul, ol, figure { margin: 0; padding: 0; }
ul, ol { list-style: none; }
b, strong { font-weight: 700; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; text-transform: inherit; letter-spacing: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
hr { border: 0; margin: 0; }
svg use { pointer-events: none; }
:focus-visible { outline: 1px solid currentColor; outline-offset: 4px; }
.nowrap { white-space: nowrap; }
.up { text-transform: uppercase; }
/* «К содержанию»: для клавиатуры и экранных дикторов. Скрыта полностью, видна только при переходе клавишей Tab */
.skip { position: fixed; left: 16px; top: 16px; z-index: 100; padding: 10px 16px; background: var(--cream); color: var(--ink); clip-path: inset(50%); width: 1px; height: 1px; overflow: hidden; white-space: nowrap; opacity: 0; }
.skip:focus-visible { clip-path: none; width: auto; height: auto; overflow: visible; opacity: 1; }
.tbd { outline: 1px dashed currentColor; outline-offset: 4px; opacity: .6; font-style: italic; }

/* ---------- общие элементы ---------- */

.sec { position: relative; overflow: clip; }
.sec__in { position: relative; width: 100%; max-width: 192rem; margin: 0 auto; height: 100%; }
.sec--light { background: var(--cream); color: var(--ink); }

/* подчеркивание при наведении: линия уходит вправо и возвращается слева (osmo underline-link) */
.ulink { position: relative; display: inline-flex; align-items: center; gap: .5em; }
.ulink::after { content: ""; position: absolute; left: 0; right: 0; bottom: -.3em; height: 1px; background: currentColor; transform: scaleX(0); transform-origin: right; transition: transform .7s var(--ease-io); }
.ulink:hover::after, .ulink:focus-visible::after { transform: scaleX(1); transform-origin: left; }
/* постоянная линия: уходит вправо и возвращается слева */
.ulink--line::after { transform: scaleX(1); transform-origin: left; bottom: 0; }
.ulink--line:hover::after, .ulink--line:focus-visible::after { animation: line-swap .9s var(--ease-io); }
@keyframes line-swap { 0% { transform: scaleX(1); transform-origin: right; } 49% { transform: scaleX(0); transform-origin: right; } 50% { transform: scaleX(0); transform-origin: left; } 100% { transform: scaleX(1); transform-origin: left; } }

.fade-link { transition: opacity .5s var(--ease); }
.fade-link:hover, .fade-link:focus-visible { opacity: .55; }

.mark64 { width: 6.4rem; height: 6.4rem; }
.mark64--grey { color: #c5baac; }
.mark64--gold { color: #a8885c; margin: 0 auto; }

.pill { display: inline-flex; align-items: center; gap: 2rem; padding: 2rem 2.4rem; border-radius: 10rem; background: #ebdabd; color: #654e4b; font-size: max(1.8rem, 13px); line-height: 1.23; }
.pill svg { width: 1.9rem; height: 2.4rem; flex: none; color: #917755; }
.pill--deep { background: #c7b398; color: #5c4a36; font-size: max(1.6rem, 13px); }
.pill--deep svg { color: #776757; }
.pill--white { background: var(--cream); color: #77615e; }
.pill--white svg { color: rgba(145, 119, 85, .7); }

.glass { display: grid; place-items: center; width: 6.5rem; height: 6.5rem; border-radius: 50%; background: rgba(217, 217, 217, .1); border: 1px solid rgba(250, 235, 222, .2); color: #faebde; -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); transition: background-color .5s var(--ease), border-color .5s var(--ease); }
.glass:hover { background: rgba(217, 217, 217, .2); border-color: rgba(250, 235, 222, .45); }
.glass svg { width: 1rem; height: 1.6rem; }
.glass--next svg { transform: scaleX(-1); }

.marquee { overflow: hidden; }
.marquee__track { display: flex; width: max-content; }
.marquee.is-run .marquee__track { animation: marquee var(--dur, 80s) linear infinite; }
.marquee.is-paused .marquee__track { animation-play-state: paused; }
@keyframes marquee { to { transform: translate3d(-50%, 0, 0); } }

/* ---------- заставка ---------- */

.intro { position: fixed; inset: 0; z-index: 90; display: grid; place-items: center; background: #120a02; pointer-events: none; }
/* подложка за край экрана: iOS и Telegram показывают страницу под полупрозрачными панелями браузера */
.intro::before { content: ""; position: absolute; left: 0; right: 0; top: -50vh; bottom: -50vh; background: inherit; }
.intro__glow { position: absolute; inset: 0; background: radial-gradient(50% 50% at 50% 50%, rgba(56, 8, 23, .9) 0%, rgba(21, 11, 2, .35) 42%, #000 100%); opacity: 0; }
.intro__glow canvas { display: block; width: 100%; height: 100%; }
.intro__logo { position: relative; width: 101.2rem; height: 29.5rem; color: #fff1b8; opacity: 0; transform: scale(.26); }
html:not(.js) .intro { display: none; }

/* ---------- 1. первый экран ---------- */

.hero { height: 108rem; min-height: 100svh; background: #28090a; color: #c6baac; }
/* фоны разделов грузятся, когда раздел в паре экранов от окна (main.js, lazyBackgrounds); без скрипта грузятся сразу */
.js [data-bg-lazy]:not(.is-near) :is(.reveal__bg, .halls__bg > i, .fin__bg) { background-image: none !important; }
.bleed { position: absolute; top: 0; bottom: 0; left: calc(50% - 50vw); right: calc(50% - 50vw); }
.hero__bg img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.nav { position: absolute; z-index: 2; left: 0; right: 0; top: 0; display: flex; justify-content: space-between; align-items: flex-start; padding: 4rem; color: #f5efe6; }
.nav__side { display: flex; gap: 4.8rem; font-weight: 600; font-size: max(1.4rem, 11px); line-height: 1.3; letter-spacing: .143em; text-transform: uppercase; }
.nav__side--r { justify-content: flex-end; }
.nav__logo { position: absolute; left: 50%; top: 7.5rem; width: 12rem; transform: translateX(-50%); color: #fff1b8; }
.nav__logo svg { width: 12rem; height: 3.5rem; }
.hero__body { position: absolute; left: 50%; top: max(19rem, calc(50% - 35rem)); width: 120.1rem; transform: translateX(-50%); }
.hero__mark { width: 10rem; height: 10rem; margin: 0 auto; color: rgba(216, 184, 143, .5); }
.hero__kicker { margin-top: 11.4rem; font-family: var(--serif); font-size: 3.6rem; line-height: .87; text-transform: uppercase; color: #c6baac; }
.hero__title { margin-top: 1.3rem; font-family: var(--serif); font-weight: 400; font-size: 12rem; line-height: .9; letter-spacing: -.02em; text-align: center; text-transform: uppercase; color: var(--gold); }
.hero__lead { width: 47rem; margin: 2rem 0 0 auto; font-weight: 300; font-size: max(2rem, 13px); line-height: 1.23; text-align: right; text-transform: uppercase; }
.hero__cta { position: absolute; left: 0; right: 0; bottom: 8.8rem; width: max-content; margin: 0 auto; padding: 1.2rem 4rem; font-size: max(1.6rem, 12px); text-transform: uppercase; color: #c6baac; white-space: nowrap; }
.hero__cta::after { left: 0; right: 0; }
.hero__arrow { font-weight: 200; font-size: 2em; line-height: .5; transition: transform .7s var(--ease); }
.hero__cta:hover .hero__arrow { transform: translateX(.6rem); }

/* ---------- 2. гардеробная открывает двери ---------- */

.reveal { height: 212.7rem; background: var(--wine); }
.reveal__bg { background: var(--wine) image-set(url("../img/bg/reveal-wide-3840.avif?v=20261006zk") type("image/avif") 1x, url("../img/bg/reveal-wide-7680.avif?v=20261006zk") type("image/avif") 2x, url("../img/bg/reveal-wide-3840.webp?v=20261006zk") type("image/webp") 1x, url("../img/bg/reveal-wide-7680.webp?v=20261006zk") type("image/webp") 2x) center top / auto 212.7rem no-repeat; }
.reveal__head { position: absolute; left: 50%; top: 15rem; width: 96.6rem; transform: translateX(-50%); text-align: center; }
.reveal__title { font-family: var(--serif); font-weight: 400; font-size: 10rem; line-height: .9; letter-spacing: -.05em; text-transform: uppercase; color: var(--gold); background: linear-gradient(180deg, #d8b88f 0%, #917755 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; filter: drop-shadow(0 1px 0 rgba(0, 0, 0, .24)); }
.reveal__title .line, .reveal__title .word { background: linear-gradient(180deg, #d8b88f 0%, #917755 100%); -webkit-background-clip: text; background-clip: text; }
.reveal__lead { width: 35.8rem; margin: 5rem auto 0; font-weight: 300; font-size: max(2rem, 13px); line-height: 1.23; color: rgba(216, 184, 143, .8); }
.reveal__emboss { position: absolute; left: 0; right: 0; top: 55.5rem; width: 32.6rem; margin: 0 auto; }
.reveal__emboss { display: block; }
.reveal__emboss img { opacity: .5; mix-blend-mode: soft-light; }
.series { position: absolute; left: 4rem; right: 4rem; top: 123.8rem; display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem; text-align: center; }
.series__item { display: flex; flex-direction: column; align-items: center; height: 74.5rem; }
.series__petal { width: 24.2rem; height: 30.4rem; margin-bottom: 9.7rem; filter: drop-shadow(0 .4rem .4rem rgba(0, 0, 0, .25)); }
.series__petal--2 { width: 30.6rem; height: 30.6rem; margin-bottom: 9.5rem; }
.series__petal--3 { width: 24.1rem; height: 30.5rem; margin-bottom: 9.5rem; }
.series__no { font-family: var(--serif); font-size: max(1.6rem, 12px); line-height: 1.1; color: var(--gold); }
.series__box { width: 100%; margin-top: 2.7rem; padding: 6.6rem 8.4rem 5.2rem; border-top: 1px solid #61333d; }
.series__title { font-family: var(--serif); font-weight: 400; font-size: 5.6rem; line-height: 1; color: #ebcda5; }
.series__text { margin-top: 3.6rem; font-size: max(2rem, 13px); line-height: 1.4; color: rgba(216, 184, 143, .62); }

/* ---------- 3. цифровое пространство ---------- */

.digital { height: 109.8rem; }
.digital__photo { position: absolute; left: 4rem; top: 4rem; width: 91rem; height: 101.8rem; overflow: hidden; }
.digital__photo img { width: 100%; height: 100%; object-fit: cover; }
.digital__body { position: absolute; left: 104.3rem; top: 12rem; width: 79.4rem; height: 87.2rem; display: flex; flex-direction: column; justify-content: space-between; }
.digital__top { display: flex; flex-direction: column; gap: 4rem; }
.digital__title { font-family: var(--serif); font-weight: 400; font-size: 10rem; line-height: .94; letter-spacing: -.02em; color: var(--ink); }
.digital__bottom { display: flex; flex-direction: column; align-items: flex-start; gap: 4rem; }
.digital__rule { width: 100%; height: 1px; background: rgba(190, 179, 163, .7); }
.digital__text { font-weight: 300; font-size: max(3rem, 16px); line-height: 1.25; letter-spacing: -.02em; color: #77615e; }
.digital__text b { display: block; font-family: var(--serif); text-transform: uppercase; color: var(--ink); }

/* ---------- 4. бренды ---------- */

.brands { height: 100rem; }
.brands__row { position: absolute; left: calc(50% - 50vw); right: calc(50% - 50vw); top: 50%; transform: translateY(-50%); --dur: 65s; }
.brands__row .marquee__track { gap: 4rem; padding-right: 4rem; }
.brands__it { display: flex; align-items: center; gap: 4rem; font-family: var(--serif); font-size: 6.4rem; line-height: .95; text-transform: uppercase; white-space: nowrap; color: #4a3228; }
.brands__it::after { content: ""; width: 1rem; height: 1rem; border-radius: 50%; background: rgba(74, 50, 40, .5); }
.fabrics { position: absolute; left: 50%; top: 50%; width: 40rem; height: 40rem; transform: translate(-50%, -50%); }
.fabrics img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; opacity: 0; }
.fabrics img.is-on { opacity: .94; }

/* ---------- 5. залы ---------- */

.halls { height: 108rem; background: #36302b; color: #f0e4c0;
  --h-title: #674233; --h-hint: #714c3d; --h-panel: rgba(81, 59, 36, .5); --h-meta: #a07830; --h-ttl: #d9c0a0;
  --h-icon: #a07830; --h-tab: rgba(77, 58, 33, .5); --h-mark: #4b381a; --h-item: rgba(255, 255, 255, .05); --h-glow: rgba(201, 168, 76, .1); }
.halls[data-hall="2"] { --h-title: #7d3d3f; --h-hint: #7d3d3f; --h-panel: rgba(75, 35, 36, .5); --h-meta: #a72c49; --h-ttl: #dabda1;
  --h-icon: #7d3d3f; --h-tab: rgba(74, 30, 31, .5); --h-mark: #622f31; --h-item: rgba(196, 196, 196, .1); }
.halls[data-hall="3"] { --h-title: #51512c; --h-hint: #51512c; --h-panel: rgba(56, 56, 36, .3); --h-meta: #636305; --h-ttl: #d5bf9f;
  --h-icon: #51511c; --h-tab: rgba(49, 49, 29, .5); --h-mark: rgba(99, 99, 5, .4); --h-glow: rgba(78, 78, 17, .1); }
.halls__bg > i { position: absolute; inset: 0; background: center / auto 108rem no-repeat; opacity: 0; transition: opacity 1.4s var(--ease); }
.halls__bg > i.is-on { opacity: 1; }
.halls__bg > i:nth-child(1) { background-image: image-set(url("../img/bg/hall-1-wide-3840.avif?v=20261006zk") type("image/avif") 1x, url("../img/bg/hall-1-wide-7680.avif?v=20261006zk") type("image/avif") 2x, url("../img/bg/hall-1-wide-3840.webp?v=20261006zk") type("image/webp") 1x, url("../img/bg/hall-1-wide-7680.webp?v=20261006zk") type("image/webp") 2x); }
.halls__bg > i:nth-child(2) { background-image: image-set(url("../img/bg/hall-2-wide-3840.avif?v=20261006zk") type("image/avif") 1x, url("../img/bg/hall-2-wide-7680.avif?v=20261006zk") type("image/avif") 2x, url("../img/bg/hall-2-wide-3840.webp?v=20261006zk") type("image/webp") 1x, url("../img/bg/hall-2-wide-7680.webp?v=20261006zk") type("image/webp") 2x); }
.halls__bg > i:nth-child(3) { background-image: image-set(url("../img/bg/hall-3-wide-3840.avif?v=20261006zk") type("image/avif") 1x, url("../img/bg/hall-3-wide-7680.avif?v=20261006zk") type("image/avif") 2x, url("../img/bg/hall-3-wide-3840.webp?v=20261006zk") type("image/webp") 1x, url("../img/bg/hall-3-wide-7680.webp?v=20261006zk") type("image/webp") 2x); }
.halls__title { position: absolute; left: 4rem; top: 11.8rem; font-weight: 400; font-size: 5.2rem; line-height: .9; letter-spacing: -.02em; color: var(--h-title); transition: color 1s var(--ease); }
.halls__hint { position: absolute; left: 4rem; top: 96.7rem; width: 25rem; font-weight: 300; font-size: max(2rem, 13px); line-height: 1.23; color: var(--h-hint); transition: color 1s var(--ease); }
.halls__tabs { position: absolute; left: 4rem; top: 35.5rem; width: 35.3rem; display: flex; flex-direction: column; gap: 1.7rem; }
/* размеры вкладки в em от ее шрифта (13 px на 1920): шрифт не мельче 11 px, и на узком ПК карточка растет вместе с ним, иначе текст не помещался */
.hall-tab { position: relative; display: flex; align-items: center; gap: .923em; width: 21.77em; height: 8.615em; padding: 1.077em; border-radius: 1.54em; border: .5px solid transparent; text-align: left; font-size: max(1.3rem, 11px); line-height: 1.2; color: rgba(240, 228, 192, .6); transition: width .8s var(--ease), gap .8s var(--ease), padding .8s var(--ease), background-color .8s var(--ease), border-color .8s var(--ease), box-shadow .8s var(--ease), color .6s var(--ease); }
.hall-tab img { width: 4.923em; height: 6.462em; border-radius: .923em; border: 1px solid rgba(79, 70, 65, .5); object-fit: cover; flex: none; }
/* колонка текста одной ширины в обоих состояниях: пока карточка меняет ширину, строки не перестраиваются */
.hall-tab__txt { display: flex; flex: none; width: 13.62em; flex-direction: column; gap: .4rem; min-width: 0; }
.hall-tab__no { align-self: flex-start; padding: .8rem 1.6rem .8rem .8rem; border-radius: 10rem; transition: background-color .8s var(--ease); }
.hall-tab__name { padding: 0 .8rem; font-weight: 500; transform-origin: 0 50%; transition: transform .8s var(--ease); }
.hall-tab__mark { position: absolute; right: 1.4rem; top: calc(50% - 2rem); width: 4rem; height: 4rem; color: var(--h-mark); opacity: 0; transform: scale(.8) rotate(-30deg); transition: opacity .8s var(--ease), transform 1.2s var(--ease), color 1s var(--ease); }
.hall-tab:hover { color: rgba(240, 228, 192, .85); }
.hall-tab[aria-selected="true"] { width: 27.15em; gap: 2.154em; padding-right: 5.385em; background: var(--h-tab); border-color: rgba(255, 255, 255, .1); box-shadow: 0 3.2rem 6.4rem rgba(0, 0, 0, .38); color: #f0e4c0; -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
.hall-tab[aria-selected="true"] img { border-color: rgba(255, 255, 255, .25); }
.hall-tab[aria-selected="true"] .hall-tab__no { background: rgba(255, 255, 255, .1); }
/* 13 -> 14 px масштабом, а не font-size: иначе строки перестраиваются скачком */
.hall-tab[aria-selected="true"] .hall-tab__name { transform: scale(1.077); }
.hall-tab[aria-selected="true"] .hall-tab__mark { opacity: 1; transform: none; }

.album { position: absolute; left: 59.6rem; top: 25.9rem; width: 48.2rem; height: 56.3rem; perspective: 120rem; }
.album__card { position: relative; width: 100%; height: 100%; border-radius: 3.6rem; background: rgba(237, 224, 196, .85); border: 1px solid rgba(201, 168, 76, .25); box-shadow: 0 4rem 8rem rgba(0, 0, 0, .5), 0 0 4rem var(--h-glow); transform-style: preserve-3d; will-change: transform; transition: background-color 1s var(--ease); }
.halls[data-hall="2"] .album__card, .halls[data-hall="3"] .album__card { background: #ede0c4; }
.album__card::after { content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; background: radial-gradient(60% 50% at var(--gx, 50%) var(--gy, 30%), rgba(255, 255, 255, .22), transparent 70%); opacity: 0; transition: opacity .6s var(--ease); }
.album.is-hover .album__card::after { opacity: 1; }
.album__face { position: absolute; inset: 0; transform-style: preserve-3d; visibility: hidden; }
.album__face.is-on { visibility: visible; }
.album__l { position: absolute; will-change: transform; }
.album__l--pill { left: 12.1rem; top: 2.5rem; width: 24rem; }
.album__l--mann { left: 5.4rem; top: 8.9rem; width: 37.4rem; }
.album__l--print { left: 19.9rem; top: 47.1rem; width: 8.4rem; }
.album__l--drop { left: 0; top: 4.6rem; width: 48.2rem; }
.album__l--sign { left: 4.9rem; top: 20rem; width: 38.5rem; }
.album__l--box { left: 14.5rem; top: 41rem; width: 19.2rem; }
.album__l--suit { left: 3.5rem; top: 7.6rem; width: 41.2rem; }
/* низ костюма растворяется в карточке. Маска на самой картинке, а не плашка поверх: плашка стояла на месте,
   а картинка при смене зала въезжает снизу и уходит в глубину, и низ пиджака вылезал из-под плашки.
   Те же границы, что у плашки макета: от 28.9 до 28.9 + 19.9 * .85 при картинке 7.6..48.8 */
.album__l--suit { -webkit-mask-image: linear-gradient(180deg, #000 51.7%, transparent 92.7%); mask-image: linear-gradient(180deg, #000 51.7%, transparent 92.7%); }

.curator { position: absolute; left: 128rem; top: 4rem; width: 60rem; height: 100rem; padding: 2.4rem; border-radius: 2rem; border: 1px solid rgba(201, 168, 76, .05); background: var(--h-panel); box-shadow: 0 1.4rem 6.4rem rgba(0, 0, 0, .1); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); overflow: hidden; transition: background-color 1s var(--ease); }
.curator template { display: none; }
.curator__meta { font-size: max(1.1rem, 10px); line-height: 1.3; text-transform: uppercase; color: var(--h-meta); }
.curator__title { margin-top: 3rem; padding-bottom: 3rem; border-bottom: 1px solid rgba(216, 184, 143, .3); font-family: var(--serif); font-weight: 400; font-size: 4rem; line-height: 1.125; color: var(--h-ttl); }
.curator__list { display: flex; flex-direction: column; gap: 1.2rem; margin-top: 3rem; }
.curator__list li { display: flex; gap: 2rem; padding: 2.4rem 2.2rem; border-radius: 1rem; background: var(--h-item); }
.curator__list img { width: 12rem; height: 13rem; flex: none; border-radius: .8rem; border: 1px solid rgba(156, 128, 85, .2); object-fit: cover; }
.curator__list h4 { display: flex; align-items: center; gap: .8rem; padding-bottom: 1rem; margin-bottom: 1rem; border-bottom: 1px solid rgba(216, 184, 143, .06); font-weight: 400; font-size: max(2rem, 14px); line-height: 1.2; color: rgba(255, 227, 191, .8); }
.curator__list h4 svg { width: 1.9rem; height: 2.4rem; flex: none; color: var(--h-icon); }
.curator__list p { font-size: max(1.4rem, 12px); line-height: 1.3; color: rgba(255, 255, 255, .8); }

/* ---------- 6. коллекция как искусство ---------- */

.art { height: 107.9rem; }
.art__head { position: absolute; left: 50%; top: 7.5rem; width: 78.2rem; transform: translateX(-50%); text-align: center; }
.art__title { margin-top: 6rem; font-family: var(--serif); font-weight: 400; font-size: 7.2rem; line-height: .8; letter-spacing: -.03em; color: var(--ink); }
.art__title b { text-transform: uppercase; }
.art__title em { font-style: normal; color: #a8885c; }
.art__row { position: absolute; left: calc(50% - 50vw); right: calc(50% - 50vw); top: 53rem; height: 50rem; --dur: 85s; }
.art__row .marquee__track { align-items: flex-end; height: 100%; gap: 7.6rem; padding-right: 7.6rem; }
.art__row li { flex: none; width: calc(var(--w) * .1rem); height: calc(var(--h) * .1rem); }
.art__row img { width: 100%; height: 100%; object-fit: contain; object-position: bottom; }

/* ---------- 7. экосистема ---------- */

/* высота растет вместе с раскрытым пунктом аккордеона */
.eco { min-height: 108.5rem; }
.eco .sec__in { padding: 10rem 0 9.9rem 8.3rem; }
.eco__body { position: relative; width: 79.4rem; display: flex; flex-direction: column; gap: 9.9rem; }
.eco__top { display: flex; flex-direction: column; gap: 1.6rem; }
.eco__title { font-family: var(--serif); font-weight: 400; font-size: 7.2rem; line-height: .9; letter-spacing: -.02em; color: var(--ink); }
.eco__bottom { display: flex; flex-direction: column; align-items: flex-start; }
.eco__rule { width: 100%; height: 1px; margin-top: 4rem; background: rgba(190, 179, 163, .3); }
.eco__text { margin-top: 1.5rem; font-weight: 300; font-size: max(2rem, 14px); line-height: 1.3; letter-spacing: -.02em; color: #77615e; }
.acc { width: 100%; margin-top: 6rem; }
.acc__it { border-top: 1px solid #beb3a3; }
.acc__btn { display: flex; align-items: center; gap: 2.4rem; width: 100%; min-height: 7.2rem; padding: .4rem 0; text-align: left; color: #4a3228; }
.acc__no { width: 2.6rem; font-weight: 200; font-size: 2.6rem; line-height: 1; }
.acc__name { flex: 1; font-size: max(2rem, 14px); line-height: 1.2; }
.acc__ic { fill: none; width: 2.5rem; height: 2.5rem; color: #beb3a3; transition: transform .9s var(--ease), color .6s var(--ease); }
.acc__btn:hover .acc__ic { color: #a8885c; }
.acc__btn[aria-expanded="true"] .acc__ic { transform: rotate(45deg); color: #a8885c; }
.acc__panel { overflow: hidden; }
.acc__panel p { padding: 0 0 2.4rem 5rem; font-weight: 300; font-size: max(1.8rem, 14px); line-height: 1.35; color: #77615e; }

.eco__stage { position: absolute; left: 97rem; top: 4.1rem; width: 91rem; height: 101.8rem; background: #000; }
.eco__glow { position: absolute; left: 7.4rem; top: 21.7rem; width: 72rem; height: 72rem; background: radial-gradient(closest-side, rgba(255, 203, 132, .55), rgba(201, 150, 90, .18) 55%, transparent); pointer-events: none; }
.eco__l { position: absolute; will-change: transform; }
.eco__phone { left: 28.9rem; top: 16.2rem; width: 33.2rem; }
.eco__app { left: 29.8rem; top: 17rem; width: 31.4rem; }
.eco__c--pill { left: 35.5rem; top: 8.1rem; width: 20rem; }
.eco__c--stylist { left: 8.4rem; top: 20.6rem; width: 14.1rem; }
.eco__c--wardrobe { left: 68.6rem; top: 25.9rem; width: 14.6rem; }
.eco__c--coll { left: 6.8rem; top: 47.5rem; width: 17.1rem; }
.eco__c--caps { left: 70.1rem; top: 52rem; width: 15.8rem; }
.eco__c--card { left: 12.9rem; top: 78.2rem; width: 22.8rem; }
.eco__c--atelier { left: 64.1rem; top: 76.7rem; width: 17.4rem; }

/* ---------- 8. галерея ---------- */

.gal { height: 108.5rem; background: #1b0809; }
.gal__stage { position: absolute; left: 4rem; top: 12.5rem; width: 153rem; height: 85.5rem; perspective: 400rem; overflow: hidden; background: #120607; }
.gal__face { position: absolute; inset: 0; overflow: hidden; backface-visibility: hidden; }
.gal__face[hidden] { display: none; }
.gal__imgs { position: absolute; inset: 0; background: #120607; }
.gal__img { position: absolute; inset: 0; opacity: 0; }
.gal__img.is-on { opacity: 1; }
.gal__img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; }
.gal__img .gal__blur { object-fit: cover; filter: blur(40px) brightness(.55); transform: scale(1.15); }
.gal__img--wide img:not(.gal__blur) { object-fit: cover; }
.gal__shade { position: absolute; left: 0; right: 0; bottom: 0; height: 30.4rem; background: linear-gradient(180deg, transparent, rgba(0, 0, 0, .85)); pointer-events: none; }
.gal__info-btn { position: absolute; right: 3.4rem; top: 2.4rem; color: #ffdcaf; }
.gal__info-btn svg { width: 2.4rem; height: 2.4rem; }
.gal__bar { position: absolute; left: 3.4rem; right: 3.4rem; bottom: 3.4rem; display: flex; align-items: center; justify-content: space-between; }
.gal__caption { font-family: var(--serif); font-weight: 700; font-size: max(2rem, 14px); line-height: 1.15; color: rgba(250, 235, 222, .7); }
.gal__caption span { margin-left: 2rem; font-weight: 400; }

.gal__info { background: #fbead5 image-set(url("../img/bg/paper-1530.avif?v=20261006zk") type("image/avif") 1x, url("../img/bg/paper-3060.avif?v=20261006zk") type("image/avif") 2x, url("../img/bg/paper-1530.webp?v=20261006zk") type("image/webp") 1x, url("../img/bg/paper-3060.webp?v=20261006zk") type("image/webp") 2x) center / cover; color: #220f01; }
.gal__info .pill { position: absolute; left: 6.5rem; top: 6.6rem; }
.gal__close { position: absolute; right: 6.5rem; top: 6.6rem; display: grid; place-items: center; width: 6.5rem; height: 6.5rem; border-radius: 50%; background: rgba(255, 248, 237, .7); border: 1px solid rgba(113, 95, 79, .24); color: #715f4f; transition: background-color .5s var(--ease), transform .8s var(--ease); }
.gal__close:hover { background: var(--cream); transform: rotate(90deg); }
.gal__close svg { width: 2rem; height: 2rem; }
.gal__info-title { position: absolute; left: 6.5rem; top: 23.7rem; font-family: var(--serif); font-weight: 400; font-size: 11.4rem; line-height: .8; letter-spacing: -.02em; text-transform: uppercase; background: linear-gradient(180deg, #a58763, #7b6146); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; padding-bottom: .22em; }
.gal__info-title .line, .gal__info-title .word { background: linear-gradient(180deg, #a58763, #7b6146); -webkit-background-clip: text; background-clip: text; }
.gal__info-rule { position: absolute; left: 6.5rem; top: 62.3rem; width: 140rem; height: 2px; background: #d2c0b1; box-shadow: 0 -1px 0 #fff inset; transform-origin: left; }
.gal__info-cols { position: absolute; left: 6.5rem; top: 65.6rem; display: flex; gap: 12rem; }
.gal__info-cols p { width: 45.4rem; font-size: max(2rem, 14px); line-height: 1.4; color: rgba(34, 15, 1, .7); }
.gal__info-cols p + p { width: 41.2rem; }
.gal__info-cols span { display: block; margin-bottom: 1.3rem; font-weight: 200; font-size: 2.6rem; }

.gal__grid { overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #674b3f transparent; }
.gal__tiles { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.gal__tile { position: relative; display: block; width: 100%; height: 20.6rem; overflow: hidden; border: 1px solid rgba(216, 184, 143, .07); transition: border-radius .9s var(--ease), border-color .9s var(--ease); }
.gal__tile img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--ease); }
.gal__tile::before { content: ""; position: absolute; inset: 0; z-index: 1; background: rgba(0, 0, 0, .5); opacity: 0; transition: opacity .9s var(--ease); }
.gal__tile-open { position: absolute; z-index: 2; left: 50%; top: 50%; display: flex; align-items: center; gap: 1rem; transform: translate(-50%, -30%); opacity: 0; font-size: max(1.4rem, 12px); text-transform: uppercase; letter-spacing: .05em; color: var(--gold); transition: opacity .7s var(--ease), transform .9s var(--ease); }
.gal__tile-open svg { width: 2rem; height: 2rem; }
.gal__tile:hover, .gal__tile:focus-visible { border-radius: 10rem; border-color: var(--gold); outline: 0; }
.gal__tile:hover img, .gal__tile:focus-visible img { transform: scale(1.06); }
.gal__tile:hover::before, .gal__tile:focus-visible::before { opacity: 1; }
.gal__tile:hover .gal__tile-open, .gal__tile:focus-visible .gal__tile-open { opacity: 1; transform: translate(-50%, -50%); }

.gal__side { position: absolute; left: 159rem; top: 12.5rem; width: 29.1rem; height: 85.4rem; display: flex; flex-direction: column; }
.gal__next { position: relative; display: block; width: 100%; height: 17.1rem; overflow: hidden; }
/* наведение увеличивает общую обертку, а не сами кадры: у кадров только прозрачность, смена идет без скачков масштаба */
.gal__next-pics { position: absolute; inset: 0; transition: transform 1.2s var(--ease); }
.gal__next img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.gal__next::before { content: ""; position: absolute; inset: 0; z-index: 1; background: rgba(0, 0, 0, .4); transition: background-color .6s var(--ease); }
.gal__next:hover::before { background: rgba(0, 0, 0, .25); }
.gal__next:hover .gal__next-pics { transform: scale(1.05); }
.gal__next-txt { position: absolute; z-index: 2; left: 50%; top: 50%; transform: translate(-50%, -50%); font-size: max(1.6rem, 12px); text-transform: uppercase; color: #c8b9b6; white-space: nowrap; }
.gal__next-txt sup { position: absolute; left: 100%; top: -1.2rem; margin-left: -.6rem; font-size: max(1.24rem, 10px); }
.gal__contacts { margin-top: 6.6rem; display: flex; flex-direction: column; gap: 5.1rem; }
.gal__contacts li, .foot__socials { display: flex; flex-direction: column; gap: 2rem; padding-top: 2rem; border-top: 1px solid #674b3f; }
.gal__contacts li:not(.gal__socials) { flex-direction: row; justify-content: space-between; align-items: center; }
.gal__contacts li:not(.gal__socials) > :first-child, .fade-link span:first-child { font-weight: 500; font-size: max(1.4rem, 11px); line-height: 1; letter-spacing: .07em; text-transform: uppercase; color: var(--gold); }
.gal__contacts li > span:last-child, .fade-link span:last-child { font-weight: 500; font-size: max(1.2rem, 10px); letter-spacing: .08em; color: rgba(216, 184, 143, .7); }
.fade-link { display: flex; justify-content: space-between; align-items: center; }
.gal__switch { position: relative; margin-top: auto; height: 7.7rem; border-bottom: 1px solid #7d6448; font-size: max(1.8rem, 13px); color: rgba(216, 184, 143, .8); transition: background-color .6s var(--ease); }
.gal__switch .ulink { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); transition: opacity .6s var(--ease); }
/* как у «Формы обратной связи» на первом экране: одна линия, при наведении перебегает, значок сдвигается */
.gal__switch { border-bottom: 0; }
.gal__switch::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: #7d6448; transform-origin: left; }
.gal__switch:hover::after, .gal__switch:focus-visible::after { animation: line-swap .9s var(--ease-io); }
.gal__switch .ulink::after { display: none; }
.gal__switch .ulink svg { transition: transform .7s var(--ease); }
.gal__switch-grid svg { fill: none; }
.gal__switch:hover .gal__switch-grid svg { transform: translateX(.6rem); }
.gal__switch:hover .gal__switch-back svg { transform: translateX(-.6rem); }
.gal__switch svg { width: 2rem; height: 2rem; color: #7d6448; }
.gal__switch-back { opacity: 0; }
.gal__switch-back svg { width: .9rem; height: 1.4rem; color: var(--gold); }
.gal[data-view="grid"] .gal__switch { background: rgba(216, 184, 143, .05); }
.gal[data-view="grid"] .gal__switch-grid { opacity: 0; }
.gal[data-view="grid"] .gal__switch-back { opacity: 1; }

/* ---------- 9. финал ---------- */

.fin { height: 245.6rem; background: #1b0809; }
.fin__bg { background: var(--wine) image-set(url("../img/bg/finale-wide-3840.avif?v=20261006zk") type("image/avif") 1x, url("../img/bg/finale-wide-7680.avif?v=20261006zk") type("image/avif") 2x, url("../img/bg/finale-wide-3840.webp?v=20261006zk") type("image/webp") 1x, url("../img/bg/finale-wide-7680.webp?v=20261006zk") type("image/webp") 2x) center top / auto 183.8rem no-repeat; }
.fin__bg::before { content: ""; position: absolute; left: 0; right: 0; top: 140rem; height: 44rem; background: linear-gradient(180deg, rgba(27, 8, 9, 0), var(--wine)); }
.fin__bg::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 61.4rem; background: radial-gradient(70% 100% at 50% 100%, rgba(40, 9, 10, 0) 66%, var(--wine)); }
.fin__mark { position: absolute; left: 37.6rem; top: 39.2rem; width: 116.8rem; opacity: .37; mix-blend-mode: soft-light; pointer-events: none; }
.fin__logo { position: absolute; left: 0; right: 0; top: 22.8rem; width: 17.2rem; height: 5rem; margin: 0 auto; color: #fff1b8; }

.carousel { touch-action: pan-y; position: absolute; left: 0; right: 0; top: 60.8rem; height: 65rem; }
/* кадры двигаются сдвигом и масштабом (main.js, carousel): каждый на своем слое, координаты целые */
.carousel__track { position: absolute; inset: 0; }
.carousel__it { position: absolute; overflow: hidden; cursor: pointer; will-change: transform; }
.carousel__it img { width: 100%; height: 100%; object-fit: cover; color: transparent; font-size: 0; }
.carousel__it::after { content: ""; position: absolute; inset: 0; background: #000; opacity: var(--dim, 0); transition: opacity .9s var(--ease); pointer-events: none; }
/* нижнее затемнение есть у каждого кадра и плавно проявляется на центральном */
.carousel__it::before { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 49%; z-index: 1; background: linear-gradient(180deg, transparent, #000); opacity: 0; transition: opacity 1.3s var(--ease-io); pointer-events: none; }
.carousel__it.is-center::before { opacity: 1; }
.carousel__meta { position: absolute; left: 50%; top: 52.4rem; z-index: 3; width: 30.8rem; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: 1.3rem; font-family: var(--pf); font-style: italic; font-weight: 900; font-size: max(1.4rem, 12px); color: #d2b998; pointer-events: none; }
.carousel__bar { position: relative; width: 100%; height: 2px; background: rgba(216, 184, 143, .2); }
.carousel__bar i { position: absolute; left: 0; top: 0; height: 100%; width: 20%; background: var(--gold); transition: transform .9s var(--ease); }
.carousel .glass { position: absolute; top: 29.2rem; z-index: 4; }
.carousel .glass svg { color: rgba(250, 235, 222, .5); }
.carousel__prev { left: 21rem; }
.carousel__next { right: 14.5rem; }

.fin__word { position: absolute; left: 0; right: 0; top: 137.5rem; width: 87.4rem; margin: 0 auto; font-family: var(--serif); font-size: 3.2rem; line-height: 1.19; text-align: center; color: #d2b998; }
.fin__vline { position: absolute; left: 96rem; top: 168.1rem; width: 1.5px; height: 29rem; background: rgba(130, 67, 81, .5); transform-origin: top; }
.fin__hline { position: absolute; left: 4rem; right: 4rem; top: 205.4rem; height: 1.5px; background: rgba(130, 67, 81, .5); }
.fin__vline::after { content: ""; position: absolute; left: 50%; bottom: -3px; width: 7px; height: 7px; border-radius: 50%; transform: translateX(-50%); background: #f0d9a8; box-shadow: 0 0 14px 5px rgba(216, 184, 143, .5); opacity: var(--tip, 0); pointer-events: none; }

.foot { position: absolute; left: 4rem; right: 4rem; top: 214.3rem; height: 28.1rem; color: #c4b5a3; }
.foot__logo { position: absolute; left: 0; top: 1.9rem; width: 68.7rem; height: 20rem; color: var(--gold); }
.foot__socials { position: absolute; right: 1.2rem; top: 7rem; width: 29.1rem; padding: 0; border: 0; gap: 2rem; }
.foot__nav { position: absolute; right: 0; top: 16.4rem; display: flex; gap: 5.5rem; font-weight: 600; font-size: max(1.4rem, 11px); line-height: 1.3; letter-spacing: .086em; text-transform: uppercase; }
.foot__nav .ulink { padding: .8rem 1.2rem; }
.foot__nav .ulink::after { bottom: .4rem; left: 1.2rem; right: 1.2rem; }
.foot__note, .foot__copy { position: absolute; top: 26.3rem; font-size: max(1.1rem, 10px); line-height: 1.6; color: rgba(123, 112, 104, .9); }
.foot__note { left: 93.2rem; }
.foot__copy { right: 0; }

/* ---------- форма ---------- */

.form-dlg { width: min(56rem, calc(100vw - 32px)); max-height: calc(100svh - 32px); padding: 0; border: 1px solid rgba(216, 184, 143, .2); border-radius: 2rem; background: #22090b; color: var(--gold); overflow: auto; scrollbar-width: none; }
.form-dlg::-webkit-scrollbar { display: none; }
.form-dlg::backdrop { background: rgba(12, 3, 4, .72); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.form-dlg[open] { animation: dlg-in .8s var(--ease); }
@keyframes dlg-in { from { opacity: 0; transform: translateY(2rem); } }
.lead { position: relative; display: flex; flex-direction: column; gap: 2.4rem; padding: 6rem 5rem 5rem; font-size: max(1.6rem, 14px); }
.lead__close { position: absolute; right: 2.4rem; top: 2.4rem; width: 4rem; height: 4rem; display: grid; place-items: center; color: rgba(216, 184, 143, .7); }
.lead__close svg { width: 1.8rem; height: 1.8rem; }
.lead__mark { width: 5rem; height: 5rem; color: rgba(216, 184, 143, .5); }
.lead__title { padding-right: 3rem; font-family: var(--serif); font-weight: 400; font-size: max(3.2rem, 22px); line-height: 1.05; text-transform: uppercase; color: var(--gold); text-wrap: balance; }
.lead__text { margin-top: -.8rem; font-weight: 300; line-height: 1.45; color: rgba(245, 239, 230, .78); }
.lead__f { display: flex; flex-direction: column; gap: .8rem; }
.lead__f > span { font-size: max(1.2rem, 11px); letter-spacing: .1em; text-transform: uppercase; color: rgba(216, 184, 143, .7); }
.lead__f i { font-style: normal; letter-spacing: .04em; text-transform: none; opacity: .7; }
.lead__f input, .lead__f textarea { width: 100%; padding: 1.2rem 0; border: 0; border-bottom: 1px solid #674b3f; background: none; color: #f5efe6; font: inherit; font-size: max(2rem, 16px); outline: 0; transition: border-color .5s var(--ease); }
.lead__f textarea { resize: none; scrollbar-width: none; min-height: 2.8em; field-sizing: content; max-height: 8em; font-size: max(1.7rem, 16px); line-height: 1.4; }
.lead__f textarea::-webkit-scrollbar { display: none; }
.lead__f input::placeholder { color: rgba(245, 239, 230, .3); }
.lead__f input:focus, .lead__f textarea:focus { border-color: var(--gold); }
.lead__f input[aria-invalid="true"] { border-color: #c56a5a; }
.lead__q { display: flex; flex-direction: column; gap: 1rem; margin: 0; padding: 0; border: 0; min-width: 0; }
.lead__q legend { margin-bottom: 1.2rem; padding: 0; font-size: max(1.2rem, 11px); letter-spacing: .1em; text-transform: uppercase; color: rgba(216, 184, 143, .7); }
.lead__opt { position: relative; display: flex; align-items: center; gap: 1.4rem; padding: 1.2rem 1.6rem; border: 1px solid #4a342c; border-radius: 1.2rem; color: #f5efe6; cursor: pointer; transition: border-color .5s var(--ease), background-color .5s var(--ease); }
.lead__opt input { position: absolute; opacity: 0; pointer-events: none; }
.lead__opt span::before { content: ""; flex: none; width: 1.8rem; height: 1.8rem; min-width: 14px; min-height: 14px; border: 1px solid #8a6d55; border-radius: 50%; transition: box-shadow .5s var(--ease), border-color .5s var(--ease); }
.lead__opt span { display: flex; align-items: center; gap: 1.4rem; }
.lead__opt:hover { border-color: #7a5b47; }
.lead__opt:has(input:checked) { border-color: var(--gold); background: rgba(216, 184, 143, .07); }
.lead__opt input:checked + span::before { border-color: var(--gold); box-shadow: inset 0 0 0 .4rem #22090b, inset 0 0 0 1rem var(--gold); }
.lead__opt input:focus-visible + span::before { outline: 2px solid var(--gold); outline-offset: 2px; }
.lead__q[aria-invalid="true"] .lead__opt { border-color: #c56a5a; }
.lead__err { margin-top: -1.6rem; font-size: max(1.3rem, 13px); line-height: 1.35; color: #e08b7a; }
.lead__err:empty { display: none; }
.lead__ok:has(input[aria-invalid="true"]) input { outline: 1px solid #e08b7a; outline-offset: 2px; }
.lead__hp { position: absolute; left: -9999px; width: 1px; height: 1px; opacity: 0; }
.lead__ok { display: flex; gap: 1.2rem; align-items: flex-start; font-size: max(1.3rem, 12px); line-height: 1.4; color: rgba(216, 184, 143, .75); }
.lead__ok input { margin: .2em 0 0; accent-color: var(--gold); width: 1.6rem; height: 1.6rem; flex: none; }
.lead__ok a { text-decoration: underline; text-underline-offset: 2px; }
.lead__send { align-self: flex-start; padding: 1.2rem 0; text-transform: uppercase; color: #f5efe6; }
.lead__send:disabled { opacity: .5; cursor: wait; }
.lead__msg { min-height: 1.4em; font-size: max(1.4rem, 13px); }

/* ---------- состояния анимаций ---------- */

/* маска строки заголовка: запас сверху и снизу, чтобы кромка не срезала надстрочные и подстрочные элементы */
.line-mask { padding-block: .14em; margin-block: -.14em; }
/* соседние отступы схлопываются в один: без этого каждая строка в маске получала лишние .14em и заголовок разъезжался */
.line-mask + .line-mask { margin-top: -.28em; }
.js [data-r], .js [data-petal] { visibility: hidden; }
.is-ready [data-r], .is-ready [data-petal], .no-motion [data-r], .no-motion [data-petal] { visibility: visible; }

/* ---------- мобильная раскладка ---------- */

@media (max-width: 1099px) {
  html { font-size: min(calc(100vw / 39), 11px); }
  body { font-size: 15px; }
  .sec { height: auto !important; min-height: 0; }
  .sec__in { padding: 0 16px; }

  .hero { min-height: 100svh; display: flex; }
  .hero .sec__in { display: flex; flex-direction: column; justify-content: center; min-height: 100svh; padding: 120px 16px 48px; }
  /* меню строкой сверху, логотип под ним: на узком экране логотип садился на «Контакты» */
  .nav { padding: 20px 16px; }
  .nav__side { gap: 18px; font-size: 11px; letter-spacing: .1em; white-space: nowrap; }
  .nav__logo { top: 54px; width: 84px; }
  .nav__logo svg { width: 84px; height: 25px; }
  .hero__body { position: relative; left: 0; top: 0; width: 100%; transform: none; text-align: center; }
  .hero__mark { width: 64px; height: 64px; }
  .hero__kicker { margin-top: 40px; font-size: 16px; text-align: center; }
  .hero__title { margin-top: 12px; font-size: clamp(42px, 12vw, 84px); }
  .hero__lead { width: auto; max-width: 420px; margin: 24px auto 0; font-size: 13px; text-align: center; }
  .hero__cta { position: relative; left: 0; bottom: 0; transform: none; align-self: center; margin-top: 48px; font-size: 13px; padding: 12px 8px; }

  .reveal .sec__in { padding: 96px 16px 80px; }
  .reveal__bg { background-image: image-set(url("../img/bg/reveal-1600.avif?v=20261006zk") type("image/avif") 1x, url("../img/bg/reveal-2560.avif?v=20261006zk") type("image/avif") 2x, url("../img/bg/reveal-1600.webp?v=20261006zk") type("image/webp") 1x, url("../img/bg/reveal-2560.webp?v=20261006zk") type("image/webp") 2x); background-size: cover; }
  .reveal__head { position: relative; left: 0; top: 0; width: 100%; transform: none; }
  .reveal__title { font-size: clamp(34px, 9.5vw, 64px); }
  .reveal__lead { width: auto; max-width: 340px; font-size: 15px; margin-top: 28px; }
  .reveal__emboss { position: relative; left: 0; top: 0; transform: none; width: 136px; margin: 32px auto 0; }
  .series { position: relative; left: 0; right: 0; top: 0; margin-top: 64px; grid-template-columns: 1fr; gap: 56px; }
  .series__item { height: auto; }
  .series__petal, .series__petal--1, .series__petal--3 { width: 96px; height: auto; margin-bottom: 24px; }
  .series__petal--2 { width: 120px; height: auto; margin-bottom: 24px; }
  .series__box { padding: 32px 8px 0; margin-top: 18px; }
  .series__title { font-size: 34px; }
  .series__text { margin-top: 18px; font-size: 15px; }

  .digital .sec__in { display: flex; flex-direction: column; gap: 40px; padding: 16px 16px 72px; }
  .digital__photo { position: relative; left: 0; top: 0; width: 100%; height: auto; aspect-ratio: 910 / 1018; }
  .digital__body { position: relative; left: 0; top: 0; width: 100%; height: auto; gap: 48px; }
  .digital__top { gap: 16px; }
  .digital__title { font-size: clamp(36px, 11vw, 72px); }
  .digital__text { font-size: 19px; }

  .brands .sec__in { height: 72vw; max-height: 520px; min-height: 300px; padding: 0; }
  .brands__it { font-size: 34px; gap: 24px; }
  .brands__row .marquee__track { gap: 24px; padding-right: 24px; }
  .fabrics { width: 52vw; height: 52vw; max-width: 340px; max-height: 340px; }

  .halls .sec__in { display: flex; flex-direction: column; gap: 32px; padding: 72px 16px; }
  .halls__title { position: relative; left: 0; top: 0; font-size: 40px; }
  .halls__hint { display: none; }
  .intro__logo { width: 40vw; height: calc(40vw * 295 / 1012); }
  /* залы на телефоне: все три столбиком, без скрытой прокрутки; выбранный на плашке, у остальных стрелка */
  .halls__tabs { position: relative; left: 0; top: 0; width: 100%; flex-direction: column; gap: 8px; }
  .hall-tab, .hall-tab[aria-selected="true"] { width: 100%; height: auto; min-height: 64px; gap: 12px; padding: 8px 44px 8px 8px; border-radius: 14px; font-size: 13px; box-shadow: none; }
  .hall-tab { border-color: rgba(240, 228, 192, .1); }
  .hall-tab img { width: 40px; height: 52px; border-radius: 8px; }
  .hall-tab__txt { flex: 1; width: auto; gap: 2px; }
  .hall-tab__no { padding: 4px 10px 4px 6px; font-size: 11px; }
  .hall-tab__name { padding: 0 6px; }
  .hall-tab[aria-selected="true"] .hall-tab__name { font-size: 13px; transform: none; }
  .hall-tab__mark { right: 12px; top: calc(50% - 14px); width: 28px; height: 28px; }
  .hall-tab::after { content: ""; position: absolute; right: 18px; top: calc(50% - 5px); width: 9px; height: 9px; border-top: 1.5px solid currentColor; border-right: 1.5px solid currentColor; transform: rotate(45deg); opacity: .7; transition: opacity .6s var(--ease); }
  .hall-tab[aria-selected="true"]::after { opacity: 0; }
  .album { position: relative; left: 0; top: 0; width: min(100%, 360px); height: auto; aspect-ratio: 482 / 563; margin: 0 auto; font-size: calc(min(100vw - 32px, 360px) / 48.2); }
  .album__card { border-radius: 26px; }
  .album__l--pill { left: 12.1em; top: 2.5em; width: 24em; }
  .album__l--mann { left: 5.4em; top: 8.9em; width: 37.4em; }
  .album__l--print { left: 19.9em; top: 47.1em; width: 8.4em; }
  .album__l--drop { top: 4.6em; width: 48.2em; }
  .album__l--sign { left: 4.9em; top: 20em; width: 38.5em; }
  .album__l--box { left: 14.5em; top: 41em; width: 19.2em; }
  .album__l--suit { left: 3.5em; top: 7.6em; width: 41.2em; }
  .curator { position: relative; left: 0; top: 0; width: 100%; height: auto; padding: 20px; }
  .curator__meta { font-size: 11px; }
  .curator__title { font-size: 26px; margin-top: 16px; padding-bottom: 18px; }
  .curator__list { margin-top: 18px; gap: 10px; }
  .curator__list li { gap: 14px; padding: 14px; }
  .curator__list img { width: 72px; height: 80px; }
  .curator__list h4 { font-size: 16px; }
  .curator__list h4 svg { width: 14px; height: 18px; }
  .curator__list p { font-size: 13px; }

  .art .sec__in { padding: 72px 0 40px; }
  .art__head { position: relative; left: 0; top: 0; width: 100%; padding: 0 16px; transform: none; }
  .mark64 { width: 48px; height: 48px; }
  .art__title { margin-top: 32px; font-size: clamp(30px, 8.6vw, 56px); }
  .art__row { position: relative; top: 0; height: 300px; margin-top: 48px; }
  .art__row .marquee__track { gap: 32px; padding-right: 32px; }
  .art__row li { width: calc(var(--w) * .6px); height: calc(var(--h) * .6px); }

  .eco .sec__in { display: flex; flex-direction: column; gap: 48px; padding: 72px 16px; }
  .eco__body { position: relative; left: 0; top: 0; width: 100%; height: auto; gap: 48px; }
  .eco__title { font-size: clamp(32px, 9vw, 56px); }
  .pill { padding: 12px 18px; gap: 12px; font-size: 14px; }
  .pill svg { width: 15px; height: 19px; }
  .eco__text { font-size: 16px; }
  .acc { margin-top: 32px; }
  .acc__btn { min-height: 60px; gap: 14px; }
  .acc__no { font-size: 22px; width: 22px; }
  .acc__name { font-size: 16px; }
  .acc__ic { width: 20px; height: 20px; }
  .acc__panel p { padding-left: 36px; font-size: 15px; }
  .eco__stage { position: relative; left: 0; top: 0; width: 100%; height: auto; aspect-ratio: 910 / 1018; font-size: calc((100vw - 32px) / 91); }
  .eco__stage > * { font-size: inherit; }
  .eco__glow { left: 7.4em; top: 21.7em; width: 72em; height: 72em; }
  .eco__phone { left: 28.9em; top: 16.2em; width: 33.2em; }
  .eco__app { left: 29.8em; top: 17em; width: 31.4em; }
  .eco__c--pill { left: 35.5em; top: 8.1em; width: 20em; }
  .eco__c--stylist { left: 8.4em; top: 20.6em; width: 14.1em; }
  .eco__c--wardrobe { left: 68.6em; top: 25.9em; width: 14.6em; }
  .eco__c--coll { left: 6.8em; top: 47.5em; width: 17.1em; }
  .eco__c--caps { left: 70.1em; top: 52em; width: 15.8em; }
  .eco__c--card { left: 12.9em; top: 78.2em; width: 22.8em; }
  .eco__c--atelier { left: 64.1em; top: 76.7em; width: 17.4em; }

  .gal .sec__in { display: flex; flex-direction: column; gap: 24px; padding: 56px 16px; }
  .gal__stage { position: relative; left: 0; top: 0; width: 100%; height: auto; aspect-ratio: 4 / 5; }
  .glass { width: 48px; height: 48px; }
  .glass svg { width: 8px; height: 13px; }
  .gal__info-btn { right: 14px; top: 14px; }
  .gal__info-btn svg { width: 20px; height: 20px; }
  .gal__bar { left: 14px; right: 14px; bottom: 14px; }
  .gal__caption { font-size: 14px; text-align: center; }
  .gal__caption span { display: block; margin: 4px 0 0; }
  .gal__info .pill { left: 18px; top: 18px; }
  .gal__close { right: 18px; top: 18px; width: 44px; height: 44px; }
  /* в колонку: на коротком экране линия не наезжает на заголовок */
  .gal__info:not([hidden]) { display: flex; flex-direction: column; padding: 76px 18px 18px; overflow-y: auto; }
  .gal__info-title { position: static; font-size: clamp(24px, 8vw, 56px); line-height: .98; padding-bottom: 0; }
  .gal__info-rule { position: static; flex: none; width: 100%; margin: 12px 0 0; }
  .gal__info-cols { position: static; margin-top: auto; padding-top: 16px; flex-direction: column; gap: 14px; }
  .gal__info-cols p, .gal__info-cols p + p { width: auto; font-size: 14px; }
  .gal__info-cols span { font-size: 18px; margin-bottom: 4px; }
  .gal__tiles { grid-template-columns: repeat(2, 1fr); gap: 6px; }
  .gal__tile { height: auto; aspect-ratio: 375 / 206; }
  /* на телефоне переключатель «Галерея / Назад» стоит над фото, контакты под ним */
  .gal__side { display: contents; }
  .gal__stage { order: 1; }
  .gal__contacts { order: 2; }
  .gal__next { display: none; }
  .gal__contacts { margin-top: 8px; gap: 28px; }
  .gal__switch { order: 0; width: 100%; margin: 0 0 -8px; height: 52px; font-size: 15px; }

  .fin .sec__in { padding: 72px 0 32px; }
  .fin__bg { background-image: image-set(url("../img/bg/finale-1600.avif?v=20261006zk") type("image/avif") 1x, url("../img/bg/finale-2560.avif?v=20261006zk") type("image/avif") 2x, url("../img/bg/finale-1600.webp?v=20261006zk") type("image/webp") 1x, url("../img/bg/finale-2560.webp?v=20261006zk") type("image/webp") 2x); background-size: cover; }
  .halls__bg > i { background-size: cover; }
  .halls__bg > i:nth-child(1) { background-image: image-set(url("../img/bg/hall-1-1600.avif?v=20261006zk") type("image/avif") 1x, url("../img/bg/hall-1-2560.avif?v=20261006zk") type("image/avif") 2x, url("../img/bg/hall-1-1600.webp?v=20261006zk") type("image/webp") 1x, url("../img/bg/hall-1-2560.webp?v=20261006zk") type("image/webp") 2x); }
  .halls__bg > i:nth-child(2) { background-image: image-set(url("../img/bg/hall-2-1600.avif?v=20261006zk") type("image/avif") 1x, url("../img/bg/hall-2-2560.avif?v=20261006zk") type("image/avif") 2x, url("../img/bg/hall-2-1600.webp?v=20261006zk") type("image/webp") 1x, url("../img/bg/hall-2-2560.webp?v=20261006zk") type("image/webp") 2x); }
  .halls__bg > i:nth-child(3) { background-image: image-set(url("../img/bg/hall-3-1600.avif?v=20261006zk") type("image/avif") 1x, url("../img/bg/hall-3-2560.avif?v=20261006zk") type("image/avif") 2x, url("../img/bg/hall-3-1600.webp?v=20261006zk") type("image/webp") 1x, url("../img/bg/hall-3-2560.webp?v=20261006zk") type("image/webp") 2x); }
  .fin__mark { left: 50%; top: 200px; width: 120%; max-width: none; transform: translateX(-50%); }
  .fin__logo { position: relative; left: 0; top: 0; transform: none; margin: 0 auto; width: 120px; height: 35px; }
  .carousel { position: relative; top: 0; margin-top: 48px; height: 440px; }
  .carousel__meta { top: 360px; width: 180px; }
  .carousel .glass { top: auto; bottom: -64px; }  /* стрелки под кадром, а не на нем и не на счетчике */
  .carousel__prev { left: calc(50% - 64px); }
  .carousel__next { right: calc(50% - 64px); }
  .fin__word { position: relative; left: 0; top: 0; width: auto; transform: none; margin: 120px 16px 0; font-size: clamp(19px, 5vw, 28px); }
  .fin__vline { position: relative; display: block; left: 50%; top: 0; height: 120px; margin-top: 40px; }
  .fin__hline { position: relative; display: block; left: 0; right: 0; top: 0; margin: 40px 16px 0; }
  .foot { position: relative; left: 0; right: 0; top: 0; height: auto; display: flex; flex-direction: column; gap: 32px; padding: 32px 16px 0; }
  .foot__logo { position: relative; top: 0; width: 100%; height: auto; aspect-ratio: 687 / 200; }
  .foot__socials { position: relative; right: 0; top: 0; width: 100%; }
  .foot__nav { position: relative; top: 0; flex-wrap: wrap; gap: 4px 8px; font-size: 12px; }
  .foot__nav .ulink { padding: 8px 0; margin-right: 16px; }
  .foot__note, .foot__copy { position: relative; left: 0; top: 0; font-size: 12px; }
  .lead { padding: 56px 24px 32px; }
  .lead__title { font-size: 21px; padding-right: 0; }
  .lead__f textarea { min-height: 0; }
}

/* ---------- без движения ---------- */

@media (max-width: 379px) {
  .nav__side { gap: 12px; font-size: 10px; letter-spacing: .06em; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
  .intro { display: none; }
  .marquee.is-run .marquee__track { animation: none; }
}

/* v2: дизеринг градиента заставки */
.intro__glow { background: url("../img/decor/dither.png") 0 0 / 256px 256px repeat, radial-gradient(50% 50% at 50% 50%, rgba(56, 8, 23, .9) 0%, rgba(21, 11, 2, .35) 42%, #000 100%); }
.intro { background: url("../img/decor/dither.png") 0 0 / 256px 256px repeat, #120a02; }
/* v2: телефон, вертикальные фоны залов 1 и 2 */
@media (max-width: 1099px) {
  .halls__bg > i:nth-child(1) { background-image: image-set(url("../img/bg/hall-1-tall-729.avif?v=20261006zk") type("image/avif") 1x, url("../img/bg/hall-1-tall-1458.avif?v=20261006zk") type("image/avif") 2x, url("../img/bg/hall-1-tall-729.webp?v=20261006zk") type("image/webp") 1x, url("../img/bg/hall-1-tall-1458.webp?v=20261006zk") type("image/webp") 2x); }
  .halls__bg > i:nth-child(2) { background-image: image-set(url("../img/bg/hall-2-tall-729.avif?v=20261006zk") type("image/avif") 1x, url("../img/bg/hall-2-tall-1458.avif?v=20261006zk") type("image/avif") 2x, url("../img/bg/hall-2-tall-729.webp?v=20261006zk") type("image/webp") 1x, url("../img/bg/hall-2-tall-1458.webp?v=20261006zk") type("image/webp") 2x); }
}

/* iPhone: на заставке Safari заливает зону с часами и полосу под нижней панелью цветом первого кадра
   и за анимацией не следит. Края заставки мягко держат этот цвет, чтобы не было линии стыка.
   Верх первого экрана не выравнивать в ровный цвет: тогда Safari красит зону с часами и при прокрутке */
@media (max-width: 1099px) {
  .intro__glow::after { content: ""; position: absolute; inset: 0; pointer-events: none;
    background: linear-gradient(#120a02, rgba(18, 10, 2, 0)) top / 100% 80px no-repeat, linear-gradient(0deg, #120a02, rgba(18, 10, 2, 0)) bottom / 100% 80px no-repeat; }
}