/* Leopardo offers · immersive system · Oct 2026
   One file for every page. Motion is driven by x.js through two hooks:
   --p (0..1 scroll progress on [data-scrub]) and .in (on [data-reveal]).
   Everything reads correctly with JS off and with reduced motion on. */

@font-face{font-family:"Bagnard";src:url("/assets/fonts/Bagnard.woff") format("woff");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"EB Garamond";src:url("/assets/fonts/eb-garamond-latin-400-normal.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"EB Garamond";src:url("/assets/fonts/eb-garamond-latin-600-normal.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Archivo Fallback";src:url("/assets/fonts/archivo-latin-wdth-normal.woff2") format("woff2");font-weight:100 900;font-stretch:62% 125%;font-style:normal;font-display:swap}

:root{
  --coral:#F28F72;--coral-2:#B4472B;--teal:#8ED1D0;--pink:#E5B3D8;--bone:#F2EFEC;--bone-2:#E7E1DB;
  --night:#14100E;--night-2:#1E1815;--night-3:#2A221E;--ink:#000;--white:#fff;
  --mute:rgba(242,239,236,.72);--mute-d:rgba(0,0,0,.66);--line-l:rgba(242,239,236,.18);--line-d:rgba(0,0,0,.16);
  --display:"wedding-gothic-atf","Archivo Fallback","Arial Black",sans-serif;
  --serif:"Bagnard","EB Garamond",Georgia,serif;
  --body:"EB Garamond","Bagnard",Georgia,serif;
  --gut:clamp(1rem,4vw,3rem);--max:1280px;
  --t-xs:.82rem;--t-s:.95rem;--t-b:clamp(1.12rem,1.05rem + .3vw,1.3rem);--t-l:clamp(1.25rem,1.1rem + .6vw,1.6rem);
  --d-hero:clamp(2.35rem,11.5vw,9.6rem);--d-1:clamp(2.6rem,9vw,7.5rem);--d-2:clamp(2.1rem,6.4vw,5.2rem);--d-3:clamp(1.6rem,3.6vw,2.8rem);
  --s-sec:clamp(3.75rem,8vw,7rem);
  --ease:cubic-bezier(.2,.7,.15,1);--ease-io:cubic-bezier(.7,0,.2,1);
  --bar-h:0px
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:5rem;background:var(--night)}
body{margin:0;background:var(--bone);color:var(--ink);font-family:var(--body);font-size:var(--t-b);line-height:1.55;font-synthesis:none;-webkit-font-smoothing:antialiased;overflow-x:clip}
body.dark{background:var(--night);color:var(--bone)}
main{display:block;overflow-x:clip}
img,video{display:block;max-width:100%;height:auto}
picture{display:block}
a{color:inherit;text-underline-offset:.2em;text-decoration-thickness:1px}
p{margin:0 0 1em}
address{font-style:normal}
b,strong{font-weight:600}
h1,h2,h3,h4{margin:0;font-family:var(--display);font-weight:900;font-stretch:125%;font-synthesis:weight;text-transform:uppercase;line-height:.9;letter-spacing:-.01em;text-wrap:balance}
.serif{font-family:var(--serif);font-weight:400;font-stretch:normal;text-transform:none;letter-spacing:-.01em}
.label{font-family:var(--display);font-weight:700;font-stretch:125%;font-size:var(--t-xs);letter-spacing:.16em;text-transform:uppercase;line-height:1.3}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;left:-999px;top:0;background:var(--ink);color:var(--white);padding:.8rem 1rem;z-index:200}
.skip:focus{left:0}
:focus-visible{outline:3px solid var(--coral);outline-offset:3px}
.wrap{max-width:var(--max);margin-inline:auto;padding-inline:var(--gut)}
.tap{display:inline-block;padding-block:.55rem}
.center{text-align:center}

/* ---------- Buttons ---------- */
.btn{--bg:var(--ink);--fg:var(--white);display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:52px;padding:.85rem 1.6rem;border:0;border-radius:999px;background:var(--bg);color:var(--fg);font-family:var(--display);font-weight:800;font-stretch:125%;font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;cursor:pointer;position:relative;overflow:hidden;isolation:isolate;transition:transform .25s var(--ease),color .3s}
.btn::before{content:"";position:absolute;inset:0;border-radius:inherit;background:var(--coral);transform:translateY(101%);transition:transform .45s var(--ease);z-index:-1}
.btn .arr{display:inline-block;transition:transform .35s var(--ease)}
@media(hover:hover){.btn:hover::before{transform:none}.btn:hover{color:var(--ink)}.btn:hover .arr{transform:translateX(4px)}}
.btn:active{transform:scale(.97)}
.btn-coral{--bg:var(--coral);--fg:var(--ink)}
.btn-coral::before{background:var(--bone)}
.btn-bone{--bg:var(--bone);--fg:var(--ink)}
.btn-ghost{--bg:transparent;--fg:currentColor;box-shadow:inset 0 0 0 1.5px currentColor}
.btn-sm{min-height:44px;padding:.6rem 1.15rem;font-size:.72rem}
.btns{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:2rem}
@media(max-width:479px){.btns .btn{flex:1 1 100%}}

/* ---------- Top: progress rail + nav ---------- */
.rail{position:fixed;top:0;left:0;right:0;height:3px;z-index:120;background:var(--coral);transform-origin:0 50%;transform:scaleX(var(--rail,0));pointer-events:none}
.nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;gap:1.5rem;padding:.9rem var(--gut);color:var(--bone);transition:background .4s,color .4s,padding .4s,box-shadow .4s,transform .45s var(--ease)}
.nav .logo{display:flex;align-items:center;min-height:44px;margin-right:auto}
.nav .logo img{height:26px;width:auto}
.nav .logo .lg-d{display:none}
.nav .links{display:none;gap:1.75rem}
.nav .links a{font-family:var(--display);font-weight:700;font-stretch:125%;font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;text-decoration:none;padding:.6rem 0;position:relative}
.nav .links a::after{content:"";position:absolute;left:0;right:0;bottom:.35rem;height:2px;background:currentColor;transform:scaleX(0);transform-origin:0 50%;transition:transform .35s var(--ease)}
.nav .links a[aria-current]::after{transform:none}
@media(hover:hover){.nav .links a:hover::after{transform:none}}
.nav .menu-btn{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:50%;border:1.5px solid currentColor;background:transparent;color:inherit;cursor:pointer;padding:0}
.nav .menu-btn span{display:block;width:18px;height:2px;background:currentColor;position:relative;transition:transform .3s}
.nav .menu-btn span::before,.nav .menu-btn span::after{content:"";position:absolute;left:0;width:18px;height:2px;background:currentColor;transition:transform .3s}
.nav .menu-btn span::before{top:-6px}.nav .menu-btn span::after{top:6px}
.nav.solid{background:rgba(242,239,236,.97);color:var(--ink);padding-block:.55rem;box-shadow:0 1px 0 var(--line-d)}
.nav.solid .logo .lg-l{display:none}.nav.solid .logo .lg-d{display:block}
.dark .nav.solid{background:rgba(20,16,14,.96);color:var(--bone);box-shadow:0 1px 0 var(--line-l)}
.dark .nav.solid .logo .lg-l{display:block}.dark .nav.solid .logo .lg-d{display:none}
.nav.light-top{color:var(--ink)}
.nav.light-top .logo .lg-l{display:none}.nav.light-top .logo .lg-d{display:block}
.nav .btn{min-height:44px;padding:.6rem 1.15rem;font-size:.72rem}
.nav.solid .btn{--bg:var(--ink);--fg:var(--white)}
.dark .nav.solid .btn{--bg:var(--coral);--fg:var(--ink)}
.nav:not(.solid):not(.light-top) .btn{--bg:var(--bone);--fg:var(--ink)}
@media(max-width:599px){.nav .btn{display:none}}
.nav .links a{white-space:nowrap}
@media(min-width:900px){.nav .logo img{height:30px}}
@media(min-width:1180px){.nav .links{display:flex}.nav .menu-btn{display:none}}

/* Full screen menu (mobile) */
.sheet{position:fixed;inset:0;z-index:110;background:var(--coral);color:var(--ink);display:flex;flex-direction:column;padding:6rem var(--gut) 2rem;clip-path:circle(0 at calc(100% - 2.6rem) 2.4rem);visibility:hidden;transition:clip-path .7s var(--ease-io),visibility 0s .7s}
.sheet.open{clip-path:circle(150% at calc(100% - 2.6rem) 2.4rem);visibility:visible;transition:clip-path .8s var(--ease-io),visibility 0s}
.sheet a.big{font-family:var(--display);font-weight:900;font-stretch:125%;font-size:clamp(2.2rem,11vw,4rem);text-transform:uppercase;line-height:1;text-decoration:none;padding:.35rem 0;display:block}
.sheet .meta{margin-top:auto;display:grid;gap:.25rem;font-size:1.05rem}
.sheet .close{position:absolute;top:1rem;right:var(--gut);width:48px;height:48px;border-radius:50%;border:1.5px solid var(--ink);background:transparent;font-size:1.6rem;line-height:1;cursor:pointer;color:var(--ink)}
.sheet .leo{position:absolute;right:-1rem;bottom:5rem;width:min(52vw,260px);opacity:.9;transform:rotate(-6deg)}
body.locked{overflow:hidden}

/* ---------- First visit curtain (home) ---------- */
.intro{position:fixed;inset:0;z-index:150;background:var(--coral);display:grid;place-items:center;pointer-events:none}
.intro img{width:min(34vw,180px);height:auto}
.intro .w{font-family:var(--display);font-weight:900;font-stretch:125%;text-transform:uppercase;font-size:clamp(1rem,3vw,1.4rem);letter-spacing:.14em;margin-top:1rem;text-align:center}
.js .intro{animation:introOut .85s var(--ease-io) .75s forwards}
.js .intro img{animation:pop .7s var(--ease) both}
@keyframes introOut{to{clip-path:inset(0 0 100% 0)}}
@keyframes pop{from{transform:scale(.6) rotate(-10deg);opacity:0}to{transform:none;opacity:1}}
html:not(.js) .intro,.intro.skip-it{display:none}

/* ---------- Hero ---------- */
.hero{position:relative;min-height:100vh;min-height:100svh;display:flex;align-items:flex-end;color:var(--bone);overflow:hidden;background:var(--night);isolation:isolate}
.hero .bg{position:absolute;inset:0;z-index:-2}
.hero .bg img,.hero .bg video{width:100%;height:100%;object-fit:cover;transform:scale(calc(1.12 - var(--p,0) * .12)) translateY(calc(var(--p,0) * 6%));transform-origin:50% 40%}
.js .hero .bg img{animation:kb 1.4s var(--ease) both}
@keyframes kb{from{transform:scale(1.22)}}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(20,16,14,.55) 0%,rgba(20,16,14,.1) 30%,rgba(20,16,14,.25) 55%,rgba(20,16,14,.92) 100%)}
.hero .inner{width:100%;max-width:var(--max);margin-inline:auto;padding:7rem var(--gut) clamp(2.5rem,7vh,5rem)}
.hero .kick{display:inline-flex;align-items:center;gap:.6rem;margin-bottom:1.1rem}
.hero .kick::before{content:"";width:28px;height:2px;background:var(--coral)}
.hero h1{font-size:var(--d-hero);line-height:.84;letter-spacing:-.02em}
.hero .lede{max-width:34rem;font-size:var(--t-l);line-height:1.4;margin:1.4rem 0 0;color:var(--bone)}
.hero .facts{display:flex;flex-wrap:wrap;gap:.4rem .9rem;margin-top:1.4rem}
.hero .facts span{display:inline-flex;align-items:center;gap:.5rem}
.hero .facts span+span::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--coral)}
.hero .svc{font-size:var(--t-s);margin:1.1rem 0 0;color:var(--mute)}
.cue{position:absolute;right:var(--gut);bottom:clamp(2.5rem,7vh,5rem);display:none;flex-direction:column;align-items:center;gap:.7rem;color:var(--bone);text-decoration:none}
.cue i{width:1.5px;height:64px;background:linear-gradient(var(--bone),transparent);position:relative;overflow:hidden}
.cue i::after{content:"";position:absolute;left:0;top:-30%;width:100%;height:30%;background:var(--coral);animation:drip 1.8s var(--ease-io) infinite}
@keyframes drip{to{top:100%}}
@media(min-width:900px){.cue{display:flex}}

/* Price disc (brand sticker, kept from the old pages) */
.disc{--d:9.5rem;width:var(--d);height:var(--d);border-radius:50%;background:var(--teal);color:var(--ink);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;line-height:1.05;padding:.6rem;transform:rotate(-8deg);flex:none}
.disc .l{font-family:var(--display);font-weight:700;font-stretch:125%;font-size:.6rem;letter-spacing:.12em;text-transform:uppercase}
.disc .v{font-family:var(--display);font-weight:900;font-stretch:125%;font-size:calc(var(--d) * .2);margin:.25rem 0}
.disc.coral{background:var(--coral)}.disc.pink{background:var(--pink)}.disc.bone{background:var(--bone)}
.disc.alt{transform:rotate(7deg)}
.js .disc[data-reveal]{transform:rotate(-30deg) scale(.4);opacity:0;transition:transform .9s cubic-bezier(.3,1.6,.4,1),opacity .4s}
.js .disc[data-reveal].in{transform:rotate(-8deg);opacity:1}
.js .disc.alt[data-reveal].in{transform:rotate(7deg)}
.hero .discs{position:absolute;right:var(--gut);top:clamp(6rem,16vh,9rem);display:flex;gap:0}
.hero .discs .disc+.disc{margin-left:-1.4rem;margin-top:4.5rem}
@media(max-width:599px){.hero .discs{display:none}}

/* Line by line headline rise */
.ln{display:block;overflow:hidden;padding:.12em .08em .16em;margin:-.12em -.08em -.16em}
.ln>span{display:block;white-space:nowrap}
.js .ln>span{transform:translateY(110%);transition:transform .75s var(--ease)}
.js .in .ln>span,.js .ln.in>span{transform:none}
.js .in .ln:nth-child(2)>span{transition-delay:.06s}
.js .in .ln:nth-child(3)>span{transition-delay:.12s}

/* Generic reveal */
.js [data-reveal]:not(.disc):not(.ln):not(.split):not(.spots){opacity:0;transform:translateY(16px);transition:opacity .55s var(--ease),transform .7s var(--ease)}
.js [data-reveal].in:not(.disc):not(.ln):not(.split){opacity:1;transform:none}
.js [data-reveal][data-d="1"]{transition-delay:.05s}
.js [data-reveal][data-d="2"]{transition-delay:.1s}
.js [data-reveal][data-d="3"]{transition-delay:.15s}

/* ---------- Sections ---------- */
.sec{padding-block:var(--s-sec);position:relative}
.sec.tight{padding-block:clamp(3rem,7vw,5.5rem)}
.dk{background:var(--night);color:var(--bone)}
.dk2{background:var(--night-2);color:var(--bone)}
.bn{background:var(--bone);color:var(--ink)}
.cr{background:var(--coral);color:var(--ink)}
.tl{background:var(--teal);color:var(--ink)}
.pk{background:var(--pink);color:var(--ink)}
.head{max-width:52rem;margin-bottom:clamp(2rem,4.5vw,3.5rem)}
.head.c{margin-inline:auto;text-align:center}
.head .label{display:inline-flex;align-items:center;gap:.6rem;margin-bottom:1.2rem}
.head .label::before{content:"";width:28px;height:2px;background:var(--coral)}
.cr .head .label::before,.pk .head .label::before{background:var(--ink)}
.head h2{font-size:var(--d-1)}
.head h2 .serif{display:block;font-size:.62em;line-height:1.05;margin-top:.15em;color:var(--coral)}
.bn .head h2 .serif{color:var(--coral-2)}
.cr .head h2 .serif,.pk .head h2 .serif,.tl .head h2 .serif{color:var(--ink)}
.head p{font-size:var(--t-l);line-height:1.45;margin:1.4rem 0 0;max-width:36rem;text-wrap:pretty}
.head.c p{margin-inline:auto}
.dk .head p,.dk2 .head p{color:var(--mute)}
.svc{font-size:var(--t-s)}
.dk .svc,.dk2 .svc{color:var(--mute)}

/* ---------- Ticker ---------- */
.ticker{overflow:hidden;white-space:nowrap;border-block:1.5px solid currentColor;padding-block:1rem;user-select:none}
.ticker .tr{display:inline-flex;animation:tick var(--dur,38s) linear infinite}
.ticker span{font-family:var(--display);font-weight:900;font-stretch:125%;text-transform:uppercase;font-size:clamp(1.1rem,2.6vw,1.9rem);letter-spacing:.02em;padding-inline:1.4rem;display:inline-flex;align-items:center;gap:2.8rem}
.ticker span::after{content:"";width:.55em;height:.42em;border-radius:50%;background:var(--coral);transform:rotate(-14deg)}
.cr .ticker span::after,.pk .ticker span::after{background:var(--ink)}
@keyframes tick{to{transform:translateX(-50%)}}
@media(hover:hover){.ticker:hover .tr{animation-play-state:paused}}

/* ---------- Home: shrink stage ---------- */
.stage{position:relative;height:220vh;background:var(--night)}
.stage .pin{--q:min(1,max(0,calc((var(--p,0) - .08) * 1.55)));position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;display:grid;place-items:center;color:var(--bone)}
.stage .ph{position:absolute;inset:0;overflow:hidden;border-radius:calc(var(--q,0) * 48px);transform:scale(calc(1 - var(--q,0) * .5));will-change:transform}
.stage .ph img{width:100%;height:100%;object-fit:cover}
.stage .ph::after{content:"";position:absolute;inset:0;background:rgba(20,16,14,calc(.45 - var(--q,0) * .35))}
.stage .words{position:relative;z-index:2;width:100%;display:flex;justify-content:space-between;padding-inline:var(--gut);pointer-events:none}
.stage .words b{flex:1 1 0;min-width:0;white-space:nowrap;overflow:visible;font-family:var(--display);font-weight:900;font-stretch:125%;text-transform:uppercase;font-size:clamp(2.6rem,10vw,9.5rem);line-height:.85;letter-spacing:-.02em}
.stage .words b:first-child{transform:translateY(calc(var(--q,0) * -2vh))}
.stage .words b:last-child{transform:translateY(calc(var(--q,0) * 2vh));color:var(--coral);text-align:right}
.stage .cap{position:absolute;left:0;right:0;bottom:clamp(5.5rem,12vh,7.5rem);text-align:center;z-index:2;opacity:calc(var(--q,0) * 2 - 1);padding-inline:var(--gut)}
.stage .cap p{max-width:34rem;margin:0 auto;font-size:var(--t-l);line-height:1.4}
@media(max-width:699px){.stage .words{flex-direction:column;align-items:center;gap:52vh;text-align:center}.stage .words b:first-child,.stage .words b:last-child{transform:translateY(calc(var(--q,0) * 0px))}
  .stage .ph{transform:scale(calc(1 - var(--q,0) * .3))}}

/* ---------- Home: stacked offer cards ---------- */
.stack{display:grid;gap:clamp(1.5rem,4vh,2.5rem)}
.card{position:sticky;top:calc(5.5rem + var(--i,0) * 1.1rem);display:grid;border-radius:28px;overflow:hidden;min-height:min(78vh,640px);box-shadow:0 30px 60px -30px rgba(0,0,0,.45);transform-origin:50% 0}
.card .im{position:relative;min-height:16rem;overflow:hidden}
.card .im img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.4s var(--ease)}
@media(hover:hover){.card:hover .im img{transform:scale(1.04)}}
.card .tx{padding:clamp(1.6rem,4vw,3.25rem);display:flex;flex-direction:column}
.card .no{font-family:var(--serif);font-size:clamp(3rem,7vw,5.5rem);line-height:.8;color:var(--coral-2)}
.card.cr .no,.card.pk .no,.card.tl .no{color:var(--ink);opacity:.9}
.card .when{margin:1.2rem 0 .9rem}
.card h3{font-size:clamp(2.1rem,5.4vw,4.4rem)}
.card p{margin:1.1rem 0 0;max-width:30rem;font-size:var(--t-b)}
.card .row{display:flex;flex-wrap:wrap;align-items:center;gap:1rem 1.5rem;margin-top:auto;padding-top:2rem}
.card .price{white-space:nowrap;font-family:var(--display);font-weight:900;font-stretch:125%;font-size:clamp(1.8rem,3.6vw,2.6rem);line-height:1}
.card .price small{display:block;font-family:var(--serif);font-weight:400;font-stretch:normal;font-size:.95rem;letter-spacing:0;text-transform:none;margin-top:.35rem;opacity:.8}
.card .svc{margin:1rem 0 0;opacity:.82}
.card .disc{position:absolute;right:1.25rem;bottom:1.25rem;--d:8rem}
@media(min-width:800px){.card{grid-template-columns:1.05fr 1fr}.card.flip .im{order:2}.card .im{min-height:auto}}
@media(max-width:799px){.card{position:relative;top:auto;min-height:0}.card .im{aspect-ratio:4/3;min-height:0}}

/* ---------- Spot reveal (brand signature) ---------- */
@property --r{syntax:"<number>";inherits:true;initial-value:1}
.spots{position:relative;overflow:hidden;--r:1;transition:--r 1.3s var(--ease)}
.js .spots:not(.in){--r:0}
.spots>picture,.spots>img,.spots>video{width:100%;height:100%}
.spots>picture img{width:100%;height:100%;object-fit:cover}
.js .spots>picture,.js .spots>img{
  -webkit-mask-image:
   radial-gradient(calc(var(--r) * 38%) calc(var(--r) * 30%) at 18% 22%,#000 98%,transparent),
   radial-gradient(calc(var(--r) * 34%) calc(var(--r) * 26%) at 72% 16%,#000 98%,transparent),
   radial-gradient(calc(var(--r) * 40%) calc(var(--r) * 30%) at 46% 50%,#000 98%,transparent),
   radial-gradient(calc(var(--r) * 34%) calc(var(--r) * 28%) at 86% 58%,#000 98%,transparent),
   radial-gradient(calc(var(--r) * 36%) calc(var(--r) * 28%) at 14% 74%,#000 98%,transparent),
   radial-gradient(calc(var(--r) * 34%) calc(var(--r) * 26%) at 58% 90%,#000 98%,transparent),
   radial-gradient(calc(var(--r) * 22%) calc(var(--r) * 18%) at 34% 6%,#000 98%,transparent),
   radial-gradient(calc(var(--r) * 22%) calc(var(--r) * 18%) at 96% 94%,#000 98%,transparent),
   linear-gradient(rgba(0,0,0,calc((var(--r) - .82) * 6)),rgba(0,0,0,calc((var(--r) - .82) * 6)));
          mask-image:
   radial-gradient(calc(var(--r) * 38%) calc(var(--r) * 30%) at 18% 22%,#000 98%,transparent),
   radial-gradient(calc(var(--r) * 34%) calc(var(--r) * 26%) at 72% 16%,#000 98%,transparent),
   radial-gradient(calc(var(--r) * 40%) calc(var(--r) * 30%) at 46% 50%,#000 98%,transparent),
   radial-gradient(calc(var(--r) * 34%) calc(var(--r) * 28%) at 86% 58%,#000 98%,transparent),
   radial-gradient(calc(var(--r) * 36%) calc(var(--r) * 28%) at 14% 74%,#000 98%,transparent),
   radial-gradient(calc(var(--r) * 34%) calc(var(--r) * 26%) at 58% 90%,#000 98%,transparent),
   radial-gradient(calc(var(--r) * 22%) calc(var(--r) * 18%) at 34% 6%,#000 98%,transparent),
   radial-gradient(calc(var(--r) * 22%) calc(var(--r) * 18%) at 96% 94%,#000 98%,transparent),
   linear-gradient(rgba(0,0,0,calc((var(--r) - .82) * 6)),rgba(0,0,0,calc((var(--r) - .82) * 6)))}

/* ---------- Neon room ---------- */
.neon{display:grid;gap:clamp(2rem,5vw,5rem);align-items:center}
.neon .sign{position:relative;border-radius:24px;overflow:hidden;aspect-ratio:4/5;box-shadow:0 0 0 1px var(--line-l),0 40px 120px -40px rgba(242,143,114,.55)}
.neon .sign img{width:100%;height:100%;object-fit:cover}
.neon .sign img.glow{animation:buzz 6s steps(1,end) infinite}
@keyframes buzz{0%,61%,100%{filter:brightness(1) saturate(1.05)}62%{filter:brightness(.62) saturate(.8)}63%{filter:brightness(1.04)}64.5%{filter:brightness(.7)}65%{filter:brightness(1.05) saturate(1.1)}}
.neon .twin{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.neon .twin .sign:last-child{margin-top:4rem}
.neon h2{font-size:var(--d-2)}
.neon h2 .serif{display:block;color:var(--coral);font-size:.7em;line-height:1.05;margin-top:.2em}
.neon p{color:var(--mute);font-size:var(--t-l);line-height:1.45;margin-top:1.4rem;max-width:30rem}
@media(min-width:900px){.neon{grid-template-columns:1fr 1.1fr}}

/* ---------- Phone with social clip ---------- */
.feed{display:grid;gap:clamp(2rem,6vw,6rem);align-items:center}
.phone{position:relative;width:min(78vw,330px);aspect-ratio:9/19.2;margin-inline:auto;border-radius:46px;background:#0b0908;padding:11px;box-shadow:0 0 0 1.5px #3a302b,0 50px 100px -40px rgba(0,0,0,.6);transform:rotate(calc(-4deg + var(--p,0) * 6deg))}
.phone video,.phone img{width:100%;height:100%;object-fit:cover;border-radius:36px;background:#222}
.phone::before{content:"";position:absolute;top:20px;left:50%;width:84px;height:24px;border-radius:20px;background:#0b0908;transform:translateX(-50%);z-index:2}
.phone .pp{position:absolute;right:22px;bottom:22px;z-index:3;width:44px;height:44px;border-radius:50%;border:0;background:rgba(242,239,236,.9);color:var(--ink);cursor:pointer;display:grid;place-items:center;font-size:.85rem}
.feed .disc{position:absolute;left:-2rem;bottom:12%;--d:7.5rem}
.feed .stagep{position:relative}
@media(min-width:900px){.feed{grid-template-columns:1fr 1fr}}

/* ---------- Visit block ---------- */
.visit{display:grid;gap:clamp(2rem,5vw,5rem);align-items:center}
.visit .pair{position:relative}
.visit .pair .a{border-radius:24px;overflow:hidden;aspect-ratio:4/5}
.visit .pair .a img{width:100%;height:100%;object-fit:cover}
.visit .pair .b{position:absolute;right:-.5rem;bottom:-2.5rem;width:44%;aspect-ratio:4/5;border-radius:18px;overflow:hidden;border:6px solid var(--bone);transform:translateY(calc(var(--p,.5) * -60px + 30px))}
.visit .pair .b img{width:100%;height:100%;object-fit:cover}
.visit h2{font-size:var(--d-2)}
.deets{display:grid;grid-template-columns:auto 1fr;margin:2rem 0 0;border-top:1px solid var(--line-d)}
.deets dt,.deets dd{margin:0;padding:.9rem 0;border-bottom:1px solid var(--line-d);display:flex;align-items:center;min-height:52px}
.deets dt{padding-right:1.5rem}
.dk .deets,.dk .deets dt,.dk .deets dd{border-color:var(--line-l)}
@media(min-width:900px){.visit{grid-template-columns:1fr 1.05fr}}

/* ---------- Closer / footer ---------- */
.closer{position:relative;overflow:hidden;text-align:center;padding-block:clamp(6rem,14vw,11rem);isolation:isolate}
.closer .bg{position:absolute;inset:0;z-index:-2}
.closer .bg img{width:100%;height:100%;object-fit:cover;transform:scale(calc(1.15 - var(--p,0) * .15))}
.closer::after{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse at 50% 60%,rgba(20,16,14,.55),rgba(20,16,14,.88))}
.closer .leo{width:clamp(7rem,14vw,10rem);margin:0 auto 1.5rem;transform:rotate(calc(-8deg + var(--p,0) * 16deg))}
.closer h2{font-size:var(--d-1);color:var(--bone)}
.closer h2 .serif{display:block;color:var(--coral);font-size:.6em;margin-top:.2em}
.closer p{color:var(--bone);max-width:36rem;margin:1.6rem auto 0;font-size:var(--t-l);line-height:1.45}
.closer .btns{justify-content:center}

.foot{background:var(--night);color:var(--bone);padding:clamp(4rem,9vw,7rem) 0 calc(2rem + var(--bar-h));overflow:hidden}
.foot .cols{display:grid;gap:2.5rem}
.foot h2{font-size:1rem;letter-spacing:.14em;margin-bottom:1rem;color:var(--coral)}
.foot p{margin:0;color:var(--mute)}
.foot .nm{display:block;color:var(--bone);margin-bottom:.4rem}
.foot ul{list-style:none;margin:0;padding:0}
.foot .addr{display:grid;gap:1.75rem}
.foot .giant{display:block;width:100%;height:auto;margin:clamp(3rem,7vw,5rem) 0 0;overflow:visible}
.foot .giant text{font-family:var(--display);font-weight:900;font-stretch:125%;text-transform:uppercase;fill:none;stroke:rgba(242,239,236,.38);stroke-width:1.5px}
.foot .giant tspan.c{fill:var(--coral);stroke:none}
.foot .base{margin-top:2.5rem;padding-top:1.4rem;border-top:1px solid var(--line-l);display:flex;flex-wrap:wrap;gap:.25rem 1.75rem;font-size:var(--t-s);color:var(--mute)}
.foot .base span{padding-block:.55rem}
@media(min-width:600px){.foot .addr{grid-template-columns:1fr 1fr}}
@media(min-width:900px){.foot .cols{grid-template-columns:2fr 1fr 1fr}}

/* ---------- Booking pill ---------- */
.bookbar{position:fixed;left:50%;bottom:calc(.9rem + env(safe-area-inset-bottom));z-index:90;display:flex;align-items:center;gap:1rem;width:min(calc(100% - 1.5rem),560px);padding:.5rem .5rem .5rem 1.4rem;border-radius:999px;background:rgba(20,16,14,.96);color:var(--bone);box-shadow:0 20px 50px -18px rgba(0,0,0,.55),0 0 0 1px rgba(242,239,236,.1);transform:translate(-50%,160%);visibility:hidden;transition:transform .55s var(--ease),visibility 0s .55s}
.bookbar.up{transform:translate(-50%,0);visibility:visible;transition:transform .55s var(--ease),visibility 0s}
.bookbar .bb-t{display:grid;line-height:1.2;min-width:0;margin-right:auto}
.bookbar .bb-1{font-family:var(--display);font-weight:900;font-stretch:125%;text-transform:uppercase;font-size:.82rem;letter-spacing:.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bookbar .bb-2{font-size:.9rem;color:var(--mute);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bookbar .bb-1[hidden]{display:none}
.bookbar .btn{flex:none;min-height:46px;padding:.55rem 1.2rem;font-size:.72rem;--bg:var(--coral);--fg:var(--ink)}
.bookbar .btn::before{background:var(--bone)}

/* ---------- Details grid (shared) ---------- */
.info{display:grid;gap:clamp(2rem,4vw,3rem)}
.info>div{border-top:2px solid currentColor;padding-top:1.4rem}
.info h3{font-size:1.25rem;margin-bottom:1rem;letter-spacing:.01em}
.info ul{margin:0;padding:0;list-style:none}
.info li{padding:.8rem 0;border-top:1px solid var(--line-d);font-size:1.08rem;line-height:1.45}
.dk .info li,.dk2 .info li{border-color:var(--line-l)}
.info li:first-child{border-top:0;padding-top:0}
.info .k{display:block;margin-bottom:.2rem;color:var(--coral-2)}
.dk .info .k,.dk2 .info .k{color:var(--coral)}
.info p{margin:0 0 .8rem;font-size:1.08rem}
.info .btns{margin-top:1.2rem}
@media(min-width:700px){.info{grid-template-columns:1fr 1fr}.info>:first-child{grid-row:span 2}}
@media(min-width:1000px){.info{grid-template-columns:1.25fr 1fr 1fr}.info>:first-child{grid-row:auto}}

/* ---------- Menu lists ---------- */
.dishes{list-style:none;margin:0;padding:0;display:grid;gap:1.5rem 3rem}
.dishes li{display:grid;gap:.3rem;align-content:start}
.dishes .d{font-family:var(--display);font-weight:900;font-stretch:125%;text-transform:uppercase;font-size:1.1rem;line-height:1.15;letter-spacing:.01em}
.dishes .x{font-size:1.06rem;line-height:1.45;opacity:.82;max-width:32rem;text-wrap:pretty}
.dishes .add{font-size:.98rem;font-style:normal;color:var(--coral-2)}
.dk .dishes .add,.dk2 .dishes .add{color:var(--coral)}
.tag{display:inline-block;vertical-align:.15em;font-family:var(--display);font-weight:700;font-stretch:125%;font-size:.6rem;letter-spacing:.12em;line-height:1.3;background:var(--teal);color:var(--ink);padding:.2em .55em;border-radius:99px;margin-left:.35em}
@media(min-width:700px){.dishes.two{grid-template-columns:1fr 1fr}}
.dishes.lines{gap:0}
.dishes.lines li{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;padding:.85rem 0;border-bottom:1px solid var(--line-l)}

/* ---------- Pre theatre: curtain ---------- */
.curtain{position:relative;height:340vh;background:var(--night)}
.curtain .pin{--c:min(1,max(0,calc((var(--p,0) - .08) * 1.2)));position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;display:flex;align-items:flex-end;color:var(--bone);isolation:isolate}
.curtain .room{position:absolute;inset:0;z-index:-3}
.curtain .room img{width:100%;height:100%;object-fit:cover;transform:scale(calc(1.18 - var(--p,0) * .18))}
.curtain .room::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,16,14,.35),rgba(20,16,14,.15) 40%,rgba(20,16,14,.9))}
.curtain .drape{position:absolute;top:0;bottom:0;width:51%;z-index:-1;background:
  linear-gradient(180deg,rgba(0,0,0,.35),transparent 12%,transparent 80%,rgba(0,0,0,.45)),
  repeating-linear-gradient(90deg,#b84a32 0,#e2785a 3.2%,#c65a40 6%,#8f3524 9.5%,#b84a32 12%);
  box-shadow:inset 0 -30px 60px rgba(0,0,0,.35);will-change:transform}
.curtain .drape.l{left:0;transform:translateX(calc(var(--c,0) * -101%)) skewX(calc(var(--c,0) * 4deg));transform-origin:0 0}
.curtain .drape.r{right:0;transform:translateX(calc(var(--c,0) * 101%)) skewX(calc(var(--c,0) * -4deg));transform-origin:100% 0}
.curtain .valance{position:absolute;top:0;left:0;right:0;height:9vh;z-index:0;background:repeating-radial-gradient(ellipse at 50% 0,#8f3524 0 40%,#b84a32 41% 60%,transparent 61%) 0 0/9vh 9vh,linear-gradient(#7a2c1d,#7a2c1d) 0 0/100% 4vh no-repeat;filter:drop-shadow(0 8px 10px rgba(0,0,0,.4))}
.curtain .inner{width:100%;max-width:var(--max);margin-inline:auto;padding:7rem var(--gut) clamp(2.5rem,7vh,5rem);position:relative;z-index:1}
.curtain h1{font-size:var(--d-hero);line-height:.84;letter-spacing:-.02em}
.curtain .pre{position:absolute;inset:0;display:grid;place-items:center;text-align:center;z-index:0;opacity:calc(1 - var(--c,0) * 2.2);pointer-events:none;padding-inline:var(--gut)}
.curtain .pre .label{color:var(--bone);display:block;margin-bottom:1rem}
.curtain .pre b{display:block;font-family:var(--serif);font-weight:400;font-size:clamp(2.2rem,6vw,5rem);line-height:1;color:var(--bone);text-shadow:0 4px 30px rgba(0,0,0,.4)}
.curtain .hero-copy{opacity:calc(var(--c,0) * 1.6 - .35)}
.curtain .lede{max-width:34rem;font-size:var(--t-l);line-height:1.4;margin:1.4rem 0 0}
.curtain .facts{display:flex;flex-wrap:wrap;gap:.4rem .9rem;margin-top:1.4rem}
.curtain .facts span{display:inline-flex;align-items:center;gap:.5rem}
.curtain .facts span+span::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--coral)}
.curtain .svc{color:var(--mute);margin:1rem 0 0}
.curtain .discs{position:absolute;right:var(--gut);top:clamp(6rem,18vh,10rem);display:flex;opacity:calc(var(--c,0) * 2 - .6)}
.curtain .discs .disc+.disc{margin-left:-1.4rem;margin-top:4.5rem}
@media(max-width:599px){.curtain .discs{display:none}}
html:not(.js) .curtain{height:auto}html:not(.js) .curtain .pin{position:relative;min-height:100vh}
html:not(.js) .curtain .drape,html:not(.js) .curtain .pre,html:not(.js) .curtain .valance{display:none}
html:not(.js) .curtain .hero-copy,html:not(.js) .curtain .discs{opacity:1}

/* Venue marquee chips */
.venues{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:2rem}
.venues span{border:1.5px solid currentColor;border-radius:999px;padding:.45rem 1rem;font-size:1rem}

/* ---------- Planner as a ticket ---------- */
.planner{position:relative;background:var(--bone);color:var(--ink);border-radius:26px;overflow:hidden;box-shadow:0 40px 90px -40px rgba(0,0,0,.6)}
.planner-grid{display:grid}
.planner-ctl{padding:clamp(1.4rem,4vw,2.75rem)}
.ctl{margin-bottom:2rem}.ctl:last-child{margin-bottom:0}.ctl[hidden]{display:none}
.cl{display:block;margin-bottom:.8rem}
.picks{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
.times{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem}
.pick,.tbtn{font-family:var(--serif);font-size:1.08rem;line-height:1.2;color:var(--ink);background:var(--white);border:1.5px solid rgba(0,0,0,.18);border-radius:14px;padding:.8rem .6rem;cursor:pointer;min-height:56px;transition:background .2s,border-color .2s,transform .15s,box-shadow .2s}
.pick:active,.tbtn:active{transform:scale(.97)}
@media(hover:hover){.pick:hover,.tbtn:hover{border-color:var(--ink)}}
.pick[aria-pressed="true"],.tbtn[aria-pressed="true"]{background:var(--ink);color:var(--bone);border-color:var(--ink);box-shadow:0 10px 24px -12px rgba(0,0,0,.55)}
.field{font-family:var(--serif);font-size:1.05rem;color:var(--ink);background:var(--white);border:1.5px solid rgba(0,0,0,.18);border-radius:14px;padding:.8rem;width:100%;min-height:56px}
.field:focus-visible{outline:3px solid var(--coral);outline-offset:2px}
.showpick{position:relative}
.showpick::after{content:"";position:absolute;right:1.2rem;top:28px;width:.55rem;height:.55rem;border-right:2px solid var(--ink);border-bottom:2px solid var(--ink);transform:translateY(-70%) rotate(45deg);pointer-events:none}
select.field{appearance:none;-webkit-appearance:none;padding-right:2.75rem;text-overflow:ellipsis}
.times .other{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:.5rem 1rem;font-size:var(--t-s);margin-top:.4rem}
.times .other .field{flex:1 1 9rem;min-width:0;width:auto}
.showmeta{font-size:var(--t-s);margin:.6rem 0 0}
.showmeta:empty{display:none}
.planner .tl{position:relative;background:var(--night);color:var(--bone);padding:clamp(1.6rem,4vw,2.75rem);text-align:left}
.planner .tl::before,.planner .tl::after{content:"";position:absolute;width:30px;height:30px;border-radius:50%;background:var(--night-2)}
.planner .tl::before{left:-15px;top:-15px}.planner .tl::after{right:-15px;top:-15px}
.stop{position:relative;padding:0 0 1.5rem 2.1rem}
.stop:last-child{padding-bottom:0}
.stop::before{content:"";position:absolute;left:0;top:.7rem;width:15px;height:15px;border-radius:50%;background:var(--coral);box-shadow:0 0 0 5px rgba(242,143,114,.22),0 0 22px rgba(242,143,114,.7)}
.stop:not(:last-child)::after{content:"";position:absolute;left:6.5px;top:1.6rem;bottom:-.7rem;width:2px;background:linear-gradient(var(--coral),rgba(242,143,114,.25))}
.stop.mid::before{width:9px;height:9px;left:3px;top:.45rem;background:var(--night);border:2px solid var(--coral);box-shadow:none}
.stop.mid::after{top:0}
.stop-time{display:block;font-family:var(--display);font-weight:900;font-stretch:125%;text-transform:uppercase;font-size:clamp(2.4rem,6vw,4rem);line-height:1;transition:opacity .2s,transform .35s var(--ease)}
.tl.tick .stop-time{opacity:.3;transform:translateY(6px)}
.tl.shut .stop:first-child .stop-time{font-size:clamp(1.4rem,3vw,2rem);padding-top:.2rem}
.tl.shut .stop:first-child .stop-what{display:none}
.stop-what{display:block;margin-top:.5rem;color:var(--coral)}
.stop.mid .stop-what{margin:0;color:var(--mute)}
.stop-note{display:block;font-size:var(--t-s);margin-top:.5rem;max-width:26rem;color:var(--mute);text-wrap:pretty}
.stop-note:empty{display:none}
.planner-foot{position:relative;padding:1.5rem clamp(1.4rem,4vw,2.75rem) clamp(1.6rem,4vw,2.4rem);border-top:2px dashed rgba(0,0,0,.25);display:grid;gap:1rem;justify-items:center;text-align:center}
.planner-foot::before,.planner-foot::after{content:"";position:absolute;top:-15px;width:30px;height:30px;border-radius:50%;background:var(--night-2)}
.planner-foot::before{left:-15px}.planner-foot::after{right:-15px}
.planner-foot p{font-size:var(--t-s);margin:0;max-width:38em;text-wrap:balance}
.planner-foot [hidden]{display:none}
@media(max-width:479px){.planner-foot .btn{width:100%}}
@media(min-width:860px){.planner-grid{grid-template-columns:1.15fr 1fr}.planner .tl{display:flex;flex-direction:column;justify-content:center}.planner .tl::before{top:auto;left:-15px;top:-15px}}

/* ---------- Pre theatre: price acts + programme ---------- */
.deals{display:grid;gap:1rem}
.deal{border-radius:26px;padding:clamp(1.8rem,4vw,3rem);position:relative;overflow:hidden;container-type:inline-size}
.deal .label{display:block;margin-bottom:1rem}
.deal .big{display:block;font-family:var(--display);font-weight:900;font-stretch:125%;font-size:clamp(2.4rem,19cqi,6.5rem);line-height:1;letter-spacing:-.02em;white-space:nowrap}
.deal .pp{font-family:var(--serif);font-size:1.1rem;margin:.5rem 0 0}
.deal .how{margin:1.4rem 0 0;max-width:24rem;font-size:1.12rem}
@media(min-width:760px){.deals{grid-template-columns:1fr 1fr}}
.acts{display:grid;gap:0;margin-top:clamp(3rem,7vw,5rem)}
.act{display:grid;gap:1.5rem;padding-block:clamp(2.2rem,5vw,3.5rem);border-top:1.5px solid currentColor}
.act:last-child{border-bottom:1.5px solid currentColor}
.act .aname .label{display:block;margin-bottom:.6rem;color:var(--coral-2)}
.dk .act .aname .label,.dk2 .act .aname .label{color:var(--coral)}
.act .aname h3{font-size:clamp(1.6rem,2.5vw,2.3rem)}
.act .aname .serif{display:block;font-size:1.05rem;margin-top:.6rem;opacity:.75;text-transform:none;font-family:var(--serif);font-weight:400;font-stretch:normal;letter-spacing:0}
@media(min-width:900px){.act{grid-template-columns:18rem 1fr;gap:3rem}}
.notes{margin-top:2rem;text-align:center;font-size:var(--t-s)}
.notes p{margin:0}

/* Gallery strip with parallax */
.strip{display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;padding-inline:var(--gut);scrollbar-width:none;-webkit-overflow-scrolling:touch}
.strip::-webkit-scrollbar{display:none}
.strip>*{flex:0 0 78%;aspect-ratio:4/5;scroll-snap-align:center;border-radius:22px;overflow:hidden}
.strip img{width:100%;height:100%;object-fit:cover}
@media(min-width:700px){.strip{display:grid;grid-template-columns:5fr 4fr 3fr;gap:1.25rem;overflow:visible;max-width:var(--max);margin-inline:auto}
  .strip>*{aspect-ratio:auto;height:clamp(320px,40vw,560px)}
  .strip>*:nth-child(2){transform:translateY(calc(var(--p,.5) * -90px + 45px))}
  .strip>*:nth-child(3){transform:translateY(calc(var(--p,.5) * 70px - 35px))}}

/* ---------- Brunch: horizontal pizza picker ---------- */
.hs{position:relative}
.hs .pin{position:relative}
.hs .track{display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 var(--gut) 1rem;padding-left:max(var(--gut),calc((100vw - var(--max))/2 + var(--gut)));scroll-padding-left:max(var(--gut),calc((100vw - var(--max))/2 + var(--gut)));scrollbar-width:none;-webkit-overflow-scrolling:touch}
.hs .track::-webkit-scrollbar{display:none}
.pz{flex:0 0 min(80vw,360px);scroll-snap-align:center;position:relative;border-radius:28px;padding:1.6rem 1.6rem 1.4rem;min-height:27rem;display:flex;flex-direction:column;text-align:left;font:inherit;color:var(--ink);border:0;cursor:pointer;overflow:hidden;isolation:isolate;transition:transform .5s var(--ease),box-shadow .5s}
.pz:nth-child(4n+1){background:var(--coral)}.pz:nth-child(4n+2){background:var(--teal)}.pz:nth-child(4n+3){background:var(--pink)}.pz:nth-child(4n+4){background:var(--bone)}
.pz .n{font-family:var(--serif);font-size:4.5rem;line-height:.8;min-height:9.5rem}
.pz .pzimg{position:absolute;right:-2.2rem;top:-2.2rem;width:12.5rem;height:12.5rem;z-index:-1;transition:transform 1.2s var(--ease);filter:drop-shadow(0 10px 18px rgba(20,16,14,.28))}
.pz .pzimg svg{display:block;width:100%;height:100%}
.pz .pzn{display:block;font-family:var(--display);font-weight:900;font-stretch:125%;text-transform:uppercase;line-height:.95;font-size:clamp(1.1rem,1.6vw,1.55rem);min-height:1.9em;display:flex;align-items:flex-end;text-wrap:balance;overflow-wrap:anywhere}
.pz .tags{display:flex;align-items:center;height:1.4rem;margin-top:.5rem;line-height:1}
.pz .tag{margin-left:0;background:var(--ink);color:var(--bone)}
.pz .x{margin:.6rem 0 0;font-size:1.02rem;line-height:1.4}
.pz .pick-it{margin-top:auto;padding-top:1.2rem;display:inline-flex;align-items:center;gap:.6rem;font-family:var(--display);font-weight:800;font-stretch:125%;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase}
.pz .pick-it i{width:26px;height:26px;border-radius:50%;border:2px solid var(--ink);display:grid;place-items:center;font-style:normal;transition:background .25s}
.pz[aria-pressed="true"]{box-shadow:0 0 0 4px var(--night),0 0 0 7px var(--ink);transform:translateY(-8px)}
.pz[aria-pressed="true"] .pick-it i{background:var(--ink);color:var(--bone)}
.pz[aria-pressed="true"] .pick-it i::after{content:"✓";font-size:.8rem}
@media(hover:hover){.pz:hover .pzimg{transform:rotate(40deg) scale(1.05)}}
.pz[aria-pressed="true"] .pzimg{transform:rotate(-25deg)}
.hs .hint{display:flex;align-items:center;gap:.8rem;margin-top:1.2rem;color:var(--mute)}
.hs .bar{height:2px;background:var(--line-l);flex:1;max-width:14rem;position:relative;overflow:hidden}
.hs .bar i{position:absolute;inset:0;background:var(--coral);transform-origin:0 50%;transform:scaleX(var(--hx,.15))}
@media(min-width:900px){
  .js .hs.go{height:var(--hs-h,300vh)}
  .js .hs.go .pin{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;justify-content:center;overflow:hidden;padding-top:4.5rem}
  .js .hs.go .head h2{font-size:clamp(2rem,4.4vw,3.8rem)!important}
  .js .hs.go .head p{margin-top:.8rem}
  .js .hs.go .track{overflow:visible;scroll-snap-type:none;transform:translateX(var(--hs-x,0px));will-change:transform;padding-bottom:0}
  .pz{flex-basis:360px;min-height:min(50vh,28rem)}
}
.mybrunch{display:inline-flex;align-items:center;gap:.8rem;margin-top:1.4rem;padding:.6rem 1rem .6rem .6rem;border-radius:999px;background:var(--night-3);color:var(--bone)}
.mybrunch .dot{width:34px;height:34px;border-radius:50%;background:var(--coral);display:grid;place-items:center;font-family:var(--display);font-weight:900;font-stretch:125%;color:var(--ink);font-size:.8rem}

/* Brunch: 1 + 3 equation */
.eq{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:clamp(.6rem,2vw,1.6rem);font-family:var(--display);font-weight:900;font-stretch:125%;text-transform:uppercase}
.eq .t{display:grid;justify-items:center;gap:.5rem;text-align:center}
.eq .t b{font-size:clamp(3.4rem,12vw,9rem);line-height:.8;letter-spacing:-.03em}
.eq .t small{font-family:var(--display);font-size:.72rem;letter-spacing:.14em;font-weight:700}
.eq .op{font-size:clamp(2rem,6vw,4.5rem);opacity:.55}
.eq .t.price b{color:var(--ink);background:var(--bone);border-radius:22px;padding:.12em .2em .08em}
.js .eq .t,.js .eq .op{opacity:0;transform:translateY(30px) scale(.9);transition:opacity .6s,transform .9s cubic-bezier(.3,1.5,.4,1)}
.js .eq.in .t,.js .eq.in .op{opacity:1;transform:none}
.js .eq.in>:nth-child(2){transition-delay:.12s}.js .eq.in>:nth-child(3){transition-delay:.24s}.js .eq.in>:nth-child(4){transition-delay:.36s}.js .eq.in>:nth-child(5){transition-delay:.5s}
.js .eq.in .op{opacity:.55}

.steps{list-style:none;margin:clamp(3rem,7vw,5rem) 0 0;padding:0;display:grid;gap:1rem;counter-reset:s}
.steps li{counter-increment:s;border-radius:22px;padding:1.6rem 1.6rem 1.8rem;background:rgba(0,0,0,.07)}
.steps li::before{content:"0" counter(s);display:block;font-family:var(--serif);font-size:3rem;line-height:1;margin-bottom:1rem}
.steps h3{font-size:1.35rem;margin-bottom:.6rem}
.steps p{margin:0}
@media(min-width:800px){.steps{grid-template-columns:repeat(3,1fr)}}

.bar-menu{display:grid;gap:clamp(2rem,5vw,4rem)}
.bar-menu .ph{border-radius:24px;overflow:hidden;aspect-ratio:4/5;position:relative}
.bar-menu .ph img{width:100%;height:100%;object-fit:cover}
.bar-menu h3.course{font-size:clamp(1.4rem,2.6vw,2rem);margin:0 0 1.4rem;display:flex;align-items:baseline;gap:.8rem;flex-wrap:wrap}
.bar-menu h3.course .label{color:var(--coral)}
.bar-menu .grp+.grp{margin-top:clamp(2.4rem,5vw,3.5rem);padding-top:clamp(2.4rem,5vw,3.5rem);border-top:1px solid var(--line-l)}
@media(min-width:900px){.bar-menu{grid-template-columns:5fr 7fr;align-items:start}.bar-menu .ph{position:sticky;top:6.5rem}}

/* ---------- 404 ---------- */
.lost{min-height:100svh;display:grid;place-items:center;text-align:center;padding:8rem var(--gut) 4rem}
.lost>*{width:100%;min-width:0}
.lost .leo{width:11rem;margin:0 auto 1.5rem;animation:prowl 5s ease-in-out infinite}
@keyframes prowl{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(6deg) translateX(10px)}}
.lost h1{font-size:var(--d-1)}
.lost p{font-size:var(--t-l);color:var(--mute);margin:1.4rem auto 0;max-width:30rem}
.lost .btns{justify-content:center}

/* ---------- Reduced motion ---------- */
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .ticker .tr{animation:none}
  .stage{height:auto}.stage .pin{position:relative;height:auto;min-height:80vh}
  .curtain{height:auto}.curtain .pin{position:relative;min-height:100vh}
  .curtain .drape,.curtain .pre,.curtain .valance{display:none}
  .curtain .hero-copy,.curtain .discs{opacity:1}
  .neon .sign img.glow{animation:none}
}
.act .sublab{font-size:.72rem;margin:0 0 1.2rem;padding-bottom:.6rem;border-bottom:1px solid var(--line-d);color:var(--coral-2)}
.act .sublab:not(:first-child){margin-top:2.4rem}
.hero .bg video{position:absolute;inset:0}
.hero .bg .vd{display:none}
@media(min-width:900px){.hero .bg .vd{display:block}.hero .bg .vm{display:none}}
.hero .pp{position:absolute;right:var(--gut);top:5.5rem;z-index:3;width:44px;height:44px;border-radius:50%;border:1.5px solid rgba(242,239,236,.6);background:rgba(20,16,14,.35);color:var(--bone);cursor:pointer;display:grid;place-items:center;font-size:.8rem}
@media(min-width:900px){.hero .pp{top:auto;bottom:clamp(2.5rem,7vh,5rem);right:calc(var(--gut) + 4rem)}}

.hs-head{position:relative;max-width:none}
.hs-head .sm{display:none}
@media(min-width:1100px){.hs-head .sm{display:block;position:absolute;right:0;top:-1rem;width:200px;aspect-ratio:4/5;border-radius:18px;overflow:hidden;transform:rotate(4deg);box-shadow:0 30px 60px -30px rgba(0,0,0,.7)}.hs-head .sm img{width:100%;height:100%;object-fit:cover}}
@media(min-width:700px){.hs-head .label{white-space:nowrap}}
.hs-head .label{max-width:100%}
.pz:focus-visible{outline:3px solid var(--bone);outline-offset:4px}

@media(min-width:900px){.bookbar{display:none!important}}
:root{--bar-h:0px}
@media(max-width:699px){.stage .words b{flex:none;width:100%}}

/* Price discs only where there is room beside the headline */
.hero .discs,.curtain .discs{display:none}
@media(min-width:1200px) and (min-height:720px){.hero .discs,.curtain .discs{display:flex}}
/* Desktop has no floating bar, so the mobile menu button shows alongside the header Book button between 900 and 1180 */
@media(min-width:600px) and (max-width:1179px){.nav{gap:.9rem}}

.stage .cap p{text-shadow:0 2px 18px rgba(0,0,0,.6)}
@media(min-width:900px){.stage .cap{bottom:clamp(1rem,4vh,2.5rem)}.stage .ph{transform:scale(calc(1 - var(--q,0) * .55))}}
/* Pre Theatre: calmer type scale */
.pt{--d-hero:clamp(2.1rem,8.2vw,6.6rem);--d-1:clamp(2.1rem,6.4vw,5.2rem);--d-2:clamp(1.8rem,4.8vw,3.9rem);--d-3:clamp(1.4rem,2.8vw,2.2rem)}
.pt .curtain .pre b{font-size:clamp(1.8rem,4.6vw,3.8rem)}
.pt .curtain .lede{font-size:clamp(1.05rem,1.4vw,1.25rem)}
.pt .stop-time{font-size:clamp(1.9rem,4.4vw,3rem)}
.pt.tl.shut .stop:first-child .stop-time,.pt .tl.shut .stop:first-child .stop-time{font-size:clamp(1.25rem,2.4vw,1.7rem)}
.pt .deal .big{font-size:clamp(2.1rem,14cqi,4.8rem)}
.pt .dishes .d{font-size:1rem}
.pt .dishes .x{font-size:1rem}
.pt .act .aname h3{font-size:clamp(1.35rem,2vw,1.85rem)}
.lost .label{margin-bottom:.7rem}
/* Grid columns never collapse to make room for wide headline type; data-fit shrinks the type instead */
.card>*,.neon>*,.neon .twin>*,.feed>*,.visit>*,.info>*,.planner-grid>*,.deals>*,.act>*,.strip>*,.steps>*,.bar-menu>*,.foot .cols>*{min-width:0}
/* Price discs: keep labels and figures inside the circle with the wide live font */
.disc{padding:.9rem}
.disc .l{font-size:.52rem;letter-spacing:.08em;line-height:1.15;max-width:85%}
.disc .v{font-size:calc(var(--d) * .165);letter-spacing:-.02em;line-height:1;margin:.3rem 0 .25rem}
/* Phones: From Naples / With Love sit closer so the caption never runs into them */
@media(max-width:699px){.stage .words{gap:32vh}.stage .cap{bottom:clamp(4.5rem,9vh,6rem)}}