/* ============================================================
   REDEFIN/ED — Design system
   Display: Jost (geometric, wide-tracked — matches the brand's
   existing POUR/ED · SHUCK/ED · CREAT/ED wordmark lockups)
   Body/UI: Outfit
   ============================================================ */

:root{
  --ink:#1c1b18;
  --ink-soft:#3a372f;
  --muted:#6f6a5f;
  --cream:#ffffff;
  --paper:#ffffff;
  --line:#ebe9e4;
  --line-strong:#dad7d0;

  --sage:#6f8f72;
  --sage-deep:#4d6950;
  --sage-tint:#e7ede4;

  --lavender:#a287e7;
  --lavender-deep:#7457c9;
  --lavender-tint:#efe9fb;

  --amber:#e8a23a;
  --amber-deep:#b97a1f;
  --amber-tint:#faeed9;

  --accent:var(--sage);
  --accent-deep:var(--sage-deep);
  --accent-tint:var(--sage-tint);

  --radius-lg:2rem;
  --radius-md:1.1rem;
  --radius-sm:0.6rem;

  --ease:cubic-bezier(.16,1,.3,1);
  --shadow-soft:0 20px 40px -22px rgba(28,27,24,.18);
  --shadow-lift:0 30px 60px -20px rgba(28,27,24,.28);
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
html,body{margin:0;padding:0;}
body{
  background:var(--cream);
  color:var(--ink);
  font-family:'Outfit',ui-sans-serif,system-ui,sans-serif;
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{list-style:none;margin:0;padding:0;}
button{font-family:inherit;}
::selection{background:var(--ink);color:var(--cream);}

.container{
  width:100%;
  max-width:1320px;
  margin-inline:auto;
  padding-inline:clamp(1.25rem,4vw,3rem);
}

/* ---------- Typography ---------- */
h1,h2,h3,h4{
  font-family:'Jost',ui-sans-serif,system-ui,sans-serif;
  margin:0;
  font-weight:600;
  letter-spacing:-0.01em;
  line-height:0.98;
}
p{margin:0;}
.lede{
  font-size:clamp(1.05rem,1.6vw,1.35rem);
  color:var(--ink-soft);
  max-width:44ch;
  line-height:1.55;
}
.body-muted{color:var(--muted);max-width:60ch;}

/* Wordmark motif: WORD/SUFFIX — the brand's signature lockup
   (regular weight, wide tracking — matches the original logo art) */
.wordmark{
  font-family:'Jost',sans-serif;
  text-transform:uppercase;
  font-weight:400;
  letter-spacing:.06em;
  display:inline-block;
  white-space:nowrap;
}
.wordmark .slash{
  color:var(--ink);
  opacity:.55;
  font-weight:300;
  padding-inline:.06em;
}
.wordmark .suffix{color:var(--accent);font-weight:400;}

.display{
  font-size:clamp(2.75rem,7.5vw,6.5rem);
  letter-spacing:-0.02em;
}
.display-xl{
  font-size:clamp(3.5rem,11vw,10rem);
  letter-spacing:-0.01em;
  line-height:.92;
}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;
  align-items:center;
  gap:.6rem;
  padding:.95rem 1.7rem;
  border-radius:100px;
  font-family:'Jost',sans-serif;
  font-weight:500;
  text-transform:uppercase;
  letter-spacing:.08em;
  font-size:.78rem;
  border:1px solid var(--ink);
  background:var(--ink);
  color:var(--cream);
  cursor:pointer;
  transition:transform .45s var(--ease),background .35s ease,color .35s ease,border-color .35s ease;
  will-change:transform;
}
.btn:hover{transform:translateY(-3px);}
.btn:active{transform:translateY(-1px) scale(.98);}
.btn svg{width:1em;height:1em;transition:transform .35s var(--ease);}
.btn:hover svg{transform:translateX(3px);}

.btn-outline{
  background:transparent;
  color:var(--ink);
  border-color:var(--ink);
}
.btn-accent{
  background:var(--accent-deep);
  border-color:var(--accent-deep);
  color:#fff;
}
.btn-ghost{
  background:transparent;
  border-color:rgba(250,246,239,.4);
  color:var(--cream);
}
.btn-ghost:hover{border-color:var(--cream);}

/* ---------- Header ---------- */
.site-header{
  position:fixed;
  top:0;left:0;right:0;
  z-index:100;
  padding-block:1.35rem;
  transition:padding .4s var(--ease),background .4s var(--ease),box-shadow .4s var(--ease),border-color .4s var(--ease);
  border-bottom:1px solid transparent;
}
.site-header{
  --header-fg:var(--cream);
  --header-fg-soft:rgba(250,246,239,.78);
  --header-line:rgba(250,246,239,.3);
}
.site-header.is-scrolled,
.site-header.on-light{
  --header-fg:var(--ink);
  --header-fg-soft:var(--ink-soft);
  --header-line:var(--line-strong);
}
.site-header.is-scrolled{
  padding-block:.85rem;
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(14px) saturate(1.4);
  -webkit-backdrop-filter:blur(14px) saturate(1.4);
  border-bottom-color:var(--line);
  box-shadow:0 10px 30px -20px rgba(28,27,24,.25);
}
.site-header .container{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1.5rem;
}
.brand{
  font-family:'Jost',sans-serif;
  font-weight:400;
  text-transform:uppercase;
  letter-spacing:.05em;
  font-size:1.15rem;
  color:var(--header-fg);
  transition:color .4s var(--ease);
}
.brand .slash{opacity:.5;font-weight:300;}
.brand .suffix{color:var(--accent-deep);}
.brand small{
  display:block;
  font-family:'Outfit',sans-serif;
  text-transform:none;
  letter-spacing:.02em;
  font-weight:400;
  font-size:.62rem;
  color:var(--header-fg-soft);
  margin-top:.1rem;
  transition:color .4s var(--ease);
}

.nav-links{
  display:flex;
  align-items:center;
  gap:clamp(1rem,2vw,2.1rem);
  font-family:'Jost',sans-serif;
  font-size:.82rem;
  text-transform:uppercase;
  letter-spacing:.07em;
}
.nav-links a{
  position:relative;
  padding-block:.3rem;
  color:var(--header-fg-soft);
  transition:color .3s ease;
}
.nav-links a::after{
  content:'';
  position:absolute;left:0;right:100%;bottom:0;
  height:1.5px;background:var(--accent-deep);
  transition:right .35s var(--ease);
}
.nav-links a:hover{color:var(--header-fg);}
.nav-links a:hover::after,
.nav-links a.is-active::after{right:0;}
.nav-links a.is-active{color:var(--header-fg);}
.nav-links a.btn::after{content:none;}
.nav-links a.btn{
  color:var(--header-fg);
  border-color:var(--header-line);
  transition:color .4s var(--ease),border-color .4s var(--ease),transform .45s var(--ease);
}
.nav-links a.btn:hover{color:var(--header-fg);transform:translateY(-3px);}

.header-tools{display:flex;align-items:center;gap:.9rem;}
.lang-toggle{
  display:flex;
  border:1px solid var(--header-line);
  border-radius:100px;
  padding:3px;
  font-family:'Jost',sans-serif;
  font-size:.7rem;
  letter-spacing:.06em;
  transition:border-color .4s var(--ease);
}
.lang-toggle button{
  border:none;background:transparent;
  padding:.35rem .65rem;
  border-radius:100px;
  cursor:pointer;
  color:var(--header-fg-soft);
  transition:background .3s ease,color .3s ease;
}
.lang-toggle button.is-active{
  background:var(--ink);
  color:var(--cream);
}
.nav-toggle{
  display:none;
  width:44px;height:44px;
  align-items:center;justify-content:center;
  border-radius:50%;
  border:1px solid var(--header-line);
  background:transparent;
  cursor:pointer;
  transition:border-color .4s var(--ease);
}
.nav-toggle span{
  position:relative;
  width:16px;height:1px;background:var(--header-fg);
  display:block;
  transition:background .4s var(--ease);
}
.nav-toggle span::before,.nav-toggle span::after{
  content:'';position:absolute;left:0;width:16px;height:1px;background:var(--header-fg);transition:transform .3s ease,background .4s var(--ease);
}
.nav-toggle span::before{top:-5px;}
.nav-toggle span::after{top:5px;}

@media (max-width:900px){
  .nav-links{
    position:fixed;
    inset:0 0 0 auto;
    width:min(78vw,340px);
    height:100dvh;
    background:var(--paper);
    flex-direction:column;
    align-items:flex-start;
    justify-content:center;
    gap:1.6rem;
    padding:2rem clamp(1.5rem,6vw,2.5rem);
    font-size:1.1rem;
    transform:translateX(100%);
    transition:transform .5s var(--ease);
    box-shadow:-30px 0 60px -30px rgba(0,0,0,.3);
  }
  .nav-links.is-open{transform:translateX(0);}
  .nav-links a{color:var(--ink-soft);}
  .nav-links a:hover,.nav-links a.is-active{color:var(--ink);}
  .nav-links a.btn{color:var(--ink);border-color:var(--ink);}
  .nav-links a.btn:hover{color:var(--ink);}
  .nav-toggle{display:inline-flex;}
  body.nav-open{overflow:hidden;}
  /* Keep the toggle icon readable once the white drawer is open,
     regardless of the header's transparent/hero state underneath. */
  body.nav-open .nav-toggle{background:var(--paper);border-color:var(--line-strong);}
  body.nav-open .nav-toggle span,
  body.nav-open .nav-toggle span::before,
  body.nav-open .nav-toggle span::after{background:var(--ink);}
}

/* ---------- Sections / rhythm ---------- */
section{position:relative;}
.section{padding-block:clamp(4.5rem,9vw,8rem);}
.section-tight{padding-block:clamp(3rem,6vw,5rem);}

/* ---------- Entrance animations (Iron Rail style: 1s ease, from sides / up / zoom, staggered) ---------- */
.reveal,.reveal-scale{opacity:0;}
.anim{opacity:0;}
.hero-content > :not(.anim-in){opacity:0;}
.anim-in{opacity:1;animation-duration:1s;animation-timing-function:ease;animation-fill-mode:backwards;animation-delay:var(--ad,0s);}
.anim-in.anim-fade-up{animation-name:an-fade-up;}
.anim-in.anim-fade-down{animation-name:an-fade-down;}
.anim-in.anim-fade-left{animation-name:an-fade-left;}
.anim-in.anim-fade-right{animation-name:an-fade-right;}
.anim-in.anim-fade-in{animation-name:an-fade-in;}
.anim-in.anim-zoom-in{animation-name:an-zoom-in;}
.anim-in.anim-slide-up{animation-name:an-slide-up;}
@keyframes an-fade-up{0%{opacity:0;transform:translate3d(0,50%,0);}100%{opacity:1;transform:translate3d(0,0,0);}}
@keyframes an-fade-down{0%{opacity:0;transform:translate3d(0,-50%,0);}100%{opacity:1;transform:translate3d(0,0,0);}}
@keyframes an-fade-left{0%{opacity:0;transform:translate3d(-50%,0,0);}100%{opacity:1;transform:translate3d(0,0,0);}}
@keyframes an-fade-right{0%{opacity:0;transform:translate3d(50%,0,0);}100%{opacity:1;transform:translate3d(0,0,0);}}
@keyframes an-fade-in{0%{opacity:0;}100%{opacity:1;}}
@keyframes an-zoom-in{0%{opacity:0;transform:scale3d(.3,.3,.3);}50%{opacity:1;}}
@keyframes an-slide-up{0%{transform:translate3d(0,50%,0);}100%{transform:translate3d(0,0,0);}}
@media (prefers-reduced-motion:reduce){
  .reveal,.reveal-scale,.anim,.hero-content > *{opacity:1 !important;animation:none !important;}
}

/* ---------- Hero shell w/ floating garnish parallax ---------- */
.hero{
  min-height:100dvh;
  display:flex;
  align-items:center;
  position:relative;
  overflow:hidden;
  padding-top:6rem;
}
.hero-bottom{align-items:flex-end;padding-bottom:clamp(3rem,8vh,5rem);}
.hero-bg{
  position:absolute;inset:0;
  z-index:0;
}
.hero-bg img,.hero-bg video{
  width:100%;height:100%;object-fit:cover;
  transform:scale(1.02);
  will-change:transform;
}
.hero-bg video.hero-video{object-position:40% 50%;display:block;}
.hero-bg img.about-photo{object-position:50% 100%;}
@media (min-aspect-ratio:11/10){.hero-bg img.about-photo{object-position:50% 66%;}}
.hero-bg img.pour-photo{object-position:50% 0%;}
@media (min-aspect-ratio:11/10){.hero-bg img.pour-photo{object-position:50% 52%;}}
.hero-bg::after{
  content:'';
  position:absolute;inset:0;
  background:
    linear-gradient(180deg,rgba(15,14,12,.62) 0%, rgba(15,14,12,.18) 16%, rgba(28,27,24,.4) 55%, rgba(28,27,24,.8) 100%);
}
.hero-content{position:relative;z-index:2;}

/* ---------- Wordmark hero lockup ---------- */
.hero-wordmark{
  font-family:'Jost',sans-serif;
  text-transform:uppercase;
  font-weight:400;
  letter-spacing:.02em;
  color:var(--cream);
  font-size:clamp(3.6rem,13vw,11.5rem);
  line-height:.9;
}
.hero-wordmark .slash{opacity:.6;font-weight:300;}
.hero-wordmark .suffix{color:var(--accent);font-weight:400;}

/* ---------- Feature rows (zig-zag, not 3-col cards) ---------- */
.feature-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:clamp(2rem,5vw,5rem);
  align-items:center;
}
.feature-row.reverse .feature-media{order:2;}
.feature-media{
  position:relative;
  border-radius:var(--radius-lg);
  overflow:hidden;
  aspect-ratio:4/5;
  box-shadow:var(--shadow-soft);
}
.feature-media img{width:100%;height:100%;object-fit:cover;transform:scale(1.02);}
.feature-media .tag{
  position:absolute;
  bottom:1.4rem;left:1.4rem;
  background:rgba(250,246,239,.92);
  backdrop-filter:blur(6px);
  padding:.55rem 1rem;
  border-radius:100px;
  font-family:'Jost',sans-serif;
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--ink);
}
.feature-list{margin-top:1.6rem;display:grid;gap:.85rem;}
.feature-list li{
  display:flex;
  gap:.85rem;
  align-items:flex-start;
  color:var(--ink-soft);
  font-size:.98rem;
}
.feature-list li::before{
  content:'';
  flex:none;
  width:7px;height:7px;
  margin-top:.55em;
  border-radius:50%;
  background:var(--accent-deep);
}

@media (max-width:860px){
  .feature-row,.feature-row.reverse{grid-template-columns:1fr;}
  .feature-row.reverse .feature-media{order:0;}
}

/* ---------- Stat / color block strip ---------- */
.stat-strip{
  background:var(--paper);
  color:var(--ink);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  padding:clamp(2.5rem,6vw,4.5rem);
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:2rem;
  position:relative;
  overflow:hidden;
}
.stat-strip .stat{text-align:left;}
.stat-strip .num{
  font-family:'Jost',sans-serif;
  font-weight:600;
  font-size:clamp(2.6rem,5.5vw,4.2rem);
  color:var(--accent-deep);
  line-height:1;
}
.stat-strip .label{
  margin-top:.6rem;
  font-size:.85rem;
  text-transform:uppercase;
  letter-spacing:.1em;
  color:var(--muted);
}
@media (max-width:700px){
  .stat-strip{grid-template-columns:1fr;gap:1.8rem;}
}

/* ---------- Scroll story (sticky text + edge-to-edge sliding image) ----------
   Progressive enhancement: base styles show every slide stacked, full-width
   image above its text. JS adds .is-enhanced (desktop only) to switch on the
   sticky pin + crossfade + sliding-image mechanics. */
.scrollstory-track{position:relative;}
.scrollstory-sticky{
  display:flex;
  flex-direction:column;
  gap:clamp(3rem,7vw,5rem);
  padding-block:clamp(2rem,5vw,3rem);
}
.scrollstory-text{
  position:relative;
  display:flex;
  flex-direction:column;
  gap:1.4rem;
  padding-inline:clamp(1.25rem,4vw,3rem);
}
.scrollstory-dots{display:none;}
.scrollstory-slides{position:relative;}
.scrollstory-slide{
  display:flex;
  flex-direction:column;
  gap:2rem;
}
.scrollstory-slide + .scrollstory-slide{margin-top:clamp(3rem,7vw,5rem);}
.scrollstory-slide h2,.scrollstory-slide h3{font-size:clamp(2.2rem,4.4vw,3.4rem);}
.scrollstory-slide p{max-width:46ch;color:var(--ink-soft);font-size:clamp(1rem,1.4vw,1.15rem);}
.scrollstory-slide-img{
  width:100vw;
  margin-left:calc(50% - 50vw);
  aspect-ratio:16/10;
  object-fit:cover;
  display:block;
}
.scrollstory-media{display:none;}
.scrollstory-media-track{height:100%;}
.scrollstory-media-slide{height:100%;width:100%;}
.scrollstory-media-slide img{width:100%;height:100%;object-fit:cover;display:block;}

/* Desktop scrollytelling mode */
.scrollstory.is-enhanced .scrollstory-sticky{
  position:sticky;
  top:0;
  height:100vh;
  overflow:hidden;
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-rows:100vh;
  gap:0;
  padding-block:0;
}
.scrollstory.is-enhanced .scrollstory-text,
.scrollstory.is-enhanced .scrollstory-media{min-height:0;}
.scrollstory.is-enhanced .scrollstory-text{
  justify-content:center;
  padding:clamp(2rem,6vw,5rem);
  height:100%;
}
.scrollstory.is-enhanced .scrollstory-dots{
  display:flex;
  position:absolute;
  top:clamp(6.5rem,10vw,8rem);
  left:clamp(2rem,6vw,5rem);
  gap:.5rem;
}
.scrollstory-dots button{
  height:4px;
  width:26px;
  border-radius:2px;
  border:none;
  padding:0;
  background:var(--line-strong);
  cursor:pointer;
  transition:width .4s var(--ease),background .4s ease;
}
.scrollstory-dots button.is-active{width:46px;background:var(--accent-deep);}
.scrollstory.is-enhanced .scrollstory-slides{min-height:14rem;}
.scrollstory-slide > .btn{margin-top:auto;}
.scrollstory.is-enhanced .scrollstory-slide{
  position:absolute;
  inset:0;
  justify-content:flex-start;
  opacity:0;
  transform:translateY(16px);
  pointer-events:none;
  transition:opacity .6s var(--ease),transform .6s var(--ease);
  margin-top:0 !important;
}
.scrollstory.is-enhanced .scrollstory-slide.is-active{opacity:1;transform:none;pointer-events:auto;}
.scrollstory.is-enhanced .scrollstory-slide-img{display:none;}
.scrollstory.is-enhanced .scrollstory-media{
  display:block;width:100%;margin-left:0;height:100%;aspect-ratio:auto;
  position:relative;overflow:hidden;
}
.scrollstory.is-enhanced .scrollstory-media-track{will-change:transform;transition:transform .7s var(--ease);}
.scrollstory.is-enhanced .scrollstory-media-slide{height:100vh;}

/* Mobile scrollytelling: image on top, compact text card below, panel starts under the fixed header */
@media (max-width:860px){
  .scrollstory.is-enhanced .scrollstory-sticky{
    top:4.75rem;
    height:calc(100svh - 4.75rem);
    grid-template-columns:1fr;
    grid-template-rows:var(--ss-img,30svh) 1fr;
  }
  .scrollstory.is-enhanced .scrollstory-media{order:1;}
  .scrollstory.is-enhanced .scrollstory-media-slide{height:var(--ss-img,30svh);}
  .scrollstory.is-enhanced .scrollstory-text{
    order:2;
    padding:1rem clamp(1.25rem,5vw,2rem) 1.25rem;
    justify-content:flex-start;
    gap:.75rem;
    overflow:hidden;
  }
  .scrollstory.is-enhanced .scrollstory-dots{position:static;}
  .scrollstory.is-enhanced .scrollstory-slide{gap:.8rem;}
  .scrollstory.is-enhanced .scrollstory-slide h2,
  .scrollstory.is-enhanced .scrollstory-slide h3{font-size:clamp(1.4rem,6.5vw,1.8rem);}
  .scrollstory.is-enhanced .scrollstory-slide p{font-size:.9rem;line-height:1.45;}
  .scrollstory.is-enhanced .scrollstory-slide .feature-list{margin-top:0;gap:.35rem;}
  .scrollstory.is-enhanced .scrollstory-slide .feature-list li{font-size:.86rem;line-height:1.4;}
  .scrollstory.is-enhanced .scrollstory-slide > .btn{padding:.75rem 1.3rem;}
}

/* ---------- Homepage service rows ---------- */
.service-row{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,6vw,6rem);align-items:center;}
.service-row + .service-row{margin-top:clamp(4rem,9vw,8rem);}
.service-row.reverse .feature-media{order:2;}
.service-row .wordmark{font-size:clamp(2.4rem,5vw,4rem);}
.feature-list li > span > b{display:block;font-family:'Jost',sans-serif;font-weight:500;letter-spacing:.04em;text-transform:uppercase;font-size:.82rem;color:var(--ink);margin-bottom:.15rem;}
@media (max-width:860px){.service-row,.service-row.reverse{grid-template-columns:1fr;}.service-row.reverse .feature-media{order:0;}}

/* ---------- Tabs (clear format breakdown) ---------- */
.tabs-nav{
  display:flex;
  gap:.65rem;
  flex-wrap:wrap;
  margin-bottom:2.5rem;
}
.tab-btn{
  padding:.85rem 1.5rem;
  border-radius:100px;
  border:1px solid var(--line-strong);
  background:var(--paper);
  font-family:'Jost',sans-serif;
  font-weight:500;
  font-size:.88rem;
  color:var(--ink-soft);
  cursor:pointer;
  transition:background .3s ease,color .3s ease,border-color .3s ease,transform .3s var(--ease);
}
.tab-btn:hover{border-color:var(--accent-deep);color:var(--ink);}
.tab-btn.is-active{
  background:var(--accent-deep);
  border-color:var(--accent-deep);
  color:#fff;
}
.tab-panel{display:none;}
.tab-panel.is-active{display:block;animation:tab-in .5s var(--ease);}
@keyframes tab-in{
  from{opacity:0;transform:translateY(10px);}
  to{opacity:1;transform:none;}
}

/* ---------- Menu / product bento ---------- */
.menu-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1.6rem;
}
.menu-card{
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:var(--radius-md);
  padding:1.4rem;
  transition:transform .5s var(--ease),box-shadow .5s var(--ease);
}
.menu-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-soft);}
.menu-card .thumb{
  aspect-ratio:1/1;
  border-radius:var(--radius-sm);
  overflow:hidden;
  background:var(--accent-tint);
  margin-bottom:1.1rem;
}
.menu-card .thumb img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease);}
.menu-card:hover .thumb img{transform:scale(1.07);}
.menu-card h3{font-size:1.2rem;text-transform:none;letter-spacing:0;font-weight:600;}
.menu-card p{color:var(--muted);font-size:.88rem;margin-top:.4rem;}
.menu-card .flavor{
  display:inline-block;
  margin-top:.7rem;
  font-family:'Jost',sans-serif;
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.08em;
  color:var(--accent-deep);
  font-style:italic;
}
@media (max-width:900px){.menu-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:560px){.menu-grid{grid-template-columns:1fr;}}

/* ---------- Drinks menu (Pour/ed) ---------- */
.drinks{border-bottom:1px solid var(--line);}
.drinks-group{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,2.4fr);
  gap:clamp(1.5rem,4vw,4rem);
  padding-block:clamp(2rem,4vw,3.25rem);
  border-top:1px solid var(--line);
}
.drinks-group-head h3{font-size:clamp(1.4rem,2.4vw,1.9rem);}
.drinks-group-head .sub{color:var(--muted);margin-top:.5rem;max-width:30ch;}
.drinks-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.75rem 2.5rem;align-content:start;}
.drink{display:grid;grid-template-columns:84px 1fr;gap:1.4rem;align-items:center;}
.drink .thumb{width:84px;height:128px;display:flex;align-items:flex-end;justify-content:center;}
.drink .thumb img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;}
.drink h4{font-family:'Jost',sans-serif;font-weight:500;font-size:1rem;letter-spacing:.06em;text-transform:uppercase;color:var(--ink);}
.drink p{color:var(--muted);font-size:.92rem;line-height:1.5;margin-top:.2rem;}
.drink .flavor{display:block;margin-top:.35rem;font-family:'Jost',sans-serif;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-deep);}
.drinks-note{color:var(--muted);font-size:.95rem;align-self:center;max-width:40ch;}
.menu-promise{
  margin-top:clamp(2.5rem,5vw,4rem);
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.6fr) auto;
  gap:clamp(1.25rem,3vw,3rem);
  align-items:center;
  padding:clamp(1.75rem,3vw,2.5rem);
  background:#f8f8f7;
  border-radius:var(--radius-md);
}
.menu-promise h3{font-size:clamp(1.3rem,2.2vw,1.7rem);}
.menu-promise .feature-list{margin-top:0;}
@media (max-width:1000px){.drinks-group{grid-template-columns:1fr;}}
@media (max-width:860px){
  .menu-promise{grid-template-columns:1fr;}
  .menu-promise .btn{justify-self:start;}
}
@media (max-width:640px){.drinks-list{grid-template-columns:1fr;}}

/* ---------- Quote / pull ---------- */
.pull-quote{
  font-family:'Jost',sans-serif;
  font-size:clamp(1.5rem,3.4vw,2.4rem);
  line-height:1.35;
  max-width:34ch;
  color:var(--ink);
}
.pull-quote::before{content:'\201C';color:var(--accent-deep);}
.pull-quote::after{content:'\201D';color:var(--accent-deep);}

.quote-card{
  background:var(--ink);
  border-radius:var(--radius-lg);
  padding:clamp(2.5rem,6vw,4.5rem);
  position:relative;
  overflow:hidden;
}
.quote-card .pull-quote{
  color:var(--cream);
  max-width:44ch;
}
.quote-card .pull-quote::before,
.quote-card .pull-quote::after{color:var(--accent);}

/* ---------- About: behind the bar ---------- */
.about-story{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:clamp(2rem,5vw,5rem);align-items:start;}
.about-story h2{max-width:none;}
@media (max-width:860px){.about-story{grid-template-columns:1fr;}}
.about-copy{display:flex;flex-direction:column;gap:1.25rem;}
.about-copy .lede,.about-copy p{max-width:none;}
.about-signature{font-family:'Jost',sans-serif;text-transform:uppercase;letter-spacing:.12em;font-size:.85rem;color:var(--accent-deep);}
.about-quote{max-width:none;font-size:clamp(1.3rem,2.2vw,1.75rem);margin-top:.75rem;padding-top:1.6rem;border-top:1px solid var(--line);}

/* ---------- Numbered differentiators (card grid) ---------- */
.numbered-list{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(1rem,2.5vw,2.25rem);
}
.numbered-row{
  display:grid;
  grid-template-columns:auto 1fr;
  column-gap:1.1rem;
  row-gap:1.5rem;
  align-items:center;
  align-content:start;
  padding:clamp(1.75rem,3vw,2.6rem);
  background:#f8f8f7;
  border-radius:var(--radius-md);
  transition:box-shadow .4s ease,background .4s ease;
}
.numbered-row:hover{background:#fff;box-shadow:0 18px 40px -18px rgba(28,27,24,.18);}
.numbered-row .n{
  font-family:'Jost',sans-serif;
  font-weight:500;
  font-size:clamp(1.8rem,2.6vw,2.2rem);
  line-height:1;
  color:var(--accent);
}
.numbered-row > div:not(.n){display:flex;flex-direction:column-reverse;gap:.45rem;}
.numbered-row h3{
  font-size:clamp(1.2rem,1.8vw,1.5rem);
  text-transform:none;
  letter-spacing:-.01em;
  line-height:1.2;
}
.numbered-row .tag{
  font-family:'Jost',sans-serif;
  font-size:.74rem;
  text-transform:uppercase;
  letter-spacing:.14em;
  color:var(--accent);
  display:block;
}
.numbered-row p{grid-column:1 / -1;color:var(--muted);line-height:1.75;}
@media (max-width:1000px){.numbered-list{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:640px){.numbered-list{grid-template-columns:1fr;}}

/* ---------- Zig-zag "perfect for" rows already covered by feature-row ---------- */

/* ---------- CTA band (also usable as a plain card) ---------- */
.cta-band{
  border-radius:var(--radius-lg);
  padding:clamp(2.5rem,6vw,4rem);
  background:var(--accent-tint);
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:2rem;
}
.cta-band h2{font-size:clamp(1.8rem,4vw,2.6rem);max-width:16ch;}

/* ---------- CTA (light split: text left, photo right, no filter) ---------- */
.cta-full{
  position:relative;
  overflow:hidden;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  align-items:stretch;
  min-height:clamp(24rem,60vh,40rem);
  background:#fff;
  border-top:1px solid var(--line);
}
.cta-full-bg{
  order:2;
  position:relative;
  margin:clamp(.75rem,1.6vw,1.5rem) clamp(.75rem,1.6vw,1.5rem) clamp(.75rem,1.6vw,1.5rem) 0;
  border-radius:var(--radius-lg);
  overflow:hidden;
  min-height:300px;
}
.cta-full-bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 64%;}
.cta-full-content{
  order:1;
  align-self:center;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  text-align:left;
  gap:1.4rem;
  width:100%;
  max-width:none;
  margin:0;
  padding:clamp(2.5rem,6vw,5rem) clamp(1.5rem,4vw,4rem) clamp(2.5rem,6vw,5rem) max(clamp(1.5rem,4vw,4rem), calc((100vw - 1200px) / 2 + 1.5rem));
}
.cta-full-content h2{color:var(--ink);font-weight:400;font-size:clamp(2.2rem,4.6vw,3.6rem);max-width:16ch;}
.cta-full-content p{color:var(--muted);max-width:40ch;font-size:clamp(1rem,1.5vw,1.15rem);}
@media (max-width:860px){
  .cta-full{display:flex;flex-direction:column;min-height:0;}
  .cta-full-content{padding:2.5rem 1.25rem 1.5rem;}
  .cta-full-bg{margin:0 1rem 1rem;aspect-ratio:4/3.6;min-height:0;}
}

/* ---------- Footer ---------- */
.site-footer{
  background:var(--paper);
  color:var(--ink-soft);
  padding-block:clamp(3.5rem,7vw,5.5rem) 2rem;
  border-top:1px solid var(--line);
}
.footer-newsletter-full{
  display:flex;
  flex-wrap:wrap;
  align-items:flex-end;
  justify-content:space-between;
  gap:1.5rem 2.5rem;
  padding-bottom:2.2rem;
  margin-bottom:2.2rem;
  border-bottom:1px solid var(--line);
}
.footer-newsletter-full h4{
  font-family:'Jost',sans-serif;
  text-transform:uppercase;
  letter-spacing:.1em;
  font-size:.78rem;
  color:var(--muted);
  margin-bottom:.5rem;
}
.footer-newsletter-full p{color:var(--muted);font-size:.92rem;max-width:40ch;}
.footer-newsletter-full form{
  display:flex;
  align-items:center;
  gap:1.2rem;
  border-bottom:1px solid var(--line-strong);
  padding-bottom:.6rem;
  min-width:280px;
  flex:1;
  max-width:380px;
}
.footer-newsletter-full input{
  background:transparent;border:none;color:var(--ink);
  font-family:'Outfit',sans-serif;font-size:.9rem;flex:1;outline:none;min-width:0;
}
.footer-newsletter-full input::placeholder{color:var(--muted);}
.footer-newsletter-full button{
  background:none;border:none;color:var(--accent-deep);cursor:pointer;
  font-family:'Jost',sans-serif;font-size:.78rem;text-transform:uppercase;letter-spacing:.08em;
  white-space:nowrap;
}

.footer-top{
  display:grid;
  grid-template-columns:1.4fr 1fr 1fr;
  gap:3rem;
  padding-bottom:3rem;
  border-bottom:1px solid var(--line);
}
.footer-brand .brand{color:var(--ink);}
.footer-brand p{margin-top:1.1rem;color:var(--muted);max-width:34ch;font-size:.92rem;}
.footer-col h4{
  font-family:'Jost',sans-serif;
  text-transform:uppercase;
  letter-spacing:.1em;
  font-size:.78rem;
  color:var(--muted);
  margin-bottom:1.1rem;
}
.footer-col ul{display:grid;gap:.65rem;font-size:.92rem;}
.footer-col a{color:var(--ink-soft);transition:color .3s ease;}
.footer-col a:hover{color:var(--accent-deep);}
.footer-bottom{
  display:flex;flex-wrap:wrap;gap:1.2rem;
  justify-content:space-between;
  padding-top:1.8rem;
  font-size:.78rem;
  color:var(--muted);
}
.footer-bottom .legal{display:flex;gap:1.4rem;flex-wrap:wrap;}
@media (max-width:900px){
  .footer-top{grid-template-columns:1fr 1fr;}
  .footer-newsletter-full{flex-direction:column;align-items:stretch;}
  .footer-newsletter-full form{max-width:none;}
}
@media (max-width:560px){
  .footer-top{grid-template-columns:1fr;}
}
@media (max-width:560px){
  .footer-top{grid-template-columns:1fr;}
}

.ig-link{display:inline-flex;align-items:center;gap:.5rem;}
.ig-icon{width:1.15em;height:1.15em;flex:none;}
.footer-ig{margin-top:1.1rem;color:var(--ink-soft);font-size:.92rem;transition:color .3s ease;}
.footer-ig:hover{color:var(--accent-deep);}

/* ---------- Forms ---------- */
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;}
.field{display:flex;flex-direction:column;gap:.5rem;}
.field.full{grid-column:1/-1;}
.field label{
  font-family:'Jost',sans-serif;
  font-size:.72rem;
  text-transform:uppercase;
  letter-spacing:.1em;
  color:var(--muted);
}
.field input,.field select,.field textarea{
  border:1px solid var(--line-strong);
  background:var(--paper);
  border-radius:var(--radius-sm);
  padding:.85rem 1rem;
  font-family:'Outfit',sans-serif;
  font-size:.96rem;
  color:var(--ink);
  outline:none;
  transition:border-color .3s ease,box-shadow .3s ease;
}
.field input:focus,.field select:focus,.field textarea:focus{
  border-color:var(--accent-deep);
  box-shadow:0 0 0 4px var(--accent-tint);
}
.field textarea{resize:vertical;min-height:110px;}
.field .error{font-size:.78rem;color:#b3402f;min-height:1em;}
.checkbox-group{display:flex;flex-wrap:wrap;gap:.7rem;}
.checkbox-group label{
  display:flex;align-items:center;gap:.55rem;
  border:1px solid var(--line-strong);
  border-radius:100px;
  padding:.55rem 1rem;
  font-size:.85rem;
  font-family:'Outfit',sans-serif;
  text-transform:none;
  letter-spacing:0;
  color:var(--ink-soft);
  cursor:pointer;
  transition:border-color .3s ease,background .3s ease;
}
.checkbox-group input{accent-color:var(--accent-deep);}
.checkbox-group label:has(input:checked){
  border-color:var(--accent-deep);
  background:var(--accent-tint);
}
.form-note{font-size:.78rem;color:var(--muted);margin-top:1rem;}
.consent-check{
  display:flex;
  align-items:flex-start;
  gap:.7rem;
  cursor:pointer;
  font-size:.86rem;
  line-height:1.5;
  color:var(--ink-soft);
}
.consent-check input{
  margin-top:.2rem;
  flex:none;
  accent-color:var(--accent-deep);
  width:16px;height:16px;
}
.consent-check a{color:var(--accent-deep);text-decoration:underline;}
.form-success{
  display:none;
  text-align:center;
  padding:3rem 1.5rem;
  border:1px dashed var(--accent-deep);
  border-radius:var(--radius-md);
  background:var(--accent-tint);
}
.form-success.is-visible{display:block;}
.form-success h3{font-size:1.6rem;margin-bottom:.6rem;}

@media (max-width:700px){
  .form-grid{grid-template-columns:1fr;}
}

/* ---------- Utility ---------- */
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4rem);}
@media (max-width:860px){.grid-2{grid-template-columns:1fr;}}
@media (min-width:861px){.book-sidebar{position:sticky;top:7rem;}}
.align-end{align-items:end;}
.mt-1{margin-top:1rem;}
.mt-2{margin-top:2rem;}
.mt-3{margin-top:3rem;}
.text-center{text-align:center;margin-inline:auto;}
.sr-only{
  position:absolute;
  width:1px;height:1px;
  padding:0;margin:-1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap;
  border:0;
}

/* ---------- Cookie consent bar ---------- */
.cookie-bar{
  position:fixed;
  left:0;right:0;bottom:0;
  z-index:200;
  background:var(--paper);
  color:var(--ink-soft);
  border-top:1px solid var(--line);
  padding:1.4rem clamp(1.25rem,4vw,3rem);
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:1.2rem 2rem;
  box-shadow:0 -12px 30px -20px rgba(28,27,24,.18);
  transform:translateY(100%);
  transition:transform .5s var(--ease);
}
.cookie-bar.is-visible{transform:translateY(0);}
.cookie-bar-text p{margin:0;max-width:62ch;font-size:.92rem;line-height:1.55;}
.cookie-bar-text a{color:var(--accent-deep);text-decoration:underline;}
.cookie-bar-actions{display:flex;gap:.75rem;flex-wrap:wrap;flex:none;}
.cookie-bar-actions .btn-accent:hover{background:var(--accent-deep);border-color:var(--accent-deep);}
@media (max-width:640px){
  .cookie-bar{flex-direction:column;align-items:stretch;}
  .cookie-bar-actions{justify-content:stretch;}
  .cookie-bar-actions .btn{flex:1;justify-content:center;}
}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;}
  html{scroll-behavior:auto;}
}

/* Live form integration states */
.form-inline-status{display:block;min-height:1.2em;margin-top:.5rem;font-size:.82rem;grid-column:1/-1;}
.form-submit-status{min-height:1.4em;margin-top:1rem;font-size:.92rem;}
.form-inline-status.is-error,.form-submit-status.is-error{color:#b3402f;}
.form-inline-status.is-success,.form-submit-status.is-success{color:#2d6a4f;}
.checkbox-group.has-error{outline:1px solid #b3402f;outline-offset:6px;border-radius:2px;}
form button[disabled]{opacity:.65;cursor:wait;}