@font-face{font-family:Num;src:url(/fonts/num-book.woff2) format("woff2");font-weight:100 500;unicode-range:U+0030-0039,U+002E,U+003A,U+0025,U+002F;font-display:swap}
@font-face{font-family:Num;src:url(/fonts/num-demi.woff2) format("woff2");font-weight:600 900;unicode-range:U+0030-0039,U+002E,U+003A,U+0025,U+002F;font-display:swap}
@font-face{font-family:GESS;src:url(/fonts/gess-light.woff2) format("woff2");font-weight:300;font-display:swap}
@font-face{font-family:GESS;src:url(/fonts/gess-medium.woff2) format("woff2");font-weight:500;font-display:swap}
@font-face{font-family:GESS;src:url(/fonts/gess-bold.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:Ruqaa;src:url(/fonts/ruqaa-bold.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:Bodoni;src:url(/fonts/bodoni-bold.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:Bodoni;src:url(/fonts/bodoni-book.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:VHS;src:url(/fonts/vt323.woff2) format("woff2");font-display:swap}

:root{
  --ink:#0b1510;--green:#12241b;--green2:#1b3428;--green3:#27463a;
  --gold:#e9bc62;--gold2:#f6dca0;--bronze:#9a7447;--kraft:#c8a57a;--board:#dcbfae;
  --cream:#f2e8d6;--muted:rgba(242,232,214,.64);--line:rgba(233,188,98,.22);--brick:#8a4a33;--cherry:#5e2a1c;
  --ar:Num,GESS,"Segoe UI",Tahoma,sans-serif;--ruq:Ruqaa,GESS,serif;--lat:Bodoni,Georgia,serif;--vhs:VHS,ui-monospace,monospace;
  --pad:clamp(16px,5vw,72px);--r:18px;--ease:cubic-bezier(.2,.7,.1,1);
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--ink);color:var(--cream);font:300 17px/1.75 var(--ar);overflow-x:hidden;-webkit-font-smoothing:antialiased}
img,video{display:block;max-width:100%;height:auto}
a{color:inherit}
button,input,textarea,select{font:inherit;color:inherit}
::selection{background:var(--gold);color:var(--ink)}
.lat{font-family:var(--lat);letter-spacing:.02em}
.vhs{font-family:var(--vhs);letter-spacing:.06em;direction:ltr;unicode-bidi:isolate}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.wrap{width:min(1240px,100%);margin-inline:auto;padding-inline:var(--pad)}
section{position:relative}
.kicker{font:400 15px/1 var(--vhs);letter-spacing:.22em;color:var(--gold);text-transform:uppercase;direction:ltr;display:inline-flex;gap:.6em;align-items:center}
.kicker::before{content:"";width:8px;height:8px;border-radius:50%;background:#e2483d;box-shadow:0 0 12px #e2483d;animation:rec 1.6s steps(1) infinite}
@keyframes rec{50%{opacity:.15}}
h1,h2,h3{margin:0;font-weight:700}
h2{font:700 clamp(40px,7vw,92px)/1.05 var(--ruq);color:var(--gold2);text-wrap:balance}
h2 .lat{font-size:.55em;display:block;color:var(--muted);font-weight:400;margin-top:.35em}
.lead{color:var(--muted);font-size:clamp(17px,1.6vw,20px);max-width:34ch}
.btn{--b:var(--gold);display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:52px;padding:0 28px;border-radius:999px;border:1px solid var(--b);
  background:var(--b);color:var(--ink);font-weight:700;text-decoration:none;cursor:pointer;transition:transform .3s var(--ease),box-shadow .3s,background .3s;white-space:nowrap}
.btn:hover{transform:translateY(-2px);box-shadow:0 12px 40px -12px rgba(233,188,98,.7)}
.btn.ghost{background:transparent;color:var(--cream);border-color:rgba(242,232,214,.35)}
.btn.ghost:hover{border-color:var(--gold);color:var(--gold2)}
.btn:focus-visible,a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

/* reveal — one class only (.rv), children never re-use it */
.rv{opacity:0;transform:translateY(34px);transition:opacity 1.1s var(--ease),transform 1.1s var(--ease)}
.rv.in{opacity:1;transform:none}
.rv.d1{transition-delay:.12s}.rv.d2{transition-delay:.24s}.rv.d3{transition-delay:.36s}
@media (prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}*{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}}

/* ---------- splash (VHS) ---------- */
#tape{position:fixed;inset:0;z-index:100;background:#050806;display:grid;place-items:center;overflow:hidden;cursor:pointer;transition:clip-path 1s var(--ease)}
#tape.out{clip-path:inset(0 0 100% 0)}
#tape .osd{position:absolute;top:22px;left:26px;font:28px/1.2 var(--vhs);color:#e8f0e0;text-shadow:2px 0 rgba(255,0,60,.5),-2px 0 rgba(0,200,255,.5);direction:ltr}
#tape .osd.r{left:auto;right:26px}
#tape .osd.b{top:auto;bottom:24px}
#tape .medal{width:min(46vw,260px);height:auto;aspect-ratio:1;object-fit:contain;opacity:0;transform:scale(.7) rotate(-18deg);animation:medal 1.3s .25s var(--ease) forwards;filter:drop-shadow(0 30px 60px rgba(233,188,98,.25))}
@keyframes medal{to{opacity:1;transform:none}}
#tape .stamp{position:absolute;bottom:22%;display:flex;gap:.35em;font:700 clamp(34px,7vw,64px)/1 var(--ruq);color:var(--gold2)}
#tape .stamp span{opacity:0;transform:scale(2.2);animation:stamp .38s var(--ease) forwards}
#tape .stamp span:nth-child(1){animation-delay:1.25s}#tape .stamp span:nth-child(2){animation-delay:1.55s}#tape .stamp span:nth-child(3){animation-delay:1.85s}
@keyframes stamp{60%{opacity:1;transform:scale(.94)}to{opacity:1;transform:none}}
#tape .scan{position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,rgba(255,255,255,.035) 0 1px,transparent 1px 3px);mix-blend-mode:screen}
#tape .track{position:absolute;left:0;right:0;height:18%;top:-20%;background:linear-gradient(180deg,transparent,rgba(255,255,255,.08) 40%,rgba(255,255,255,.18) 50%,transparent);animation:track 2.4s .1s linear}
@keyframes track{to{top:110%}}
#tape .skip{position:absolute;bottom:26px;right:26px;font:20px var(--vhs);color:var(--muted);background:none;border:0;cursor:pointer}

/* ---------- header ---------- */
.top{position:fixed;inset:0 0 auto;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px var(--pad);transition:background .4s,padding .4s,backdrop-filter .4s}
.top.solid{background:rgba(11,21,16,.82);backdrop-filter:blur(14px);padding-block:10px;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none}
.brand img{width:42px;height:42px}
.brand b{font:700 26px/1 var(--ruq);color:var(--gold2)}
.brand small{display:block;font:400 11px/1 var(--lat);letter-spacing:.28em;color:var(--muted);margin-top:4px;direction:ltr}
.nav{display:flex;gap:26px}
.nav a{text-decoration:none;font-size:15px;color:var(--muted);transition:color .3s}
.nav a:hover{color:var(--gold2)}
.top .btn{min-height:42px;padding:0 20px;font-size:15px}
@media (max-width:900px){.nav{display:none}}

/* ---------- hero ---------- */
.hero{height:100svh;min-height:600px;display:grid;align-items:end;overflow:hidden;isolation:isolate}
.hero video,.hero .poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(11,21,16,.55),transparent 28%,transparent 45%,rgba(11,21,16,.92) 92%),radial-gradient(120% 70% at 50% 110%,rgba(11,21,16,.9),transparent 60%)}
.hero .osd{position:absolute;top:92px;inset-inline-end:var(--pad);font:22px/1.25 var(--vhs);color:#eef3e6;text-shadow:2px 0 rgba(255,0,60,.45),-2px 0 rgba(0,200,255,.45);direction:ltr;text-align:left;opacity:.9}
.hero .osd.l{inset-inline-end:auto;inset-inline-start:var(--pad)}
.hero-in{padding:0 var(--pad) clamp(40px,9vh,96px);display:grid;gap:22px;max-width:1240px;width:100%;margin-inline:auto}
.hero h1{font:700 clamp(64px,13vw,190px)/.95 var(--ruq);color:var(--gold2);text-shadow:0 0 40px rgba(233,188,98,.35),0 2px 0 rgba(0,0,0,.4)}
.hero .sub{font-size:clamp(17px,2vw,22px);color:var(--cream);opacity:.9;margin:0}
.hero .sub .lat{color:var(--gold);font-size:.8em;letter-spacing:.22em;text-transform:uppercase;margin-inline-start:.6em}
.hero .ctas{display:flex;gap:12px;flex-wrap:wrap}
.hero .loc{position:absolute;bottom:clamp(40px,9vh,96px);inset-inline-end:var(--pad);font-size:14px;color:var(--muted);text-align:end;line-height:1.6}
@media (max-width:760px){.hero .loc{display:none}.hero .osd{top:78px;font-size:18px}}

/* ---------- ticker ---------- */
.ticker{border-block:1px solid var(--line);overflow:hidden;background:var(--green);padding:18px 0}
.ticker .row{display:flex;gap:48px;width:max-content;animation:tick 38s linear infinite;align-items:center}
.ticker span{font:700 clamp(26px,3.4vw,44px)/1 var(--ruq);color:var(--gold2);white-space:nowrap}
.ticker span.lat{font:700 clamp(20px,2.4vw,30px)/1 var(--lat);letter-spacing:.24em;color:var(--kraft);direction:ltr}
.ticker i{width:10px;height:10px;border-radius:50%;background:var(--gold);box-shadow:0 0 14px var(--gold),0 0 30px rgba(233,188,98,.6);flex:none}
@keyframes tick{to{transform:translateX(50%)}}

/* ---------- story ---------- */
.story{padding:clamp(90px,14vw,180px) 0}
.story .grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(32px,6vw,96px);align-items:center}
.frame{position:relative;padding:14px;background:linear-gradient(135deg,#b88d3c,#f3d58c 30%,#8e6526 55%,#e8c06a 80%,#9a7231);border-radius:4px;box-shadow:0 40px 90px -30px rgba(0,0,0,.8),inset 0 0 0 1px rgba(0,0,0,.3)}
.frame::before{content:"";position:absolute;inset:8px;border:1px solid rgba(60,40,10,.55);pointer-events:none;z-index:1}
.frame img{width:100%;height:100%;object-fit:cover;filter:sepia(.12) contrast(1.04)}
.story .stats{display:flex;gap:clamp(20px,4vw,48px);margin-top:36px;flex-wrap:wrap}
.stat b{display:block;font:700 clamp(38px,4.6vw,58px)/1 var(--lat);color:var(--gold2)}
.stat span{font-size:14px;color:var(--muted)}
@media (max-width:860px){.story .grid{grid-template-columns:1fr}}

/* ---------- services board ---------- */
.services{padding:clamp(90px,12vw,160px) 0;background:radial-gradient(90% 60% at 50% 0,rgba(39,70,58,.55),transparent 70%)}
.head{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;margin-bottom:clamp(36px,5vw,64px)}
.board{position:relative;background:linear-gradient(180deg,#e3c8b7,#d6b6a2);color:#2b1d14;border-radius:6px;padding:clamp(22px,4vw,56px);
  box-shadow:0 0 0 12px #3a2016,0 0 0 14px #b8904a,0 0 0 22px #2a170f,0 60px 120px -40px rgba(0,0,0,.9)}
.board::before{content:"";position:absolute;inset:12px;border:1px solid rgba(90,55,25,.45);border-radius:3px;pointer-events:none}
.board .tabs{display:flex;gap:6px;flex-wrap:wrap;justify-content:center;margin-bottom:28px;position:relative}
.board .tabs button{border:1px solid rgba(58,32,22,.35);background:transparent;border-radius:999px;padding:8px 18px;cursor:pointer;font-size:15px;color:#3a2016;transition:.3s}
.board .tabs button[aria-selected=true]{background:#2a170f;color:var(--gold2);border-color:#2a170f}
.board .title{display:flex;align-items:center;justify-content:center;gap:14px;margin-bottom:26px;font:700 clamp(22px,2.6vw,30px)/1 var(--lat);letter-spacing:.2em;direction:ltr;color:#2a170f}
.board .title::before,.board .title::after{content:"";height:1px;flex:1;max-width:140px;background:linear-gradient(90deg,transparent,#5a3a22)}
.board .title::after{transform:scaleX(-1)}
.items{display:grid;grid-template-columns:1fr 1fr;gap:6px 56px;position:relative}
.item{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:baseline;padding:12px 4px;border-bottom:1px dashed rgba(58,32,22,.22)}
.item .n{font-weight:700;font-size:17px}
.item .n small{display:block;font:400 13px/1.4 var(--lat);color:#6b4b35;direction:ltr;text-align:right;letter-spacing:.04em}
.item .dots{border-bottom:2px dotted rgba(58,32,22,.35);transform:translateY(-6px)}
.item .p{font:700 20px/1 var(--lat);white-space:nowrap;direction:ltr}
.item .p small{font:500 12px var(--ar);color:#6b4b35;margin-inline-start:4px}
.item .m{grid-column:1/-1;font-size:13px;color:#6b4b35;display:flex;justify-content:space-between;align-items:center;margin-top:-4px}
.item .m button{border:0;background:none;color:#2a170f;font-weight:700;text-decoration:underline;text-underline-offset:4px;cursor:pointer;font-size:13px;padding:6px 0}
.board .offer{position:absolute;top:-18px;inset-inline-start:24px;background:#2a170f;color:var(--gold2);padding:6px 16px;border-radius:999px;font-size:14px;box-shadow:0 0 0 2px #b8904a}
@media (max-width:760px){.items{grid-template-columns:1fr}.board{box-shadow:0 0 0 8px #3a2016,0 0 0 10px #b8904a,0 0 0 15px #2a170f,0 40px 80px -30px rgba(0,0,0,.9)}}

.packs{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:clamp(70px,9vw,120px)}
.pack{position:relative;border-radius:var(--r);overflow:hidden;min-height:420px;display:flex;flex-direction:column;justify-content:end;padding:22px;isolation:isolate;border:1px solid var(--line)}
.pack img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform 1.4s var(--ease)}
.pack:hover img{transform:scale(1.06)}
.pack::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 30%,rgba(11,21,16,.95))}
.pack h3{font:700 30px/1.1 var(--ruq);color:var(--gold2)}
.pack p{margin:6px 0 14px;font-size:14px;color:var(--muted)}
.pack .row{display:flex;justify-content:space-between;align-items:center}
.pack .price{font:700 30px/1 var(--lat);direction:ltr}
.pack .price small{font:500 13px var(--ar)}
.pack button{min-height:42px;padding:0 18px;font-size:14px}
@media (max-width:1000px){.packs{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.packs{grid-template-columns:1fr}.pack{min-height:340px}}

/* ---------- barbers: cassettes ---------- */
.crew{padding:clamp(90px,12vw,160px) 0;overflow:hidden}
.tapes{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,3vw,34px)}
.tape{--c:#1b3428;position:relative;aspect-ratio:1.6;border-radius:14px;background:linear-gradient(160deg,#2a2a28,#141413);padding:7% 6% 9%;cursor:pointer;border:0;text-align:start;
  box-shadow:0 30px 60px -25px rgba(0,0,0,.9),inset 0 1px 0 rgba(255,255,255,.08);transition:transform .5s var(--ease)}
.tape:hover{transform:translateY(-6px) rotate(-1deg)}
.tape .lbl{position:absolute;inset:7% 6% 22%;border-radius:6px;background:linear-gradient(180deg,var(--cream) 0 52%,var(--c) 52% 55%,var(--cream) 55%);color:#1b140e;padding:5% 6%;overflow:hidden}
.tape .lbl .side{font:16px/1 var(--vhs);color:#7a5a3c;direction:ltr;display:flex;justify-content:space-between}
.tape .lbl b{display:block;font:700 clamp(24px,2.6vw,34px)/1.1 var(--ruq);color:#1b140e;margin-top:4%}
.tape .lbl em{position:absolute;bottom:8%;inset-inline-start:6%;font:400 12px var(--lat);font-style:normal;letter-spacing:.2em;color:#6b4b35;direction:ltr;display:block}
.tape .win{position:absolute;left:26%;right:26%;bottom:25%;height:14%;border-radius:40px;background:#0c0c0c;box-shadow:inset 0 2px 6px #000;display:flex;justify-content:space-between;align-items:center;padding:0 5%}
.tape .win i{width:24%;aspect-ratio:1;border-radius:50%;background:repeating-conic-gradient(#e8e0cf 0 30deg,#bfb6a3 30deg 60deg);box-shadow:0 0 0 3px #3b2a1c;animation:spin 3s linear infinite paused}
.tape:hover .win i{animation-play-state:running}
@keyframes spin{to{transform:rotate(360deg)}}
.tape .foot{position:absolute;left:22%;right:22%;bottom:0;height:18%;background:linear-gradient(180deg,#222,#161616);clip-path:polygon(8% 0,92% 0,100% 100%,0 100%);border-radius:4px 4px 0 0}
.tape .cta{position:absolute;bottom:4%;inset-inline-end:6%;font:16px var(--vhs);color:var(--gold);direction:ltr}
.tape.any .lbl{background:linear-gradient(180deg,var(--gold2) 0 52%,#2a170f 52% 55%,var(--gold2) 55%)}
@media (max-width:860px){.tapes{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.tapes{grid-template-columns:1fr}}

/* ---------- tuesday: CRT ---------- */
.tue{padding:clamp(90px,12vw,160px) 0;background:linear-gradient(180deg,var(--ink),#16100b 50%,var(--ink))}
.tue .grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,6vw,90px);align-items:center}
.crt{position:relative;background:linear-gradient(160deg,#6e4a2c,#3f2716 60%,#2a190e);border-radius:28px;padding:clamp(18px,3vw,34px) clamp(18px,3vw,34px) clamp(56px,7vw,80px);
  box-shadow:0 50px 100px -30px rgba(0,0,0,.9),inset 0 2px 0 rgba(255,255,255,.12),inset 0 -8px 20px rgba(0,0,0,.5)}
.crt .screen{position:relative;aspect-ratio:4/3;border-radius:30px/24px;overflow:hidden;background:#0f1712;box-shadow:inset 0 0 60px rgba(0,0,0,.95),0 0 0 8px #1a120b;display:grid;place-items:center;text-align:center;isolation:isolate}
.crt .screen::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,rgba(255,255,255,.05) 0 1px,transparent 1px 3px);z-index:2;pointer-events:none}
.crt .screen::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 50%,rgba(0,0,0,.7));z-index:2;pointer-events:none}
.crt canvas{position:absolute;inset:0;width:100%;height:100%;opacity:.22;z-index:0}
.crt .onair{position:relative;z-index:1;padding:8%}
.crt .onair .d{font:700 clamp(44px,7vw,90px)/1 var(--ruq);color:var(--gold2);text-shadow:0 0 24px rgba(233,188,98,.6)}
.crt .onair .c{font:clamp(22px,2.6vw,32px)/1.2 var(--vhs);color:#dfe9d6;margin-top:14px;direction:ltr}
.crt .onair .ch{position:absolute;top:8%;right:8%;font:24px var(--vhs);color:#8fe38f;text-shadow:0 0 8px #3f3}
.crt .knobs{position:absolute;bottom:18px;inset-inline:34px;display:flex;justify-content:space-between;align-items:center}
.crt .knobs span{display:flex;gap:12px}
.crt .knobs i{width:26px;height:26px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#d8c8a8,#6b5a40);box-shadow:0 3px 6px rgba(0,0,0,.6)}
.crt .knobs b{font:400 13px var(--lat);letter-spacing:.3em;color:#caa973;direction:ltr}
.tue .fine{font-size:14px;color:var(--muted);margin-top:18px}
@media (max-width:860px){.tue .grid{grid-template-columns:1fr}}

/* ---------- coffee ---------- */
.coffee{padding:clamp(90px,12vw,160px) 0;overflow:hidden}
.coffee .stage{position:relative;border-radius:calc(var(--r)*1.4);overflow:hidden;min-height:min(88vh,760px);display:grid;align-items:end;isolation:isolate}
.coffee .stage video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.coffee .stage::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(11,21,16,.9),rgba(11,21,16,.2) 60%),linear-gradient(0deg,rgba(11,21,16,.85),transparent 50%)}
[dir=rtl] .coffee .stage::after{background:linear-gradient(270deg,rgba(11,21,16,.9),rgba(11,21,16,.2) 60%),linear-gradient(0deg,rgba(11,21,16,.85),transparent 50%)}
.coffee .inner{padding:clamp(28px,5vw,64px);max-width:640px}
.drinks{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(20px,4vw,48px);margin-top:clamp(40px,6vw,80px);align-items:start}
.menu-c h3{font:700 20px/1 var(--lat);letter-spacing:.24em;color:var(--kraft);direction:ltr;text-align:end;margin:26px 0 8px}
.menu-c h3:first-child{margin-top:0}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{border:1px solid var(--line);border-radius:999px;padding:8px 16px;font-size:15px;display:inline-flex;gap:10px;align-items:baseline}
.chip b{font:700 15px var(--lat);color:var(--gold2);direction:ltr}
.duo{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.duo img{border-radius:var(--r);aspect-ratio:2/3;object-fit:cover;width:100%}
.duo img:nth-child(2){margin-top:44px}
.note{font-size:13px;color:var(--muted);margin-top:14px}
@media (max-width:860px){.drinks{grid-template-columns:1fr}}

/* ---------- place: gallery wall ---------- */
.place{padding:clamp(90px,12vw,160px) 0;background:linear-gradient(180deg,var(--ink),transparent 18%,transparent 82%,var(--ink)),url(/media/wall-900.webp) center/cover fixed;position:relative}
.place::before{content:"";position:absolute;inset:0;background:rgba(20,10,6,.78)}
.place .wrap{position:relative}
.gwall{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(14px,2.4vw,30px);align-items:start}
.gwall .frame{transition:transform .8s var(--ease)}
.gwall .frame:nth-child(odd){transform:rotate(-1.2deg)}.gwall .frame:nth-child(even){transform:rotate(1deg)}
.gwall .frame:hover{transform:none scale(1.02)}
.gwall .f1{grid-column:1/8}.gwall .f2{grid-column:8/13;margin-top:60px}.gwall .f3{grid-column:1/5}.gwall .f4{grid-column:5/10;margin-top:40px}.gwall .f5{grid-column:10/13;margin-top:90px}
.gwall .frame img{aspect-ratio:3/2}.gwall .f3 img,.gwall .f5 img{aspect-ratio:2/3}
.gwall figcaption{position:absolute;bottom:-34px;inset-inline-start:6px;font:18px var(--vhs);color:var(--kraft);direction:ltr}
@media (max-width:760px){.gwall{grid-template-columns:1fr 1fr}.gwall .frame{grid-column:auto!important;margin-top:0!important}.gwall .f1{grid-column:1/-1!important}.gwall figcaption{display:none}.place{background-attachment:scroll}}

/* ---------- booking ---------- */
.book{padding:clamp(90px,12vw,160px) 0;background:radial-gradient(80% 50% at 50% 0,rgba(39,70,58,.5),transparent 70%)}
.bk{display:grid;grid-template-columns:1fr 380px;gap:24px;align-items:start}
.panel{background:rgba(27,52,40,.55);border:1px solid var(--line);border-radius:calc(var(--r)*1.2);padding:clamp(18px,3vw,34px);backdrop-filter:blur(8px)}
.step{padding-bottom:26px;margin-bottom:26px;border-bottom:1px solid var(--line)}
.step:last-of-type{border:0;margin:0;padding:0}
.step h3{display:flex;align-items:center;gap:12px;font:700 20px/1.3 var(--ar);margin-bottom:16px;color:var(--cream)}
.step h3 i{font:400 20px/1 var(--vhs);font-style:normal;color:var(--ink);background:var(--gold);width:30px;height:30px;border-radius:50%;display:grid;place-items:center;flex:none}
.opts{display:flex;flex-wrap:wrap;gap:8px}
.opt{border:1px solid rgba(242,232,214,.2);background:rgba(11,21,16,.35);border-radius:14px;padding:10px 14px;cursor:pointer;text-align:start;transition:.25s;min-height:44px}
.opt:hover{border-color:var(--gold)}
.opt[aria-pressed=true]{background:var(--gold);color:var(--ink);border-color:var(--gold)}
.opt small{display:block;font-size:12px;opacity:.7}
.svc-groups{display:grid;gap:14px}
.svc-groups .g b{display:block;font-size:13px;color:var(--kraft);margin-bottom:8px;font-weight:500}
.days{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;scrollbar-width:thin;scroll-snap-type:x mandatory}
.day{flex:none;width:68px;scroll-snap-align:start;text-align:center;padding:10px 0}
.day b{display:block;font:700 24px/1.1 var(--lat)}
.day small{font-size:12px}
.day.dtue{position:relative}
.day.dtue::after{content:"☕";position:absolute;top:-8px;inset-inline-end:-4px;font-size:14px}
.slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(82px,1fr));gap:8px}
.slots .opt{text-align:center;font:400 20px/1 var(--vhs);padding:12px 4px;direction:ltr}
.empty{color:var(--muted);font-size:15px;padding:12px 0}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.fields label{display:grid;gap:6px;font-size:14px;color:var(--muted)}
.fields label.full{grid-column:1/-1}
.fields input,.fields textarea{width:100%;background:rgba(11,21,16,.5);border:1px solid rgba(242,232,214,.2);border-radius:12px;padding:12px 14px;min-height:48px;color:var(--cream)}
.fields input:focus,.fields textarea:focus{border-color:var(--gold);outline:none}
.fields textarea{min-height:80px;resize:vertical}
.hp{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);opacity:0;pointer-events:none}
.err{color:#ff9c86;font-size:14px;min-height:1.4em;margin-top:10px}
.ticket{position:sticky;top:90px;background:var(--cream);color:#1b140e;border-radius:14px;padding:26px 24px 30px;box-shadow:0 30px 80px -30px rgba(0,0,0,.9);
  -webkit-mask:radial-gradient(circle 10px at 0 62%,transparent 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 10px at 100% 62%,transparent 98%,#000) right/51% 100% no-repeat;
  mask:radial-gradient(circle 10px at 0 62%,transparent 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 10px at 100% 62%,transparent 98%,#000) right/51% 100% no-repeat}
.ticket .th{display:flex;align-items:center;gap:12px;border-bottom:1px dashed #b89f7e;padding-bottom:16px;margin-bottom:16px}
.ticket .th img{width:52px;height:52px}
.ticket .th b{font:700 26px/1 var(--ruq)}
.ticket .th small{display:block;font:400 11px var(--lat);letter-spacing:.25em;color:#7a5a3c;direction:ltr}
.ticket dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:10px 14px;font-size:15px}
.ticket dt{color:#7a5a3c}
.ticket dd{margin:0;font-weight:700;text-align:end}
.ticket .tot{display:flex;justify-content:space-between;align-items:baseline;border-top:1px dashed #b89f7e;margin-top:18px;padding-top:16px}
.ticket .tot b{font:700 30px/1 var(--lat);direction:ltr}
.ticket .btn{width:100%;margin-top:20px;--b:#1b140e;color:var(--gold2)}
.ticket .btn[disabled]{opacity:.35;pointer-events:none}
.ticket .pol{font-size:12px;color:#7a5a3c;margin-top:12px;text-align:center}
.done{text-align:center;padding:clamp(20px,4vw,50px)}
.done .ok{font:700 clamp(46px,7vw,80px)/1 var(--ruq);color:var(--gold2)}
.done .ref{font:28px var(--vhs);letter-spacing:.2em;color:var(--gold);direction:ltr;margin:10px 0 20px}
.done .acts{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:24px}
@media (max-width:980px){.bk{grid-template-columns:1fr}.ticket{position:relative;top:0}}
@media (max-width:520px){.fields{grid-template-columns:1fr}}

/* ---------- visit ---------- */
.visit{padding:clamp(90px,12vw,160px) 0}
.visit .grid{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(24px,5vw,70px);align-items:center}
.visit .frame img{aspect-ratio:3/2}
.info{display:grid;gap:22px}
.info .k{font-size:13px;color:var(--kraft);letter-spacing:.06em}
.info .v{font-size:19px}
.info a{text-decoration:none;border-bottom:1px solid var(--line)}
.info a:hover{color:var(--gold2)}
.info .phones{display:flex;gap:18px;flex-wrap:wrap;direction:ltr;justify-content:flex-end;font-family:var(--lat);font-size:22px}
@media (max-width:860px){.visit .grid{grid-template-columns:1fr}.info .phones{justify-content:flex-start;direction:rtl}}

footer{border-top:1px solid var(--line);padding:56px 0 40px;text-align:center;color:var(--muted);font-size:14px}
footer img{width:84px;margin:0 auto 16px}
footer b{font:700 34px/1 var(--ruq);color:var(--gold2);display:block;margin-bottom:6px}
footer .row{display:flex;gap:18px;justify-content:center;flex-wrap:wrap;margin-top:18px}
footer a{text-decoration:none}
footer a:hover{color:var(--gold2)}

/* ---------- manage page ---------- */
.solo{min-height:100svh;padding:120px 0 80px}
.solo .card{max-width:640px;margin:0 auto}
.status{display:inline-block;padding:4px 14px;border-radius:999px;font-size:14px;background:rgba(233,188,98,.14);color:var(--gold2);border:1px solid var(--line)}
.status.cancelled{background:rgba(255,120,100,.12);color:#ffb09f}

figure.frame{margin:0}
.mt{margin-top:26px}
.done{grid-column:1/-1}
.lead.c{margin:0 auto;max-width:44ch}
.hero .poster{transition:opacity 1.2s}
.hero .poster.gone{opacity:0}
.mdl{display:grid;grid-template-columns:auto 1fr;gap:10px 18px;margin:18px 0}
.mdl dt{color:var(--muted)}.mdl dd{margin:0;font-weight:700}
.acts{display:flex;gap:10px;flex-wrap:wrap}
.ref.vhs{font-size:30px;color:var(--gold);letter-spacing:.2em}
.solo h2{margin-bottom:6px}
.bk>*{min-width:0}
.days{max-width:100%}
@media (max-width:600px){.hero .sub .lat{display:block;margin:6px 0 0;font-size:.72em}.hero .kicker{font-size:13px}}
section[id]{scroll-margin-top:64px}
@media (max-width:600px){#tape .osd{font-size:20px}#tape .skip{bottom:64px}}
.rc img{width:100%;max-width:480px;margin:0 auto;border-radius:14px;box-shadow:0 30px 70px -30px rgba(0,0,0,.9)}
