/* Logan's Alley — shared styles for all pages */
:root{
  --burgundy:#5C1230;
  --burgundy-lift:#6E1A3B;
  --amber:#D4A843;
  --amber-bright:#E6BC5C;
  --linen:#F0EDEA;
  --linen-soft:rgba(240,237,234,0.72);
  --slate:#1A1A22;
  --slate-2:#2A2A35;
  --slate-3:#22222C;
  --slate-line:rgba(240,237,234,0.08);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{background-color:#1A1A22;scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  background-color:#1A1A22;
  color:var(--linen);
  font-family:'Jost',-apple-system,BlinkMacSystemFont,sans-serif;
  font-weight:400;font-size:16px;line-height:1.55;
  overflow-x:hidden;
  padding-top:env(safe-area-inset-top,0px);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
body::after{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:998;opacity:0.04;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 0.92  0 0 0 0 0.78  0 0 0 0.6 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  mix-blend-mode:screen;
}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}
h1,h2,h3,h4,h5{font-family:'Zilla Slab',Georgia,serif;font-weight:600;line-height:1.08;letter-spacing:-0.01em}
.container{max-width:1320px;margin:0 auto;padding:0 clamp(20px,4vw,56px)}

/* NAV */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:1000;
  background-color:#1A1A22;
  transition:background-color 320ms ease-out,border-color 320ms ease-out,backdrop-filter 320ms ease-out;
  padding:
    calc(18px + env(safe-area-inset-top,0px))
    calc(clamp(20px,4vw,56px) + env(safe-area-inset-right,0px))
    18px
    calc(clamp(20px,4vw,56px) + env(safe-area-inset-left,0px));
  border-bottom:1px solid var(--slate-line);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.nav.transparent{background-color:transparent;border-bottom-color:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
.nav.scrolled{background-color:#1A1A22;border-bottom-color:var(--burgundy);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.nav-inner{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:32px;max-width:1400px;margin:0 auto}
.logo{
  display:flex;align-items:center;gap:10px;
  font-family:'Zilla Slab',serif;font-weight:700;
  color:var(--linen);font-size:22px;letter-spacing:0.01em;
  justify-self:start;white-space:nowrap;
}
.logo > span:last-child{white-space:nowrap}
.logo-mark{
  width:34px;height:34px;border-radius:6px;background:var(--burgundy);
  display:grid;place-items:center;color:var(--amber);font-family:'Zilla Slab',serif;font-weight:700;font-size:22px;line-height:1;
  box-shadow:inset 0 0 0 1px rgba(212,168,67,0.25);flex-shrink:0;
}
.logo-mark span{transform:translateY(-1px)}
.nav-links{display:flex;gap:34px;justify-self:center;align-items:center}
.nav-links a{
  position:relative;font-family:'Jost',sans-serif;font-weight:500;font-size:14px;letter-spacing:0.12em;text-transform:uppercase;
  color:var(--linen);padding:6px 0;
}
.nav-links a::after{content:"";position:absolute;left:0;bottom:-2px;height:2px;width:0;background:var(--burgundy);transition:width 220ms ease-out}
.nav-links a:hover::after,.nav-links a.active::after{width:100%}
.nav-links a.active{color:var(--amber)}
.nav-cta{
  justify-self:end;display:inline-flex;align-items:center;gap:8px;
  padding:12px 22px;background-color:var(--amber);color:var(--slate);
  font-family:'Jost',sans-serif;font-weight:600;font-size:13px;letter-spacing:0.14em;text-transform:uppercase;
  border-radius:2px;transition:transform 200ms ease-out,background-color 200ms ease-out;
  position:relative;overflow:hidden;
}
.nav-cta::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(circle at center,var(--amber-bright) 0%,var(--amber) 60%);
  transform:scale(0);transition:transform 260ms ease-out;z-index:0;
}
.nav-cta:hover::before{transform:scale(2.4)}
.nav-cta span,.nav-cta svg{position:relative;z-index:1}
.nav-cta svg{width:12px;height:12px;flex-shrink:0}
.nav-burger{display:none;justify-self:end;width:40px;height:40px;border-radius:4px;background:transparent;border:1px solid var(--slate-line);color:var(--linen);align-items:center;justify-content:center}
.nav-burger span{display:block;width:18px;height:2px;background:var(--linen);position:relative}
.nav-burger span::before,.nav-burger span::after{content:"";position:absolute;left:0;width:18px;height:2px;background:var(--linen);transition:transform 220ms ease-out}
.nav-burger span::before{top:-6px}
.nav-burger span::after{top:6px}

/* Drawer */
.drawer{
  position:fixed;top:0;right:0;bottom:0;width:min(420px,100vw);
  background-color:#1A1A22;transform:translateX(100%);transition:transform 320ms ease-out;z-index:1100;
  padding:calc(90px + env(safe-area-inset-top,0px)) calc(32px + env(safe-area-inset-right,0px)) 32px 32px;
  border-left:1px solid var(--slate-line);display:flex;flex-direction:column;gap:4px;
}
.drawer.open{transform:translateX(0)}
.drawer-close{position:absolute;top:calc(20px + env(safe-area-inset-top,0px));right:24px;width:40px;height:40px;display:grid;place-items:center;color:var(--linen);border-radius:4px;border:1px solid var(--slate-line)}
.drawer a{font-family:'Zilla Slab',serif;font-weight:600;font-size:28px;color:var(--linen);padding:14px 0;border-bottom:1px solid var(--slate-line);display:flex;align-items:center;justify-content:space-between}
.drawer a.drawer-cta{margin-top:20px;background:var(--amber);color:var(--slate);padding:16px 20px;border-radius:2px;border:none;font-size:18px;text-transform:uppercase;letter-spacing:0.14em;font-family:'Jost',sans-serif;font-weight:600;justify-content:center;gap:10px}
.drawer-backdrop{position:fixed;inset:0;background:rgba(10,10,14,0.6);opacity:0;pointer-events:none;transition:opacity 260ms ease-out;z-index:1050;backdrop-filter:blur(4px)}
.drawer-backdrop.open{opacity:1;pointer-events:auto}

/* Section kicker */
.section-kicker{
  font-family:'Jost',sans-serif;font-size:12px;font-weight:500;
  color:var(--amber);letter-spacing:0.36em;text-transform:uppercase;
  margin-bottom:14px;display:flex;align-items:center;gap:12px;
}
.section-kicker::before{content:"";width:28px;height:1px;background:var(--amber);flex-shrink:0}
.section-title{font-family:'Zilla Slab',serif;font-weight:600;font-size:clamp(28px,3.4vw,46px);color:var(--linen);letter-spacing:-0.01em}
.section-title .amber{color:var(--amber)}
.section-header{display:flex;align-items:baseline;justify-content:space-between;gap:24px;margin-bottom:36px;flex-wrap:wrap}

/* CASK COUNTDOWN (shared — used on index + beers + inline variant on specials) */
.cask,.cask-feature{background-color:var(--slate);padding:clamp(64px,10vh,120px) 0;border-top:1px solid var(--slate-line);border-bottom:1px solid var(--slate-line);position:relative}
.cask::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,transparent 0%,var(--burgundy) 25%,var(--amber) 50%,var(--burgundy) 75%,transparent 100%);opacity:0.5}
.cask-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,96px);align-items:center}
.cask-section-label{font-family:'Jost',sans-serif;font-size:12px;font-weight:500;color:var(--amber);letter-spacing:0.36em;text-transform:uppercase;margin-bottom:18px;display:flex;align-items:center;gap:12px}
.cask-section-label::before{content:"";width:28px;height:1px;background:var(--amber)}
.cask-brewery{font-family:'Jost',sans-serif;font-size:14px;font-weight:600;color:var(--amber);letter-spacing:0.24em;text-transform:uppercase;margin-bottom:10px}
.cask-beer-name{font-family:'Zilla Slab',serif;font-weight:600;font-size:clamp(40px,5.5vw,72px);color:var(--linen);line-height:1.02;letter-spacing:-0.02em;margin-bottom:14px}
.cask-style{font-family:'Jost',sans-serif;font-size:14px;color:var(--linen-soft);letter-spacing:0.06em}
.cask-note{margin-top:24px;font-family:'Jost',sans-serif;font-style:italic;font-size:13px;color:var(--linen-soft);padding-top:20px;border-top:1px solid var(--slate-line)}
.cask-timer{display:flex;gap:clamp(8px,1.4vw,20px);justify-content:center;margin-bottom:24px}
.cask-unit{display:flex;flex-direction:column;align-items:center;min-width:0}
.cask-flipgroup{display:flex;gap:4px}
.cask-digit{
  position:relative;
  width:clamp(42px,5vw,74px);height:clamp(60px,7.2vw,108px);
  background:linear-gradient(180deg,#1E1E28 0%,#141418 50%,#1E1E28 100%);
  border-radius:6px;border:1px solid rgba(212,168,67,0.18);
  box-shadow:inset 0 1px 0 rgba(255,255,255,0.04),inset 0 0 24px rgba(0,0,0,0.5),0 2px 8px rgba(0,0,0,0.4);
  overflow:hidden;font-family:'Zilla Slab',serif;font-weight:600;font-size:clamp(38px,5vw,72px);
  color:var(--amber);display:grid;place-items:center;line-height:1;
}
.cask-digit::before{content:"";position:absolute;top:50%;left:0;right:0;height:1px;background:rgba(0,0,0,0.45);z-index:2;box-shadow:0 -1px 0 rgba(255,255,255,0.03)}
.cask-digit-inner{position:relative;z-index:1;display:inline-block;transition:transform 380ms cubic-bezier(0.25,0.46,0.45,0.94)}
.cask-digit.flip .cask-digit-inner{animation:digit-flip 380ms ease-out}
@keyframes digit-flip{
  0%{transform:translateY(0) scaleY(1)}
  40%{transform:translateY(-18%) scaleY(0.6);opacity:0.5}
  60%{transform:translateY(18%) scaleY(0.6);opacity:0.5}
  100%{transform:translateY(0) scaleY(1);opacity:1}
}
.cask-unit-label{font-family:'Jost',sans-serif;font-size:11px;font-weight:500;color:var(--linen-soft);letter-spacing:0.28em;text-transform:uppercase;margin-top:14px}
.cask-separator{font-family:'Zilla Slab',serif;font-size:clamp(38px,5vw,72px);color:var(--burgundy);align-self:flex-start;margin:0 -2px}
.cask-bottom-note{text-align:center;font-family:'Jost',sans-serif;font-style:italic;font-size:13px;color:var(--linen-soft);letter-spacing:0.08em;margin-top:18px}

/* FOOTER */
.footer{background-color:var(--slate);padding:clamp(56px,8vh,96px) 0 clamp(28px,4vh,48px);border-top:1px solid var(--slate-line)}
.footer-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr 1fr 1.3fr;gap:clamp(28px,3vw,48px);margin-bottom:48px}
.footer h4{font-family:'Jost',sans-serif;font-weight:500;font-size:11px;color:var(--amber);letter-spacing:0.28em;text-transform:uppercase;margin-bottom:18px}
.footer-brand .logo{margin-bottom:14px;font-size:22px}
.footer-brand p{font-family:'Jost',sans-serif;font-style:italic;font-size:14px;color:var(--linen-soft);line-height:1.55;max-width:36ch}
.footer-list{display:flex;flex-direction:column;gap:10px}
.footer-list a,.footer-contact a{font-family:'Jost',sans-serif;font-size:14px;color:var(--linen);display:inline-flex;align-items:center;gap:6px}
.footer-list a:hover,.footer-contact a:hover{color:var(--amber)}
.footer a svg{width:11px;height:11px;opacity:0.7;flex-shrink:0}
.footer-hours{font-family:'Jost',sans-serif;font-size:13px;color:var(--linen);line-height:1.7}
.footer-hours-note{font-style:italic;font-size:12px;color:var(--linen-soft);margin-top:10px}
.footer-contact{display:flex;flex-direction:column;gap:10px}
.footer-cask{background:var(--slate-3);border:1px solid var(--burgundy);padding:16px;border-radius:2px;display:flex;flex-direction:column;gap:6px}
.footer-cask-label{font-family:'Jost',sans-serif;font-weight:500;font-size:10px;color:var(--amber);letter-spacing:0.28em;text-transform:uppercase}
.footer-cask-time{font-family:'Zilla Slab',serif;font-weight:600;font-size:20px;color:var(--linen);line-height:1.1}
.footer-cask-time.hot{color:var(--amber)}
.footer-cask-sub{font-family:'Jost',sans-serif;font-style:italic;font-size:12px;color:var(--linen-soft)}
.footer-bottom{padding-top:28px;border-top:1px solid var(--slate-line);display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-family:'Jost',sans-serif;font-size:12px;color:var(--linen-soft)}

/* Toast CTA band */
.toast{background-color:var(--burgundy);padding:clamp(56px,8vh,88px) 0;text-align:center;position:relative;overflow:hidden}
.toast::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 30% 40%,rgba(212,168,67,0.08) 0%,transparent 60%),radial-gradient(circle at 70% 60%,rgba(212,168,67,0.05) 0%,transparent 50%);pointer-events:none}
.toast h2{font-family:'Zilla Slab',serif;font-weight:600;font-size:clamp(32px,4.2vw,54px);color:var(--linen);letter-spacing:-0.01em;margin-bottom:8px}
.toast p{font-family:'Jost',sans-serif;font-size:15px;color:rgba(240,237,234,0.84);margin-bottom:26px}
.toast-cta{display:inline-flex;align-items:center;gap:10px;padding:16px 32px;background:var(--amber);color:var(--slate);font-family:'Jost',sans-serif;font-weight:600;font-size:14px;letter-spacing:0.14em;text-transform:uppercase;border-radius:2px;position:relative;overflow:hidden}
.toast-cta::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at center,var(--amber-bright),var(--amber) 60%);transform:scale(0);transition:transform 300ms ease-out}
.toast-cta:hover::before{transform:scale(2.4)}
.toast-cta span,.toast-cta svg{position:relative;z-index:1}
.toast-cta svg{width:14px;height:14px;flex-shrink:0}

/* Scroll reveal */
.reveal > .container{opacity:0;transform:translateY(18px);transition:opacity 720ms ease-out,transform 720ms ease-out}
.reveal.visible > .container{opacity:1;transform:translateY(0)}
.reveal-strip{opacity:0;transition:opacity 720ms ease-out 120ms}
.reveal.visible .reveal-strip,.reveal-strip.visible{opacity:1}

/* Responsive */
@media (max-width:960px){
  .cask-grid{grid-template-columns:1fr;gap:56px}
  .footer-grid{grid-template-columns:1fr 1fr;gap:36px}
  .footer-cask{grid-column:span 2}
  .footer-brand{grid-column:span 2}
}
@media (max-width:680px){
  .nav-inner{grid-template-columns:1fr auto;gap:16px}
  .nav-links{display:none}
  .nav-cta{display:none}
  .nav-burger{display:inline-flex;grid-column:2;justify-self:end}
  .footer-grid{grid-template-columns:1fr}
  .footer-cask{grid-column:auto}
  .footer-brand{grid-column:auto}
  .section-header{flex-direction:column;align-items:flex-start}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:0.01ms !important;transition-duration:0.01ms !important}
}