/* Премия «Дизайнер года», d-year.ru. Дизайн-код - проекты/премия/бренд/дизайн-код.md (Антон, 11.10.2026),
   живой образец - проекты/премия/бренд/прототип.html. Вечер вручения в мраморном зале: темнота,
   в которой загорается золотой свет. Анимация - свет, а не движение. Шрифты - static/dyear/fonts/fonts.css. */

:root{
  --night:#07060A; --night2:#0E0C10; --night3:#16131A;
  --ivory:#F2EBDD; --ivory-m:rgba(242,235,221,.66); --ivory-d:rgba(242,235,221,.4);
  --gold:#C9A45C; --gold-l:#EBD3A0; --gold-d:#8C6A2F;
  --gold-grad:linear-gradient(115deg,#8C6A2F 0%,#EBD3A0 38%,#C9A45C 58%,#6E5224 100%);
  --hair:rgba(235,211,160,.16); --hair2:rgba(235,211,160,.34);
  --ease:cubic-bezier(.22,.8,.16,1);       /* тяжёлое торможение - «дорогой» ход */
  --ease-in:cubic-bezier(.6,0,.2,1);
  --serif:'Cormorant Garamond',Georgia,serif;
  --sans:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif;
  --max:1240px; --pad:clamp(16px,4vw,48px); --r:28px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:clip}
body{margin:0;background:var(--night);color:var(--ivory);font:400 17px/1.7 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit}
p{margin:0 0 16px}
.wrap{width:100%;max-width:var(--max);margin:0 auto;padding:0 var(--pad)}
.narrow{max-width:820px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:12px;top:12px;z-index:95;background:var(--gold);color:#14100A;padding:8px 14px}
/* плёночное зерно: один фиксированный слой поверх всего */
body::after{content:'';position:fixed;inset:0;pointer-events:none;z-index:90;opacity:.06;mix-blend-mode:overlay;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* ── типографика ── */
h1,h2,h3{font-family:var(--serif);font-weight:300;line-height:1.02;margin:0;letter-spacing:-.01em}
.h2{font-size:clamp(40px,6vw,84px);margin:0 0 28px}
.h2--m{font-size:clamp(38px,4.6vw,64px)}
.h1 em,.h2 em{font-style:italic;font-weight:300}
.gold{background:var(--gold-grad);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent}
.lit .gold{animation:shine 2.4s var(--ease) .3s both}
@keyframes shine{from{background-position:100% 0}to{background-position:0 0}}
/* метка раздела: золотая черта и слово обычным регистром (капс с разрядкой - примета сайта от ИИ) */
.label{display:inline-flex;align-items:center;gap:12px;color:var(--gold);font-size:14px;letter-spacing:.02em;margin:0 0 22px}
.label::before{content:'';width:36px;height:1px;background:var(--gold)}
.label--c{display:flex;justify-content:center}
.muted{color:var(--ivory-m)}
.note{color:var(--ivory-m);font-size:14.5px;margin:22px 0 0;max-width:70ch}
.note--c{text-align:center;margin-left:auto;margin-right:auto}
.small{font-size:13px;color:var(--ivory-d);margin:16px 0 0;line-height:1.55}
.num{font-family:var(--serif);font-size:15px;letter-spacing:.18em;color:var(--gold)}

/* ── «Капля»: жидкое серебро, при наведении золотой перламутр (реф. LUCA «View films») ──
   Цвета слоёв - зарегистрированные переменные (@property): браузер плавно переливает их
   из серебра в золото, хотя сами градиенты анимировать нельзя. Неровный край - SVG-фильтры
   #liq/#liq-swirl из base.html, при наведении их *-flow, край течёт. */
@property --a{syntax:'<angle>';inherits:true;initial-value:0deg}
@property --r1{syntax:'<color>';inherits:true;initial-value:#9C9CA3}
@property --r2{syntax:'<color>';inherits:true;initial-value:#DCDCE2}
@property --p1{syntax:'<color>';inherits:true;initial-value:rgba(246,213,142,0)}
@property --p2{syntax:'<color>';inherits:true;initial-value:rgba(243,201,214,0)}
@property --p3{syntax:'<color>';inherits:true;initial-value:rgba(207,237,224,0)}
@property --glow{syntax:'<color>';inherits:true;initial-value:rgba(235,197,131,0)}
.liq,.btn{transition:--r1 .9s var(--ease),--r2 .9s var(--ease),--p1 .9s var(--ease),--p2 1.1s var(--ease),--p3 1.3s var(--ease),--glow .9s var(--ease),transform .9s var(--ease),box-shadow .9s var(--ease)}
.liq:hover,.btn:hover,.btn:focus-visible{--r1:#C9A45C;--r2:#F6DDA6;--p1:rgba(246,213,142,.95);--p2:rgba(243,201,214,.55);--p3:rgba(207,237,224,.4);--glow:rgba(235,197,131,.75)}
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:22px;min-height:60px;padding:0 30px 0 34px;border-radius:99px;border:0;cursor:pointer;isolation:isolate;
  font:500 14px/1 var(--sans);letter-spacing:.08em;text-decoration:none;color:#F7F3EA;text-shadow:0 1px 8px rgba(0,0,0,.6);white-space:nowrap;
  background:radial-gradient(120% 90% at 50% 125%,rgba(255,255,255,.16),transparent 60%),linear-gradient(180deg,rgba(60,58,60,.32),rgba(8,8,10,.42) 55%,rgba(40,39,42,.36));
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  box-shadow:inset 0 3px 3px -1px rgba(255,255,255,.75),inset 0 -3px 4px -1px rgba(255,255,255,.4),inset 6px 0 10px -6px rgba(255,255,255,.35),inset 0 0 26px rgba(0,0,0,.55),
    0 0 0 1px rgba(0,0,0,.55),0 20px 40px -18px #000,0 0 40px -4px var(--glow),0 0 120px -10px var(--glow)}
/* ободок: хром неровной толщины */
.btn::before{content:'';position:absolute;inset:-2px;border-radius:inherit;padding:4px;z-index:-1;pointer-events:none;
  background:conic-gradient(from var(--a),#fff 0deg,var(--r1) 30deg,#151517 70deg,var(--r2) 115deg,#fff 140deg,#3a3a3f 190deg,var(--r1) 240deg,#fff 270deg,#202024 310deg,#fff 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
  filter:url(#liq) drop-shadow(0 0 1.5px rgba(255,255,255,.55))}
/* внутри: волнистые отражения, как в ртути, и золотые вкрапления (видны при наведении) */
.btn::after{content:'';position:absolute;inset:4px;border-radius:inherit;z-index:-1;pointer-events:none;mix-blend-mode:screen;
  background:
    radial-gradient(ellipse 42% 14% at 30% 28%,rgba(255,255,255,.62),transparent 70%),
    radial-gradient(ellipse 56% 11% at 62% 74%,rgba(255,255,255,.42),transparent 70%),
    radial-gradient(ellipse 22% 34% at 88% 44%,rgba(255,255,255,.3),transparent 70%),
    radial-gradient(ellipse 30% 20% at 8% 56%,rgba(255,255,255,.22),transparent 70%),
    radial-gradient(circle at 18% 70%,var(--p1),transparent 26%),
    radial-gradient(circle at 46% 22%,var(--p2),transparent 22%),
    radial-gradient(circle at 72% 64%,var(--p1),transparent 20%),
    radial-gradient(circle at 92% 30%,var(--p3),transparent 24%);
  background-size:150% 150%;background-position:0 0;filter:url(#liq-swirl) blur(1px);clip-path:inset(0 round 99px)}
.btn:hover::before,.btn:focus-visible::before{filter:url(#liq-flow) drop-shadow(0 0 3px rgba(246,221,166,.8));animation:turn 5s linear infinite}
.btn:hover::after,.btn:focus-visible::after{filter:url(#liq-swirl-flow) blur(1.4px);animation:swirl 4s var(--ease) infinite alternate}
.btn:hover,.btn:focus-visible{animation:drip 1.1s var(--ease) forwards;outline:0}
.btn:active{transform:scale(.97)}
@keyframes turn{to{--a:360deg}}
@keyframes swirl{to{background-position:100% 80%}}
/* капля «растекается»: чуть шире, вздрагивает и оседает */
@keyframes drip{0%{transform:none}35%{transform:scale(1.07,.95)}65%{transform:scale(1.02,1.04)}100%{transform:scale(1.04,1)}}
.btn i{font-style:normal;font-size:17px;color:#fff;transition:transform .8s var(--ease),color .8s}
.btn:hover i{transform:translate(3px,-3px);color:var(--gold-l)}
.btn--gold{--p1:rgba(246,213,142,.32);--glow:rgba(235,197,131,.22)}   /* главная кнопка: золото чуть видно и в покое */
.btn--sm{min-height:44px;padding:0 20px 0 22px;gap:14px;font-size:12.5px}
.btn--sm::before{padding:3px}
.btn--off{cursor:default;color:var(--ivory-m);text-shadow:none}
.btn--off:hover{animation:none;--r1:#9C9CA3;--r2:#DCDCE2;--p1:rgba(246,213,142,0);--p2:rgba(243,201,214,0);--p3:rgba(207,237,224,0);--glow:rgba(235,197,131,0)}
.btn--off:hover::before,.btn--off:hover::after{animation:none;filter:url(#liq)}

/* ── жидкая рамка: тонкий хром с золотом, у углов свет вытекает наружу.
   При наведении рамка толще, золото гуще, блики бегут по кругу, край течёт ── */
.liq{position:relative;isolation:isolate}
.liq::before{content:'';position:absolute;inset:0;border-radius:inherit;padding:var(--lw,1.8px);z-index:3;pointer-events:none;
  background:conic-gradient(from var(--a),rgba(255,255,255,.95) 0deg,var(--r1) 25deg,rgba(30,30,34,.35) 60deg,#EBD3A0 95deg,#fff 105deg,#8C6A2F 130deg,rgba(30,30,34,.35) 170deg,var(--r2) 210deg,#fff 222deg,#C9A45C 250deg,rgba(30,30,34,.35) 290deg,var(--r1) 330deg,rgba(255,255,255,.95) 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
  filter:url(#liq-frame) drop-shadow(0 0 2px rgba(235,211,160,.45));opacity:.62;transition:padding .9s var(--ease),opacity .9s var(--ease)}
.liq::after{content:'';position:absolute;inset:-70px;border-radius:inherit;z-index:-1;pointer-events:none;opacity:.5;
  background:radial-gradient(60px 60px at 70px 70px,rgba(235,197,131,.5),transparent 70%),radial-gradient(70px 70px at calc(100% - 70px) 70px,rgba(255,255,255,.2),transparent 70%),
    radial-gradient(90px 90px at 70px calc(100% - 70px),rgba(235,197,131,.55),transparent 70%),radial-gradient(70px 70px at calc(100% - 70px) calc(100% - 70px),rgba(235,197,131,.38),transparent 70%);
  filter:blur(14px);transition:opacity 1s var(--ease),transform 1.2s var(--ease)}
.liq:hover{--lw:3px}
.liq:hover::before{opacity:1;filter:url(#liq-frame-flow) drop-shadow(0 0 5px rgba(246,221,166,.75)) brightness(1.15);animation:turn 7s linear infinite}
.liq:hover::after{opacity:1;transform:scale(1.06)}

/* мелкие капли: кружки этапов, «Листайте вниз», таблички стола */
.step i,.plate{background:radial-gradient(70% 60% at 30% 20%,rgba(255,255,255,.28),transparent 60%),linear-gradient(180deg,#2B2A2E,#0A0A0C 60%,#232226);
  box-shadow:inset 0 1.5px 1.5px rgba(255,255,255,.65),inset 0 -1.5px 2px rgba(255,255,255,.25),inset 0 0 0 1.5px rgba(220,220,226,.35),0 10px 24px -10px #000}

/* ── шапка: парящая стеклянная капсула ── */
.hdr{position:fixed;top:18px;left:0;right:0;z-index:40;pointer-events:none;padding:0 var(--pad)}
.hdr__pill{pointer-events:auto;margin:0 auto;max-width:calc(var(--max) - 2*var(--pad));display:flex;align-items:center;gap:24px;
  padding:10px 10px 10px 22px;border-radius:99px;background:rgba(10,9,12,.42);backdrop-filter:blur(18px) saturate(1.2);-webkit-backdrop-filter:blur(18px) saturate(1.2);
  box-shadow:0 20px 60px -30px #000;transition:background .5s}
.hdr__pill.liq::after{display:none}
.hdr.is-scrolled .hdr__pill{background:rgba(10,9,12,.8)}
.logo{display:flex;align-items:center;gap:12px;text-decoration:none;white-space:nowrap}
.logo svg{width:22px;height:38px;flex:none;filter:drop-shadow(0 0 6px rgba(235,197,131,.35))}
.logo b{font:500 15px/1 var(--serif);letter-spacing:.28em;text-transform:uppercase}
.logo b span{font-style:italic;text-transform:none;letter-spacing:.02em;font-size:18px;margin-left:6px}
.hdr__nav{display:flex;gap:28px;margin-left:auto;font-size:14px}
.hdr__nav a{text-decoration:none;color:var(--ivory-m);transition:color .4s}
.hdr__nav a:hover{color:var(--gold-l)}
.burger{display:none;flex:none;width:46px;height:46px;border-radius:50%;border:0;margin-left:auto;cursor:pointer;background:rgba(235,211,160,.08);box-shadow:inset 0 0 0 1px var(--hair2);position:relative}
.burger span{position:absolute;left:14px;right:14px;height:1px;background:var(--gold-l);transition:transform .6s var(--ease),top .6s var(--ease)}
.burger span:first-child{top:19px}.burger span:last-child{top:26px}
.menu-open .burger span:first-child{top:23px;transform:rotate(45deg)}
.menu-open .burger span:last-child{top:23px;transform:rotate(-45deg)}
.menu{position:fixed;inset:0;z-index:35;background:rgba(7,6,10,.88);backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px);
  display:flex;flex-direction:column;justify-content:center;padding:0 28px;gap:6px;opacity:0;visibility:hidden;transition:opacity .6s var(--ease),visibility 0s .6s}
.menu a{font:300 40px/1.25 var(--serif);text-decoration:none;opacity:0;transform:translateY(40px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.menu .menu__cta{font:500 15px/1 var(--sans);color:var(--gold-l);margin-top:24px;letter-spacing:.06em}
.menu-open .menu{opacity:1;visibility:visible;transition:opacity .6s var(--ease)}
.menu-open .menu a{opacity:1;transform:none}
.menu a:nth-child(2){transition-delay:.05s}.menu a:nth-child(3){transition-delay:.1s}.menu a:nth-child(4){transition-delay:.15s}
.menu a:nth-child(5){transition-delay:.2s}.menu a:nth-child(6){transition-delay:.25s}.menu a:nth-child(7){transition-delay:.3s}.menu a:nth-child(8){transition-delay:.35s}

/* ── 1. первый экран: при загрузке зал тёмный, потом «включается свет» от проёма ── */
.hero{position:relative;min-height:100dvh;overflow:hidden;display:flex;align-items:center;padding:112px 0 90px;background:#050407}
.hall{position:absolute;inset:0;pointer-events:none}
.hall img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:70% 50%;animation:lightup 3.4s var(--ease-in) .2s both}
@keyframes lightup{0%{filter:brightness(.05) saturate(.6);transform:scale(1.08)}35%{filter:brightness(.25) saturate(.7)}100%{filter:none;transform:none}}
.hall__flash{position:absolute;left:73%;top:44%;width:34vw;height:34vw;transform:translate(-50%,-50%) scale(.2);border-radius:50%;
  background:radial-gradient(circle,rgba(255,236,196,.55),rgba(235,197,131,.18) 40%,transparent 70%);mix-blend-mode:screen;opacity:0;animation:flash 3s var(--ease) .6s both}
@keyframes flash{30%{opacity:1}100%{opacity:.35;transform:translate(-50%,-50%) scale(1)}}
.hall__shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,4,7,.88) 0%,rgba(5,4,7,.55) 38%,rgba(5,4,7,0) 62%),linear-gradient(180deg,rgba(5,4,7,.5) 0%,transparent 20%,transparent 60%,#07060A 100%)}
.hero__wrap{position:relative;z-index:2}
.hero__text{max-width:620px}
.h1{font-size:clamp(42px,7vw,100px);line-height:.92;margin:0 0 18px}
.h1 em{display:block;padding-left:.9em}
.hero__aud{font:400 clamp(20px,2.3vw,30px)/1.3 var(--serif);max-width:38ch;margin:0 0 14px}
.hero__date{color:var(--gold-l);font-size:15px;margin:0 0 14px}
.hero__lead{color:var(--ivory-m);font-size:15px;max-width:46ch;margin:0 0 30px}
.hero__btns{display:flex;flex-wrap:wrap;gap:16px}
.hero__deadline{color:var(--gold-l);font-size:14px;margin:18px 0 0}
/* текст первого экрана проступает после того, как зажёгся свет */
.in{opacity:0;transform:translateY(28px);filter:blur(8px);animation:rise 1.4s var(--ease) var(--d,0s) forwards}
@keyframes rise{to{opacity:1;transform:none;filter:none}}

/* ── 2. три карты: фото во всю карту, жидкая рамка ── */
.doors{position:relative;z-index:3;margin-top:-64px}
.doors__row{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.card{position:relative;display:block;text-decoration:none;border-radius:var(--r);
  transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateY(var(--ty,0));box-shadow:0 40px 80px -40px #000}
.card__in{position:relative;overflow:hidden;border-radius:var(--r);min-height:440px;padding:30px 28px;display:flex;flex-direction:column;isolation:isolate;
  background:linear-gradient(180deg,#17141B,#0B0A0D);box-shadow:inset 0 1px 0 rgba(255,255,255,.12)}
.card__photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transform:scale(1.02);transition:transform 1.6s var(--ease),filter 1.6s var(--ease);filter:brightness(.78) saturate(.95)}
.card--cup .card__in{background:radial-gradient(ellipse 50% 60% at 60% 0%,rgba(255,236,196,.22),transparent 70%),linear-gradient(180deg,#141117,#08070A)}
.card--cup .card__photo{object-fit:contain;inset:auto 0 0 auto;width:72%;height:84%;object-position:100% 100%;filter:brightness(.92)}
.card__in::before{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(7,6,10,.72) 0%,rgba(7,6,10,0) 30%,rgba(7,6,10,0) 60%,rgba(7,6,10,.88) 100%)}
.card:hover .card__photo{transform:scale(1.07);filter:brightness(.98) saturate(1.05)}
.card__in::after{content:'';position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .7s var(--ease);mix-blend-mode:screen;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,30%),rgba(235,211,160,.22),transparent 45%)}
.card:hover{--ty:-8px;box-shadow:0 50px 90px -40px #000,0 0 80px -20px rgba(201,164,92,.5)}
.card:hover .card__in::after{opacity:1}
.card__top{display:flex;justify-content:space-between;align-items:center}
.card__top .arr{color:var(--gold-l);transition:transform .7s var(--ease)}
.card:hover .arr{transform:translate(4px,-4px)}
.card h3{font-size:34px;margin:14px 0 0}
.card__fill{flex:1}
.card__cap{font-size:14px;margin:0;opacity:.88}

/* общие секции; появление блоков - снизу из лёгкой размытости */
.sec{position:relative;padding:clamp(110px,14vw,190px) 0}
.js .reveal{opacity:0;transform:translateY(46px);filter:blur(10px);transition:opacity 1.3s var(--ease),transform 1.3s var(--ease),filter 1.3s var(--ease)}
.js .reveal.lit{opacity:1;transform:none;filter:none}
.d1{transition-delay:.12s!important}.d2{transition-delay:.24s!important}.d3{transition-delay:.36s!important}

/* ── 3. о премии ── */
.about{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(40px,7vw,110px);align-items:start}
.about__lead{font:300 clamp(24px,2.5vw,34px)/1.3 var(--serif);margin:0 0 26px}
.gains{display:grid;grid-template-columns:1fr 1fr;gap:16px;list-style:none;margin:0;padding:0}
.tile{border-radius:22px;padding:6px;background:rgba(235,211,160,.04)}
.tile>div{height:100%;border-radius:16px;padding:24px 22px;background:linear-gradient(180deg,#141217,#0C0B0E);box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}
.tile b{display:block;font:400 25px/1.15 var(--serif);margin:14px 0 8px}
.tile span{font-size:14.5px;color:var(--ivory-m);line-height:1.55}
.tile b+span{display:block}
.tile:nth-child(2n){margin-top:44px}

/* ── 4. номинации: круглый стол ── */
.sec--table{background:radial-gradient(ellipse 60% 50% at 50% 50%,#141118,var(--night) 70%)}
.table-head{text-align:center;max-width:820px;margin:0 auto 10px}
.table-wrap{position:relative;max-width:900px;margin:0 auto;aspect-ratio:1}
.table-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:50%;
  -webkit-mask:radial-gradient(circle,#000 58%,transparent 71%);mask:radial-gradient(circle,#000 58%,transparent 71%)}
.plate{position:absolute;transform:translate(-50%,-50%);border:0;cursor:pointer;padding:9px 12px;width:164px;border-radius:99px;
  font:500 12px/1.3 var(--sans);letter-spacing:.04em;color:var(--gold-l);text-align:center;white-space:nowrap;
  transition:transform .7s var(--ease),box-shadow .7s var(--ease),color .5s,background .5s}
.plate:hover,.plate:focus-visible,.plate.on{transform:translate(-50%,-50%) translateY(-4px);color:#1A1206;background:var(--gold-grad);box-shadow:0 0 40px -6px rgba(235,197,131,.75);outline:0}
.plate--empty{color:#FFF1D2;font-weight:600}
.seat-panel{max-width:760px;margin:10px auto 0;text-align:center;min-height:190px}
.seat-panel h3{font-size:clamp(28px,3vw,40px);margin:0 0 10px}
.seat-panel p{color:var(--ivory-m);margin:0 0 24px}
.seat-panel>*{transition:opacity .5s var(--ease),transform .5s var(--ease)}
.seat-panel.swap>*{opacity:0;transform:translateY(10px)}
.nom-list{display:none}

/* ── 5. как подать ── */
.steps{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:24px;list-style:none;margin:70px 0 0;padding:0}
.steps::before,.steps::after{content:'';position:absolute;top:28px;left:28px;right:28px;height:1px;background:var(--hair)}
.steps::after{background:var(--gold-grad);transform-origin:left;transform:scaleX(0);transition:transform 2.6s var(--ease) .3s;box-shadow:0 0 14px rgba(235,197,131,.6)}
.steps.lit::after{transform:scaleX(1)}
.step i{position:relative;z-index:1;display:grid;place-items:center;width:56px;height:56px;border-radius:50%;font:400 18px var(--serif);font-style:normal;color:var(--gold-l);margin-bottom:24px;transition:box-shadow 1s var(--ease)}
.steps.lit .step i{box-shadow:inset 0 1.5px 1.5px rgba(255,255,255,.65),inset 0 0 0 1.5px var(--gold),0 0 30px -4px rgba(201,164,92,.7)}
.steps.lit .step:nth-child(2) i{transition-delay:.5s}.steps.lit .step:nth-child(3) i{transition-delay:1s}
.steps.lit .step:nth-child(4) i{transition-delay:1.5s}.steps.lit .step:nth-child(5) i{transition-delay:2s}
.step b{display:block;font:400 26px/1.1 var(--serif);margin-bottom:8px}
.step span{font-size:14.5px;color:var(--ivory-m);line-height:1.55}
.need{margin-top:80px;border-radius:var(--r);padding:7px;background:rgba(235,211,160,.04)}
.need>div{border-radius:calc(var(--r) - 7px);padding:clamp(28px,4vw,48px);background:linear-gradient(120deg,#15121A,#0B0A0D);display:grid;grid-template-columns:1fr 1.4fr auto;gap:40px;align-items:center}
.need h3{font-size:34px}
.need ul{margin:0;padding:0;list-style:none;columns:2;column-gap:34px;font-size:15px;color:var(--ivory-m)}
.need li{padding:7px 0 7px 22px;position:relative;break-inside:avoid}
.need li::before{content:'';position:absolute;left:0;top:17px;width:10px;height:1px;background:var(--gold)}

/* ── 6. кубок: вырезан из фона, стоит прямо на странице, сверху луч ── */
.sec--cup{overflow:hidden}
.cup-word{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);font:300 clamp(120px,24vw,340px)/1 var(--serif);letter-spacing:.06em;
  color:transparent;-webkit-text-stroke:1px rgba(235,211,160,.18);white-space:nowrap;pointer-events:none}
.cup-grid{position:relative;display:grid;grid-template-columns:1fr 1.1fr 1fr;gap:40px;align-items:center}
.cup-stage{position:relative;aspect-ratio:3/4;display:flex;align-items:flex-end;justify-content:center;padding-bottom:6%}
.cup-stage__ray{position:absolute;left:50%;top:-24%;width:90%;height:118%;transform:translateX(-50%);pointer-events:none;
  background:linear-gradient(180deg,rgba(255,240,205,.26),rgba(255,240,205,.05) 70%,rgba(255,240,205,0));clip-path:polygon(43% 0,57% 0,100% 100%,0 100%);
  filter:blur(6px);opacity:0;transition:opacity 2.2s var(--ease) .3s}
.cup-stage.lit .cup-stage__ray{opacity:1}
.cup-stage__floor{position:absolute;left:12%;right:12%;bottom:3%;height:9%;border-radius:50%;
  background:radial-gradient(ellipse at 50% 50%,rgba(255,230,180,.22),rgba(0,0,0,.5) 55%,transparent 72%);pointer-events:none}
.cup-stage__obj{position:relative;z-index:1;width:62%;container-type:inline-size}
.cup-stage__obj img{width:100%;height:auto;filter:brightness(.12) drop-shadow(0 30px 30px rgba(0,0,0,.6));transition:filter 2.4s var(--ease)}
.cup-stage.lit .cup-stage__obj img{filter:drop-shadow(0 30px 30px rgba(0,0,0,.6)) drop-shadow(0 0 40px rgba(235,197,131,.18))}
/* надпись на чёрной табличке кубка - из админки (cup.plate_*), место таблички снято с кадра */
.cup-plate{position:absolute;left:4%;top:53%;width:37%;height:26%;padding:5% 4%;display:flex;flex-direction:column;gap:1cqw;
  font-family:var(--serif);color:#EBD3A0;line-height:1.1;opacity:0;transition:opacity 1.6s var(--ease) 1.2s}
.cup-stage.lit .cup-plate{opacity:.96}
.cup-plate b{font-weight:500;font-size:5.2cqw;letter-spacing:.1em;text-transform:uppercase}
.cup-plate__y{font-size:8cqw;color:var(--ivory);font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1}
.cup-plate span:not(.cup-plate__y){font-size:4.2cqw;color:rgba(242,235,221,.8)}
.spec{list-style:none;margin:0;padding:0}
.spec li{padding:18px 0;border-top:1px solid var(--hair);font-size:15px;color:var(--ivory-m)}
.spec b{display:block;font:400 22px/1.2 var(--serif);color:var(--ivory)}

/* ── 7. история ── */
.sec--hist{padding-top:40px}
.hist{list-style:none;margin:60px 0 0;padding:0 0 0 40px;position:relative}
.hist::before{content:'';position:absolute;left:0;top:10px;bottom:10px;width:1px;background:var(--hair)}
.hist__i{position:relative;border-bottom:1px solid var(--hair)}
.hist__row{position:relative;display:grid;grid-template-columns:260px 1fr auto;gap:30px;align-items:baseline;width:100%;padding:22px 0;margin:0;border:0;background:none;font:inherit;color:inherit;text-align:left;cursor:default}
.hist__row:not(:disabled){cursor:pointer}
.hist__row::before{content:'';position:absolute;left:-44px;top:50%;width:9px;height:9px;border-radius:50%;background:var(--night);box-shadow:inset 0 0 0 1px var(--gold);transition:background 1s,box-shadow 1s}
.hist__i.lit .hist__row::before{background:var(--gold);box-shadow:0 0 18px 2px rgba(235,197,131,.7)}
.hist__y{font:300 clamp(56px,7vw,104px)/1 var(--serif);color:transparent;-webkit-text-stroke:1px rgba(235,211,160,.45);transition:color 1.2s var(--ease)}
.hist__i.lit .hist__y{color:rgba(235,211,160,.16)}
.hist__i.now .hist__y{background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;-webkit-text-stroke:0;color:transparent}
.hist__t{color:var(--ivory-m);max-width:56ch}
.hist__chev{justify-self:end;align-self:center;font-size:18px;color:var(--ivory-m);transition:transform .3s var(--ease)}
.hist__i.open .hist__chev{transform:rotate(180deg)}
.hist__panel{display:grid;grid-template-rows:0fr;overflow:hidden;transition:grid-template-rows .4s var(--ease)}
.hist__i.open .hist__panel{grid-template-rows:1fr}
.hist__panel-in{overflow:hidden;min-height:0}
.hist__desc{margin:4px 0 20px;color:var(--ivory-m);max-width:70ch}
.hist__slides{position:relative;margin:0 0 26px;border-radius:14px;overflow:hidden;background:#0b0a0d}
.hist__track{display:flex;transition:transform .5s var(--ease)}
.hist__track img{width:100%;flex:0 0 100%;aspect-ratio:16/9;object-fit:cover;display:block}
.hist__nav{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;border:1px solid var(--hair);background:rgba(7,6,10,.55);color:var(--ivory);font-size:20px;line-height:1;cursor:pointer}
.hist__nav--prev{left:12px}.hist__nav--next{right:12px}

/* ── 8. церемония: бархатный занавес расходится ── */
.sec--cer{overflow:hidden;background:#110306;--cur:2.4s;box-shadow:inset 0 140px 120px -60px var(--night),inset 0 -140px 120px -60px var(--night)}
.cer__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.sec--cer::before{content:'';position:absolute;inset:0;z-index:1;background:radial-gradient(ellipse 46% 60% at 50% 50%,rgba(14,3,6,.82),rgba(14,3,6,.45) 70%,rgba(7,6,10,.3))}
.curtain{position:absolute;top:0;bottom:0;width:52%;z-index:3;transition:transform var(--cur) var(--ease-in) .15s;
  background:repeating-linear-gradient(90deg,#3A0910 0 24px,#6E1620 46px,#8B2129 58px,#4A0C14 80px,#250509 104px);
  box-shadow:inset 0 -120px 140px -40px #000,inset 0 120px 120px -60px #000}
.curtain--l{left:0}.curtain--r{right:0}
/* Занавес расходится по классу open: его ставит dyear.js, когда раздел уже перед глазами,
   а не когда только показался снизу. Прежде открытие начиналось по общему .lit (порог 18 %
   высоты), и на телефоне человек доезжал до текста при шторках, открытых наполовину, -
   строки были разрезаны красными полосами (Андрей, 11.10.2026). */
.sec--cer.open .curtain--l{transform:translateX(-101%)}
.sec--cer.open .curtain--r{transform:translateX(101%)}
/* И текст проступает уже после того, как занавес разошёлся: тогда шторка не режет строку
   ни в один момент, а до открытия видна ровная бархатная стена. Без JS занавеса нет вовсе. */
.js .sec--cer .cer{opacity:0;transition:opacity .9s var(--ease)}
.js .sec--cer.open .cer{opacity:1;transition-delay:calc(var(--cur) * .66)}
html:not(.js) .curtain{display:none}
.cer{position:relative;z-index:2;text-align:center;max-width:840px}
.cer__date{font:300 clamp(60px,10vw,150px)/.95 var(--serif);margin:0 0 6px}
.cer__year{font:italic 300 clamp(24px,3vw,40px)/1.1 var(--serif);color:var(--gold-l);margin:0 0 26px}
.cer__place{display:inline-block;padding:10px 22px;border-radius:99px;box-shadow:inset 0 0 0 1px rgba(235,211,160,.4);font-size:14px;margin:0 0 34px}
.cer p:not([class]){color:rgba(242,235,221,.8)}
.cer .btn{margin-top:16px}

/* ── 9. партнёрам: ар-деко рамка ── */
.part{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,7vw,110px);align-items:center}
.deco{position:relative;border-radius:6px;padding:8px;background:rgba(235,211,160,.04)}
.deco>div{position:relative;padding:clamp(28px,4vw,48px);background:linear-gradient(160deg,#141118,#0A090C);box-shadow:inset 0 0 0 1px var(--hair)}
.deco h3{font-size:32px;margin-bottom:22px}
.deco svg.corner{position:absolute;width:64px;height:64px;color:var(--gold);z-index:4}
.deco .c1{top:-1px;left:-1px}.deco .c2{top:-1px;right:-1px;transform:scaleX(-1)}.deco .c3{bottom:-1px;left:-1px;transform:scaleY(-1)}.deco .c4{bottom:-1px;right:-1px;transform:scale(-1)}
.field{display:block;margin:0 0 14px;font-size:13px;color:var(--ivory-m)}
.field input{display:block;width:100%;margin-top:6px;padding:15px 18px;border:0;border-radius:12px;font:400 16px var(--sans);color:var(--ivory);
  background:rgba(255,255,255,.035);box-shadow:inset 0 0 0 1px var(--hair);transition:box-shadow .5s var(--ease)}
.field input:focus{outline:0;box-shadow:inset 0 0 0 1.5px var(--gold-l),inset 0 1px 2px rgba(255,255,255,.4),0 0 30px -6px rgba(235,197,131,.7)}

/* простые страницы: «Спасибо», политика */
.sec--simple{padding-top:170px}
.sec--simple .h2{font-size:clamp(40px,5vw,64px)}
.legal{color:var(--ivory-m);font-size:15.5px;margin:0 0 30px}
.legal h2,.legal h3{font-size:28px;margin:32px 0 12px;color:var(--ivory)}
.legal a{color:var(--gold-l)}

/* подвал */
.foot{border-top:1px solid var(--hair);padding:56px 0 30px;font-size:14px;color:var(--ivory-m)}
.foot__row{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:30px}
.foot__col{display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.foot__about{margin:8px 0 0;max-width:36ch}
.foot__link{text-decoration:none;transition:color .4s}
.foot__link:hover{color:var(--gold-l)}
.foot__bottom{display:flex;justify-content:space-between;gap:20px;margin-top:40px;padding-top:22px;border-top:1px solid var(--hair);font-size:12.5px;color:var(--ivory-d)}

/* переход «на следующую страницу»: экран гаснет, вспыхивает золотая нить */
.veil{position:fixed;inset:0;z-index:80;pointer-events:none;background:#050407;opacity:0;transition:opacity .55s var(--ease-in)}
.veil::after{content:'';position:absolute;left:0;right:0;top:50%;height:1px;background:var(--gold-grad);box-shadow:0 0 30px 4px rgba(235,197,131,.6);transform:scaleX(0);transition:transform .7s var(--ease)}
.veil.on{opacity:1}.veil.on::after{transform:scaleX(1)}

/* обычные (не старинные) цифры у Cormorant: правило в конце, потому что шорткат font выше его сбрасывает */
h1,h2,h3,.cer__date,.hist__y,.num,.spec b,.step i{font-variant-numeric:lining-nums;font-feature-settings:"lnum" 1}

/* ── телефон и планшет ── */
@media (max-width:1080px){
  .hdr__nav{display:none}.burger{display:block}.hdr .btn--sm{margin-left:auto}
}
@media (max-width:980px){
  .doors__row{grid-template-columns:1fr}.card__in{min-height:300px}
  .about,.part,.cup-grid{grid-template-columns:1fr}
  .cup-stage{max-width:440px;margin:0 auto;width:100%}
  .steps{grid-template-columns:1fr;gap:28px}
  .steps::before,.steps::after{top:28px;bottom:28px;left:28px;right:auto;width:1px;height:auto}
  .steps::after{transform-origin:top;transform:scaleY(0)}.steps.lit::after{transform:scaleY(1)}
  .step{display:grid;grid-template-columns:56px 1fr;gap:20px}.step i{margin:0}
  .need>div{grid-template-columns:1fr}.need ul{columns:1}
  .hist__row{grid-template-columns:1fr;gap:6px}
  .foot__row{grid-template-columns:1fr}
}
@media (max-width:760px){
  .hdr .btn--sm{display:none}
  .hero{padding:110px 0 90px}  .hall img{object-position:84% 50%}
  .hall__shade{background:linear-gradient(90deg,rgba(5,4,7,.9) 0%,rgba(5,4,7,.6) 60%,rgba(5,4,7,.2) 100%),linear-gradient(180deg,rgba(5,4,7,.5) 0%,transparent 20%,transparent 60%,#07060A 100%)}
  .doors{margin-top:-64px}
  .gains{grid-template-columns:1fr}.tile:nth-child(2n){margin-top:0}
  .seat-panel,.plate{display:none}
  /* Круглый стол на телефоне не раскладывается - шесть табличек по 164 px не влезают
     в 390 px. Но табличка пустого кресла остаётся: в ней весь смысл блока. Загорается,
     когда стол входит в кадр, нажимать нечего (панель под столом скрыта). */
  .plate--empty{display:block;width:auto;padding:8px 14px;font-size:11px;letter-spacing:.06em;pointer-events:none;
    opacity:0;transition:opacity 1s var(--ease) .45s,box-shadow 1.4s var(--ease) .9s}
  .table-wrap.lit .plate--empty{opacity:1;
    box-shadow:inset 0 1.5px 1.5px rgba(255,255,255,.65),inset 0 -1.5px 2px rgba(255,255,255,.25),
      inset 0 0 0 1.5px rgba(235,211,160,.5),0 0 34px -4px rgba(235,197,131,.6)}
  .sec--cer{--cur:1.7s}
  .nom-list{display:grid;gap:14px;list-style:none;margin:30px 0 0;padding:0}
  .nom-list li{border-radius:20px;padding:22px;background:linear-gradient(180deg,#15121A,#0B0A0D)}
  .nom-list b{display:block;font:400 24px/1.15 var(--serif);margin:6px 0}
  .nom-list span:not(.num){font-size:14px;color:var(--ivory-m)}
  .cup-word{font-size:34vw}
  .foot__bottom{flex-direction:column}
}
/* ── палец вместо курсора: «жидкое золото» - примета сайта, а на телефоне наведения нет,
   и на карточках первого экрана оно не показывалось ни разу. Поэтому по рамке один раз
   проходит золото, когда карта появляется (Андрей 11.10.2026: включить анимацию и на телефоне). ── */
@media (hover:none){
  .card.lit{animation:goldpass 2.6s var(--ease) .35s both}
  .card.d1.lit{animation-delay:.6s}
  .card.d2.lit{animation-delay:.85s}
}
@keyframes goldpass{0%,100%{--r1:#9C9CA3;--r2:#DCDCE2}50%{--r1:#C9A45C;--r2:#F6DDA6}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-delay:0s!important;transition-duration:.01ms!important;transition-delay:0s!important}
  .js .reveal,.in{opacity:1;transform:none;filter:none}
  .curtain{display:none}
  .js .sec--cer .cer{opacity:1}
}