:root{
  --ink:#0b0506;--ink-2:#120809;--ink-3:#1b0d10;
  --wine:#6e1420;--wine-2:#8f1d2b;
  --brass:#c9a45c;--brass-hi:#f3dca4;--brass-lo:#8c6a2e;
  --ivory:#f3e9d6;--muted:#bba98c;--line:#3c2226;
  --gold-grad:linear-gradient(180deg,#fff1c9 0%,#e9c77e 42%,#b8893f 70%,#f0d49a 100%);
  --display:'Playfair Display',Georgia,'Times New Roman',serif;
  --label:'Oswald','Arial Narrow',Arial,sans-serif;
  --body:'Manrope','Segoe UI',Arial,sans-serif;
  --pad:clamp(20px,6vw,96px);
  --ease:cubic-bezier(.2,.7,.2,1);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:72px;background:var(--ink);overflow-x:clip}
body{margin:0;background:var(--ink);color:var(--ivory);font:400 17px/1.7 var(--body);-webkit-font-smoothing:antialiased;overflow-x:clip}
img,video{display:block;max-width:100%}
a{color:inherit}
button{font:inherit;color:inherit;cursor:pointer}
em{font-style:italic;color:var(--brass-hi)}
::selection{background:var(--wine-2);color:#fff}

.grain{position:fixed;inset:-50%;z-index:100;pointer-events:none;opacity:.07;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation:grain 1.2s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-3%)}60%{transform:translate(-2%,-1%)}80%{transform:translate(3%,3%)}100%{transform:translate(0,0)}}

.gold{background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent}

/* nav */
.nav{position:fixed;inset:0 0 auto;z-index:50;height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 var(--pad);transition:background .4s,border-color .4s,height .4s;border-bottom:1px solid transparent}
.nav.scrolled{background:#0b0506d9;backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px);border-color:#3c222680;height:62px}
.nav-brand{display:flex;align-items:center;gap:12px;text-decoration:none;font:600 15px/1 var(--label);letter-spacing:3px;text-transform:uppercase}
.nav-brand img{width:40px;height:40px;border-radius:4px;box-shadow:0 4px 18px #0008}
.nav-links{display:flex;align-items:center;gap:30px}
.nav-links a{position:relative;text-decoration:none;font:500 13px/1 var(--label);letter-spacing:2.4px;text-transform:uppercase;color:#e6d8bd;transition:color .25s}
.nav-links a:not(.nav-steam)::after{content:"";position:absolute;left:0;right:0;bottom:-8px;height:1px;background:var(--brass);transform:scaleX(0);transition:transform .35s var(--ease)}
.nav-links a:hover{color:#fff}
.nav-links a:hover::after{transform:scaleX(1)}
.nav-steam{display:inline-flex;align-items:center;gap:9px;padding:10px 16px;border:1px solid #c9a45c88;border-radius:2px;color:var(--brass-hi)!important;background:#c9a45c12}
.nav-steam:hover{background:#c9a45c26}
.nav-steam svg,.hero-steam svg{width:18px;height:18px;fill:currentColor}
.nav-toggle{display:none;width:44px;height:44px;border:0;background:none;position:relative}
.nav-toggle i{position:absolute;left:11px;right:11px;height:1.5px;background:var(--ivory);transition:transform .3s}
.nav-toggle i:first-child{top:18px}.nav-toggle i:last-child{top:25px}
.nav-toggle[aria-expanded=true] i:first-child{transform:translateY(3.5px) rotate(45deg)}
.nav-toggle[aria-expanded=true] i:last-child{transform:translateY(-3.5px) rotate(-45deg)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:54px;padding:0 30px;border-radius:2px;border:1px solid transparent;text-decoration:none;font:500 14px/1 var(--label);letter-spacing:2.6px;text-transform:uppercase;transition:transform .3s var(--ease),box-shadow .3s,background .3s,color .3s}
.btn svg{width:18px;height:18px;fill:currentColor}
.btn-gold{background:linear-gradient(180deg,#f3dca4,#c9a45c 55%,#a8823d);color:#1b0c0a;box-shadow:0 10px 40px #c9a45c33,inset 0 1px 0 #fff6}
.btn-gold:hover{transform:translateY(-2px);box-shadow:0 16px 50px #c9a45c55,inset 0 1px 0 #fff8}
.btn-line{border-color:#f3e9d655;color:var(--ivory);background:#0b050633;backdrop-filter:blur(6px)}
.btn-line:hover{border-color:var(--brass);color:var(--brass-hi);transform:translateY(-2px)}
.btn.is-soon{cursor:default;opacity:.85;filter:saturate(.7)}
.btn.is-soon:hover{transform:none}

/* hero */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;justify-content:center;text-align:center;padding:120px var(--pad) 140px;overflow:hidden;isolation:isolate}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transform:scale(1.06);animation:heroZoom 24s ease-in-out infinite alternate}
@keyframes heroZoom{to{transform:scale(1.14)}}
.hero-shade{position:absolute;inset:0;z-index:-1;background:
  radial-gradient(ellipse 70% 60% at 50% 48%,#0b050633 0%,#0b0506aa 70%,#0b0506 100%),
  linear-gradient(180deg,#0b0506cc 0%,#0b050644 30%,#0b050655 65%,#0b0506 100%)}
.hero-inner{max-width:1100px}
.kicker{display:inline-flex;align-items:center;gap:18px;margin:0 0 26px;font:500 13px/1 var(--label);letter-spacing:5px;text-transform:uppercase;color:var(--brass-hi)}
.kicker span{width:54px;height:1px;background:linear-gradient(90deg,transparent,var(--brass))}
.kicker span:last-child{transform:scaleX(-1)}
.hero-title{margin:0;font:900 clamp(64px,13.5vw,212px)/.86 var(--display);letter-spacing:-.02em;text-shadow:0 20px 80px #000}
.hero-title .gold{filter:drop-shadow(0 6px 30px #000c)}
.hero-sub{margin:28px auto 42px;max-width:30em;font:italic 500 clamp(20px,2.3vw,30px)/1.4 var(--display);color:#efe2c9;text-shadow:0 4px 24px #000}
.hero-cta{display:flex;flex-wrap:wrap;gap:14px;justify-content:center}
.hero-steam{position:absolute;left:var(--pad);bottom:44px;display:flex;align-items:center;gap:14px;text-decoration:none;color:var(--ivory);font:500 15px/1.2 var(--label);letter-spacing:2px;text-transform:uppercase;text-align:left}
.hero-steam svg{width:34px;height:34px;color:var(--brass-hi)}
.hero-steam small{display:block;font:400 11px/1.4 var(--label);letter-spacing:2.5px;color:var(--muted)}
.scroll-cue{position:absolute;left:50%;bottom:34px;width:26px;height:44px;margin-left:-13px;border:1px solid #f3e9d677;border-radius:14px}
.scroll-cue span{position:absolute;left:50%;top:9px;width:3px;height:9px;margin-left:-1.5px;border-radius:2px;background:var(--brass-hi);animation:cue 2s var(--ease) infinite}
@keyframes cue{0%{opacity:0;transform:translateY(0)}30%{opacity:1}100%{opacity:0;transform:translateY(16px)}}

/* ticker */
.ticker{position:relative;overflow:hidden;border-block:1px solid var(--line);background:linear-gradient(90deg,#1b0d10,#2a0f15 50%,#1b0d10);padding:18px 0}
.ticker-track{display:flex;width:max-content;animation:ticker 90s linear infinite}
.ticker-track span{display:inline-flex;align-items:center;gap:28px;padding-right:28px;white-space:nowrap;font:italic 500 22px/1 var(--display);color:#ead8b4}
.ticker-track span::after{content:"✦";font:normal 12px/1 var(--body);color:var(--brass)}
@keyframes ticker{to{transform:translateX(-50%)}}

/* sections */
main section{position:relative;padding:clamp(90px,12vw,170px) var(--pad) 0}
.label{display:inline-flex;align-items:center;gap:14px;margin:0 0 20px;font:500 13px/1 var(--label);letter-spacing:4.5px;text-transform:uppercase;color:var(--brass)}
.label::before{content:"";width:34px;height:1px;background:var(--brass)}
h2{margin:0 0 26px;font:700 clamp(38px,5.4vw,78px)/1.04 var(--display);letter-spacing:-.015em;color:#fbf2df}
h2 em{font-weight:500}
section p{color:#d9c9ab;max-width:36em}
.section-head{max-width:1280px;margin:0 auto 56px}
.center{text-align:center}
.center p,.section-head.center p{margin-left:auto;margin-right:auto}
.section-head.center .label::after{content:"";width:34px;height:1px;background:var(--brass)}
.note{font-size:14px;color:var(--muted)!important}
p.note.center{max-width:none;margin:30px auto 0}

/* about */
.about{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(30px,6vw,100px);align-items:center;max-width:1380px;margin:0 auto}
.about-year{font:900 clamp(110px,15vw,270px)/1 var(--display);letter-spacing:-.04em;font-variant-numeric:lining-nums;color:transparent;-webkit-text-stroke:1.5px #c9a45c99;background:linear-gradient(180deg,transparent 0 56%,#f6dfa6 56%,#c9a45c 78%,#8c6a2e 100%);-webkit-background-clip:text;background-clip:text;user-select:none}
.about-copy b{color:var(--ivory);font-weight:700}
.about-copy{position:relative}
.about-sign{position:absolute;right:-20px;top:-70px;width:150px;transform:rotate(6deg);filter:drop-shadow(0 20px 40px #000c)}
.about-sign img{width:100%;height:auto;border-radius:4px}

/* features */
.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;max-width:1500px;margin:0 auto}
.feature{position:relative;min-height:540px;overflow:hidden;border:1px solid var(--line);background:var(--ink-3);display:flex;align-items:flex-end;isolation:isolate}
.feature img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform 1.2s var(--ease),filter 1.2s;filter:saturate(.85) brightness(.8)}
.feature::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,#0b050600 20%,#0b0506d9 62%,#0b0506 100%)}
.feature:hover img{transform:scale(1.08);filter:saturate(1.05) brightness(.95)}
.feature-body{padding:30px 28px 34px}
.num{display:block;margin-bottom:16px;font:500 13px/1 var(--label);letter-spacing:3px;color:var(--brass)}
.feature h3{margin:0 0 12px;min-height:2.3em;display:flex;align-items:flex-end;font:700 27px/1.15 var(--display);color:#fbf2df}
.feature p{min-height:4.95em}
.feature p{margin:0;font-size:15.5px;line-height:1.65;color:#cdbb9c}

/* welcome */
.welcome{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(36px,7vw,120px);align-items:center;max-width:1320px;margin:0 auto}
.arch{position:relative;aspect-ratio:4/5;border-radius:999px 999px 6px 6px;overflow:hidden;border:1px solid #c9a45c77;box-shadow:0 0 0 10px var(--ink),0 0 0 11px #c9a45c33,0 40px 100px #000c}
.arch video{width:100%;height:100%;object-fit:cover;object-position:60% 30%}
.arch::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,#0b0506aa);pointer-events:none}
blockquote{margin:40px 0 0;padding:6px 0 6px 28px;border-left:2px solid var(--wine-2);font:italic 500 clamp(22px,2.4vw,32px)/1.35 var(--display);color:#f6e7c7}
blockquote cite{display:block;margin-top:14px;font:400 12px/1 var(--label);font-style:normal;letter-spacing:3px;text-transform:uppercase;color:var(--muted)}

/* stats */
.stats{display:grid;grid-template-columns:repeat(4,1fr);max-width:1320px;margin:0 auto;padding-top:clamp(90px,10vw,150px)!important}
.stat{padding:34px 20px;text-align:center;border-inline-start:1px solid var(--line)}
.stat:first-child{border:0}
.stat b{display:block;font:900 clamp(46px,6vw,86px)/1 var(--display);background:var(--gold-grad);-webkit-background-clip:text;background-clip:text;color:transparent;font-variant-numeric:lining-nums tabular-nums}
.stat span{display:block;margin-top:12px;font:500 12px/1.4 var(--label);letter-spacing:3px;text-transform:uppercase;color:var(--muted)}

/* gallery */
.bento{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:clamp(170px,17vw,270px);grid-auto-flow:dense;gap:14px;max-width:1500px;margin:0 auto}
.shot{position:relative;padding:0;border:1px solid var(--line);background:var(--ink-3);overflow:hidden}
.shot.s-wide{grid-column:span 2;grid-row:span 2}
.shot.s-tall{grid-row:span 2}
.shot img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease),filter 1s;filter:brightness(.88)}
.shot span{position:absolute;left:18px;bottom:16px;font:500 12px/1 var(--label);letter-spacing:3px;text-transform:uppercase;color:#f6e3b4;text-shadow:0 2px 10px #000,0 0 2px #000;z-index:1}
.shot::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,#0b0506cc);pointer-events:none}
.shot:hover img,.shot:focus-visible img{transform:scale(1.06);filter:brightness(1.02)}
.shot:focus-visible{outline:2px solid var(--brass);outline-offset:3px}

/* recipes */
.recipes .section-head{max-width:900px}
.dish-rows{display:grid;gap:22px;overflow:hidden;margin:0 calc(var(--pad) * -1) 56px;mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.dish-row{display:flex;gap:22px;width:max-content;animation:dishes 140s linear infinite}
.dish-row.reverse{animation-direction:reverse;animation-duration:160s}
.dish-rows:hover .dish-row{animation-play-state:paused}
@keyframes dishes{to{transform:translateX(-50%)}}
.dish{flex:0 0 190px;text-align:center}
.dish-orb{width:170px;height:170px;margin:0 auto 14px;border-radius:50%;overflow:hidden;background:#f1ebe0;border:3px solid #c9a45c;box-shadow:0 0 0 6px var(--ink),0 0 0 7px #c9a45c44,0 22px 40px #000a}
.dish-orb img{width:100%;height:100%;object-fit:cover;transform:scale(1.08)}
.dish b{display:flex;align-items:center;justify-content:center;font:500 17px/1.25 var(--display);color:#f3e6ca;height:2.5em;overflow:hidden}
.dish small{display:block;margin-top:4px;font:400 11px/1 var(--label);letter-spacing:2px;text-transform:uppercase;color:var(--muted)}

/* trailer */
.screen{position:relative;max-width:1320px;margin:0 auto 22px;aspect-ratio:16/9;border:1px solid #c9a45c55;background:#000;box-shadow:0 0 0 12px var(--ink-2),0 0 0 13px var(--line),0 60px 140px #000}
.screen video{width:100%;height:100%;object-fit:cover}
.screen-play{position:absolute;inset:0;margin:auto;width:118px;height:118px;border-radius:50%;border:1px solid #f3dca4aa;background:#0b050699;backdrop-filter:blur(8px);display:grid;place-items:center;transition:transform .4s var(--ease),background .3s}
.screen-play svg{width:40px;height:40px;fill:var(--brass-hi);margin-left:6px}
.screen-play::before{content:"";position:absolute;inset:-14px;border-radius:50%;border:1px solid #c9a45c55;animation:pulse 2.4s var(--ease) infinite}
@keyframes pulse{0%{transform:scale(.9);opacity:1}100%{transform:scale(1.35);opacity:0}}
.screen-play:hover{transform:scale(1.07);background:#6e1420cc}
.screen.playing .screen-play{opacity:0;pointer-events:none}

/* steam */
.steam{padding-bottom:clamp(90px,12vw,170px)!important}
.steam-card{position:relative;max-width:1100px;margin:0 auto;padding:clamp(50px,7vw,100px) clamp(24px,6vw,90px);text-align:center;overflow:hidden;border:1px solid #c9a45c55;background:
  radial-gradient(ellipse at 50% -20%,#8f1d2b88,transparent 60%),
  radial-gradient(ellipse at 50% 130%,#c9a45c22,transparent 60%),var(--ink-3)}
.steam-card::before{content:"";position:absolute;inset:14px;border:1px solid #c9a45c2a;pointer-events:none}
.steam-card h2{font-size:clamp(46px,7vw,104px)}
.steam-card p{margin:0 auto}
.steam-card .label::after{content:"";width:34px;height:1px;background:var(--brass)}
.steam-logo{display:block;width:64px;height:64px;margin:0 auto 26px;fill:var(--brass-hi);filter:drop-shadow(0 8px 30px #c9a45c66)}
.steam-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin-top:40px}

/* footer */
.footer{display:grid;justify-items:center;gap:22px;padding:60px var(--pad) 70px;border-top:1px solid var(--line);text-align:center;background:var(--ink-2)}
.footer img{width:72px;height:72px;border-radius:4px}
.footer nav{display:flex;flex-wrap:wrap;justify-content:center;gap:26px}
.footer nav a{text-decoration:none;font:500 12px/1 var(--label);letter-spacing:3px;text-transform:uppercase;color:#d9c9ab}
.footer nav a:hover{color:var(--brass-hi)}
.footer p{margin:0;max-width:40em;font-size:13px;color:#8e7c62}

/* lightbox */
.lightbox{position:fixed;inset:0;z-index:90;display:grid;grid-template-columns:80px 1fr 80px;align-items:center;background:#070304f2;backdrop-filter:blur(10px)}
.lightbox[hidden]{display:none}
.lightbox figure{margin:0;display:grid;justify-items:center;gap:16px}
.lightbox img{max-height:84vh;width:auto;border:1px solid var(--line);box-shadow:0 40px 120px #000}
.lightbox figcaption{font:500 13px/1 var(--label);letter-spacing:3px;text-transform:uppercase;color:var(--brass-hi)}
.lb-close{position:absolute;top:14px;right:18px;width:52px;height:52px;border:0;background:none;font:300 44px/1 var(--body);color:var(--ivory)}
.lb-nav{height:100%;border:0;background:none;font:300 64px/1 var(--display);color:#f3e9d6aa}
.lb-nav:hover,.lb-close:hover{color:var(--brass-hi)}

/* reveal */
.reveal{opacity:0;transform:translateY(34px);transition:opacity 1s var(--ease),transform 1s var(--ease);transition-delay:var(--d,0s)}
.reveal.in{opacity:1;transform:none}
.no-js .reveal{opacity:1;transform:none}

/* responsive */
@media (max-width:1180px){
  .feature-grid{grid-template-columns:repeat(2,1fr)}
  .feature{min-height:440px}
  .about-sign{width:120px;top:-40px;right:0}
}
@media (max-width:900px){
  .nav-toggle{display:block;z-index:2}
  .nav-links{position:fixed;inset:0;flex-direction:column;justify-content:center;gap:34px;background:#0b0506f7;opacity:0;pointer-events:none;transition:opacity .35s}
  .nav-links.open{opacity:1;pointer-events:auto}
  .nav-links a{font-size:17px}
  .about,.welcome{grid-template-columns:1fr}
  .about-year{font-size:clamp(96px,30vw,200px)}
  .about-sign{position:static;width:130px;margin-top:30px;transform:rotate(-4deg)}
  .welcome .arch{max-width:420px;width:100%;margin:0 auto}
  .stats{grid-template-columns:repeat(2,1fr)}
  .stat:nth-child(3){border:0}
  .stat{border-top:1px solid var(--line)}
  .stat:nth-child(-n+2){border-top:0}
  .bento{grid-template-columns:repeat(2,1fr);grid-auto-rows:clamp(150px,38vw,240px)}
  .hero-steam{left:0;right:0;margin-inline:auto;width:max-content;bottom:96px;white-space:nowrap}
  .hero{padding-bottom:190px}
  .lightbox{grid-template-columns:44px 1fr 44px}
  .lb-nav{font-size:44px}
}
@media (max-width:620px){
  body{font-size:16px}
  .feature-grid{grid-template-columns:1fr}
  .feature{min-height:400px}
  .bento{grid-template-columns:1fr 1fr}
  .shot.s-wide{grid-column:span 2;grid-row:span 1}
  .shot.s-tall{grid-row:span 1}
  .dish{flex-basis:140px}
  .dish-orb{width:124px;height:124px}
  .kicker{letter-spacing:2.5px;font-size:11px;white-space:nowrap}
  .kicker span{display:none}
  .scroll-cue{display:none}
  .hero-steam{bottom:44px}
  .hero{padding-bottom:140px}
  .feature p{min-height:0}
  .btn{width:100%;padding-inline:14px;letter-spacing:2px}
  .hero-cta{flex-direction:column}
  .screen{box-shadow:0 0 0 6px var(--ink-2),0 0 0 7px var(--line),0 30px 70px #000}
  .screen-play{width:84px;height:84px}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .grain,.hero-video,.ticker-track,.dish-row,.scroll-cue span,.screen-play::before{animation:none}
  .reveal{opacity:1;transform:none;transition:none}
}
