/* ============================================================
   THE PURPLE BLEND — v3: premium light/lavender theme
   Purple #4a1c4c · White #ffffff · Soft Lavender #EADFF2 · Dark Grey #2C2A2E
   Secondary brand: Magenta #852076 · Gold #e1a900 (sparing signature accent)
   Display: Fraunces · Body: Inter
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300;0,9..144,400;0,9..144,500;0,9..144,600;1,9..144,400&family=Inter:wght@300;400;500;600&display=swap');

:root{
  --white:#ffffff;
  --bg-soft:#faf6fc;
  --lavender:#ecdff5;
  --lavender-deep:#d3b3e6;
  --purple:#4a1c4c;
  --magenta:#852076;
  --gold:#e1a900;
  --ink:#2c2a2e;
  --ink-soft:#5c5561;
  --line: rgba(74,28,76,0.12);
  --line-strong: rgba(74,28,76,0.22);
  --shadow: 0 24px 60px -24px rgba(74,28,76,0.28);

  --display:'Fraunces', serif;
  --body:'Inter', sans-serif;
  --max: 1200px;
  --ease: cubic-bezier(.4,0,.2,1);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--white);
  color:var(--ink);
  font-family:var(--body);
  font-weight:300;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}

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

::selection{background:var(--lavender-deep);color:var(--purple);}
a:focus-visible, button:focus-visible, .btn:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible{
  outline:2px solid var(--purple);
  outline-offset:3px;
}
.skip-link{
  position:absolute; left:-9999px; top:0; z-index:200; background:var(--purple); color:var(--white);
  padding:14px 22px; font-size:0.85rem; border-radius:0 0 4px 0;
}
.skip-link:focus{left:0;}

.wrap{max-width:var(--max); margin:0 auto; padding:0 40px;}
@media (max-width:700px){ .wrap{padding:0 22px;} }

h1,h2,h3,h4{
  font-family:var(--display);
  font-weight:400;
  margin:0 0 .4em;
  letter-spacing:-0.01em;
  color:var(--purple);
}
h1{font-size:clamp(2.3rem,5vw,3.9rem); line-height:1.08; font-weight:400;}
h2{font-size:clamp(1.7rem,3.2vw,2.4rem); font-weight:400;}
h3{font-size:1.12rem; font-weight:500; font-family:var(--body); letter-spacing:0.01em; color:var(--ink);}
p{margin:0 0 1em; color:var(--ink-soft); font-weight:300;}

.eyebrow{
  font-family:var(--body); text-transform:uppercase; letter-spacing:0.2em; font-size:0.68rem;
  color:var(--magenta); font-weight:600; display:inline-block; margin-bottom:1.1em;
}
.lede{font-size:1.08rem; max-width:48ch; font-weight:300; color:var(--ink-soft);}

/* ---------- announcement bar ---------- */
.topbar{
  background:var(--purple); color:var(--white); text-align:center; font-size:0.72rem;
  letter-spacing:0.08em; text-transform:uppercase; padding:9px 10px;
}

/* ---------- header / nav ---------- */
header.site{
  position:sticky; top:0; z-index:50; background:rgba(255,255,255,0.92);
  backdrop-filter:blur(14px); border-bottom:1px solid var(--line);
}
.nav{display:flex; align-items:center; justify-content:space-between; padding:16px 0; max-width:var(--max); margin:0 auto; padding-left:40px; padding-right:40px;}
@media (max-width:700px){ .nav{padding-left:22px; padding-right:22px;} }
.logo{display:inline-flex; align-items:center; gap:10px;}
.logo-icon{height:30px; width:auto; display:block;}
.logo-img{height:22px; width:auto; display:block;}
footer .logo-icon{height:34px;}
footer .logo-img{height:26px;}

.nav ul{list-style:none; display:flex; gap:34px; margin:0; padding:0; font-size:0.86rem; letter-spacing:0.02em;}
.nav ul a{position:relative; padding-bottom:4px; transition:color .2s; color:var(--ink);}
.nav ul a:hover, .nav ul a.active{color:var(--purple);}
.nav ul a.active{border-bottom:2px solid var(--gold);}
.nav-cta{
  font-size:0.8rem; letter-spacing:0.03em; background:var(--purple); color:var(--white);
  padding:11px 24px; border-radius:3px; transition:background .2s;
}
.nav-cta:hover{background:var(--magenta);}
.burger{display:none; background:none; border:0; color:var(--purple); font-size:1.6rem; cursor:pointer;}

@media (max-width: 900px){
  .nav ul{
    position:fixed; inset:64px 0 0 0; background:var(--white);
    flex-direction:column; padding:36px 22px; gap:26px; font-size:1.08rem;
    transform:translateY(-110%); transition:transform .35s var(--ease); height:calc(100vh - 64px); overflow:auto;
  }
  .nav ul.open{transform:translateY(0);}
  .nav-cta{display:none;}
  .burger{display:block;}
}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:10px; font-family:var(--body); font-size:0.8rem;
  letter-spacing:0.05em; text-transform:uppercase; padding:16px 30px; border-radius:3px;
  border:1px solid transparent; cursor:pointer; font-weight:500; transition:all .25s var(--ease);
}
.btn-solid{background:var(--purple); color:var(--white);}
.btn-solid:hover{background:var(--magenta); transform:translateY(-1px);}
.btn-gold{background:var(--gold); color:var(--purple);}
.btn-gold:hover{background:#f5c132; transform:translateY(-1px);}
.btn-outline{border-color:var(--line-strong); color:var(--purple); background:transparent;}
.btn-outline:hover{border-color:var(--purple); background:var(--bg-soft);}
.btn-outline-dark{border-color:rgba(255,255,255,0.4); color:var(--white);}
.btn-outline-dark:hover{border-color:var(--white); background:rgba(255,255,255,0.08);}
.btn-row{display:flex; gap:16px; flex-wrap:wrap;}

/* ---------- hero ---------- */
/* Full-screen cinematic hero (homepage) */
.hero-full{
  position:relative; height:100svh; min-height:560px; overflow:hidden;
  display:flex; align-items:center; justify-content:center; text-align:center; color:var(--white);
}
.hero-full .hero-bg{position:absolute; inset:0; z-index:0;}
.hero-full .hero-bg img{width:100%; height:100%; object-fit:cover;}
.hero-full .hero-scrim{
  position:absolute; inset:0; z-index:1;
  background:linear-gradient(180deg, rgba(26,10,28,0.55) 0%, rgba(74,28,76,0.55) 55%, rgba(26,10,28,0.78) 100%);
}
.hero-full .hero-content{position:relative; z-index:2; max-width:820px; padding:0 28px;}
.hero-full .eyebrow{color:var(--gold); background:rgba(0,0,0,0.18); padding:6px 16px; border-radius:20px;}
.hero-full h1{color:var(--white); font-size:clamp(2.6rem,6.2vw,4.6rem); line-height:1.06;}
.hero-full .lede{color:rgba(255,255,255,0.88); max-width:52ch; margin:18px auto 34px; font-size:1.15rem;}
.hero-full .btn-row{justify-content:center;}
.hero-full .btn-outline{border-color:rgba(255,255,255,0.55); color:var(--white);}
.hero-full .btn-outline:hover{background:rgba(255,255,255,0.12); border-color:var(--white);}
.scroll-indicator{
  position:absolute; bottom:28px; left:50%; transform:translateX(-50%); z-index:2;
  display:flex; flex-direction:column; align-items:center; gap:8px;
  font-family:var(--body); font-size:0.66rem; letter-spacing:0.18em; text-transform:uppercase; color:rgba(255,255,255,0.75);
}
.scroll-indicator .chevron{
  width:14px; height:14px; border-right:1.5px solid rgba(255,255,255,0.75); border-bottom:1.5px solid rgba(255,255,255,0.75);
  transform:rotate(45deg); animation:tpb-bob 2s ease-in-out infinite;
}
@keyframes tpb-bob{ 0%,100%{transform:rotate(45deg) translate(0,0);} 50%{transform:rotate(45deg) translate(4px,4px);} }
@media (prefers-reduced-motion: reduce){ .scroll-indicator .chevron{animation:none;} }

/* Original split hero — still used on interior pages where relevant */
.hero{position:relative; overflow:hidden; padding:64px 0 0; background:linear-gradient(180deg, var(--bg-soft) 0%, var(--white) 60%);}
.hero .wrap{display:grid; grid-template-columns:1.05fr 0.95fr; gap:60px; align-items:center; padding-top:56px; padding-bottom:56px;}
.hero-photo{position:relative; border-radius:14px; overflow:hidden; box-shadow:var(--shadow); aspect-ratio:4/5;}
.hero-photo img{width:100%; height:100%; object-fit:cover;}
@media (max-width:900px){ .hero .wrap{grid-template-columns:1fr;} .hero-photo{order:-1; aspect-ratio:16/10;} }

/* divider */
.divider{display:flex; align-items:center; gap:18px; max-width:var(--max); margin:0 auto; padding:0 40px;}
@media (max-width:700px){ .divider{padding:0 22px;} }
.divider::before, .divider::after{content:''; flex:1; height:1px; background:var(--line);}
.divider .mark{width:6px; height:6px; background:var(--gold); border-radius:50%;}

/* ---------- sections ---------- */
section{padding:96px 0;}
@media (max-width:700px){ section{padding:60px 0;} }
.section-soft{background:var(--bg-soft);}
.section-purple{background:linear-gradient(155deg, var(--purple) 0%, var(--magenta) 150%); color:var(--white);}
.section-purple h2, .section-purple .eyebrow{color:var(--white);}
.section-purple p{color:rgba(255,255,255,0.82);}
.section-head{max-width:640px; margin-bottom:52px;}
.section-head.center{margin-left:auto; margin-right:auto; text-align:center;}

.grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:28px;}
.grid-2{display:grid; grid-template-columns:1fr 1fr; gap:56px;}
.grid-4{display:grid; grid-template-columns:repeat(4,1fr); gap:20px;}
@media (max-width:900px){ .grid-4{grid-template-columns:repeat(2,1fr);} }
@media (max-width:800px){ .grid-3{grid-template-columns:1fr;} .grid-2{grid-template-columns:1fr; gap:34px;} }

.card{
  background:var(--white); padding:38px 32px; border-radius:14px; border:1px solid var(--line);
  transition:box-shadow .25s, transform .25s;
}
.card:hover{box-shadow:var(--shadow); transform:translateY(-3px);}
.card .num{font-family:var(--body); color:var(--gold); font-size:0.7rem; letter-spacing:0.16em; text-transform:uppercase; display:block; margin-bottom:1.1em; font-weight:600;}

.photo-moment{position:relative; aspect-ratio:21/9; overflow:hidden; border-radius:10px;}
.photo-moment img{width:100%; height:100%; object-fit:cover;}

/* sips / signature food cards */
.sip-row{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
@media (max-width:800px){ .sip-row{grid-template-columns:1fr;} }
.sip{background:var(--white); border:1px solid var(--line); border-radius:14px; padding:40px 30px; transition:box-shadow .25s, transform .25s;}
.sip:hover{box-shadow:var(--shadow); transform:translateY(-3px);}
.sip .tag{font-size:0.68rem; letter-spacing:0.16em; text-transform:uppercase; color:var(--gold); margin-bottom:1em; display:block; font-weight:600;}
.sip h3{font-family:var(--display); font-size:1.35rem; font-weight:400; color:var(--purple); margin-bottom:.3em;}

.pull{font-family:var(--display); font-style:italic; font-weight:400; font-size:clamp(1.5rem,3.2vw,2.3rem); line-height:1.35; margin:0;}

/* reviews */
.review-row{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
@media (max-width:800px){ .review-row{grid-template-columns:1fr;} }
.review{background:var(--white); border:1px solid var(--line); border-radius:14px; padding:32px 28px;}
.review .stars{color:var(--gold); letter-spacing:2px; margin-bottom:14px; font-size:0.9rem;}
.review p{font-style:italic; color:var(--ink);}
.review .who{font-size:0.82rem; color:var(--ink-soft); font-style:normal;}

/* gallery grid */
.gallery-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:14px;}
.gallery-grid img{border-radius:6px; aspect-ratio:1; object-fit:cover;}
@media (max-width:760px){ .gallery-grid{grid-template-columns:repeat(2,1fr);} }

/* menu tables */
.menu-cat{margin-bottom:60px;}
.menu-cat h3{
  font-family:var(--body); text-transform:uppercase; letter-spacing:0.13em; font-size:0.78rem; font-weight:600;
  color:var(--magenta); border-bottom:1px solid var(--line); padding-bottom:14px; margin-bottom:4px;
}
.menu-item{display:flex; justify-content:space-between; gap:20px; padding:15px 0; border-bottom:1px solid var(--line); align-items:center;}
.menu-item.has-thumb{justify-content:flex-start; gap:16px;}
.menu-item.has-thumb > span:not(.price){flex:1;}
.menu-item.has-thumb .price{margin-left:auto; padding-left:16px;}
.menu-thumb{width:64px; height:64px; border-radius:8px; object-fit:cover; flex-shrink:0;}
.menu-item .name{font-family:var(--display); font-size:1.06rem; color:var(--ink); font-weight:400;}
.menu-item .desc{font-size:0.86rem; color:var(--ink-soft); margin-top:4px; font-weight:300; display:block;}
.menu-item .price{font-family:var(--body); color:var(--purple); font-weight:600; white-space:nowrap; padding-top:2px; font-size:0.92rem;}
.menu-note{font-size:0.82rem; color:var(--ink-soft); font-style:italic; margin-top:-16px;}

.tab-row{display:flex; gap:0; margin-bottom:52px; border:1px solid var(--line-strong); border-radius:4px; width:fit-content; overflow:hidden;}
.tab-btn{font-family:var(--body); font-size:0.78rem; letter-spacing:0.04em; text-transform:uppercase; padding:14px 28px; border:0; background:var(--white); color:var(--ink-soft); cursor:pointer; transition:all .2s;}
.tab-btn + .tab-btn{border-left:1px solid var(--line-strong);}
.tab-btn.active{background:var(--purple); color:var(--white);}
.tab-panel{display:none;}
.tab-panel.active{display:block;}

/* FAQ accordion */
.faq-item{border-bottom:1px solid var(--line); padding:22px 0;}
.faq-q{display:flex; justify-content:space-between; align-items:center; cursor:pointer; font-family:var(--display); font-size:1.1rem; color:var(--purple); gap:20px;}
.faq-q .plus{font-size:1.3rem; color:var(--gold); transition:transform .25s;}
.faq-item.open .plus{transform:rotate(45deg);}
.faq-a{max-height:0; overflow:hidden; transition:max-height .3s var(--ease);}
.faq-item.open .faq-a{max-height:300px;}
.faq-a p{padding-top:14px; margin:0;}

/* location */
.map-frame{border-radius:14px; overflow:hidden; border:1px solid var(--line); box-shadow:var(--shadow);}
.info-list{list-style:none; margin:0; padding:0;}
.info-list li{display:grid; grid-template-columns:110px 1fr; gap:14px; padding:16px 0; border-bottom:1px solid var(--line); font-size:0.94rem;}
.info-list .ico{color:var(--magenta); font-family:var(--body); font-size:0.7rem; letter-spacing:0.1em; text-transform:uppercase; padding-top:2px; font-weight:600;}

/* order/reserve tiles */
.order-tile{display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; padding:28px 0; border-bottom:1px solid var(--line);}

/* form */
.field{margin-bottom:22px;}
.field label{font-size:0.72rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--ink-soft); display:block; margin-bottom:8px; font-weight:600;}
.field input, .field textarea, .field select{
  width:100%; padding:13px 14px; border:1px solid var(--line-strong); border-radius:4px; background:var(--white);
  color:var(--ink); font-family:var(--body); font-size:1rem; font-weight:300;
}
.field input:focus, .field textarea:focus, .field select:focus{border-color:var(--purple); outline:none;}
.confirm-box{display:none; background:var(--lavender); border:1px solid var(--lavender-deep); border-radius:8px; padding:22px 24px; margin-top:20px;}
.confirm-box.show{display:block;}

/* sticky mobile action bar */
.mobile-bar{
  display:none; position:fixed; bottom:0; left:0; right:0; z-index:60;
  background:var(--white); border-top:1px solid var(--line); box-shadow:0 -8px 24px rgba(74,28,76,0.12);
}
.mobile-bar-row{display:grid; grid-template-columns:repeat(4,1fr);}
.mobile-bar a{
  display:flex; flex-direction:column; align-items:center; gap:4px; padding:10px 4px 12px;
  font-size:0.66rem; letter-spacing:0.02em; text-transform:uppercase; color:var(--purple); font-weight:600;
  border-right:1px solid var(--line);
}
.mobile-bar a:last-child{border-right:0;}
.mobile-bar .ic{font-size:1.15rem;}
@media (max-width:900px){
  .mobile-bar{display:block;}
  body{padding-bottom:66px;}
}

/* footer */
footer{background:var(--purple); color:rgba(255,255,255,0.88); padding:64px 0 30px;}
.footer-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:48px; margin-bottom:44px;}
footer h4{font-family:var(--body); font-size:0.7rem; text-transform:uppercase; letter-spacing:0.14em; color:var(--gold); font-weight:600; margin-bottom:1.2em;}
footer p{color:rgba(255,255,255,0.72);}
footer ul{list-style:none; margin:0; padding:0;}
footer li{margin-bottom:11px; color:rgba(255,255,255,0.78); font-size:0.92rem;}
footer a:hover{color:var(--gold);}
.footer-bottom{border-top:1px solid rgba(255,255,255,0.16); padding-top:24px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; font-size:0.78rem; color:rgba(255,255,255,0.65);}
.social-row{display:flex; gap:20px;}
@media (max-width:760px){ .footer-grid{grid-template-columns:1fr;} }

/* reveal on scroll */
.reveal{opacity:0; transform:translateY(14px); transition:opacity .7s var(--ease), transform .7s var(--ease);}
.reveal.in{opacity:1; transform:translateY(0);}

/* interior page hero */
.page-hero{padding:64px 0 60px; background:var(--bg-soft);}
.page-hero p{max-width:56ch;}

/* breadcrumb */
.breadcrumb{font-size:0.78rem; color:var(--ink-soft); margin-bottom:18px;}
.breadcrumb a{color:var(--magenta);}
.breadcrumb a:hover{text-decoration:underline;}

/* ---------- Featured beverage collection ---------- */
.featured-row{display:grid; grid-template-columns:1.3fr 1fr 1fr; gap:24px;}
@media (max-width:900px){ .featured-row{grid-template-columns:1fr;} }
.featured-card{
  position:relative; border-radius:16px; overflow:hidden; aspect-ratio:4/5;
  box-shadow:0 24px 60px -24px rgba(74,28,76,0.35); transition:transform .35s var(--ease), box-shadow .35s var(--ease);
}
.featured-row > .featured-card:first-child{aspect-ratio:auto;}
@media (min-width:901px){ .featured-row > .featured-card:first-child{grid-row:span 1;} }
.featured-card:hover{transform:translateY(-4px); box-shadow:0 32px 70px -22px rgba(74,28,76,0.45);}
.featured-card .fc-bg{position:absolute; inset:0;}
.featured-card .fc-bg img{width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease);}
.featured-card:hover .fc-bg img{transform:scale(1.05);}
.featured-card .fc-scrim{position:absolute; inset:0; background:linear-gradient(180deg, transparent 40%, rgba(26,10,28,0.82) 100%);}
.featured-card .fc-body{position:absolute; left:0; right:0; bottom:0; padding:28px 26px; color:var(--white);}
.featured-card .fc-tag{font-size:0.66rem; letter-spacing:0.16em; text-transform:uppercase; color:var(--gold); font-weight:600; display:block; margin-bottom:8px;}
.featured-card h3{color:var(--white); font-family:var(--display); font-size:1.5rem; font-weight:400; margin-bottom:4px;}
.featured-card p{color:rgba(255,255,255,0.85); margin:0; font-size:0.9rem;}

/* ---------- Editorial gallery + lightbox ---------- */
.editorial-gallery{display:grid; grid-template-columns:repeat(6,1fr); grid-auto-rows:120px; gap:14px;}
.editorial-gallery .eg-item{position:relative; border-radius:12px; overflow:hidden; cursor:pointer;}
.editorial-gallery .eg-item img{width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease);}
.editorial-gallery .eg-item:hover img{transform:scale(1.06);}
.editorial-gallery .eg-item::after{
  content:'\\2197'; position:absolute; top:14px; right:14px; width:30px; height:30px; border-radius:50%;
  background:rgba(255,255,255,0.9); color:var(--purple); display:flex; align-items:center; justify-content:center;
  font-size:0.9rem; opacity:0; transition:opacity .25s;
}
.editorial-gallery .eg-item:hover::after{opacity:1;}
.eg-a{grid-column:span 3; grid-row:span 3;}
.eg-b{grid-column:span 3; grid-row:span 2;}
.eg-c{grid-column:span 2; grid-row:span 2;}
.eg-d{grid-column:span 2; grid-row:span 2;}
.eg-e{grid-column:span 2; grid-row:span 2;}
.eg-f{grid-column:span 6; grid-row:span 2;}
@media (max-width:800px){
  .editorial-gallery{grid-template-columns:repeat(2,1fr); grid-auto-rows:160px;}
  .eg-a,.eg-b,.eg-c,.eg-d,.eg-e,.eg-f{grid-column:span 1; grid-row:span 2;}
}
.lightbox{
  display:none; position:fixed; inset:0; z-index:100; background:rgba(20,8,22,0.92);
  align-items:center; justify-content:center; padding:30px;
}
.lightbox.open{display:flex;}
.lightbox img{max-width:min(90vw,1000px); max-height:85vh; border-radius:8px; box-shadow:0 30px 80px rgba(0,0,0,0.5);}
.lightbox .lb-close{
  position:absolute; top:24px; right:28px; width:42px; height:42px; border-radius:50%;
  background:rgba(255,255,255,0.12); color:var(--white); border:0; font-size:1.3rem; cursor:pointer;
}
.lightbox .lb-nav{
  position:absolute; top:50%; transform:translateY(-50%); width:46px; height:46px; border-radius:50%;
  background:rgba(255,255,255,0.12); color:var(--white); border:0; font-size:1.3rem; cursor:pointer;
}
.lightbox .lb-prev{left:20px;} .lightbox .lb-next{right:20px;}

/* ---------- Google-style reviews ---------- */
.google-summary{
  display:flex; align-items:center; gap:20px; justify-content:center; margin-bottom:44px; flex-wrap:wrap;
}
.g-mark{
  width:44px; height:44px; border-radius:50%; background:var(--white); display:flex; align-items:center; justify-content:center;
  font-family:var(--display); font-weight:600; font-size:1.3rem; color:var(--purple); box-shadow:0 2px 10px rgba(0,0,0,0.08);
}
.google-summary .g-score{font-family:var(--display); font-size:2rem; color:var(--purple);}
.google-summary .g-stars{color:var(--gold); letter-spacing:2px;}
.google-summary .g-count{color:var(--ink-soft); font-size:0.9rem;}
.review-row .review{border-radius:14px;}
.review .g-review-mark{display:flex; align-items:center; gap:8px; margin-bottom:12px;}
.review .g-review-mark .mini-g{
  width:22px; height:22px; border-radius:50%; background:var(--bg-soft); display:flex; align-items:center; justify-content:center;
  font-family:var(--display); font-weight:600; font-size:0.75rem; color:var(--purple);
}
.review .g-review-mark span.src{font-size:0.72rem; color:var(--ink-soft); text-transform:uppercase; letter-spacing:0.08em;}

/* ---------- Signature experiences ---------- */
.experience-row{display:grid; grid-template-columns:repeat(5,1fr); gap:18px;}
@media (max-width:1000px){ .experience-row{grid-template-columns:repeat(3,1fr);} }
@media (max-width:700px){ .experience-row{grid-template-columns:repeat(2,1fr);} }
.experience-card{
  position:relative; border-radius:14px; overflow:hidden; aspect-ratio:3/4;
  box-shadow:0 16px 40px -20px rgba(74,28,76,0.3); transition:transform .3s var(--ease);
}
.experience-card:hover{transform:translateY(-4px);}
.experience-card .ec-bg{position:absolute; inset:0;}
.experience-card .ec-bg img{width:100%; height:100%; object-fit:cover;}
.experience-card .ec-scrim{position:absolute; inset:0; background:linear-gradient(180deg, rgba(74,28,76,0.15) 0%, rgba(26,10,28,0.85) 100%);}
.experience-card .ec-body{position:absolute; left:0; right:0; bottom:0; padding:18px 16px; color:var(--white);}
.experience-card h3{color:var(--white); font-family:var(--display); font-size:1.02rem; font-weight:400; margin:0;}

/* contextual CTA strip */
.cta-strip{
  display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap;
  background:var(--bg-soft); border:1px solid var(--line); border-radius:12px; padding:24px 28px; margin-top:48px;
}
.cta-strip p{margin:0; color:var(--ink);}

/* ============================================================
   THE PURPLE HOUR — chapter-based homepage
   ============================================================ */
body.home-chapters{padding-bottom:0;}
.home-chapters header.site{position:fixed; top:0; left:0; right:0; background:transparent; border-bottom-color:transparent; transition:background .4s var(--ease), border-color .4s var(--ease);}
.home-chapters main{padding-top:0;}
.home-chapters header.site.solid{background:rgba(255,255,255,0.92); border-bottom-color:var(--line);}
.home-chapters header.site .logo-img, .home-chapters header.site .logo-icon{filter:brightness(0) invert(1); transition:filter .4s var(--ease);}
.home-chapters header.site.solid .logo-img, .home-chapters header.site.solid .logo-icon{filter:none;}
.home-chapters .nav ul a, .home-chapters .nav-cta, .home-chapters .burger{color:var(--white); transition:color .4s var(--ease);}
.home-chapters header.site.solid .nav ul a{color:var(--ink);}
.home-chapters header.site.solid .nav ul a:hover, .home-chapters header.site.solid .nav ul a.active{color:var(--purple);}
.home-chapters header.site.solid .nav-cta{background:var(--purple); color:var(--white);}
.home-chapters header.site.solid .burger{color:var(--purple);}
.home-chapters .topbar{display:none;}
.home-chapters .mobile-bar{background:rgba(255,255,255,0.97);}

.chapter{position:relative; overflow:hidden;}

/* Chapter 0 — The Approach */
.ch-hero{height:100vh; height:100svh; min-height:600px; position:relative; display:flex; align-items:flex-end; color:var(--white); background:linear-gradient(160deg,#2e1233,#14060f);}
.ch-hero .ch-bg{position:absolute; inset:0; background:#1a0a1c;}
.ch-hero .ch-bg img{width:100%; height:100%; object-fit:cover; filter:saturate(1.05);}
.ch-hero .ch-scrim{position:absolute; inset:0; background:linear-gradient(180deg, rgba(74,28,76,0.25) 0%, rgba(40,14,45,0.35) 45%, rgba(20,7,22,0.88) 100%);}
.ch-hero .ch-content{position:relative; z-index:2; padding:0 40px 90px; max-width:900px;}
@media (max-width:700px){ .ch-hero .ch-content{padding:0 24px 70px;} }
.ch-hero .mark-line{width:36px; height:1px; background:var(--gold); margin-bottom:22px;}
.ch-hero .eyebrow{color:rgba(255,255,255,0.75); background:none; padding:0; letter-spacing:0.3em;}
.ch-hero h1{color:var(--white); font-size:clamp(2.2rem,5.6vw,4rem); font-weight:300; max-width:14ch;}
.hero-subline{font-family:var(--body); font-weight:300; color:rgba(255,255,255,0.78); font-size:1rem; max-width:42ch; margin:20px 0 0;}
.ch-scroll-cue{position:absolute; bottom:34px; left:40px; z-index:2; width:1px; height:54px; background:rgba(255,255,255,0.3); overflow:hidden;}
@media (max-width:700px){ .ch-scroll-cue{left:24px;} }
.ch-scroll-cue::after{content:''; position:absolute; top:-100%; left:0; width:100%; height:100%; background:var(--gold); animation:tpb-thread 3s ease-in-out 1 forwards;}
@keyframes tpb-thread{ 0%{top:-100%;} 100%{top:100%;} }
@media (prefers-reduced-motion: reduce){ .ch-scroll-cue::after{animation:none; top:0;} }

/* Chapter 1 — The Reveal (bright, identity) */
.ch-reveal{display:grid; grid-template-columns:1.4fr 1fr; min-height:88vh; background:var(--white);}
@media (max-width:900px){ .ch-reveal{grid-template-columns:1fr; min-height:auto;} }
.ch-reveal .ch-photo{position:relative; overflow:hidden;}
.ch-reveal .ch-photo img{width:100%; height:100%; object-fit:cover; filter:sepia(0.12) saturate(1.1);}
.ch-reveal .ch-photo::after{content:''; position:absolute; inset:0; background:linear-gradient(160deg, rgba(133,32,118,0.18), rgba(74,28,76,0.05));}
@media (max-width:900px){ .ch-reveal .ch-photo{aspect-ratio:5/4;} }
.ch-reveal .ch-text{display:flex; flex-direction:column; justify-content:center; padding:70px 60px;}
@media (max-width:900px){ .ch-reveal .ch-text{padding:50px 26px;} }
.ch-reveal .big-line{font-family:var(--display); font-weight:300; font-size:clamp(1.6rem,3.4vw,2.5rem); color:var(--purple); line-height:1.35; margin-bottom:28px;}
.ch-reveal .identity-line{font-family:var(--body); font-size:0.98rem; color:var(--ink-soft); max-width:38ch; padding-top:20px; border-top:1px solid var(--line);}
.ch-reveal .identity-line strong{color:var(--ink); font-weight:500;}

/* Chapter 2 — bridge */
.ch-bridge{height:46vh; min-height:280px; display:flex; align-items:center; justify-content:center; text-align:center;
  background:linear-gradient(180deg, var(--white) 0%, #2a1030 60%, var(--void, #14060f) 100%);}
.ch-bridge p{font-family:var(--display); font-style:italic; font-weight:300; font-size:clamp(1.2rem,2.6vw,1.7rem); color:rgba(255,255,255,0.92); max-width:24ch; margin:0;}

/* Chapter 3 — Beverages (dark, THE POUR) */
.ch-beverages{background:#14060f; padding:120px 0; color:var(--white);}
.ch-beverages .ch-head{max-width:640px; margin:0 auto 90px; text-align:center;}
.ch-beverages .ch-head .eyebrow{color:var(--gold);}
.ch-beverages .ch-head h2{color:var(--white); font-weight:300; font-size:clamp(1.8rem,3.4vw,2.6rem);}
.pour-item{position:relative; max-width:760px; margin:0 auto 130px; display:grid; grid-template-columns:0.9fr 1.1fr; gap:50px; align-items:center;}
.pour-item:nth-child(even){grid-template-columns:1.1fr 0.9fr;}
.pour-item:nth-child(even) .pour-photo{order:2;}
@media (max-width:760px){ .pour-item, .pour-item:nth-child(even){grid-template-columns:1fr;} .pour-item:nth-child(even) .pour-photo{order:0;} }
.pour-photo{position:relative; aspect-ratio:4/5; border-radius:6px; overflow:hidden;}
.pour-photo img{width:100%; height:100%; object-fit:cover; filter:saturate(1.1) brightness(0.9);}
.pour-photo .pour-veil{
  position:absolute; inset:0; background:linear-gradient(180deg, #852076 0%, #4a1c4c 60%, transparent 100%);
  transform:translateY(0%); transition:transform 1.4s cubic-bezier(.65,0,.35,1);
}
.pour-item.in .pour-photo .pour-veil{transform:translateY(100%);}
.pour-text{opacity:0; transform:translateY(14px); transition:opacity .8s ease .5s, transform .8s ease .5s;}
.pour-text .tag{font-size:0.66rem; letter-spacing:0.18em; text-transform:uppercase; color:var(--gold); display:block; margin-bottom:14px;}
.pour-text h3{font-family:var(--display); font-weight:300; font-size:clamp(1.6rem,3vw,2.2rem); color:var(--white); margin-bottom:12px;}
.pour-text p{color:rgba(255,255,255,0.65); margin:0;}
.pour-item.in .pour-text{opacity:1; transform:translateY(0);}

/* Chapter 4 — Food (warm editorial, full bleed) */
.ch-food{background:#faf3ea; padding:110px 0;}
.ch-food .ch-food-photo{width:100%; aspect-ratio:21/8; overflow:hidden;}
.ch-food .ch-food-photo img{width:100%; height:100%; object-fit:cover; filter:sepia(0.15) saturate(1.15);}
.ch-food .ch-food-text{max-width:640px; margin:50px auto 0; text-align:center;}
.ch-food .ch-food-text .eyebrow{color:var(--magenta);}
.ch-food .ch-food-text h2{font-weight:300;}

/* Chapter 5 — Ambience (luxurious, spacious, detached quote) */
.ch-ambience{background:#3c1640; padding:130px 0; position:relative; min-height:90vh; display:flex; align-items:center;}
.ch-ambience .amb-grid{position:relative; width:100%;}
.ch-ambience .amb-photo{width:56%; aspect-ratio:3/4; overflow:hidden; border-radius:4px; margin-left:8%;}
.ch-ambience .amb-photo img{width:100%; height:100%; object-fit:cover;}
.ch-ambience .amb-quote{
  position:relative; margin-top:-70px; margin-left:44%; max-width:440px; background:rgba(20,7,22,0.55); backdrop-filter:blur(6px);
  padding:38px 34px; border-radius:4px;
}
@media (max-width:800px){
  .ch-ambience .amb-photo{width:84%; margin-left:8%;}
  .ch-ambience .amb-quote{margin-left:8%; margin-top:24px; width:84%;}
}
.ch-ambience .amb-quote p{font-family:var(--display); font-style:italic; font-weight:300; color:var(--white); font-size:1.3rem; line-height:1.5; margin:0;}

/* Chapter 6 — The Ritual (pure typography, emotional peak) */
.ch-ritual{background:#0f0511; padding:0;}
.ritual-line{
  min-height:70vh; display:flex; align-items:center; justify-content:center; text-align:center; padding:40px 24px;
}
.ritual-line p{
  font-family:var(--display); font-weight:300; font-style:italic; color:rgba(255,255,255,0.35);
  font-size:clamp(1.4rem,3.4vw,2.4rem); max-width:20ch; margin:0; transition:color 1s var(--ease);
}
.ritual-line.in p{color:rgba(255,255,255,0.95);}

/* Chapter 7 — Experiences (typographic wash, no photography) */
.ch-experiences{padding:0; transition:background 1.2s var(--ease);}
.exp-line{min-height:50vh; display:flex; align-items:center; justify-content:center; text-align:center; padding:30px 24px;}
.exp-line span{
  font-family:var(--display); font-weight:300; color:rgba(255,255,255,0.3); font-size:clamp(1.3rem,3vw,2rem);
  transition:color .9s var(--ease);
}
.exp-line.in span{color:var(--white);}

/* Chapter 8 — Reservation (minimal close) */
.ch-reservation-minimal{background:#0f0511; min-height:70vh; display:flex; align-items:center; justify-content:center; text-align:center; padding:60px 24px;}
.ch-reservation-minimal p.close-line{font-family:var(--display); font-weight:300; color:var(--white); font-size:clamp(1.6rem,3.6vw,2.4rem); margin-bottom:34px; max-width:16ch;}
.ch-reservation-minimal .quiet-links{display:flex; gap:34px; justify-content:center; font-family:var(--body); font-size:0.85rem; letter-spacing:0.04em;}
.ch-reservation-minimal .quiet-links a{color:rgba(255,255,255,0.75); border-bottom:1px solid rgba(255,255,255,0.3); padding-bottom:3px; transition:color .2s, border-color .2s;}
.ch-reservation-minimal .quiet-links a:hover{color:var(--gold); border-color:var(--gold);}

/* footer echo of The Pour, closing the motif */
.footer-pour{height:3px; width:64px; margin:0 auto 30px; background:linear-gradient(90deg, var(--gold), var(--magenta)); border-radius:2px; opacity:0.8;}