/* ==========================================================================
   Kingston Barbershop — основные стили
   Палитра взята из дизайн-проекта ARCHITEQUE, золото #C8A127 — из герба.
   ========================================================================== */

:root{
  --ink:#0F0E0D;
  --ink-2:#171513;
  --bordo:#6B1220;
  --bordo-d:#490C13;
  --gold:#C8A127;
  --gold-l:#E2C46E;
  --cream:#F3EFE6;
  --cream-70:rgba(243,239,230,.72);
  --cream-55:rgba(243,239,230,.6);
  --line:rgba(243,239,230,.16);

  --gutter:clamp(20px,5vw,64px);
  --maxw:1280px;
  --display:'Oswald','Helvetica Neue',Arial,sans-serif;
  --serif:'Cormorant Garamond',Georgia,'Times New Roman',serif;
}

*{box-sizing:border-box}

/* важно: .drawer и .yc-modal задают display:flex и перебили бы браузерное [hidden] */
[hidden]{display:none !important}

html{scroll-behavior:auto}

body{
  margin:0;
  background:var(--ink);
  color:var(--cream);
  font-family:var(--serif);
  font-size:18px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
body.is-locked{overflow:hidden}

img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3{margin:0;font-weight:300;text-wrap:balance}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

/* ---------- утилиты ---------- */
.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter)}
.lbl{font-family:var(--display);font-weight:300;font-size:11px;letter-spacing:.3em;text-transform:uppercase}
.eyebrow{color:var(--gold)}
.h2{font-family:var(--display);font-weight:300;font-size:clamp(34px,5.2vw,62px);line-height:1.02;letter-spacing:.01em;text-transform:uppercase}
.lead{font-size:clamp(18px,2.1vw,21px);line-height:1.62;color:var(--cream-70);max-width:42ch}
.rule{width:84px;height:1px;background:var(--gold);display:block}
.stack{display:flex;flex-direction:column;gap:18px}
.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

.btn{
  display:inline-block;font-family:var(--display);font-weight:500;font-size:12px;
  letter-spacing:.22em;text-transform:uppercase;padding:17px 36px;cursor:pointer;
  background:var(--gold);color:var(--ink);border:1px solid var(--gold);
  transition:background .25s ease,color .25s ease,border-color .25s ease;
}
.btn:hover,.btn:focus-visible{background:var(--gold-l);border-color:var(--gold-l)}
.btn-ghost{background:none;color:var(--gold)}
.btn-ghost:hover,.btn-ghost:focus-visible{background:var(--gold);color:var(--ink)}

/* ---------- шапка ---------- */
.site-head{
  position:fixed;inset:0 0 auto 0;z-index:60;
  padding-top:env(safe-area-inset-top,0px);
  background:transparent;border-bottom:1px solid transparent;
  transition:background .35s ease,border-color .35s ease,backdrop-filter .35s ease;
}
.site-head.is-stuck{background:rgba(15,14,13,.94);border-bottom-color:var(--line);backdrop-filter:blur(6px)}
.head-in{display:flex;align-items:center;gap:24px;height:78px}
.brand{display:flex;align-items:center;gap:13px;flex-shrink:0}
.brand img{width:23px;height:30px}
.brand span{font-family:var(--display);font-weight:500;font-size:14px;letter-spacing:.34em;text-transform:uppercase}
.nav{display:flex;gap:34px;margin-inline:auto}
.nav a{font-family:var(--display);font-weight:300;font-size:12px;letter-spacing:.2em;text-transform:uppercase;transition:color .2s ease}
.nav a:hover{color:var(--gold-l)}
.head-side{display:flex;align-items:center;gap:18px;flex-shrink:0}
.lang{display:flex;align-items:center;gap:12px}
.lang button{background:none;border:0;padding:6px 2px;cursor:pointer;font-family:var(--display);font-weight:400;font-size:12px;letter-spacing:.16em;color:var(--cream-55)}
.lang button[aria-pressed="true"]{color:var(--gold)}
.lang i{width:1px;height:12px;background:var(--line);display:block}
.head-cta{padding:12px 24px;font-size:11px}
.burger{display:none;width:44px;height:44px;background:none;border:0;cursor:pointer;flex-direction:column;align-items:flex-end;justify-content:center;gap:6px}
.burger span{width:24px;height:1px;background:var(--cream);display:block}
.burger span:last-child{width:16px}

.drawer{
  position:fixed;inset:0;z-index:70;background:var(--ink);
  padding:calc(90px + env(safe-area-inset-top,0px)) var(--gutter) 40px;
  display:flex;flex-direction:column;gap:6px;
}
.drawer a{font-family:var(--display);font-weight:300;font-size:26px;letter-spacing:.1em;text-transform:uppercase;padding:14px 0;border-bottom:1px solid var(--line)}
.drawer .btn{margin-top:28px;text-align:center;border-bottom:0}
.drawer-close{position:absolute;top:calc(22px + env(safe-area-inset-top,0px));right:var(--gutter);width:44px;height:44px;background:none;border:0;color:var(--cream);font-size:26px;line-height:1;cursor:pointer}

/* ---------- герой: три слоя глубины ---------- */
.hero{position:relative;height:clamp(560px,82vh,820px);overflow:hidden;background:var(--ink)}
.hero-layer{position:absolute;will-change:transform;max-width:none}
/* кромка стойки ресепшена в исходнике — 929px из 1567px */
.hero-fg{clip-path:polygon(0 59.4%,100% 58.5%,100% 100%,0 100%)}
.hero-veil,.hero-fade{position:absolute;inset:0;pointer-events:none}
.hero-veil{background:linear-gradient(180deg,rgba(15,14,13,.9) 0%,rgba(15,14,13,.62) 36%,rgba(15,14,13,.34) 62%,rgba(15,14,13,.3) 100%)}
.hero-fade{background:linear-gradient(180deg,rgba(15,14,13,0) 48%,rgba(15,14,13,.72) 76%,var(--ink) 100%)}
/* размер надписи подбирается в layoutHero() под ширину стойки ресепшена;
   clamp ниже — то, что видно до выполнения скрипта */
.hero-word{
  position:absolute;left:0;width:100%;text-align:center;white-space:nowrap;
  font-family:var(--display);font-weight:700;font-size:clamp(62px,17vw,250px);
  line-height:1;letter-spacing:-.015em;color:var(--cream);
  will-change:transform;user-select:none;
}
.hero-word span{display:inline-block}

/* тёплое пятно света, идёт за курсором */
.hero-glow{
  position:absolute;left:0;top:0;width:820px;height:820px;margin:-410px 0 0 -410px;
  border-radius:50%;pointer-events:none;opacity:0;
  background:radial-gradient(circle,rgba(226,196,110,.42) 0%,rgba(200,161,39,.26) 22%,rgba(140,40,42,.20) 48%,rgba(107,18,32,0) 72%);
  transition:opacity 1s ease;will-change:transform;mix-blend-mode:screen;
}
.hero-glow.is-on{opacity:1}

/* лампы интерьера: всегда горят и медленно дышат */
.hero-lamps{position:absolute;left:0;top:0;pointer-events:none;will-change:transform}
.lamp{
  position:absolute;border-radius:50%;transform:translate(-50%,-50%);
  mix-blend-mode:screen;animation:breathe 7s ease-in-out infinite alternate;
}
.lamp-spot{
  width:26%;height:21%;
  background:radial-gradient(circle,rgba(255,226,150,.5) 0%,rgba(226,177,70,.26) 30%,rgba(200,161,39,0) 68%);
}
.lamp-wash{
  width:48%;height:32%;
  background:radial-gradient(ellipse,rgba(226,177,90,.26) 0%,rgba(150,80,40,.13) 44%,rgba(107,18,32,0) 74%);
}
@keyframes breathe{
  0%{opacity:.62;transform:translate(-50%,-50%) scale(.94)}
  100%{opacity:1;transform:translate(-50%,-50%) scale(1.07)}
}

/* пылинки в луче света */
.hero-dust{position:absolute;inset:0;pointer-events:none;mix-blend-mode:screen}
.hero-kicker{position:absolute;left:0;top:calc(112px + env(safe-area-inset-top,0px));width:100%;display:flex;justify-content:space-between;gap:16px;color:var(--cream-70)}
.hero-foot{position:absolute;left:0;bottom:clamp(28px,5vh,62px);width:100%}
.hero-foot-in{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;flex-wrap:wrap}
.hero-claim{font-style:italic;font-size:clamp(26px,3.4vw,40px);line-height:1.16;max-width:16ch;display:flex;flex-direction:column;gap:16px}
.hero-act{display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.hero-tel{font-family:var(--display);font-weight:300;font-size:18px;letter-spacing:.08em;color:var(--cream-70)}

/* ---------- полоса фактов ---------- */
.strip{border-block:1px solid var(--line)}
.strip-in{display:flex;flex-wrap:wrap}
.strip-in>div{flex:1 1 180px;padding:26px 16px;text-align:center;color:var(--cream-70);border-left:1px solid var(--line)}
.strip-in>div:first-child{border-left:0}

/* ---------- услуги ---------- */
.sec{padding-block:clamp(64px,9vw,112px)}
.svc-grid{display:grid;grid-template-columns:minmax(0,420px) minmax(0,1fr);gap:clamp(36px,6vw,96px);align-items:start}
.svc-intro{display:flex;flex-direction:column;gap:24px}
.svc-intro figure{margin:0;overflow:hidden}
.svc-intro img{width:100%;height:clamp(200px,26vw,262px);object-fit:cover;object-position:center 40%}
.svc-list{display:flex;flex-direction:column}
.svc-row{display:flex;align-items:center;gap:20px;padding:22px 18px;border-bottom:1px solid var(--line);transition:background .25s ease}
.svc-row:first-child{border-top:1px solid var(--line)}
.svc-name{flex:1 1 auto;display:flex;flex-direction:column;gap:5px;min-width:0}
.svc-name b{font-family:var(--display);font-weight:300;font-size:clamp(18px,2.1vw,23px);letter-spacing:.02em}
.svc-name i{font-family:var(--display);font-style:normal;font-weight:200;font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--cream-55)}
.svc-price{font-family:var(--display);font-weight:400;font-size:clamp(18px,2.1vw,23px);font-variant-numeric:tabular-nums}
.svc-book{
  display:none;font-family:var(--display);font-weight:500;font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  padding:12px 22px;background:var(--gold);color:var(--ink);white-space:nowrap;border:0;cursor:pointer;
}
@media (hover:hover) and (pointer:fine){
  .svc-row:hover,.svc-row:focus-within{background:rgba(107,18,32,.4)}
  .svc-row:hover .svc-price,.svc-row:focus-within .svc-price{display:none}
  .svc-row:hover .svc-book,.svc-row:focus-within .svc-book{display:inline-block}
}
.svc-more{margin-top:30px;display:inline-flex;align-items:center;gap:14px;color:var(--gold);font-family:var(--display);font-weight:300;font-size:12px;letter-spacing:.24em;text-transform:uppercase;background:none;border:0;padding:0;cursor:pointer}
.svc-more i{width:44px;height:1px;background:var(--gold);display:block;transition:width .3s ease}
.svc-more:hover i{width:70px}

/* ---------- кабинеты ---------- */
.rooms{background:var(--ink-2)}
.rooms-head{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;flex-wrap:wrap;margin-bottom:clamp(32px,4vw,52px)}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:clamp(20px,2.6vw,40px)}
.card{background:var(--ink);border:1px solid rgba(200,161,39,.28);display:flex;flex-direction:column}
.card figure{margin:0;overflow:hidden;aspect-ratio:29/20;max-width:100%}
.card img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.3,1)}
.card:hover img{transform:scale(1.05)}
.card-body{padding:26px 28px 30px;display:flex;flex-direction:column;gap:11px}
.card-top{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.card-top b{font-family:var(--display);font-weight:400;font-size:21px;letter-spacing:.06em;text-transform:uppercase}
.card-top span{font-family:var(--display);font-weight:200;font-size:12px;letter-spacing:.16em;color:var(--gold);white-space:nowrap}
.card p{margin:0;font-size:17px;line-height:1.55;color:var(--cream-70)}

/* ---------- цитата ---------- */
.band{position:relative;height:clamp(280px,34vw,340px);overflow:hidden;display:grid;place-items:center}
.band>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 34%;transform:scale(1.2);will-change:transform}
.band .veil{position:absolute;inset:0;background:rgba(15,14,13,.72)}
.moulding{position:absolute;pointer-events:none;border:1px solid rgba(200,161,39,.5)}
.moulding-1{inset:clamp(18px,2.4vw,34px)}
.moulding-2{inset:clamp(28px,3.2vw,44px);border-color:rgba(200,161,39,.22)}
.band-in{position:relative;text-align:center;display:flex;flex-direction:column;align-items:center;gap:20px;padding-inline:clamp(32px,8vw,120px)}
.band-in q{font-style:italic;font-size:clamp(21px,3.2vw,40px);line-height:1.3;quotes:none;max-width:24ch}

/* ---------- клуб ---------- */
.club{position:relative;background:var(--bordo-d);overflow:hidden;padding-block:clamp(56px,7vw,80px)}
.club-frame{position:absolute;inset:clamp(22px,3vw,56px);border:1px solid rgba(200,161,39,.55);pointer-events:none}
.club-frame.inner{inset:clamp(34px,3.9vw,68px);border-color:rgba(200,161,39,.25)}
.club-grid{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(32px,5vw,72px);align-items:center;padding-block:clamp(24px,4vw,64px)}
.club-copy{display:flex;flex-direction:column;gap:24px;align-items:flex-start;padding-left:clamp(0px,2vw,44px)}
.club-copy .lead{color:rgba(243,239,230,.82)}
.club-shot{position:relative;overflow:hidden;aspect-ratio:11/10;max-width:100%;box-shadow:-24px 26px 60px rgba(0,0,0,.45)}
.club-shot img{width:100%;height:100%;object-fit:cover;object-position:52% 46%;transform:scale(1.16);will-change:transform}

/* ---------- мастера ---------- */
.masters{background:var(--cream);color:var(--ink)}
.masters .eyebrow{color:#8A6C18}
.masters-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap;margin-bottom:clamp(30px,4vw,44px)}
.masters-head button{font-family:var(--display);font-weight:400;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--bordo);background:none;border:0;padding:0;cursor:pointer}
.team{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:clamp(20px,2.6vw,36px)}
.person{display:flex;flex-direction:column;gap:14px;align-items:flex-start}
.person .shot{position:relative;width:100%;aspect-ratio:37/30;background:var(--bordo-d);display:grid;place-items:center}
.person .shot img{width:50px;height:64px;opacity:.34}
.person .shot span{position:absolute;left:0;bottom:12px;width:100%;text-align:center;color:rgba(243,239,230,.68);font-size:9px}
.person b{font-family:var(--display);font-weight:400;font-size:20px;letter-spacing:.04em}
.person em{font-size:17px;color:#5A5245;line-height:1.4;font-style:italic}
.person .book-link{font-family:var(--display);font-weight:400;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--bordo);background:none;border:0;padding:8px 0;cursor:pointer;border-bottom:1px solid rgba(107,18,32,.35);transition:color .2s ease,border-color .2s ease}
.person .book-link:hover{color:#8A6C18;border-color:#8A6C18}

/* ---------- призыв и подвал ---------- */
.cta{text-align:center;display:flex;flex-direction:column;align-items:center;gap:26px}
.cta h2{max-width:18ch}
.foot{border-top:1px solid var(--line);padding-block:clamp(44px,6vw,62px) 30px}
.foot-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:clamp(28px,4vw,72px);align-items:start}
.foot-col{display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.foot-col a,.foot-col span{font-size:19px;color:var(--cream-70)}
.foot-col a:hover{color:var(--gold-l)}
.foot-col button{font-size:19px;color:var(--cream-70);font-family:var(--serif);background:none;border:0;padding:0;cursor:pointer;text-align:left}
.foot-col button:hover{color:var(--gold-l)}
.foot-brand img{width:36px;height:46px;margin-bottom:6px}
.foot-bar{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-top:clamp(34px,4vw,50px);padding-top:22px;border-top:1px solid var(--line)}
.foot-bar em{font-style:italic;font-size:21px;color:var(--gold)}
.socials{display:flex;gap:22px;flex-wrap:wrap}

/* ---------- модальное окно онлайн-записи (YClients) ---------- */
.yc-modal{
  position:fixed;inset:0;z-index:90;display:flex;
  padding:clamp(12px,3vw,40px);
  padding-top:calc(clamp(12px,3vw,40px) + env(safe-area-inset-top,0px));
  padding-bottom:calc(clamp(12px,3vw,40px) + env(safe-area-inset-bottom,0px));
  background:rgba(9,8,8,.86);
}
.yc-dialog{
  width:min(980px,100%);max-height:100%;margin:auto;
  display:flex;flex-direction:column;overflow:hidden;
  background:var(--cream);border:1px solid var(--gold);
  box-shadow:0 30px 80px rgba(0,0,0,.6);
}
.yc-bar{display:flex;align-items:center;gap:16px;padding:13px 16px;background:var(--ink);border-bottom:1px solid rgba(200,161,39,.5)}
.yc-bar .crest{width:18px;height:23px;flex-shrink:0}
.yc-title{flex:1 1 auto;font-family:var(--display);font-weight:300;font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--cream)}
.yc-ext{font-family:var(--display);font-weight:300;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);white-space:nowrap}
.yc-ext:hover{color:var(--gold-l)}
.yc-close{width:44px;height:44px;flex-shrink:0;background:none;border:0;color:var(--cream);font-size:24px;line-height:1;cursor:pointer}
.yc-close:hover{color:var(--gold-l)}
.yc-body{position:relative;flex:1 1 auto;min-height:min(74vh,720px);background:var(--cream)}
.yc-frame{position:absolute;inset:0;width:100%;height:100%;border:0}
.yc-note{
  position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
  padding:24px;text-align:center;color:#5A5245;
}
.yc-note .lbl{color:#8A6C18}
.yc-note span:not(.lbl){max-width:44ch;font-size:18px;line-height:1.55}
.yc-note .btn{margin-top:14px}
/* в демо-режиме форма не грузится, поэтому окно не растягиваем */
.yc-modal--demo .yc-body{min-height:300px}

/* ==========================================================================
   Атмосфера: зернистость, виньетка, появление секций
   ========================================================================== */

.grain,.vignette{position:fixed;inset:0;z-index:55;pointer-events:none}
.grain{
  opacity:.14;mix-blend-mode:overlay;
  width:200%;height:200%;left:-50%;top:-50%;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain 1s steps(6) infinite;
}
@keyframes grain{
  0%{transform:translate(0,0)}
  17%{transform:translate(-3%,-4%)}
  34%{transform:translate(-6%,2%)}
  51%{transform:translate(2%,-5%)}
  68%{transform:translate(-2%,4%)}
  85%{transform:translate(4%,1%)}
  100%{transform:translate(0,0)}
}
.vignette{
  background:
    radial-gradient(ellipse at 50% 42%,rgba(0,0,0,0) 38%,rgba(0,0,0,.30) 74%,rgba(0,0,0,.72) 100%),
    linear-gradient(180deg,rgba(74,12,19,.12) 0%,rgba(0,0,0,0) 22%);
}

html.js .reveal{opacity:0;transform:translateY(24px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.3,1)}
html.js .reveal.is-in{opacity:1;transform:none}

/* ==========================================================================
   Часы клуба
   ========================================================================== */

.hours{flex:1 1 180px;padding:26px 16px;display:flex;align-items:center;justify-content:center;gap:11px;color:var(--cream-70)}
.hours .dot{width:7px;height:7px;border-radius:50%;background:var(--cream-55);flex-shrink:0;transition:background .4s ease,box-shadow .4s ease}
.hours.is-open .dot{background:var(--gold);box-shadow:0 0 0 0 rgba(200,161,39,.55);animation:pulse 3.2s ease-out infinite}
.hours.is-open #hoursText{color:var(--gold-l)}
@keyframes pulse{
  0%{box-shadow:0 0 0 0 rgba(200,161,39,.5)}
  70%{box-shadow:0 0 0 9px rgba(200,161,39,0)}
  100%{box-shadow:0 0 0 0 rgba(200,161,39,0)}
}

/* ==========================================================================
   Пока вы ждёте
   ========================================================================== */

.amen{border-bottom:1px solid var(--line)}
.amen-in{display:flex;align-items:baseline;gap:clamp(20px,4vw,56px);flex-wrap:wrap;padding-block:clamp(30px,4vw,44px)}
.amen-list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:clamp(14px,2.4vw,32px);align-items:baseline}
.amen-list li{
  position:relative;font-size:clamp(17px,2vw,21px);color:var(--cream-70);
  padding-left:clamp(14px,2.4vw,32px);
}
.amen-list li::before{content:"";position:absolute;left:0;top:.62em;width:5px;height:5px;background:var(--gold);opacity:.75}
.amen-list li:first-child{padding-left:0}
.amen-list li:first-child::before{display:none}

/* ==========================================================================
   Кнопки «смотреть» на снимках
   ========================================================================== */

.card-fig,.svc-figure,.gal-item{
  position:relative;display:block;padding:0;border:0;background:var(--ink-2);
  overflow:hidden;cursor:pointer;width:100%;
}
.card-fig{aspect-ratio:29/20}
.svc-figure{height:clamp(200px,26vw,262px)}
.card-fig img,.svc-figure img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.3,1)}
.svc-figure img{object-position:center 40%}
.card-fig:hover img,.svc-figure:hover img,.gal-item:hover img{transform:scale(1.05)}
.zoom{
  position:absolute;left:50%;bottom:16px;transform:translateX(-50%) translateY(8px);
  padding:10px 20px;background:rgba(15,14,13,.82);border:1px solid var(--gold);color:var(--gold-l);
  opacity:0;transition:opacity .3s ease,transform .3s ease;white-space:nowrap;
}
.card-fig:hover .zoom,.card-fig:focus-visible .zoom,
.svc-figure:hover .zoom,.svc-figure:focus-visible .zoom{opacity:1;transform:translateX(-50%) translateY(0)}

/* ==========================================================================
   Лента интерьера
   ========================================================================== */

.gal{padding-block:clamp(56px,7vw,90px)}
.gal-head{display:flex;flex-direction:column;gap:20px;margin-bottom:clamp(28px,3.4vw,44px)}
.gal-row{
  display:flex;gap:clamp(12px,1.6vw,20px);overflow-x:auto;overscroll-behavior-x:contain;
  padding-inline:var(--gutter);padding-bottom:14px;
  scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:var(--gold) transparent;
}
.gal-row::-webkit-scrollbar{height:3px}
.gal-row::-webkit-scrollbar-thumb{background:rgba(200,161,39,.6)}
.gal-item{
  flex:0 0 clamp(230px,27vw,360px);aspect-ratio:4/3;scroll-snap-align:start;
  filter:saturate(.85) brightness(.88);transition:filter .5s ease;
}
.gal-item:hover,.gal-item:focus-visible{filter:none}
.gal-item img{width:100%;height:100%;object-fit:cover;transition:transform .7s cubic-bezier(.2,.7,.3,1)}

/* ==========================================================================
   Лайтбокс
   ========================================================================== */

.lb{
  position:fixed;inset:0;z-index:95;display:flex;flex-direction:column;
  background:#0A0908;
  padding:calc(14px + env(safe-area-inset-top,0px)) 14px calc(14px + env(safe-area-inset-bottom,0px));
}
.lb-bar{display:flex;align-items:center;gap:16px;padding:6px 6px 14px}
.lb-title{flex:1 1 auto;font-family:var(--display);font-weight:300;font-size:11px;letter-spacing:.26em;text-transform:uppercase;color:var(--cream-70)}
.lb-count{font-family:var(--display);font-weight:300;font-size:11px;letter-spacing:.2em;color:var(--gold);font-variant-numeric:tabular-nums}
.lb-close{width:44px;height:44px;background:none;border:0;color:var(--cream);font-size:26px;line-height:1;cursor:pointer}
.lb-close:hover{color:var(--gold-l)}
/* картинку центрируем абсолютом: в grid с авто-строкой max-height:100%
   считается от самой картинки и не ограничивает её */
.lb-stage{flex:1 1 auto;position:relative;min-height:0}
.lb-stage img{
  position:absolute;inset:0;margin:auto;
  max-width:100%;max-height:100%;width:auto;height:auto;
  object-fit:contain;box-shadow:0 26px 70px rgba(0,0,0,.6);
}
.lb-nav{
  position:absolute;top:50%;transform:translateY(-50%);width:54px;height:54px;
  background:rgba(15,14,13,.7);border:1px solid rgba(200,161,39,.45);color:var(--gold-l);
  font-size:22px;line-height:1;cursor:pointer;transition:background .25s ease,border-color .25s ease;
}
.lb-nav:hover{background:var(--gold);color:var(--ink);border-color:var(--gold)}
.lb-prev{left:6px}
.lb-next{right:6px}
.lb-cap{padding:14px 6px 0;text-align:center;color:var(--cream-55);font-size:16px}

/* ==========================================================================
   Открывающая сцена
   ========================================================================== */

.intro{position:fixed;inset:0;z-index:120;pointer-events:auto}
.intro-half{position:absolute;top:0;bottom:0;width:50.5%;background:var(--ink);transition:transform 1s cubic-bezier(.76,0,.24,1)}
.intro-l{left:0}
.intro-r{right:0}
.intro.is-open .intro-l{transform:translateX(-101%)}
.intro.is-open .intro-r{transform:translateX(101%)}
.intro-mark{
  position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;
  transition:opacity .5s ease;
}
.intro.is-open .intro-mark{opacity:0}
.intro-mark img{width:52px;height:67px;opacity:0;transform:translateY(10px);transition:opacity .7s ease,transform .7s ease}
.intro-mark .hair{width:min(280px,54vw);max-width:none;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:center;transition:transform .8s cubic-bezier(.2,.7,.3,1) .25s}
.intro-mark .lbl{color:var(--cream-55);opacity:0;transition:opacity .7s ease .55s}
.intro.is-lit img{opacity:1;transform:none}
.intro.is-lit .hair{transform:scaleX(1)}
.intro.is-lit .lbl{opacity:1}

/* ==========================================================================
   Курсор
   ========================================================================== */

.cursor{
  position:fixed;left:0;top:0;z-index:110;pointer-events:none;
  width:34px;height:34px;margin:-17px 0 0 -17px;border-radius:50%;
  border:1px solid rgba(200,161,39,.85);
  display:grid;place-items:center;opacity:0;
  transition:opacity .3s ease,width .3s ease,height .3s ease,margin .3s ease,background .3s ease,border-color .3s ease;
}
.cursor.is-on{opacity:1}
.cursor .cursor-label{
  font-family:var(--display);font-weight:400;font-size:10px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--ink);opacity:0;transition:opacity .2s ease;white-space:nowrap;
}
.cursor.on-link{width:52px;height:52px;margin:-26px 0 0 -26px;border-color:var(--gold-l)}
.cursor.on-view{
  width:96px;height:96px;margin:-48px 0 0 -48px;
  background:var(--gold);border-color:var(--gold);
}
.cursor.on-view .cursor-label{opacity:1}
body.cursor-on .hero,
body.cursor-on .gal-item,
body.cursor-on .card-fig,
body.cursor-on .svc-figure{cursor:none}

/* ==========================================================================
   Бегущая строка
   ========================================================================== */

.marq{
  background:var(--bordo-d);border-block:1px solid rgba(200,161,39,.35);
  overflow:hidden;padding-block:20px;
}
.marq-track{display:flex;width:max-content;animation:marq 34s linear infinite}
.marq:hover .marq-track{animation-play-state:paused}
.marq-track span{
  font-family:var(--display);font-weight:300;font-size:clamp(13px,1.6vw,18px);
  letter-spacing:.28em;text-transform:uppercase;color:var(--cream-70);
  padding-inline:clamp(18px,2.6vw,38px);white-space:nowrap;
}
.marq-track span.sep{color:var(--gold);letter-spacing:0;padding-inline:0}
@keyframes marq{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}

/* ==========================================================================
   Золотая линия, которая рисуется
   ========================================================================== */

.hair{display:block;width:100%;max-width:200px;height:1px;background:var(--gold);opacity:.7}
html.js .reveal .hair{transform:scaleX(0);transform-origin:left;transition:transform 1s cubic-bezier(.2,.7,.3,1) .15s}
html.js .reveal.is-in .hair{transform:scaleX(1)}

@media (max-width:900px){
  .nav{display:none}
  .head-cta{display:none}
  .burger{display:flex}
  .svc-grid{grid-template-columns:minmax(0,1fr)}
  .club-grid{grid-template-columns:minmax(0,1fr)}
  .club-copy{padding-left:0}
  .yc-body{min-height:70vh}
}
@media (max-width:560px){
  .hero-kicker span:last-child{display:none}
  .strip-in>div{flex-basis:100%;border-left:0;border-top:1px solid var(--line)}
  .strip-in>div:first-child{border-top:0}
  .foot-bar{flex-direction:column;align-items:flex-start}
  .yc-modal{padding:0}
  .yc-dialog{border:0;height:100%}
}
@media (max-width:560px){
  .amen-in{flex-direction:column;gap:18px}
  .amen-list{flex-direction:column;gap:10px}
  .amen-list li{padding-left:16px}
  .amen-list li:first-child{padding-left:16px}
  .amen-list li:first-child::before{display:block}
  .lb-nav{width:46px;height:46px}
}

@media (prefers-reduced-motion:reduce){
  *{transition-duration:.01ms !important;animation-duration:.01ms !important}
  html.js .reveal{opacity:1;transform:none}
  html.js .reveal .hair{transform:none}
  .hours.is-open .dot{animation:none}
  .hero-glow,.hero-dust,.cursor{display:none}
  .grain{animation:none}
  .lamp{animation:none;opacity:.85}
  .marq-track{animation:none;width:auto;justify-content:center;flex-wrap:wrap}
  .intro{display:none}
}