/* ============================================================
   EMBER & OAK · Brand System v1
   "Where flame meets the grain."
   ============================================================ */

/* ---------- TOKENS ---------- */
:root{
  /* Palette */
  --bg:           #0A0807;
  --bg-2:         #100B08;
  --bg-3:         #15100B;
  --bg-4:         #1F1610;
  --oak:          #3A2818;
  --cream:        #F4E8D0;
  --cream-dim:    #C9B996;
  --cream-mute:   #8E806A;
  --ember:        #E0541B;
  --ember-deep:   #B33C0E;
  --ember-bright: #F5A24A;
  --brass:        #C9A059;
  --brass-bright: #E5C079;
  --brass-deep:   #9C7A36;

  /* Lines */
  --line:         rgba(201,160,89,.16);
  --line-mid:     rgba(201,160,89,.30);
  --line-strong:  rgba(201,160,89,.55);

  /* Type */
  --f-display:   'Playfair Display', 'Cormorant Garamond', Georgia, serif;
  --f-serif:     'Cormorant Garamond', 'Playfair Display', Georgia, serif;
  --f-italic:    'Cormorant Garamond', Georgia, serif;
  --f-ui:        'Inter', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;

  /* Spacing scale */
  --s-1: 6px;
  --s-2: 12px;
  --s-3: 20px;
  --s-4: 32px;
  --s-5: 52px;
  --s-6: 84px;
  --s-7: 136px;
  --s-8: 220px;

  /* Motion */
  --ease: cubic-bezier(.2,.7,.2,1);
  --ease-out: cubic-bezier(.16,1,.3,1);
  --ease-in: cubic-bezier(.7,0,.84,0);

  /* Container */
  --max: 1360px;
  --gutter: clamp(20px, 4vw, 56px);
}

/* ---------- RESET ---------- */
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;padding:0}
html{
  background:var(--bg);
  color:var(--cream);
  font-family:var(--f-serif);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}
body{
  min-height:100vh;
  overflow-x:hidden;
  background:
    radial-gradient(900px 700px at 80% -10%, rgba(224,84,27,.08), transparent 60%),
    radial-gradient(700px 700px at 10% 110%, rgba(224,84,27,.05), transparent 60%),
    linear-gradient(180deg,#0A0807 0%, #0E0B08 30%, #0A0807 100%);
  cursor:none;
  -webkit-tap-highlight-color:transparent;
}

/* ---------- LENIS (smooth scroll) required rules ---------- */
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto !important}
.lenis.lenis-smooth [data-lenis-prevent]{overscroll-behavior:contain}
.lenis.lenis-stopped{overflow:clip}
.lenis.lenis-smooth iframe{pointer-events:none}
@media (max-width:900px){ body{cursor:auto} }
img,svg{display:block;max-width:100%}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
a{color:inherit;text-decoration:none}
::selection{background:var(--ember);color:var(--bg)}

/* ---------- TEXTURES ---------- */
.grain{
  position:fixed;inset:0;pointer-events:none;z-index:1;opacity:.16;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' seed='5'/><feColorMatrix values='0 0 0 0 0.95  0 0 0 0 0.91  0 0 0 0 0.82  0 0 0 0.55 0'/></filter><rect width='200' height='200' filter='url(%23n)' opacity='0.5'/></svg>");
}
.vignette{
  position:fixed;inset:0;pointer-events:none;z-index:2;
  background:radial-gradient(120% 90% at 50% 50%, transparent 55%, rgba(0,0,0,.55) 100%);
}
canvas.embers{position:fixed;inset:0;pointer-events:none;z-index:3;opacity:.85}

/* ---------- CUSTOM CURSOR ---------- */
.cursor,.cursor-trail{
  position:fixed;top:0;left:0;pointer-events:none;z-index:1000;
  transform:translate(-50%,-50%);will-change:transform;
}
.cursor{
  width:8px;height:8px;border-radius:999px;background:var(--cream);
  mix-blend-mode:difference;transition:width .25s var(--ease), height .25s var(--ease);
}
.cursor-trail{
  width:38px;height:38px;border-radius:999px;border:1px solid var(--brass);
  opacity:.6;transition:width .35s var(--ease), height .35s var(--ease), opacity .35s var(--ease);
}
.cursor.is-hover{width:14px;height:14px}
.cursor-trail.is-hover{width:64px;height:64px;opacity:.9;border-color:var(--ember-bright)}
.cursor.is-link::after{content:""}
@media (max-width:900px){.cursor,.cursor-trail{display:none}}

/* ---------- LAYOUT ---------- */
.wrap{max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter);position:relative;z-index:5}
.section{padding:var(--s-7) 0;position:relative;z-index:5}
.section.alt{background:linear-gradient(180deg, transparent, rgba(15,11,8,.55), transparent)}

/* ---------- TYPE ---------- */
.eyebrow{
  font-family:var(--f-ui);font-size:11px;letter-spacing:.5em;text-transform:uppercase;
  color:var(--brass);font-weight:500;
}
.eyebrow .num{color:var(--ember);margin-right:14px}
.h-display{font-family:var(--f-display);font-weight:500;line-height:1.02;letter-spacing:.01em}
.h-display em{font-family:var(--f-italic);font-style:italic;color:var(--ember);font-weight:500}
.h-display .amp{font-family:var(--f-italic);font-style:italic;color:var(--ember);font-weight:500}
h1,h2,h3{margin:0;font-weight:500}
h1.h-display{font-size:clamp(72px,12vw,200px)}
h2.h-display{font-size:clamp(44px,7vw,118px)}
h3.h-display{font-size:clamp(28px,3.6vw,52px)}
.lede{font-family:var(--f-italic);font-style:italic;font-size:clamp(18px,1.6vw,24px);color:var(--cream-dim);line-height:1.55;max-width:62ch}
.body-l{font-size:clamp(17px,1.25vw,20px);line-height:1.7;color:var(--cream-dim);max-width:64ch}
.body{font-size:16px;line-height:1.7;color:var(--cream-dim);max-width:62ch}
.caps{font-family:var(--f-ui);font-size:11px;letter-spacing:.42em;text-transform:uppercase;color:var(--cream-dim)}
.tag{font-family:var(--f-italic);font-style:italic;color:var(--brass-bright);letter-spacing:.04em}

/* Section titles */
.sec-head{display:flex;align-items:flex-end;justify-content:space-between;gap:32px;margin-bottom:var(--s-5)}
.sec-head .right{display:flex;flex-direction:column;align-items:flex-end;gap:10px;text-align:right;max-width:380px}
.sec-head .ln{height:1px;background:var(--line);flex:1;align-self:center;margin:0 18px}
@media (max-width:780px){
  .sec-head{flex-direction:column;align-items:flex-start}
  .sec-head .right{align-items:flex-start;text-align:left}
}

/* ---------- BUTTONS ---------- */
.btn{
  position:relative;display:inline-flex;align-items:center;gap:12px;
  font-family:var(--f-ui);font-weight:500;font-size:11px;letter-spacing:.42em;text-transform:uppercase;
  padding:18px 28px;border:1px solid var(--brass);color:var(--cream);background:transparent;
  cursor:pointer;overflow:hidden;transition:color .4s var(--ease), border-color .4s var(--ease);
  isolation:isolate;
}
.btn::before{
  content:"";position:absolute;inset:0;background:var(--brass);
  transform:translateY(101%);transition:transform .55s var(--ease);z-index:-1;
}
.btn:hover{color:var(--bg);border-color:var(--brass-bright)}
.btn:hover::before{transform:translateY(0)}
.btn .pip{width:6px;height:6px;border-radius:999px;background:var(--ember);box-shadow:0 0 12px var(--ember);flex-shrink:0}
.btn.solid{background:var(--ember);border-color:var(--ember);color:var(--cream)}
.btn.solid::before{background:var(--bg)}
.btn.solid:hover{color:var(--cream);border-color:var(--ember-bright)}
.btn.ghost{border-color:var(--line-strong);color:var(--cream-dim)}
.btn.ghost:hover{color:var(--cream);border-color:var(--brass-bright)}

.link-arrow{
  display:inline-flex;align-items:center;gap:14px;font-family:var(--f-ui);font-size:11px;
  letter-spacing:.42em;text-transform:uppercase;color:var(--brass);position:relative;padding:6px 0;
}
.link-arrow .arrow{display:inline-block;width:34px;height:1px;background:var(--brass);position:relative;transition:width .4s var(--ease)}
.link-arrow .arrow::after{content:"";position:absolute;right:0;top:-3px;width:7px;height:7px;border-top:1px solid var(--brass);border-right:1px solid var(--brass);transform:rotate(45deg)}
.link-arrow:hover{color:var(--brass-bright)}
.link-arrow:hover .arrow{width:60px}

/* ---------- NAV ---------- */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:50;
  display:flex;justify-content:space-between;align-items:center;
  padding:18px var(--gutter);
  transition:background .5s var(--ease), padding .5s var(--ease), border-color .5s var(--ease);
  border-bottom:1px solid transparent;
}
.nav.scrolled{
  background:rgba(10,8,7,.78);
  backdrop-filter:blur(14px) saturate(120%);
  -webkit-backdrop-filter:blur(14px) saturate(120%);
  border-bottom-color:var(--line);
  padding:14px var(--gutter);
}
.nav .brand{display:flex;align-items:center;gap:14px}
.nav .brand img{
  width:46px;height:46px;display:block;
  filter:drop-shadow(0 0 14px rgba(224,84,27,.35));
  transition:transform .5s var(--ease), filter .5s var(--ease);
}
.nav .brand:hover img{filter:drop-shadow(0 0 18px rgba(224,84,27,.6))}
.nav.scrolled .brand img{transform:scale(.92)}
.nav .brand .nm{font-family:var(--f-display);font-size:19px;letter-spacing:.18em}
.nav .brand .nm em{font-family:var(--f-italic);font-style:italic;color:var(--ember)}
.nav ul{display:flex;gap:36px;list-style:none;margin:0;padding:0}
.nav ul a{font-family:var(--f-ui);font-size:11px;letter-spacing:.42em;text-transform:uppercase;color:var(--cream-dim);position:relative;transition:color .3s var(--ease)}
.nav ul a::after{content:"";position:absolute;left:50%;bottom:-10px;width:0;height:1px;background:var(--ember);transition:width .4s var(--ease), left .4s var(--ease)}
.nav ul a:hover{color:var(--cream)}
.nav ul a:hover::after{width:100%;left:0}
.nav .reserve{display:inline-flex;align-items:center;gap:10px}
.nav .menu-toggle{display:none}
@media (max-width:980px){
  .nav ul{display:none}
  .nav .menu-toggle{display:inline-flex;align-items:center;gap:10px}
}

/* ============================================================
   LOADER — "Lighting the Hearth"
   ============================================================ */
.loader{
  position:fixed;inset:0;z-index:9000;background:#070504;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
}
.loader.is-done{pointer-events:none}
.loader-grain{position:absolute;inset:0;pointer-events:none;opacity:.18;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' seed='3'/><feColorMatrix values='0 0 0 0 0.95  0 0 0 0 0.91  0 0 0 0 0.82  0 0 0 0.55 0'/></filter><rect width='200' height='200' filter='url(%23n)' opacity='0.5'/></svg>")}
.loader-vignette{position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(80% 70% at 50% 50%, transparent 30%, rgba(0,0,0,.85) 100%)}
.loader-embers{position:absolute;inset:0;pointer-events:none;opacity:.7}

.loader-stack{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:34px;padding:40px;text-align:center;max-width:560px}

.loader-eyebrow{display:flex;align-items:center;gap:18px;font-family:var(--f-ui);font-size:11px;letter-spacing:.5em;text-transform:uppercase;color:var(--brass-bright)}
.loader-eyebrow .dot{width:5px;height:5px;border-radius:999px;background:var(--ember);box-shadow:0 0 10px var(--ember);animation:lpulse 1.4s ease-in-out infinite}
.loader-eyebrow .ttl{opacity:0;animation:ldFade 1s var(--ease) .15s forwards}
@keyframes lpulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.4);opacity:.7}}
@keyframes ldFade{to{opacity:1}}

.loader-crest{width:min(280px,62vw);height:auto;display:block;filter:drop-shadow(0 30px 80px rgba(224,84,27,.3))}

.ld-ring{stroke-dasharray:1000;stroke-dashoffset:1000;animation:ldDraw 2.2s var(--ease-out) .2s forwards}
.ld-ring-2{animation-delay:.45s;animation-duration:1.8s}
@keyframes ldDraw{to{stroke-dashoffset:0}}

.ld-tick{stroke-dasharray:20;stroke-dashoffset:20;animation:ldDraw .8s var(--ease) .9s forwards}
.ld-tick:nth-of-type(2){animation-delay:1.0s}
.ld-tick:nth-of-type(3){animation-delay:1.1s}
.ld-tick:nth-of-type(4){animation-delay:1.2s}

.ld-flame{transform-origin:50% 80%;opacity:0;animation:ldFlameIn 1s var(--ease) 1.0s forwards, ldFlicker 2s ease-in-out 2s infinite}
@keyframes ldFlameIn{from{opacity:0;transform:translate(120px,118px) scale(.4)}to{opacity:1;transform:translate(120px,102px) scale(1)}}
@keyframes ldFlicker{0%,100%{transform:translate(120px,102px) scale(1)}50%{transform:translate(120px,102px) scale(1.04,1.07)}}

.ld-amp{opacity:0;transform-origin:50% 50%;animation:ldAmpIn 1.2s var(--ease) 1.3s forwards}
@keyframes ldAmpIn{0%{opacity:0;letter-spacing:-.3em;filter:blur(8px)}100%{opacity:1;letter-spacing:0;filter:blur(0)}}

.ld-rule{opacity:0;animation:ldFade .9s var(--ease) 1.6s forwards}

.loader-meta{display:flex;align-items:center;gap:18px;width:min(380px,80vw);margin-top:6px;opacity:0;animation:ldFade .9s var(--ease) .8s forwards}
.loader-bar{flex:1;height:1px;background:rgba(229,192,121,.18);position:relative;overflow:hidden}
.loader-bar .fill{position:absolute;left:0;top:0;height:100%;width:0%;background:linear-gradient(90deg,var(--ember),var(--brass-bright));transition:width .4s var(--ease);box-shadow:0 0 10px var(--ember)}
.loader-num{font-family:var(--f-display);font-style:italic;color:var(--cream);font-size:18px;min-width:74px;text-align:right;letter-spacing:.04em}
.loader-num em{font-family:var(--f-italic);font-style:italic;color:var(--cream-mute);font-size:13px;margin-left:2px}

.loader-tag{font-family:var(--f-italic);font-style:italic;color:var(--brass);font-size:14px;letter-spacing:.32em;text-transform:lowercase;opacity:0;animation:ldFade 1s var(--ease) 1.8s forwards}

/* curtains: panels that slide in from top + bottom, meet, then split apart */
.loader-curtain{position:absolute;left:0;right:0;height:55%;background:#070504;z-index:5;will-change:transform}
.loader-curtain.top{top:0;transform:translateY(-100%)}
.loader-curtain.bot{bottom:0;transform:translateY(100%)}

/* Phase 1: stack + embers fade, curtains slide IN to meet at the middle */
.loader.is-exiting .loader-stack{opacity:0;transform:scale(1.03);transition:opacity .55s var(--ease), transform .9s var(--ease)}
.loader.is-exiting .loader-embers{opacity:0;transition:opacity .55s var(--ease)}
.loader.is-exiting .loader-curtain.top,
.loader.is-exiting .loader-curtain.bot{
  transform:translateY(0);
  transition:transform .85s cubic-bezier(.86,0,.07,1) .25s;
}

/* Phase 2: curtains slide OUT — top up, bottom down — revealing the hero */
.loader.is-splitting{background:transparent}
.loader.is-splitting .loader-curtain.top{transform:translateY(-100%);transition:transform 1.05s cubic-bezier(.7,0,.18,1)}
.loader.is-splitting .loader-curtain.bot{transform:translateY(100%);transition:transform 1.05s cubic-bezier(.7,0,.18,1)}

.loader.is-removed{display:none}

/* lock body scroll while loading */
body.is-loading{overflow:hidden;height:100vh}

/* HERO: pure-CSS staged reveal on body.is-loading toggle ----------- */
.hero h1 .word > span,
.hero .est,
.hero .ornament,
.hero .tagline,
.hero .ctas,
.hero .scroll-cue{
  transition:opacity 1.1s var(--ease), transform 1.4s var(--ease);
}
body.is-loading .hero h1 .word > span{opacity:0;transform:translateY(110%)}
body.is-loading .hero .est,
body.is-loading .hero .ornament,
body.is-loading .hero .tagline,
body.is-loading .hero .ctas{opacity:0;transform:translateY(14px)}
body.is-loading .hero .scroll-cue{opacity:0}

/* stagger out */
.hero .est{transition-delay:.05s}
.hero h1 .word:nth-child(1) > span{transition-delay:.20s}
.hero h1 .word:nth-child(2) > span{transition-delay:.36s}
.hero h1 .word:nth-child(3) > span{transition-delay:.52s}
.hero .ornament{transition-delay:.78s}
.hero .tagline{transition-delay:.92s}
.hero .ctas{transition-delay:1.08s}
.hero .scroll-cue{transition-delay:1.6s}

/* ---------- HERO ---------- */
.hero{
  position:relative;min-height:100vh;display:grid;place-items:center;text-align:center;
  padding:140px var(--gutter) 80px;overflow:hidden;z-index:5;
}
.hero .crest{position:absolute;top:50%;left:50%;transform:translate(-50%,-58%);width:min(620px,90vw);opacity:.18;filter:blur(.4px) drop-shadow(0 0 80px rgba(224,84,27,.18));pointer-events:none;animation:breathe 7s ease-in-out infinite}
@keyframes breathe{0%,100%{transform:translate(-50%,-58%) scale(1);opacity:.18}50%{transform:translate(-50%,-58%) scale(1.04);opacity:.24}}
.hero .stack{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:24px}
.hero .est{font-family:var(--f-italic);font-style:italic;font-size:14px;letter-spacing:.5em;color:var(--brass);text-transform:uppercase;display:flex;align-items:center;gap:18px}
.hero .est::before,.hero .est::after{content:"";width:38px;height:1px;background:var(--brass)}
.hero h1{font-size:clamp(72px,14vw,260px);line-height:.92;letter-spacing:.005em}
.hero h1 .word{display:inline-block;overflow:hidden;vertical-align:bottom}
.hero h1 .word > span{display:inline-block;will-change:transform}
.hero .tagline{font-family:var(--f-italic);font-style:italic;font-size:clamp(18px,1.8vw,28px);letter-spacing:.18em;color:var(--cream-dim);text-transform:lowercase}
.hero .ornament{display:flex;gap:14px;align-items:center}
.hero .ornament .dot{width:5px;height:5px;border-radius:999px;background:var(--brass)}
.hero .ornament .ln{width:60px;height:1px;background:var(--brass)}
.hero .ctas{display:flex;gap:18px;margin-top:14px;flex-wrap:wrap;justify-content:center}
.hero .scroll-cue{position:absolute;bottom:34px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:14px;font-family:var(--f-ui);font-size:10px;letter-spacing:.5em;color:var(--cream-mute);text-transform:uppercase;z-index:6}
.hero .scroll-cue .bar{width:1px;height:64px;background:linear-gradient(180deg, transparent, var(--brass));position:relative;overflow:hidden}
.hero .scroll-cue .bar::after{content:"";position:absolute;left:0;width:1px;height:30%;background:var(--ember);animation:cueDown 2.4s var(--ease) infinite}
@keyframes cueDown{0%{top:-30%;opacity:0}30%{opacity:1}100%{top:130%;opacity:0}}

/* ---------- MARQUEE ---------- */
.marquee{
  border-block:1px solid var(--line);padding:28px 0;overflow:hidden;
  background:linear-gradient(180deg, rgba(15,11,8,.6), rgba(10,8,7,.4));
}
.marquee .track{display:flex;gap:64px;width:max-content;animation:marq 36s linear infinite;will-change:transform}
.marquee:hover .track{animation-play-state:paused}
.marquee .item{display:inline-flex;align-items:center;gap:32px;font-family:var(--f-display);font-size:clamp(28px,4vw,52px);font-weight:500;letter-spacing:.06em;color:var(--cream);white-space:nowrap}
.marquee .item em{font-family:var(--f-italic);font-style:italic;color:var(--ember);font-weight:500}
.marquee .item .star{width:8px;height:8px;background:var(--brass);transform:rotate(45deg);display:inline-block}
@keyframes marq{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ---------- PHILOSOPHY ---------- */
.philosophy{
  min-height:130vh;position:relative;display:grid;place-items:center;padding:var(--s-7) var(--gutter);
}
.philosophy .quote{
  font-family:var(--f-display);font-weight:500;line-height:1.06;letter-spacing:0;color:var(--cream);
  font-size:clamp(38px,6.4vw,108px);text-align:center;max-width:1100px;
}
.philosophy .quote em{font-family:var(--f-italic);font-style:italic;color:var(--ember);font-weight:500}
.philosophy .quote .word{display:inline-block;opacity:.18;transition:opacity .6s var(--ease)}
.philosophy .quote .word.lit{opacity:1}
.philosophy .attrib{margin-top:var(--s-5);text-align:center}
.philosophy .attrib .ornament{display:flex;align-items:center;gap:14px;justify-content:center;margin-bottom:14px}
.philosophy .attrib .ornament .ln{width:50px;height:1px;background:var(--brass)}
.philosophy .attrib .ornament .dt{width:5px;height:5px;border-radius:999px;background:var(--brass)}

/* ---------- GRILL THEATER (horizontal scroll) ---------- */
.grill{position:relative;overflow:hidden;min-height:100vh;display:flex;flex-direction:column;justify-content:center}
.grill .head{padding:80px var(--gutter) 40px;max-width:var(--max);margin-inline:auto;width:100%}
.grill .h-track{display:flex;gap:48px;padding:0 var(--gutter) 60px;will-change:transform}
.grill .panel{
  flex:0 0 auto;width:min(520px,80vw);min-height:520px;border:1px solid var(--line);padding:36px;
  background:linear-gradient(180deg, rgba(20,14,10,.6), rgba(10,8,7,.7));
  position:relative;display:flex;flex-direction:column;justify-content:space-between;
  transition:border-color .5s var(--ease), transform .8s var(--ease);
}
.grill .panel:hover{border-color:var(--line-strong)}
.grill .panel .step{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}
.grill .panel .step .n{font-family:var(--f-display);font-style:italic;font-size:62px;color:var(--ember);line-height:1;font-weight:500}
.grill .panel .step .lb{font-family:var(--f-ui);font-size:10px;letter-spacing:.5em;color:var(--brass);text-transform:uppercase}
.grill .panel h3{font-family:var(--f-display);font-size:clamp(28px,3vw,42px);margin:8px 0 18px;letter-spacing:.01em}
.grill .panel .body{color:var(--cream-dim);max-width:420px}
.grill .panel .meter{display:flex;gap:6px;margin-top:28px}
.grill .panel .meter span{flex:1;height:1px;background:var(--line)}
.grill .panel .meter span.on{background:var(--ember)}
.grill .panel .ill{
  position:absolute;right:32px;top:32px;width:80px;height:80px;border-radius:999px;
  background:radial-gradient(circle, rgba(224,84,27,.45), rgba(224,84,27,.08) 60%, transparent 75%);
  filter:blur(.4px);
}
.grill .scroll-rail{display:flex;align-items:center;justify-content:space-between;padding:0 var(--gutter) var(--s-6);max-width:var(--max);margin-inline:auto}
.grill .scroll-rail .bar{flex:1;height:1px;background:var(--line);margin:0 24px;position:relative}
.grill .scroll-rail .bar .fill{position:absolute;left:0;top:0;height:100%;background:var(--ember);width:0%;transition:width .15s linear}

/* ---------- MENU ---------- */
.menu .tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:var(--s-5)}
.menu .tab{
  font-family:var(--f-ui);font-size:11px;letter-spacing:.42em;text-transform:uppercase;
  padding:14px 22px;border:1px solid var(--line);color:var(--cream-dim);
  transition:all .3s var(--ease);
}
.menu .tab:hover{color:var(--cream);border-color:var(--line-strong)}
.menu .tab.is-active{color:var(--bg);background:var(--brass);border-color:var(--brass)}
.menu .panel{display:none}
.menu .panel.is-active{display:block;animation:fadeUp .8s var(--ease)}
@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

.menu .grid-cuts{display:grid;grid-template-columns:repeat(2,1fr);gap:0}
@media (max-width:880px){.menu .grid-cuts{grid-template-columns:1fr}}
.menu .cut{
  position:relative;padding:32px 28px;border-bottom:1px solid var(--line);
  display:grid;grid-template-columns:48px 1fr auto;gap:18px;align-items:start;
  cursor:pointer;transition:background .4s var(--ease);
}
.menu .cut:hover{background:linear-gradient(90deg,rgba(224,84,27,.06),transparent)}
.menu .cut::before{
  content:"";position:absolute;left:0;top:0;height:100%;width:2px;background:var(--ember);
  transform:scaleY(0);transform-origin:top;transition:transform .5s var(--ease);
}
.menu .cut:hover::before{transform:scaleY(1)}
.menu .grid-cuts .cut:nth-child(odd){border-right:1px solid var(--line)}
@media (max-width:880px){.menu .grid-cuts .cut{border-right:none !important}}
.menu .cut .num{font-family:var(--f-italic);font-style:italic;color:var(--brass);font-size:14px;letter-spacing:.18em}
.menu .cut .body h4{font-family:var(--f-display);font-size:24px;margin:0 0 6px;letter-spacing:.01em}
.menu .cut .body h4 em{font-family:var(--f-italic);font-style:italic;color:var(--ember);font-weight:500}
.menu .cut .body .desc{font-family:var(--f-italic);font-style:italic;color:var(--cream-dim);font-size:14.5px;line-height:1.55}
.menu .cut .body .meta{display:flex;gap:14px;margin-top:10px;flex-wrap:wrap}
.menu .cut .body .meta span{font-family:var(--f-ui);font-size:9.5px;letter-spacing:.35em;color:var(--cream-mute);text-transform:uppercase;padding:5px 10px;border:1px solid var(--line)}
.menu .cut .price{font-family:var(--f-display);font-size:22px;color:var(--cream);font-weight:500;letter-spacing:.04em;white-space:nowrap}
.menu .note{margin-top:32px;padding-top:24px;border-top:1px solid var(--line);font-family:var(--f-italic);font-style:italic;color:var(--cream-mute);font-size:13.5px;letter-spacing:.04em}

/* ---------- WHISKEY LIBRARY ---------- */
.whiskey{position:relative;overflow:hidden}
.whiskey .row{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}
@media (max-width:980px){.whiskey .row{grid-template-columns:1fr}}
.whiskey .left{position:sticky;top:120px;align-self:start}
.whiskey .left .badge{display:inline-flex;align-items:center;gap:10px;padding:8px 14px;border:1px solid var(--brass);font-family:var(--f-ui);font-size:10px;letter-spacing:.42em;text-transform:uppercase;color:var(--brass);margin-bottom:18px}
.whiskey .left .badge .dot{width:5px;height:5px;border-radius:999px;background:var(--ember);box-shadow:0 0 8px var(--ember)}
.whiskey .featured{
  border:1px solid var(--line-strong);padding:32px;background:linear-gradient(180deg,rgba(224,84,27,.05),rgba(15,11,8,.4));
  margin-top:24px;display:flex;gap:24px;align-items:center;
}
.whiskey .featured .glass{flex-shrink:0}
.whiskey .featured h4{font-family:var(--f-display);font-size:26px;margin:0 0 4px;letter-spacing:.01em}
.whiskey .featured .age{font-family:var(--f-italic);font-style:italic;color:var(--ember);font-size:18px}
.whiskey .featured .notes{font-family:var(--f-italic);font-style:italic;color:var(--cream-dim);font-size:14px;margin:8px 0 12px}
.whiskey .featured .pour{display:flex;gap:18px;align-items:center;margin-top:12px}
.whiskey .featured .pour .price{font-family:var(--f-display);font-size:22px;color:var(--cream)}
.whiskey .featured .pour .by{font-family:var(--f-ui);font-size:10px;letter-spacing:.42em;color:var(--cream-mute);text-transform:uppercase}

.whiskey .cats{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:18px}
.whiskey .cat-btn{
  font-family:var(--f-ui);font-size:10px;letter-spacing:.4em;text-transform:uppercase;
  padding:11px 16px;border:1px solid var(--line);color:var(--cream-dim);
  transition:all .3s var(--ease);
}
.whiskey .cat-btn:hover{color:var(--cream);border-color:var(--line-strong)}
.whiskey .cat-btn.is-active{color:var(--bg);background:var(--brass);border-color:var(--brass)}

.whiskey .list{border-top:1px solid var(--line)}
.whiskey .pour-row{
  display:grid;grid-template-columns:36px 1fr 80px 90px;gap:14px;align-items:baseline;
  padding:18px 0;border-bottom:1px solid var(--line);transition:background .3s var(--ease), padding-left .4s var(--ease);
  cursor:pointer;
}
.whiskey .pour-row:hover{padding-left:14px;background:linear-gradient(90deg,rgba(224,84,27,.05),transparent 80%)}
.whiskey .pour-row .n{font-family:var(--f-italic);font-style:italic;color:var(--brass);font-size:13px}
.whiskey .pour-row .name{font-family:var(--f-display);font-size:18px;color:var(--cream)}
.whiskey .pour-row .name em{font-family:var(--f-italic);font-style:italic;color:var(--ember);font-weight:500}
.whiskey .pour-row .age{font-family:var(--f-italic);font-style:italic;font-size:13px;color:var(--cream-dim);text-align:right}
.whiskey .pour-row .price{font-family:var(--f-display);font-size:18px;color:var(--cream);text-align:right;letter-spacing:.04em}

/* ---------- STORY ---------- */
.story{position:relative}
.story .grid{display:grid;grid-template-columns:1fr 1.3fr;gap:80px;align-items:start}
@media (max-width:980px){.story .grid{grid-template-columns:1fr}}
.story .num-block{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:32px}
.story .num-block .n{padding:24px 0;border-top:1px solid var(--line)}
.story .num-block .n .v{font-family:var(--f-display);font-size:62px;color:var(--cream);line-height:1;letter-spacing:.005em}
.story .num-block .n .v em{font-family:var(--f-italic);font-style:italic;color:var(--ember);font-weight:500}
.story .num-block .n .lb{font-family:var(--f-ui);font-size:10px;letter-spacing:.42em;color:var(--cream-mute);text-transform:uppercase;margin-top:10px}

.story .essay p{font-family:var(--f-serif);font-size:19px;line-height:1.78;color:var(--cream-dim);margin:0 0 22px;max-width:60ch}
.story .essay p:first-of-type::first-letter{
  font-family:var(--f-display);font-style:italic;color:var(--ember);font-size:88px;line-height:.85;
  float:left;padding:6px 12px 0 0;
}
.story .essay .signoff{font-family:var(--f-italic);font-style:italic;color:var(--brass);font-size:18px;margin-top:8px}

/* Timeline */
.timeline{margin-top:var(--s-6);position:relative}
.timeline::before{content:"";position:absolute;left:0;right:0;top:50%;height:1px;background:var(--line)}
.timeline ul{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(5,1fr);gap:20px;position:relative}
@media (max-width:780px){.timeline ul{grid-template-columns:repeat(2,1fr)}.timeline::before{display:none}}
.timeline li{position:relative;padding:32px 0;text-align:center}
.timeline li::before{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:9px;height:9px;background:var(--brass);border-radius:999px;box-shadow:0 0 0 6px var(--bg)}
.timeline li.acc::before{background:var(--ember);box-shadow:0 0 0 6px var(--bg), 0 0 16px var(--ember)}
.timeline li .yr{font-family:var(--f-display);font-style:italic;color:var(--brass);font-size:24px}
.timeline li .ev{font-family:var(--f-italic);font-style:italic;color:var(--cream-dim);font-size:13.5px;margin-top:8px;line-height:1.5}

/* ---------- PRESS ---------- */
.press .row{display:grid;grid-template-columns:repeat(2,1fr);gap:0}
@media (max-width:880px){.press .row{grid-template-columns:1fr}}
.press blockquote{
  margin:0;padding:40px;border-top:1px solid var(--line);border-right:1px solid var(--line);
  font-family:var(--f-display);font-size:22px;line-height:1.45;color:var(--cream);font-weight:500;letter-spacing:.005em;
  position:relative;
}
.press .row blockquote:nth-child(2n){border-right:none}
.press blockquote em{font-family:var(--f-italic);font-style:italic;color:var(--ember);font-weight:500}
.press blockquote .src{font-family:var(--f-ui);font-size:10px;letter-spacing:.5em;text-transform:uppercase;color:var(--brass);display:block;margin-top:18px}
.press blockquote::before{
  content:"\201C";position:absolute;top:6px;left:18px;font-family:var(--f-display);font-style:italic;font-size:90px;color:var(--ember);opacity:.18;line-height:1;
}
.press .marks{display:flex;flex-wrap:wrap;gap:48px;align-items:center;justify-content:space-between;padding:48px 0;border-top:1px solid var(--line);margin-top:48px;opacity:.78}
.press .marks span{font-family:var(--f-display);font-style:italic;font-size:18px;letter-spacing:.18em;color:var(--cream-dim)}

/* ---------- RESERVATIONS ---------- */
.reservations{position:relative}
.reservations .row{display:grid;grid-template-columns:1.1fr 1fr;gap:80px;align-items:center}
@media (max-width:980px){.reservations .row{grid-template-columns:1fr}}
.reservations .form{
  border:1px solid var(--line-strong);padding:36px;background:linear-gradient(180deg, rgba(224,84,27,.04), rgba(15,11,8,.5));
}
.reservations .field{display:flex;flex-direction:column;gap:10px;margin-bottom:24px}
.reservations .field label{font-family:var(--f-ui);font-size:10px;letter-spacing:.42em;color:var(--brass);text-transform:uppercase}
.reservations .field input{
  background:transparent;border:0;border-bottom:1px solid var(--line-mid);
  padding:8px 0;font-family:var(--f-display);font-size:18px;color:var(--cream);
  outline:none;transition:border-color .3s var(--ease);
}
.reservations .field input:focus{border-bottom-color:var(--ember)}
.reservations .field input::placeholder{color:var(--cream-mute)}
.reservations .picker{display:flex;flex-wrap:wrap;gap:8px}
.reservations .pick{
  font-family:var(--f-display);font-size:15px;padding:11px 14px;border:1px solid var(--line);color:var(--cream);
  transition:all .3s var(--ease);min-width:78px;text-align:center;letter-spacing:.04em;
}
.reservations .pick:hover{border-color:var(--line-strong)}
.reservations .pick.is-active{background:var(--ember);border-color:var(--ember);color:var(--cream)}
.reservations .pick.disabled{opacity:.35;cursor:not-allowed;text-decoration:line-through}
.reservations .pick.disabled:hover{border-color:var(--line)}
.reservations .summary{font-family:var(--f-italic);font-style:italic;color:var(--cream-dim);font-size:15px;line-height:1.6;margin:18px 0 24px;min-height:48px}
.reservations .summary em{color:var(--ember);font-family:var(--f-italic);font-style:italic}
.reservations .confirm-msg{display:none;border:1px solid var(--ember);padding:24px;text-align:center;background:linear-gradient(180deg,rgba(224,84,27,.08),transparent)}
.reservations .confirm-msg.show{display:block;animation:fadeUp .7s var(--ease)}
.reservations .confirm-msg h4{font-family:var(--f-display);font-style:italic;color:var(--ember);font-size:30px;margin:0 0 8px;font-weight:500}
.reservations .confirm-msg p{font-family:var(--f-italic);font-style:italic;color:var(--cream);margin:0;font-size:15px;line-height:1.6}
.reservations .copy h2{margin-bottom:24px}
.reservations .copy ul{list-style:none;padding:0;margin:24px 0 0;display:flex;flex-direction:column;gap:12px}
.reservations .copy ul li{display:flex;gap:14px;font-family:var(--f-italic);font-style:italic;color:var(--cream-dim);font-size:15.5px}
.reservations .copy ul li::before{content:"·";color:var(--ember);font-size:22px;line-height:1}

/* ---------- VISIT ---------- */
.visit .row{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
@media (max-width:980px){.visit .row{grid-template-columns:1fr}}
.visit .info{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.visit .info .item{padding:20px 0;border-top:1px solid var(--line)}
.visit .info .item .lb{font-family:var(--f-ui);font-size:10px;letter-spacing:.42em;color:var(--brass);text-transform:uppercase;margin-bottom:10px}
.visit .info .item .vl{font-family:var(--f-display);font-size:18px;color:var(--cream);line-height:1.5}
.visit .info .item .vl em{font-family:var(--f-italic);font-style:italic;color:var(--ember)}
.visit .info .item .vl small{font-family:var(--f-italic);font-style:italic;color:var(--cream-dim);font-size:14px;display:block;margin-top:4px}
.visit .map{
  position:relative;border:1px solid var(--line-strong);padding:32px;min-height:440px;
  background:
    radial-gradient(circle at 30% 30%, rgba(224,84,27,.10), transparent 60%),
    linear-gradient(180deg,rgba(20,14,10,.6),rgba(10,8,7,.7));
  overflow:hidden;
}
.visit .map svg{width:100%;height:auto}
.visit .map .pin{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center}
.visit .map .pin .dot{width:14px;height:14px;border-radius:999px;background:var(--ember);box-shadow:0 0 0 4px rgba(224,84,27,.25), 0 0 24px var(--ember);margin:0 auto;animation:pulse 2.4s ease-in-out infinite}
.visit .map .pin .lb{font-family:var(--f-italic);font-style:italic;color:var(--cream);font-size:13px;margin-top:14px;letter-spacing:.04em}
@keyframes pulse{0%,100%{box-shadow:0 0 0 4px rgba(224,84,27,.25), 0 0 24px var(--ember)}50%{box-shadow:0 0 0 12px rgba(224,84,27,.08), 0 0 36px var(--ember)}}

/* ---------- CELLAR (private events) ---------- */
.cellar{
  position:relative;padding:var(--s-7) var(--gutter);
  background:linear-gradient(180deg, transparent, rgba(58,40,24,.18), transparent);
}
.cellar .inner{
  max-width:1100px;margin-inline:auto;display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;
  border:1px solid var(--line-strong);padding:64px;
  background:linear-gradient(180deg, rgba(15,11,8,.6), rgba(10,8,7,.7));
}
@media (max-width:880px){.cellar .inner{grid-template-columns:1fr;padding:36px}}
.cellar h2{margin-bottom:18px}
.cellar .feats{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:32px}
.cellar .feats .f{padding:18px 0;border-top:1px solid var(--line)}
.cellar .feats .f .v{font-family:var(--f-display);font-style:italic;color:var(--ember);font-size:30px;font-weight:500}
.cellar .feats .f .lb{font-family:var(--f-ui);font-size:10px;letter-spacing:.42em;color:var(--cream-mute);text-transform:uppercase;margin-top:6px}

/* ---------- FOOTER ---------- */
footer.foot{
  border-top:1px solid var(--line);padding:var(--s-6) var(--gutter) 32px;
  background:linear-gradient(180deg, transparent, rgba(15,11,8,.7));
  position:relative;z-index:5;
}
footer.foot .wrap{padding-inline:0}
footer .top{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:48px;padding-bottom:var(--s-5)}
@media (max-width:880px){footer .top{grid-template-columns:1fr 1fr}}
@media (max-width:560px){footer .top{grid-template-columns:1fr}}
footer .col h5{font-family:var(--f-ui);font-size:10px;letter-spacing:.5em;color:var(--brass);text-transform:uppercase;margin:0 0 18px;font-weight:500}
footer .col ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:12px}
footer .col a{font-family:var(--f-display);font-size:17px;color:var(--cream-dim);transition:color .3s var(--ease)}
footer .col a:hover{color:var(--cream)}
footer .brand-col p{font-family:var(--f-italic);font-style:italic;color:var(--cream-dim);font-size:14px;line-height:1.7;margin:18px 0 24px;max-width:320px}
footer .brand-col img{width:64px;height:64px;display:block;filter:drop-shadow(0 0 22px rgba(224,84,27,.28))}
footer .news{display:flex;border-bottom:1px solid var(--line-mid);padding-bottom:8px;margin-top:14px;max-width:340px}
footer .news input{flex:1;background:transparent;border:0;color:var(--cream);font-family:var(--f-display);font-size:15px;padding:6px 0;outline:none}
footer .news input::placeholder{color:var(--cream-mute);font-style:italic}
footer .news button{font-family:var(--f-ui);font-size:10px;letter-spacing:.42em;color:var(--brass);text-transform:uppercase}
footer .news button:hover{color:var(--ember-bright)}
footer .bot{display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;padding-top:28px;border-top:1px solid var(--line);font-family:var(--f-ui);font-size:10px;letter-spacing:.42em;text-transform:uppercase;color:var(--cream-mute)}

/* Big ghost wordmark */
.ghost-mark{
  font-family:var(--f-display);font-weight:500;letter-spacing:.005em;
  font-size:clamp(80px,18vw,300px);line-height:.9;color:transparent;
  -webkit-text-stroke:1px var(--line-strong);
  text-align:center;padding:0 var(--gutter);margin:0 0 -16px;
  user-select:none;
}
.ghost-mark em{font-family:var(--f-italic);font-style:italic;color:transparent;-webkit-text-stroke:1px var(--ember-bright);font-weight:500}

/* ---------- ANIMATION UTILITIES ---------- */
.reveal{opacity:0;transform:translateY(22px);transition:opacity 1.1s var(--ease), transform 1.1s var(--ease)}
.reveal.in{opacity:1;transform:none}
.reveal-l{opacity:0;transform:translateX(-22px);transition:opacity 1.1s var(--ease), transform 1.1s var(--ease)}
.reveal-l.in{opacity:1;transform:none}
.reveal-r{opacity:0;transform:translateX(22px);transition:opacity 1.1s var(--ease), transform 1.1s var(--ease)}
.reveal-r.in{opacity:1;transform:none}

.split-line{display:block;overflow:hidden}
.split-line > span{display:inline-block;transform:translateY(110%);transition:transform 1.1s var(--ease)}
.split-line.in > span{transform:none}

/* Scroll progress bar */
.scroll-progress{position:fixed;left:0;top:0;height:2px;background:linear-gradient(90deg,var(--ember),var(--brass-bright));width:0%;z-index:60;transition:width .1s linear}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
  body{cursor:auto}
  .cursor,.cursor-trail,canvas.embers{display:none}
}