/* ============================================================
   Beirut Restaurant — site.css (approved "Menu Book" design)
   ============================================================ */
:root{
  --cream:#FAF6EC; --cream-deep:#F1EADA;
  --charcoal:#191713; --charcoal-2:#221F1A;
  --gold:#B8945A; --gold-light:#D8BC8A;
  --ink:#262219; --ink-muted:#776E5E;
  --warm-white:#F6F1E5;
  --hair:rgba(184,148,90,.4);
  --serif:'Cormorant Garamond', Georgia, serif;
  --sans:'Manrope','Segoe UI',sans-serif;
  --headerH:118px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--headerH) + 1rem)}
body{font-family:var(--sans);background:var(--cream);color:var(--ink);font-size:16.5px;line-height:1.75;-webkit-font-smoothing:antialiased;padding-top:var(--headerH)}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
::selection{background:var(--gold);color:var(--charcoal)}
.page{max-width:1060px;margin:0 auto;padding:0 clamp(1.4rem,5vw,4rem)}
.caps{font-size:.7rem;letter-spacing:.32em;text-transform:uppercase;font-weight:700;color:var(--gold)}
.caps.gold{color:var(--gold-light)}
.muted{color:var(--ink-muted)}
h1,h2,h3{font-family:var(--serif);font-weight:500;line-height:1.07;text-wrap:balance}
em{font-style:italic}
.rv{opacity:0;transform:translateY(24px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.7,.25,1)}
.rv.in{opacity:1;transform:none}
.rv-d1{transition-delay:.12s}
.arch{border-radius:300px 300px 8px 8px;overflow:hidden;border:1px solid var(--hair);padding:10px;background:var(--cream)}
.arch img{border-radius:290px 290px 4px 4px;width:100%;height:100%;object-fit:cover}
.dark .arch{background:transparent;border-color:rgba(216,188,138,.45)}
.rule{display:flex;align-items:center;gap:1.1rem;color:var(--gold);justify-content:center;margin:1.6rem 0}
.rule::before,.rule::after{content:"";height:1px;flex:0 0 90px;background:linear-gradient(to var(--d,right),transparent,var(--gold))}
.rule::after{--d:left}
.link-cta{font-size:.7rem;letter-spacing:.26em;text-transform:uppercase;font-weight:800;border-bottom:1px solid var(--gold);padding-bottom:.35rem}
.link-cta:hover{color:var(--gold)}

/* ============ header ============ */
header{position:fixed;top:0;left:0;right:0;z-index:90;background:rgba(250,246,236,.98);backdrop-filter:blur(12px);border-bottom:1px solid var(--hair)}
.h-util{background:var(--charcoal);color:rgba(246,241,229,.85)}
.h-util .u-in{max-width:1380px;margin:0 auto;padding:.38rem clamp(1rem,3vw,2.4rem);display:flex;justify-content:space-between;align-items:center;gap:1.4rem;font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;font-weight:700}
.h-util .u-l{display:flex;gap:1.6rem;align-items:center}
.h-util .u-addr{color:rgba(246,241,229,.55);font-weight:600}
.h-util a:hover{color:var(--gold-light)}
.h-util .u-res{color:var(--gold-light);border-bottom:1px solid var(--gold);padding-bottom:.1rem;font-weight:800}
.h-main{max-width:1380px;margin:0 auto;padding:.55rem clamp(1rem,3vw,2.4rem);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:clamp(1rem,2.5vw,2.5rem)}
header nav{display:flex;gap:clamp(1.1rem,2.2vw,2.2rem);font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;font-weight:800}
header nav.n-l{justify-content:flex-end}
header nav.n-r{justify-content:flex-start}
header nav a{position:relative;padding:.5rem 0;color:var(--ink);transition:color .3s}
header nav a::after{content:"";position:absolute;left:50%;transform:translateX(-50%);bottom:0;width:0;height:1px;background:var(--gold);transition:width .3s}
header nav a:hover{color:var(--gold)}
header nav a:hover::after{width:100%}
.h-logo{justify-self:center}
.h-logo img{height:62px;width:auto}
@media(max-width:1100px){
  :root{--headerH:96px}
  header nav{display:none}
  .h-main{grid-template-columns:1fr;justify-items:center;padding:.5rem}
  .h-logo img{height:52px}
}
@media(max-width:640px){
  :root{--headerH:88px}
  .h-util .u-addr{display:none}
}

/* announcement */
.notice{background:var(--charcoal);color:var(--warm-white);border-bottom:1px solid var(--hair);padding:.9rem 0}
.notice .n-in{display:flex;align-items:center;justify-content:center;gap:1.4rem;flex-wrap:wrap;text-align:center}
.notice .n-text{font-family:var(--serif);font-style:italic;font-size:1.15rem}
.notice a{font-size:.66rem;letter-spacing:.24em;text-transform:uppercase;font-weight:800;color:var(--gold-light);border-bottom:1px solid var(--gold)}

/* ============ hero (split banner) ============ */
.cover{display:grid;grid-template-columns:1fr 1fr;min-height:calc(100svh - var(--headerH));background:var(--charcoal)}
.hero-brand{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:var(--warm-white);padding:clamp(3rem,6vw,5rem) clamp(1.6rem,4vw,4rem);overflow:hidden}
.hero-brand::before{content:"";position:absolute;inset:18px;border:1px solid rgba(216,188,138,.35);pointer-events:none}
.hero-brand::after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:min(560px,90%);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(184,148,90,.16),transparent 65%);pointer-events:none}
.hb-corner{position:absolute;width:34px;height:34px;border:1px solid var(--gold);pointer-events:none}
.hb-corner.tl{top:18px;left:18px;border-right:none;border-bottom:none}
.hb-corner.tr{top:18px;right:18px;border-left:none;border-bottom:none}
.hb-corner.bl{bottom:18px;left:18px;border-right:none;border-top:none}
.hb-corner.br{bottom:18px;right:18px;border-left:none;border-top:none}
.hero-brand>*:not(.hb-corner){position:relative;z-index:2}
.hero-brand .c-logo{height:clamp(150px,17vw,225px);width:auto;filter:drop-shadow(0 0 34px rgba(216,188,138,.35))}
.hb-rule{display:flex;align-items:center;gap:1rem;color:var(--gold-light);margin:1.8rem 0 1.2rem}
.hb-rule::before,.hb-rule::after{content:"";height:1px;width:clamp(50px,7vw,90px);background:linear-gradient(to var(--d,right),transparent,var(--gold))}
.hb-rule::after{--d:left}
.hb-rule i{font-style:normal;font-size:.75rem}
.hero-brand .caps{color:var(--gold-light)}
.hero-brand h1{font-family:var(--serif);font-style:italic;font-weight:500;font-size:clamp(1.4rem,2.5vw,1.9rem);color:rgba(246,241,229,.92);margin-top:.9rem;max-width:24ch;line-height:1.4}
.hb-ctas{display:flex;gap:1rem;margin-top:2.4rem;flex-wrap:wrap;justify-content:center}
.hb-ctas a{font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;font-weight:800;padding:1rem 2rem;border:1px solid var(--gold);transition:all .3s}
.hb-ctas a.solid{background:var(--gold);color:var(--charcoal)}
.hb-ctas a.solid:hover{background:var(--gold-light);border-color:var(--gold-light)}
.hb-ctas a.ghost{color:var(--gold-light)}
.hb-ctas a.ghost:hover{background:var(--gold);color:var(--charcoal)}
.hero-photo{position:relative;overflow:hidden;min-height:420px}
.hero-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity 1.8s ease}
.hero-photo img.on{opacity:1;animation:kb 9s ease-out forwards}
@keyframes kb{from{transform:scale(1.01)}to{transform:scale(1.09)}}
.hero-photo::after{content:"";position:absolute;inset:14px;border:1px solid rgba(250,246,236,.55);pointer-events:none;z-index:2}
.hp-caption{position:absolute;left:0;right:0;bottom:0;z-index:3;background:linear-gradient(transparent,rgba(25,23,19,.82));color:var(--warm-white);padding:2.6rem 2rem 1.6rem;text-align:center}
.hp-caption b{font-family:var(--serif);font-weight:600;font-size:1.35rem;display:block}
.hp-caption span{font-size:.64rem;letter-spacing:.26em;text-transform:uppercase;font-weight:800;color:var(--gold-light)}
@media(max-width:920px){
  .cover{grid-template-columns:1fr}
  .hero-photo{min-height:46svh;order:2}
  .hero-brand{min-height:54svh;order:1}
}

/* ============ chapters ============ */
.chapter{padding:clamp(5rem,10vw,8.5rem) 0;position:relative}
.ch-head{position:relative;margin-bottom:clamp(2.4rem,5vw,3.6rem)}
.ch-num{position:absolute;top:-3.2rem;left:-1rem;font-family:var(--serif);font-size:clamp(7rem,15vw,11rem);line-height:1;color:transparent;-webkit-text-stroke:1px var(--hair);user-select:none;z-index:0}
.ch-head .caps{position:relative;z-index:1}
.ch-head h2{position:relative;z-index:1;font-size:clamp(2.4rem,5.4vw,4.2rem);margin-top:.7rem}
.dark{background:var(--charcoal);color:var(--warm-white)}
.dark .ch-num{-webkit-text-stroke-color:rgba(216,188,138,.28)}
.dark2{background:var(--charcoal-2)}

.house-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(2.5rem,6vw,5rem);align-items:center}
.house-grid .lead,.prose .lead{font-family:var(--serif);font-style:italic;font-size:1.5rem;color:var(--ink);line-height:1.45;margin-bottom:1rem}
.house-grid .muted{margin:1rem 0;max-width:56ch}
.house-arches{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem;align-items:end}
.house-arches .arch:first-child{aspect-ratio:3/4.4}
.house-arches .arch:last-child{aspect-ratio:3/3.4;margin-bottom:2.4rem}
.about-arches{max-width:560px;margin-top:2.5rem}
.drive-note{margin-top:2.2rem;border-left:2px solid var(--gold);padding:.4rem 0 .4rem 1.4rem}
.drive-note b{font-family:var(--serif);font-size:1.25rem;font-weight:600;display:block}
.drive-note span{font-size:.8rem;color:var(--ink-muted);letter-spacing:.06em}
.drive-note .st{display:inline-flex;gap:.5rem;margin-top:.6rem}
.drive-note .st i{font-style:normal;border:1px solid var(--hair);color:var(--gold);font-size:.62rem;letter-spacing:.18em;font-weight:800;padding:.25rem .65rem}
@media(max-width:880px){.house-grid{grid-template-columns:1fr}}

.fire-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(2.5rem,6vw,5.5rem);align-items:center}
.fire-grid .arch{aspect-ratio:3/4;max-width:380px}
.fire-state{font-family:var(--serif);font-style:italic;font-size:clamp(1.6rem,3.4vw,2.3rem);line-height:1.35;color:var(--gold-light);max-width:22ch;margin-bottom:2.2rem}
.sig{border-top:1px solid rgba(216,188,138,.3)}
.sig-row{display:flex;justify-content:space-between;align-items:baseline;gap:1.4rem;padding:1.05rem 0;border-bottom:1px solid rgba(216,188,138,.22)}
.sig-row .n{font-weight:800;font-size:1.06rem}
.sig-row .n small{display:block;font-weight:400;font-size:.8rem;color:rgba(246,241,229,.6);margin-top:.1rem}
.sig-row .p{font-family:var(--serif);font-size:1.35rem;color:var(--gold-light);white-space:nowrap}
.sig-row .dots{flex:1;border-bottom:1px dotted rgba(216,188,138,.35);transform:translateY(-4px)}
@media(max-width:880px){.fire-grid{grid-template-columns:1fr}.fire-grid .arch{margin:0 auto}}

.week{margin-top:clamp(3rem,6vw,5rem);border:1px solid rgba(216,188,138,.4);background:rgba(250,246,236,.025);padding:clamp(1.8rem,4vw,3rem)}
.week h3{font-size:1.9rem;margin-bottom:.4rem}
.wk-row{display:grid;grid-template-columns:150px 1fr auto;gap:1.2rem;align-items:baseline;padding:1rem 0;border-bottom:1px solid rgba(216,188,138,.2)}
.wk-row:last-child{border:none}
.wk-row .d{font-size:.66rem;letter-spacing:.26em;text-transform:uppercase;font-weight:800;color:var(--gold-light)}
.wk-row .t{font-family:var(--serif);font-size:1.35rem}
.wk-row .t small{display:block;font-family:var(--sans);font-size:.8rem;color:rgba(246,241,229,.6)}
.wk-row .tag{font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;font-weight:800;background:var(--gold);color:var(--charcoal);padding:.3rem .7rem;white-space:nowrap}
@media(max-width:680px){.wk-row{grid-template-columns:1fr;gap:.2rem}.wk-row .tag{justify-self:start;margin-top:.4rem}}
.city-week{margin-top:2rem;border-color:var(--hair);background:var(--cream-deep)}
.city-week .wk-row .d{color:var(--gold)}
.city-dishes{font-family:var(--serif);font-size:1.3rem}

.carte-cols{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2.4rem,6vw,5.5rem)}
.carte-cols h3{font-size:1.65rem;display:flex;align-items:center;gap:1rem;margin-bottom:1.3rem}
.carte-cols h3::after{content:"";flex:1;height:1px;background:linear-gradient(to right,var(--hair),transparent)}
.ci{display:flex;justify-content:space-between;gap:1rem;align-items:baseline;padding:.8rem 0;border-bottom:1px dashed rgba(119,110,94,.3)}
.ci:last-child{border:none}
.ci .n{font-weight:800}
.ci .n small{display:block;font-weight:400;font-size:.82rem;color:var(--ink-muted)}
.ci .n .new{font-size:.54rem;letter-spacing:.18em;font-weight:800;background:var(--gold-light);color:var(--charcoal);padding:.14rem .45rem;margin-left:.5rem;vertical-align:middle}
.ci .p{font-family:var(--serif);font-size:1.3rem;color:var(--gold);white-space:nowrap}
.ci-right{display:flex;align-items:center;gap:.9rem}
.order-btn{font-size:.58rem;letter-spacing:.2em;text-transform:uppercase;font-weight:800;border:1px solid var(--gold);color:var(--gold);padding:.4rem .8rem;transition:all .3s}
.order-btn:hover{background:var(--gold);color:var(--charcoal)}
.carte-foot{margin-top:3rem}
@media(max-width:880px){.carte-cols{grid-template-columns:1fr}}

.night-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2.5rem,6vw,5.5rem);align-items:center}
.flyer{position:relative;max-width:400px;justify-self:center;width:100%}
.flyer .arch{aspect-ratio:3/4}
.flyer .f-tag{position:absolute;top:-0.9rem;left:50%;transform:translateX(-50%);background:var(--gold);color:var(--charcoal);font-size:.6rem;letter-spacing:.24em;text-transform:uppercase;font-weight:800;padding:.45rem 1.1rem;white-space:nowrap;z-index:2}
.nightp{color:rgba(246,241,229,.72);max-width:50ch;margin:1rem 0 1.8rem}
.nights{border-top:1px solid rgba(216,188,138,.3)}
.nights .wk-row .t{font-size:1.5rem}
.night-ctas{margin-top:1.8rem;display:flex;gap:2.2rem;flex-wrap:wrap}
.gold-link{font-size:.7rem;letter-spacing:.26em;text-transform:uppercase;font-weight:800;color:var(--gold-light);border-bottom:1px solid var(--gold);padding-bottom:.35rem}
.dim-link{font-size:.7rem;letter-spacing:.26em;text-transform:uppercase;font-weight:800;border-bottom:1px solid rgba(216,188,138,.4);padding-bottom:.35rem}
@media(max-width:880px){.night-grid{grid-template-columns:1fr}}

.occ-row{display:grid;grid-template-columns:1fr auto;gap:clamp(1.2rem,3vw,2.4rem);align-items:center;padding:2rem 0;border-bottom:1px solid var(--hair);counter-increment:occ}
.occ{counter-reset:occ}
.occ-row:first-of-type{border-top:1px solid var(--hair)}
.occ-row h3{font-size:1.8rem;margin-bottom:.2rem}
.occ-row h3::before{content:"0" counter(occ) "  ";font-size:1.4rem;color:transparent;-webkit-text-stroke:1px var(--gold);margin-right:.6rem}
.occ-row p{font-size:.88rem;color:var(--ink-muted);max-width:56ch}
.occ-row a{font-size:.66rem;letter-spacing:.24em;text-transform:uppercase;font-weight:800;border:1px solid var(--gold);padding:.8rem 1.6rem;white-space:nowrap;transition:all .3s}
.occ-row a:hover{background:var(--charcoal);border-color:var(--charcoal);color:var(--warm-white)}
@media(max-width:680px){.occ-row{grid-template-columns:1fr}.occ-row a{justify-self:start}}

.visit{background:var(--cream-deep)}
.visit-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2.5rem,6vw,5rem)}
.hours{border-top:1px solid var(--hair)}
.h-row{display:flex;justify-content:space-between;padding:1rem 0;border-bottom:1px solid var(--hair)}
.h-row b{font-weight:800}
.addr{font-family:var(--serif);font-size:1.5rem;margin:1.6rem 0 .4rem}
.vc{font-size:.92rem;color:var(--ink-muted)}
.vc a{border-bottom:1px dotted var(--gold)}
.rsv-card{background:var(--charcoal);color:var(--warm-white);padding:clamp(2rem,4vw,3rem);position:relative;align-self:start}
.rsv-card::before{content:"✦";position:absolute;top:1.3rem;right:1.5rem;color:var(--gold)}
.rsv-card h3{font-size:2.1rem;margin-bottom:1.2rem}
.rsv-card h3 em{color:var(--gold-light)}
.rsv-note{font-size:.88rem;color:rgba(246,241,229,.7);margin-bottom:1.6rem}
.rsv-btn{display:inline-block;background:var(--gold);color:var(--charcoal);font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;font-weight:800;padding:1.1rem 2.2rem;text-align:center;transition:background .3s;border:none;cursor:pointer;font-family:var(--sans)}
.rsv-btn:hover{background:var(--gold-light)}
.rsv-card .ph{margin-top:1.2rem;font-size:.84rem;color:rgba(246,241,229,.7)}
.rsv-card .ph a{color:var(--gold-light)}
@media(max-width:880px){.visit-grid{grid-template-columns:1fr}}

/* ============ inner page heads ============ */
.pg-head{padding:clamp(3rem,6vw,4.5rem) 0 1rem;text-align:center}
.pg-title{font-size:clamp(2.4rem,5.6vw,4.2rem);margin-top:.7rem}
.prose{max-width:760px}
.prose p{margin:1rem 0;color:var(--ink-muted)}

/* ============ menu page ============ */
.menu-page{padding-bottom:clamp(4rem,8vw,7rem)}
.chips-wrap{position:relative;margin:1.5rem 0 2.5rem;overflow-x:auto;cursor:grab;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:var(--gold) transparent;padding-bottom:.5rem;mask-image:linear-gradient(to right,transparent,#000 22px,#000 calc(100% - 22px),transparent);-webkit-mask-image:linear-gradient(to right,transparent,#000 22px,#000 calc(100% - 22px),transparent)}
.chips-wrap.dragging{cursor:grabbing;user-select:none}
.chips-wrap::-webkit-scrollbar{height:4px}
.chips-wrap::-webkit-scrollbar-thumb{background:var(--hair);border-radius:2px}
.chips{display:flex;gap:.55rem;flex-wrap:nowrap;width:max-content;margin:0 auto;padding:.2rem 22px}
.chips a,.chips span{flex:0 0 auto;font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;font-weight:800;border:1px solid var(--hair);padding:.5rem 1rem;color:var(--ink-muted);white-space:nowrap;transition:all .25s}
.chips a.hot,.chips span.hot{background:var(--charcoal);color:var(--gold-light);border-color:var(--charcoal)}
.sticky-chips{position:sticky;top:var(--headerH);background:var(--cream);z-index:40}
.menu-cat{margin-bottom:3rem}
.cat-title{font-size:2rem;display:flex;align-items:center;gap:1.1rem;margin-bottom:.4rem}
.cat-title::after{content:"";flex:1;height:1px;background:linear-gradient(to right,var(--hair),transparent)}
.cat-intro{font-size:.9rem;color:var(--ink-muted);margin-bottom:.6rem;max-width:64ch}
.menu-cta{text-align:center;margin-top:3rem}

/* ============ reservations ============ */
.res-page{padding-bottom:clamp(4rem,8vw,7rem)}
.res-grid{display:grid;grid-template-columns:1.4fr .9fr;gap:clamp(2rem,4vw,3.5rem);align-items:start}
@media(max-width:880px){.res-grid{grid-template-columns:1fr}}
.res-form{background:#fff;border:1px solid var(--hair);padding:clamp(1.6rem,3.5vw,2.6rem)}
.rf-row{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}
@media(max-width:560px){.rf-row{grid-template-columns:1fr}}
.rf-field{margin-bottom:1.2rem}
.rf-field label{display:block;font-size:.62rem;letter-spacing:.24em;text-transform:uppercase;font-weight:800;color:var(--gold);margin-bottom:.4rem}
.rf-field input,.rf-field select,.rf-field textarea{width:100%;border:1px solid var(--hair);background:var(--cream);padding:.85rem 1rem;font-family:var(--sans);font-size:1rem;color:var(--ink)}
.rf-field input:focus,.rf-field select:focus,.rf-field textarea:focus{outline:2px solid var(--gold)}
.rf-hint{display:block;font-size:.72rem;color:var(--ink-muted);margin-top:.35rem}
.slot-grid{display:flex;flex-wrap:wrap;gap:.55rem;min-height:48px}
.slot-grid button{border:1px solid var(--hair);background:var(--cream);font-family:var(--sans);font-size:.78rem;font-weight:700;padding:.6rem 1rem;cursor:pointer;transition:all .25s}
.slot-grid button:hover{border-color:var(--gold)}
.slot-grid button.sel{background:var(--charcoal);color:var(--gold-light);border-color:var(--charcoal)}
.rf-submit{width:100%;margin-top:.6rem}
.rf-call{text-align:center;font-size:.84rem;color:var(--ink-muted);margin-top:1rem}
.rf-call a{border-bottom:1px dotted var(--gold)}
.res-err{background:#fbeaea;border:1px solid #d9a0a0;color:#7a2f2f;padding:.8rem 1rem;font-size:.86rem;margin-bottom:1.2rem}
.hp-field{position:absolute;left:-5000px;height:1px;width:1px;opacity:0}
.res-done{background:#fff;border:1px solid var(--hair);padding:clamp(2rem,4vw,3rem);grid-column:1/-1;text-align:center}
.res-done h2{font-size:clamp(1.8rem,4vw,2.6rem);margin:1rem 0}
.res-sum{font-size:1.1rem;margin-bottom:1rem}
.res-notes{list-style:none}
.res-notes li{padding:.6rem 0;border-bottom:1px solid rgba(216,188,138,.25);font-size:.86rem;color:rgba(246,241,229,.8)}
.res-notes li:last-child{border:none}
.res-notes a{color:var(--gold-light);border-bottom:1px dotted var(--gold)}

/* faq */
.faq{margin-top:2.5rem;border-top:1px solid var(--hair)}
.faq details{border-bottom:1px solid var(--hair);padding:1rem 0}
.faq summary{font-family:var(--serif);font-size:1.25rem;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:1rem}
.faq summary::after{content:"+";color:var(--gold);font-size:1.4rem}
.faq details[open] summary::after{content:"–"}
.faq p{color:var(--ink-muted);margin-top:.6rem;font-size:.92rem}
.city-quote{font-family:var(--serif);font-style:italic;font-size:1.4rem;border-left:2px solid var(--gold);padding-left:1.4rem;margin:2.5rem 0;color:var(--ink)}

/* ============ footer ============ */
footer{background:var(--charcoal);color:rgba(246,241,229,.7);padding:4.5rem 0 7rem;border-top:1px solid var(--hair)}
.f-grid{display:grid;grid-template-columns:1.2fr 1fr 1.3fr;gap:3rem}
.f-logo{height:110px;width:auto;margin-bottom:1.3rem;filter:drop-shadow(0 0 22px rgba(216,188,138,.25))}
.f-desc{font-size:.86rem;max-width:34ch}
footer h4{font-size:.68rem;letter-spacing:.26em;text-transform:uppercase;color:var(--gold);margin-bottom:1.1rem;font-weight:800}
footer ul{list-style:none}
footer li{margin:.45rem 0;font-size:.86rem}
footer a:hover{color:var(--gold-light)}
.soc{display:flex;gap:1.2rem;margin-top:1.4rem;font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;font-weight:800;flex-wrap:wrap}
.soc a{color:var(--gold-light)}
.dark-soc a{color:var(--gold)}
.st-badges{display:flex;gap:.55rem;margin:.9rem 0 1rem;flex-wrap:wrap}
.st-badges span{border:1px solid rgba(216,188,138,.5);color:var(--gold-light);font-size:.64rem;letter-spacing:.2em;font-weight:800;padding:.32rem .75rem}
.cities{font-size:.8rem;line-height:2;color:rgba(246,241,229,.55)}
.cities a{border-bottom:1px dotted rgba(216,188,138,.4)}
.f-bottom{max-width:1060px;margin:3.2rem auto 0;padding:1.6rem clamp(1.4rem,5vw,4rem) 0;border-top:1px solid rgba(216,188,138,.2);font-size:.74rem;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}
.f-bottom a{color:var(--gold-light)}
@media(max-width:820px){.f-grid{grid-template-columns:1fr}}

/* mobile bottom bar */
.mob-bar{position:fixed;bottom:0;left:0;right:0;z-index:90;display:none;background:rgba(25,23,19,.97);backdrop-filter:blur(8px);border-top:1px solid var(--hair)}
.mob-bar a{flex:1;text-align:center;padding:.85rem .3rem .95rem;color:var(--warm-white);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;font-weight:800}
.mob-bar a span{display:block;font-size:1.05rem;margin-bottom:.12rem;color:var(--gold-light)}
.mob-bar a.hot{background:var(--gold);color:var(--charcoal)}
.mob-bar a.hot span{color:var(--charcoal)}
@media(max-width:780px){.mob-bar{display:flex}footer{padding-bottom:8rem}}

/* ============ popup ad ============ */
.popup-overlay{position:fixed;inset:0;z-index:200;background:rgba(25,23,19,.72);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;padding:1.4rem;opacity:0;transition:opacity .4s}
.popup-overlay.show{opacity:1}
.popup-card{position:relative;max-width:520px;width:100%;background:var(--cream);border:1px solid var(--gold);box-shadow:0 30px 80px rgba(0,0,0,.5);transform:translateY(16px);transition:transform .4s}
.popup-overlay.show .popup-card{transform:none}
.popup-card.is-img{background:transparent;border:none}
.popup-card img{width:100%;max-height:78vh;object-fit:contain;border:1px solid var(--gold)}
.popup-x{position:absolute;top:-1rem;right:-1rem;z-index:2;width:2.4rem;height:2.4rem;border-radius:50%;border:1px solid var(--gold);background:var(--charcoal);color:var(--gold-light);font-size:1.3rem;line-height:1;cursor:pointer;transition:background .3s}
.popup-x:hover{background:var(--gold);color:var(--charcoal)}
.popup-body{padding:2.6rem 2.2rem;text-align:center}
.popup-orn{color:var(--gold);display:block;margin-bottom:.8rem}
.popup-body h3{font-size:1.9rem;margin-bottom:.7rem}
.popup-body p{color:var(--ink-muted);font-size:.95rem}
.popup-cta{display:inline-block;margin-top:1.4rem;background:var(--gold);color:var(--charcoal);font-size:.66rem;letter-spacing:.22em;text-transform:uppercase;font-weight:800;padding:.9rem 1.8rem}

/* dietary badge chips (from CMS badges JSON) */
.diet{font-size:.52rem;letter-spacing:.14em;text-transform:uppercase;font-weight:800;border:1px solid var(--hair);color:var(--ink-muted);padding:.12rem .4rem;margin-left:.45rem;vertical-align:middle;white-space:nowrap}
.dark .diet{border-color:rgba(216,188,138,.35);color:rgba(246,241,229,.6)}
