/* ============================================================
   Tacos 'N' Tequilas — shared front-end styles
   Used by every page: index.php, locations.php, location.php,
   contact.php, careers.php, privacy.php, terms.php, thanks.php
   ============================================================ */
:root{
  --red:#9F2210; --red-deep:#6E1609; --red-bright:#C8321A;
  --gold:#F9D021; --gold-deep:#E9AE07; --gold-soft:#FCE08A;
  --cream:#FBEED0; --cream-2:#F6E3BE; --paper:#FFF9EC;
  --ink:#1E0A06; --ink-soft:#3A160D; --white:#fff;
  --magenta:#E6187E; --purple:#5B2A86; --green:#2F9E44; --teal:#0E9E8E;
  --maxw:1240px; --radius:22px; --radius-sm:14px;
  --shadow:0 18px 40px -18px rgba(30,10,6,.55);
  --shadow-soft:0 10px 30px -14px rgba(30,10,6,.35);
  --font-display:'Lilita One',system-ui,sans-serif;
  --font:'Montserrat',system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--font);color:var(--ink);background:var(--paper);line-height:1.55;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{margin:0 0 .4em;line-height:1.02;font-weight:800}
p{margin:0 0 1em}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 22px}
.display{font-family:var(--font-display);font-weight:400;letter-spacing:.5px}
.eyebrow{font-weight:800;text-transform:uppercase;letter-spacing:.18em;font-size:.78rem}
.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}

/* ---------- Buttons ---------- */
/* Flat buttons — no drop shadows anywhere. Colour change on hover only. */
.btn{display:inline-flex;align-items:center;gap:.5em;font-weight:800;font-size:.95rem;
  padding:.82em 1.35em;border-radius:999px;cursor:pointer;border:2px solid transparent;
  transition:background .15s ease,color .15s ease,border-color .15s ease;white-space:nowrap;
  background:none;box-shadow:none}
.btn:hover{box-shadow:none}
.btn-gold{background:var(--gold);color:var(--red-deep)}
.btn-gold:hover{background:var(--gold-soft)}
.btn-red{background:var(--red);color:var(--gold)}
.btn-red:hover{background:var(--red-bright)}
.btn-outline{border-color:currentColor;color:var(--white)}
.btn-outline.dark{color:var(--red)}
.btn-outline:hover{background:rgba(255,255,255,.12)}
.btn-ghost{color:var(--red);border-color:rgba(159,34,16,.25);background:rgba(255,255,255,.6)}
.btn-sm{padding:.6em 1em;font-size:.85rem}
.pill{display:inline-block;font-weight:800;font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;
  padding:.35em .8em;border-radius:999px;background:var(--gold);color:var(--red-deep)}
.border_r {
    border-radius: 15px;
}
/* ---------- Papel picado ---------- */
.papel{height:34px;width:100%;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='34' viewBox='0 0 240 34'%3E%3Cg%3E%3Cpath d='M0 0h60v14a30 20 0 0 1-60 0z' fill='%23E6187E'/%3E%3Cpath d='M60 0h60v14a30 20 0 0 1-60 0z' fill='%23F9D021'/%3E%3Cpath d='M120 0h60v14a30 20 0 0 1-60 0z' fill='%232F9E44'/%3E%3Cpath d='M180 0h60v14a30 20 0 0 1-60 0z' fill='%230E9E8E'/%3E%3Ccircle cx='30' cy='8' r='3' fill='%23FFF9EC'/%3E%3Ccircle cx='90' cy='8' r='3' fill='%239F2210'/%3E%3Ccircle cx='150' cy='8' r='3' fill='%23FFF9EC'/%3E%3Ccircle cx='210' cy='8' r='3' fill='%239F2210'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat:repeat-x;background-size:240px 34px;filter:drop-shadow(0 3px 2px rgba(0,0,0,.15))}
.cat-grid .cat-tile .t small {
    display: none;
}
/* ---------- Announcement bar ---------- */
.topbar{background:var(--ink);color:var(--gold-soft);font-size:.82rem;font-weight:600}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;min-height:38px;gap:16px}
.topbar a{color:var(--gold-soft)}
.topbar .tb-left{display:flex;align-items:center;gap:.5em}
.topbar .tb-right{display:flex;gap:18px;align-items:center;white-space:nowrap}
.topbar .tb-right .sep{opacity:.4}
.topbar .tb-right>a{font-weight:700;transition:color .15s}
.topbar .tb-right>a:hover{color:var(--white)}
.tb-social{display:inline-flex;gap:6px;align-items:center}
.tb-social a{width:26px;height:26px;border-radius:7px;display:grid;place-items:center;transition:color .15s,background .15s}
.tb-social a:hover{color:var(--gold);background:rgba(255,255,255,.1)}
.tb-social svg{width:15px;height:15px}
.venue-row .vr-photo:after {
    content: "elsternwick";
    position: absolute;
    height: 100%;
    width: 100%;
    left: 0;
    top: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 26px;
    text-transform: capitalize;
}
.venue-row .vr-photo.belgrave:after {
    content: "belgrave";
}
.venue-row .vr-photo.rowville:after {
    content: "rowville";
}
.venue-row .vr-photo.lorne:after {
    content: "lorne";
}
.venue-row .vr-body {
    padding: 50px 40px 60px;
}
.about_sec .wrap {
    display: grid;
    justify-content: space-around;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 50px;
    align-items: center;
}

.gallery-slider {
  position: relative;
  width: 100%;
  padding: 70px 0;
  overflow: hidden;
}
.whats_on {
    background: linear-gradient(180deg, #00000047, #9f2210ad), url(/assets/images/whats-on.webp) !important;
    min-height: 400px;
    display: flex;
    align-items: center;
    background-size: cover !important;
    background-position: center !important;
}
.gallery-slider__header {
  position: relative;
  margin: 0 auto 35px;
  padding: 0 20px;
}

.gallery-slider__header span {
  color: #811b0c;
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 2px;
}

.gallery-slider__header h2 {
  margin: 8px 0 0;
  font-size: clamp(1.5rem,4.6vw,3.2rem);
  line-height: 1.05;
}

.gallery-slider__controls {
  position: absolute;
  right: 20px;
  bottom: 0;
  display: flex;
  gap: 8px;
}

.gallery-slider__controls button {
  width: 46px;
  height: 46px;
  border: 1px solid #ddd;
  background: #fff;
  color: #222;
  border-radius: 50%;
  cursor: pointer;
  font-size: 20px;
  transition: all .3s ease;
}

.gallery-slider__controls button:hover {
  background: #9f2210;
  color: #fff;
  border-color: #9f2210;
}

.gallery-slider__viewport {
  width: 100%;
  overflow: hidden;
}

.gallery-slider__track {
  display: flex;
  gap: 20px;
  transition: transform .7s cubic-bezier(.22, .61, .36, 1);
  will-change: transform;
}

.gallery-slide {
  flex: 0 0 calc((100% - 60px) / 4);
  overflow: hidden;
  border-radius: 4px;
  aspect-ratio: 4 / 5;
  background: #eee;
}

.gallery-slide img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  transition: transform .6s ease;
}

.gallery-slide:hover img {
  transform: scale(1.05);
}
.lhero .bg:after{content: "";    position: absolute;
    inset: 0;
    z-index: 1;
    background: linear-gradient(94deg, rgb(0 0 0 / 82%), rgb(0 0 0 / 0%)), radial-gradient(70% 60% at 76% 38%, rgb(0 0 0 / 0%), #00000000 70%);}

/* Tablet */
@media (max-width: 991px) {
  .gallery-slide {
    flex-basis: calc((100% - 40px) / 3);
  }
}

/* Mobile */
@media (max-width: 767px) {
  .gallery-slider {
    padding: 50px 0;
  }
.vr-photo {
    min-height: 270px;
}
.gallery-slider__header {
    margin-bottom: 25px;
    padding: 0;
}

  .gallery-slider__controls {
    position: static;
    margin-top: 20px;
  }

  .gallery-slide {
    flex-basis: calc((100% - 20px) / 2);
  }
  .whats_on {
    min-height: unset !important;
}
}

/* Small mobile */
@media (max-width: 480px) {
  .gallery-slide {
    flex-basis: 85%;
  }
}
@media(max-width:860px){.topbar .tb-right{display:none}.topbar{font-size:.74rem}.topbar .tb-left{justify-content:center;width:100%}}

/* ---------- Header / nav ---------- */
.site-header{position:sticky;top:0;z-index:60;background:var(--red);color:var(--white);
  box-shadow:0 6px 24px -12px rgba(0,0,0,.5)}
.nav{display:flex;align-items:center;gap:20px;min-height:78px}
.brand{display:flex;align-items:center;gap:12px;margin-right:6px}
.brand-logo{height:56px;width:auto;display:block}
@media(max-width:480px){.brand-logo{height:44px}}
.menu{display:flex;align-items:center;gap:2px;margin-left:auto;list-style:none;padding:0;margin:0 0 0 auto}
.menu>li{list-style:none;position:static}
.menu>li>a{display:flex;align-items:center;gap:.35em;padding:14px 10px;font-weight:700;font-size:.92rem;
  border-radius:10px;color:var(--white);transition:background .15s}
.menu>li>a:hover,.menu>li.open>a,.menu>li.current>a{background:rgba(0,0,0,.18);color:var(--gold)}
.menu>li>a .chev{width:9px;height:9px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;
  transform:rotate(45deg);margin-top:-3px;transition:transform .2s;opacity:.8}
.menu>li.has-mega:hover>a .chev{transform:rotate(-135deg);margin-top:2px}
.nav-cta{display:flex;gap:10px;align-items:center;margin-left:10px}
.nav-cta .btn{padding:.62em 1.05em;font-size:.86rem}
.nav-cta .has-mega{display:flex}
.nav-cta .dd{font-size:.7em;opacity:.85;margin-left:.1em}

/* Mega menu */
.mega{position:absolute;left:0;right:0;top:100%;background:var(--paper);color:var(--ink);
  border-top:4px solid var(--gold);box-shadow:var(--shadow);
  opacity:0;visibility:hidden;transform:translateY(8px);transition:.18s ease;z-index:70}
.has-mega:hover>.mega,.has-mega:focus-within>.mega{opacity:1;visibility:visible;transform:none}
.mega .wrap{padding:26px 22px 30px}
.mega-grid{display:grid;gap:18px}
.mega-grid.cols-4{grid-template-columns:repeat(4,1fr)}
.mega-grid.cols-3{grid-template-columns:repeat(3,1fr)}
.mega-split{display:grid;grid-template-columns:.9fr 2.5fr;gap:18px;align-items:stretch}
.mega h4{font-size:.78rem;text-transform:uppercase;letter-spacing:.14em;color:var(--red);margin-bottom:10px}
.mega-aside{background:linear-gradient(160deg,var(--red),var(--red-deep));color:var(--cream);
  border-radius:var(--radius-sm);padding:20px;display:flex;flex-direction:column;justify-content:center}
.mega-aside b{font-family:var(--font-display);font-weight:400;color:var(--gold);font-size:1.3rem}
.mega-aside .eyebrow{color:var(--gold-soft)}
.mega-aside p{margin:.5em 0 1em;font-size:.9rem}

/* ---------- Per-venue mega panel ----------
   One nav item per venue; the panel anchors under its own item
   (the full-width .mega is still used by the Order Online CTA). */
.menu>li.venue-item{position:relative}
.menu>li.venue-item>a{font-size:.9rem}
.venue-mega{left:50%;right:auto;width:min(430px,92vw);border-radius:0 0 16px 16px;
  overflow:hidden;transform:translate(-50%,8px)}
.has-mega:hover>.venue-mega,.has-mega:focus-within>.venue-mega{transform:translate(-50%,0)}
/* The last venue sits closest to the CTA buttons — right-align its panel so it
   stays on screen. Flagged in PHP (.vm-end), not by position, because other nav
   items now follow the venues. */
.menu>li.venue-item.vm-end .venue-mega{left:auto;right:0;transform:translate(0,8px)}
.menu>li.venue-item.vm-end:hover>.venue-mega,
.menu>li.venue-item.vm-end:focus-within>.venue-mega{transform:translate(0,0)}

.vm-inner{padding:0}
.vm-photo{display:flex;flex-direction:column;justify-content:flex-end;gap:2px;
  height:150px;padding:16px 18px;color:#fff;background-size:cover;background-position:center;position:relative}
.vm-name{font-family:var(--font-display);font-weight:400;font-size:1.5rem;line-height:1;
  letter-spacing:.3px;text-shadow:0 2px 8px rgba(0,0,0,.5)}
.vm-addr{font-size:.78rem;font-weight:600;opacity:.92;text-shadow:0 1px 6px rgba(0,0,0,.6)}
.vm-tag{position:absolute;top:12px;right:12px;background:rgba(0,0,0,.42);border-radius:999px;
  padding:.25em .7em;font-size:.62rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.vm-links{padding:10px}
.vm-links a{display:flex;align-items:center;gap:12px;padding:11px 12px;border-radius:12px;transition:background .14s}
.vm-links a:hover{background:var(--cream)}
.vm-links a+a{border-top:1px solid rgba(159,34,16,.09)}
.vm-links svg{width:22px;height:22px;flex:none;color:var(--red)}
.vm-links b{display:block;font-size:.92rem;color:var(--ink)}
.vm-links small{display:block;font-size:.76rem;color:var(--ink-soft)}

/* Venue card used inside the mega menu */
.loc-card{background:var(--white);border:1px solid rgba(159,34,16,.12);border-radius:var(--radius-sm);
  padding:16px;box-shadow:var(--shadow-soft);transition:transform .15s,box-shadow .15s;display:block}
.loc-card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.lc-img{position:relative;height:58px;border-radius:10px;overflow:hidden;display:flex;align-items:flex-end;
  padding:8px;margin-bottom:10px;background-size:cover;background-position:center}
.lc-name{position:relative;z-index:1;font-family:var(--font-display);font-weight:400;color:#fff;font-size:1.06rem;
  letter-spacing:.3px;text-shadow:0 2px 6px rgba(0,0,0,.55)}
.loc-card .addr{font-size:.82rem;color:var(--ink-soft);margin:6px 0 10px;min-height:34px}
.loc-card .links{display:flex;flex-wrap:wrap;gap:6px}
.mini{font-size:.74rem;font-weight:800;padding:.4em .7em;border-radius:999px;background:var(--cream);color:var(--red-deep)}
.mini.gold{background:var(--gold)}
.mini:hover{background:var(--gold-soft)}

/* Category chips inside the Our Menu mega */
.cat-cloud{display:flex;flex-wrap:wrap;gap:8px;align-content:flex-start}
.cat-chip{display:inline-flex;align-items:center;gap:.4em;font-size:.82rem;font-weight:700;
  padding:.5em .9em;border-radius:999px;background:var(--white);border:1px solid rgba(159,34,16,.14);
  color:var(--red-deep);box-shadow:var(--shadow-soft);transition:.15s}
.cat-chip:hover{background:var(--gold);border-color:var(--gold-deep);transform:translateY(-2px)}
/* Order-online table inside the mega */
.order-table{width:100%;border-collapse:collapse;background:var(--white);border-radius:var(--radius-sm);
  overflow:hidden;box-shadow:var(--shadow-soft);font-size:.86rem}
.order-table th{background:var(--red);color:var(--gold);text-align:left;font-size:.7rem;text-transform:uppercase;
  letter-spacing:.12em;padding:10px 14px;font-weight:800}
.order-table td{padding:11px 14px;border-top:1px solid rgba(159,34,16,.1);vertical-align:middle}
.order-table tr:hover td{background:var(--cream)}
.order-table .v{font-weight:800;color:var(--red)}
.order-table .acts{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
@media(max-width:1080px){.mega-split{grid-template-columns:1fr}.mega-grid.cols-4{grid-template-columns:repeat(2,1fr)}}

/* Mobile nav */
.hamburger{display:none;margin-left:auto;background:none;border:0;color:var(--white);cursor:pointer;padding:8px}
.hamburger span{display:block;width:26px;height:3px;background:currentColor;border-radius:3px;margin:5px 0;transition:.2s}
.mobile-nav{display:none}
@media(max-width:1160px){
  .menu,.nav-cta{display:none}
  .hamburger{display:block}
  .mobile-nav{display:block;position:fixed;inset:0 0 0 auto;width:min(360px,86vw);background:var(--red);
    color:#fff;z-index:120;transform:translateX(100%);transition:transform .25s ease;overflow-y:auto;padding:18px 18px 40px;box-shadow:var(--shadow)}
  .mobile-nav.show{transform:none}
  .m-back{position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:110;opacity:0;visibility:hidden;transition:.2s}
  .m-back.show{opacity:1;visibility:visible}
}
.mobile-nav .m-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.mobile-nav .close{background:none;border:0;color:#fff;font-size:1.8rem;cursor:pointer;line-height:1}
.m-item>a{display:flex;justify-content:space-between;align-items:center;padding:14px 6px;font-weight:700;
  border-bottom:1px solid rgba(255,255,255,.14);font-size:1.02rem}
.m-item .sub{max-height:0;overflow:hidden;transition:max-height .25s ease}
.m-item.open .sub{max-height:900px}
.m-item .sub a{display:block;padding:10px 6px 10px 18px;font-size:.9rem;color:var(--gold-soft)}
.m-item .plus{transition:transform .2s}
.m-item.open .plus{transform:rotate(45deg)}
.mobile-nav .m-cta{margin-top:18px;display:grid;gap:10px}

/* ---------- Hero (homepage) ---------- */
.hero{position:relative;background:radial-gradient(120% 90% at 70% 0%,var(--red-bright),var(--red) 45%,var(--red-deep));
  color:#fff;overflow:hidden}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.hero-overlay{position:absolute;inset:0;z-index:1;
  background:linear-gradient(94deg, rgb(0 0 0), rgb(0 0 0 / 22%)), radial-gradient(70% 60% at 76% 38%, rgb(0 0 0 / 0%), #00000000 70%);}
.hero-inner{position:relative;z-index:2;padding:88px 0 96px;max-width:820px}
.hero .kicker{display:inline-flex;align-items:center;gap:.6em;background:rgba(0,0,0,.28);
  padding:.5em 1em;border-radius:999px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;font-size:.74rem;color:var(--gold)}
.hero h1{font-family:var(--font-display);font-weight:400;font-size:clamp(2.9rem,7vw,5.6rem);
  line-height:.94;margin:.35em 0 .3em;text-shadow:0 6px 0 rgba(0,0,0,.18)}
.hero h1 .g{color:var(--gold)}
.hero p.lede{font-size:clamp(1.05rem,2.4vw,1.3rem);max-width:600px;color:var(--cream);font-weight:500}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}

/* ---------- Stats bar (horizontal, under the hero) ---------- */
.statbar{background:var(--red-deep);color:var(--cream);border-top:4px solid var(--gold);position:relative;z-index:3}
.statbar .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.statbar .s{padding:26px 20px;text-align:center;border-left:1px solid rgba(255,255,255,.12)}
.statbar .s:first-child{border-left:0}
.statbar b{font-family:var(--font-display);font-weight:400;font-size:2.5rem;color:var(--gold);display:block;line-height:1}
.statbar span{font-weight:700;font-size:.84rem;opacity:.9}
@media(max-width:820px){.statbar .wrap{grid-template-columns:1fr 1fr}.statbar .s:nth-child(3){border-left:0}
  .statbar .s:nth-child(n+3){border-top:1px solid rgba(255,255,255,.12)}}

/* wavy divider */
.wave{display:block;width:100%;height:60px}
.wave path{fill:var(--paper)}

/* ---------- Section shells ---------- */
section{position:relative}
.sec{padding:78px 0}
.sec-head{max-width:720px;margin:0 auto 42px;text-align:center}
.sec-head .eyebrow{color:var(--red);display:inline-block;margin-bottom:10px}
.sec-head h2{font-family:var(--font-display);font-weight:400;font-size:clamp(2rem,4.6vw,3.2rem);color:var(--red);line-height:.98}
.sec-head p{color:var(--ink-soft);font-size:1.05rem}
.on-dark{background:var(--red-deep);color:#fff}
.on-dark .sec-head h2{color:var(--gold)}
.on-dark .sec-head .eyebrow{color:var(--gold)}
.on-dark .sec-head p{color:var(--cream)}

/* ---------- Intro ---------- */
.intro{background:var(--cream)}
.intro h2{font-family:var(--font-display);font-weight:400;color:var(--red);font-size:clamp(1.9rem,4vw,2.8rem);line-height:1}
.intro .lede{font-size:1.12rem;color:var(--ink-soft)}
.intro-narrow{max-width:820px;margin:0 auto;text-align:center}

/* ---------- Venue sections (homepage: one per location) ---------- */
.venue-row{display:grid;grid-template-columns:1fr 1fr;gap:0;align-items:stretch;
  background:var(--white);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);
  border:1px solid rgba(159,34,16,.1);margin-bottom:34px}
.venue-row:nth-child(even) .vr-photo{order:2}
.vr-photo{position:relative;min-height:340px;background-size:cover;background-position:center;
  display:flex;align-items:flex-end;padding:18px;color:#fff}
.vr-photo .ph-tag{background:rgba(0,0,0,.4);padding:.35em .8em;border-radius:999px;font-size:.72rem;font-weight:800;letter-spacing:.05em}
.vr-body{padding:38px 40px}
.vr-body .eyebrow{color:var(--red)}
.vr-body h3{font-family:var(--font-display);font-weight:400;color:var(--red);font-size:clamp(1.7rem,3.2vw,2.4rem);line-height:1;margin:.2em 0 .35em}
.vr-body .blurb{font-size:1.04rem;color:var(--ink-soft)}
.vr-meta{display:grid;gap:8px;margin:16px 0 20px}
.vr-meta .row{display:flex;gap:10px;align-items:flex-start;font-size:.9rem;color:var(--ink-soft)}
.vr-meta .row .k{width:18px;flex:none;text-align:center}
.vr-actions{display:flex;flex-wrap:wrap;gap:9px}
@media(max-width:960px){.venue-row{grid-template-columns:1fr}
  .venue-row:nth-child(even) .vr-photo{order:0}
  .vr-photo{min-height:300px}.vr-body{padding:28px 24px}}

/* ---------- Venue cards grid (locations index) ---------- */
.venue-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:26px}
.vcard{background:var(--white);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);
  border:1px solid rgba(159,34,16,.1);display:flex;flex-direction:column;transition:transform .18s}
.vcard:hover{transform:translateY(-5px)}
.vcard .ph{position:relative;aspect-ratio: 16 / 9; height: unset;background-size:cover;background-position:center;
  display:flex;align-items:flex-end;padding:16px;color:#fff}
.vcard .ph .ph-tag{background:rgba(0,0,0,.4);padding:.3em .7em;border-radius:999px;font-size:.7rem;font-weight:800}
.vcard .ph h3{font-family:var(--font-display);font-weight:400;font-size:1.8rem;margin:0;text-shadow:0 2px 8px rgba(0,0,0,.5)}
.vcard .body{padding:22px 24px 26px;flex:1;display:flex;flex-direction:column}
.vcard .body p{font-size:.94rem;color:var(--ink-soft)}
.vcard .body .acts{margin-top:auto;display:flex;flex-wrap:wrap;gap:8px;padding-top:14px}
@media(max-width:860px){.venue-grid{grid-template-columns:1fr}}

/* ---------- Menu category grid (from the CMS) ---------- */
.cat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:40px 20px}
.cat-tile{border-radius:var(--radius-sm);
  overflow:hidden;transition:transform .16s,box-shadow .16s;display:flex;flex-direction:column; position: relative;}
.cat-tile:hover{transform:translateY(-4px);}
.cat-tile .shot {
    height: 180px;
    background-size: cover;
    background-position: 0px 40px;
    background-repeat: no-repeat;
    transition: background-position 0.5s ease-in-out;
}
.cat-tile:hover > .shot {
    background-position: center;
}
/* Empty slot waiting on a category image from the admin panel */
.cat-tile .shot.placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;
  background:var(--cream);border-bottom:1px solid rgba(159,34,16,.1);position:relative}
.cat-tile .shot.placeholder::after{content:"";position:absolute;inset:12px;
  border:2px dashed rgba(159,34,16,.22);border-radius:10px;pointer-events:none}
.cat-tile .shot.placeholder svg{width:34px;height:34px;color:rgba(159,34,16,.4)}
.cat-tile .shot.placeholder span{font-size:.68rem;font-weight:800;letter-spacing:.1em;
  text-transform:uppercase;color:rgba(159,34,16,.5)}
.cat-tile .t{padding:16px 14px 18px;text-align:center; background: #fff;}
/*.cat-tile:hover .t{background:var(--gold-soft)}*/
.cat-tile b{display:block;font-family:var(--font-display);font-weight:400;color:var(--red);font-size:1.12rem;letter-spacing:.3px}
.cat-tile small{color:var(--ink-soft);font-size:.78rem;font-weight:600}
@media(max-width:980px){.cat-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:680px){.cat-grid{grid-template-columns:repeat(2,1fr)}.cat-tile .shot{height:110px}}

/* ---------- Split CTA bands ---------- */
.band{display:grid;grid-template-columns:1fr 1fr}
.band>div{padding:64px 8%}
.band .franchise{background:linear-gradient(160deg,var(--gold),var(--gold-deep));color:var(--red-deep)}
.band .careers{background:linear-gradient(160deg,var(--red),var(--red-deep));color:var(--cream)}
.band h3{font-family:var(--font-display);font-weight:400;font-size:clamp(1.8rem,3.4vw,2.6rem);line-height:1}
.band .franchise h3{color:var(--red-deep)}
.band .careers h3{color:var(--gold)}
.band p{max-width:42ch}
@media(max-width:820px){.band{grid-template-columns:1fr}.band>div{padding:48px 26px}}

/* ---------- Newsletter ---------- */
.news{background:var(--ink);color:var(--cream);text-align:center;padding:64px 0}
.news h2{font-family:var(--font-display);font-weight:400;color:var(--gold);font-size:clamp(1.8rem,4vw,2.6rem)}
.news form{display:flex;gap:10px;max-width:560px;margin:18px auto 0}
.news input{flex:1;border:0;border-radius:999px;padding:.9em 1.2em;font-family:var(--font);font-size:1rem}
@media(max-width:560px){.news form{flex-direction:column}}

/* ---------- Page hero (inner pages) ---------- */
.phero{background:linear-gradient(160deg,var(--red-bright),var(--red) 55%,var(--red-deep));color:#fff;padding:46px 0 54px;text-align:center}
.phero h1{font-family:var(--font-display);font-weight:400;font-size:clamp(2.2rem,5vw,3.4rem);line-height:1}
.phero p{color:var(--cream);max-width:60ch;margin:10px auto 0}
.crumb{font-size:.8rem;color:var(--cream);opacity:.85;margin-bottom:12px;font-weight:600}
.crumb a:hover{color:var(--gold)}

/* ---------- Prose (legal pages) ---------- */
.prose{max-width:820px;margin:0 auto;background:var(--white);border-radius:var(--radius);
  box-shadow:var(--shadow);border:1px solid rgba(159,34,16,.1);padding:42px 46px}
.prose h2{font-family:var(--font-display);font-weight:400;color:var(--red);font-size:1.6rem;margin:1.6em 0 .5em}
.prose h2:first-child{margin-top:0}
.prose h3{font-size:1.02rem;color:var(--red-deep);margin:1.4em 0 .4em}
.prose p,.prose li{color:var(--ink-soft);font-size:.98rem}
.prose ul{padding-left:1.25em;margin:0 0 1em}
.prose li{margin-bottom:.4em}
.prose a{color:var(--red);font-weight:700;text-decoration:underline}
.prose .updated{font-size:.85rem;font-weight:700;color:var(--red);background:var(--cream);
  display:inline-block;padding:.45em .9em;border-radius:999px;margin-bottom:1.4em}
.prose table{width:100%;border-collapse:collapse;margin:0 0 1.2em;font-size:.9rem}
.prose th,.prose td{border:1px solid rgba(159,34,16,.16);padding:9px 12px;text-align:left}
.prose th{background:var(--cream);color:var(--red-deep)}
@media(max-width:620px){.prose{padding:28px 22px}}

/* ---------- Form + side image layout (contact / careers) ---------- */
.form-split{display:grid;grid-template-columns:1.35fr .85fr;gap:30px;align-items:start;
  max-width:1120px;margin:0 auto}
.form-split .form-card{max-width:none;margin:0}
.form-title{color:var(--red);font-family:var(--font-display);font-weight:400;
  font-size:clamp(1.5rem,3vw,2.1rem);line-height:1.05;margin:.25em 0 .3em}
.form-intro{color:var(--ink-soft);font-size:.96rem;margin-bottom:22px}
.form-fine{margin:14px 0 0;font-size:.8rem;color:var(--ink-soft)}
.form-fine a{color:var(--red);font-weight:700;text-decoration:underline}

.form-side{display:grid;gap:20px;position:sticky;top:100px}
.fs-media{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);
  border:1px solid rgba(159,34,16,.12)}
.fs-media .img-slot.tall{min-height:300px;border-radius:0}
.fs-card{background:linear-gradient(160deg,var(--red),var(--red-deep));color:var(--cream);
  border-radius:var(--radius);padding:26px 26px 28px;box-shadow:var(--shadow)}
.fs-card h3{font-family:var(--font-display);font-weight:400;color:var(--gold);font-size:1.4rem;margin-bottom:.5em}
.fs-card a{color:var(--gold);font-weight:700}
ul.tick{list-style:none;margin:0;padding:0;display:grid;gap:11px;font-size:.92rem}
ul.tick li{position:relative;padding-left:26px;line-height:1.5}
ul.tick li::before{content:"";position:absolute;left:0;top:.42em;width:14px;height:8px;
  border-left:2.5px solid var(--gold);border-bottom:2.5px solid var(--gold);transform:rotate(-45deg)}
@media(max-width:960px){.form-split{grid-template-columns:1fr}.form-side{position:static}
  .fs-media .img-slot.tall{min-height:200px}}

/* ---------- File upload (résumé) ---------- */
.file-drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;
  padding:26px 18px;border:2px dashed rgba(159,34,16,.28);border-radius:14px;background:var(--paper);
  cursor:pointer;text-align:center;transition:border-color .15s,background .15s}
.file-drop:hover,.file-drop.over{border-color:var(--red);background:var(--cream)}
.file-drop svg{width:30px;height:30px;color:var(--red);opacity:.7}
.file-drop .fd-main{font-weight:800;font-size:.92rem;color:var(--red-deep)}
.file-drop .fd-sub{font-size:.76rem;color:var(--ink-soft)}
.file-drop .fd-name{display:none;font-size:.84rem;font-weight:800;color:var(--green);
  background:#dcfce7;border-radius:999px;padding:.3em .9em;margin-top:4px;max-width:100%;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.file-drop.has-file{border-color:var(--green);background:#f4fdf6}
.file-drop.has-file .fd-name{display:block}
.file-drop.has-file .fd-main{color:var(--green)}

/* ---------- Contact page venue grid (2 x 2) ---------- */
.contact-venues{display:grid;grid-template-columns:repeat(2,1fr);gap:26px;max-width:1000px;margin:0 auto}
.cv-card{background:#fff;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);
  border:1px solid rgba(159,34,16,.1);display:flex;flex-direction:column;transition:transform .18s}
.cv-card:hover{transform:translateY(-4px)}
.cv-media{display:block}
.cv-media .img-slot{height:190px}
.cv-body{padding:22px 24px 24px;display:flex;flex-direction:column;flex:1}
.cv-body h3{font-family:var(--font-display);font-weight:400;color:var(--red);font-size:1.5rem;margin-bottom:.4em}
.cv-body .row{display:flex;gap:9px;align-items:flex-start;font-size:.88rem;color:var(--ink-soft);margin-bottom:7px}
.cv-body .row .k{width:16px;flex:none;text-align:center}
.cv-body .row a:hover{color:var(--red)}
.cv-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto;padding-top:14px}


/* ---------- Forms ---------- */
.form-card{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow);border:1px solid rgba(159,34,16,.1);padding:30px;max-width:720px;margin:0 auto}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media(max-width:600px){.form-grid{grid-template-columns:1fr}}
.field{margin-bottom:16px}
.field.full{grid-column:1/-1}
label{display:block;font-weight:700;font-size:.85rem;margin-bottom:5px}
input,select,textarea{width:100%;padding:12px 14px;border:1.5px solid rgba(159,34,16,.18);border-radius:12px;font:inherit;background:var(--paper)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--red);box-shadow:0 0 0 3px rgba(159,34,16,.12)}
textarea{min-height:120px;resize:vertical}
.alert{padding:12px 16px;border-radius:10px;margin-bottom:16px;font-weight:600;font-size:.92rem}
.alert.success{background:#dcfce7;color:#166534}.alert.error{background:#fee2e2;color:#991b1b}
.info-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:30px}
@media(max-width:760px){.info-cards{grid-template-columns:1fr}}
.icard{background:#fff;border-radius:var(--radius-sm);box-shadow:var(--shadow-soft);padding:20px;text-align:center;border:1px solid rgba(159,34,16,.08)}
.icard .i{font-size:1.8rem}
.icard b{display:block;color:var(--red);font-family:var(--font-display);font-weight:400;font-size:1.2rem;margin:4px 0}

/* ---------- Footer ---------- */
.key{height:16px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='16' viewBox='0 0 48 16'%3E%3Cpath d='M0 15h6V6h6v6h6V3h9v9h-6V9h-6v6H0z' fill='none' stroke='%23F9D021' stroke-width='2'/%3E%3C/svg%3E");
  background-repeat:repeat-x;background-size:auto 16px;opacity:.9}
.footer{background:var(--red-deep);color:var(--cream);padding:56px 0 0}
.footer-logo{height:66px;margin-bottom:12px}
.f-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.3fr;gap:34px}
.footer .tagline{color:var(--cream);opacity:.85;margin:14px 0 16px;max-width:34ch;font-size:.92rem}
.social{display:flex;gap:10px}
.social a{width:38px;height:38px;border-radius:10px;background:rgba(255,255,255,.1);display:grid;place-items:center;transition:background .15s}
.social a:hover{background:var(--gold);color:var(--red-deep)}
.social svg{width:18px;height:18px}
.footer h4{color:var(--gold);font-size:.82rem;text-transform:uppercase;letter-spacing:.14em;margin-bottom:14px}
.footer ul{list-style:none;margin:0;padding:0;display:grid;gap:9px}
.footer a.fl{font-size:.9rem;opacity:.9}
.footer a.fl:hover{opacity:1;color:var(--gold)}
.f-loc{margin-bottom:10px}
.f-loc b{color:#fff;font-weight:800;font-size:.9rem}
.f-loc small{display:block;opacity:.8;font-size:.8rem;margin-top:2px}
.f-loc a:hover b{color:var(--gold)}
.f-bottom{border-top:1px solid rgba(255,255,255,.14);margin-top:40px;padding:20px 0 26px;
  display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:.78rem;opacity:.82}
.f-bottom .legal{display:flex;gap:16px;flex-wrap:wrap}
.ack{font-size:.75rem;opacity:.7;max-width:70ch;margin-top:8px}
@media(max-width:900px){.f-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.f-grid{grid-template-columns:1fr}}

/* ---------- Booking widget (OpenTable) ----------
   The widget is a cross-origin iframe, so its interior cannot be styled from here.
   To make it read as part of the page we match the frame to the widget's own white
   background — no visible seam where the iframe starts — and let our brand furniture
   (gold rule, brand border, radius, type) sit around it. */
.book-strip{background:linear-gradient(180deg,var(--cream),var(--cream-2))}
/* width:fit-content + margin:auto centres the frame when the widget fits; when it
   does not (the "wide" layout on a phone) the frame caps at 100% and the widget
   scrolls from its LEFT edge — never centred-and-clipped. */
.book-widget {
    background: transparent;
    margin: 0 auto -180px;
    width: fit-content;
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    font-family: var(--font);
    color: var(--ink);
    z-index: 4;
    position: relative;
}
.book-widget iframe{display:block;border:0;max-width:none;color-scheme:light}
/* OpenTable sometimes wraps the frame in its own div — strip its stray spacing */
.book-widget div[id^="ot-"],.book-widget div[class^="ot-"]{margin:0 auto!important;padding:0!important;
  background:transparent!important;border:0!important;box-shadow:none!important}
.book-note{text-align:center;margin:18px auto 0;font-size:.9rem;color:var(--ink-soft);max-width:60ch}
.book-note a{color:var(--red);font-weight:800}
@media(max-width:620px){.book-widget{padding:12px;border-radius:var(--radius-sm); margin: 0 auto;}}

/* ---------- Booking modal ---------- */
.modal{position:fixed;inset:0;z-index:200;display:none;align-items:center;justify-content:center;
  padding:20px;background:rgba(20,6,3,.74)}
.modal.open{display:flex}
.modal-box{background:var(--paper);border-radius:20px;max-width:520px;width:100%;max-height:92vh;
  overflow:auto;box-shadow:var(--shadow);border-top:5px solid var(--gold)}
/* Wide enough for the full "wide" OpenTable widget (~840px) plus padding,
   without ever exceeding the viewport. */
.modal-book{max-width:min(1000px,100%);overflow:hidden;display:flex;flex-direction:column}
.modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;
  padding:18px 22px;background:linear-gradient(150deg,var(--red-bright),var(--red-deep));color:#fff}
.modal-head .eyebrow{display:block;color:var(--gold-soft);font-size:.66rem;margin-bottom:3px}
.modal-head b{display:block;font-family:var(--font-display);font-weight:400;font-size:1.45rem;
  line-height:1.05;color:var(--gold)}
.modal-head small{display:block;font-size:.8rem;opacity:.9;margin-top:4px}
.modal-head .x{background:none;border:0;color:#fff;font-size:1.9rem;cursor:pointer;line-height:1;
  padding:0 2px;opacity:.85;transition:opacity .15s}
.modal-head .x:hover{opacity:1}
.modal-body{padding:22px;min-height:120px;overflow:auto}
.modal-book .modal-body{background:var(--cream);padding:18px}
/* inside the popup the modal already frames things — keep the widget flush and
   give it every available pixel so the wide layout is never clipped */
.modal-book .book-widget{box-shadow:none;border-top-width:1px;padding:14px;margin:0 auto;
  width:fit-content;min-width:min(100%,860px);max-width:100%;
  /* the widget scrolls from its left edge if the viewport is too narrow for it */
  overflow-x:auto}
.modal-foot{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;
  padding:14px 22px;background:var(--paper);border-top:1px solid rgba(159,34,16,.14);
  font-size:.85rem;color:var(--ink-soft)}
.modal-foot a[href^="tel:"]{color:var(--red);font-weight:800}
@media(max-width:1060px){.modal{padding:12px}}
@media(max-width:620px){.modal{padding:8px}.modal-head{padding:14px 16px}
  .modal-body,.modal-book .modal-body{padding:12px}
  .modal-book .book-widget{min-width:0;padding:10px}
  .modal-head b{font-size:1.2rem}.modal-foot{padding:12px 16px}}

/* ============================================================
   VENUE PAGE (locations/<slug>) — global, no per-page <style>
   ============================================================ */
.lhero{position:relative;color:#fff;padding:0;overflow:hidden;
  background:linear-gradient(160deg,var(--red-bright),var(--red) 55%,var(--red-deep))}
.lhero .bg{position:absolute;inset:0;background-size:cover;background-position:center;z-index:0}
.lhero .wrap{position:relative;z-index:2;padding:80px 22px}
.lhero .sub{color:var(--gold);font-weight:800;letter-spacing:.14em;text-transform:uppercase;font-size:.78rem}
.lhero h1{font-family:var(--font-display);font-weight:400;font-size:clamp(2.4rem,6vw,4.2rem);line-height:.95;margin:6px 0 12px;
  text-shadow:0 4px 18px rgba(0,0,0,.4)}
.lhero p{color:var(--cream);max-width:56ch}
.facts{display:flex;flex-wrap:wrap;gap:10px;margin:16px 0 22px}
.fact{background:rgba(0,0,0,.34);padding:.5em .9em;border-radius:999px;font-size:.82rem;font-weight:700}
.lcta{display:flex;flex-wrap:wrap;gap:10px}

.linfo{background:var(--paper);border-bottom:1px solid rgba(159,34,16,.12)}
.linfo .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;padding:20px 22px}
.icb{display:flex;gap:12px}
.icb .i{width:40px;height:40px;border-radius:10px;background:var(--cream);display:grid;place-items:center;font-size:1.2rem;flex:none}
.icb h4{font-size:.72rem;text-transform:uppercase;letter-spacing:.1em;color:var(--red);margin:0 0 3px}
.icb p,.icb a{font-size:.85rem;color:var(--ink-soft);margin:0}
@media(max-width:860px){.linfo .wrap{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.linfo .wrap{grid-template-columns:1fr}}

/* venue story (long per-venue copy from the CMS) */
.vstory{background:var(--cream)}
.vstory-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:44px;align-items:center}
.vstory h2{font-family:var(--font-display);font-weight:400;color:var(--red);font-size:clamp(1.8rem,3.8vw,2.6rem);line-height:1}
.vstory p{color:var(--ink-soft);font-size:1.02rem}
.vstory .shot{border-radius:var(--radius);min-height:340px;background-size:cover;background-position:center;
  box-shadow:var(--shadow);border:4px solid var(--gold);display:flex;align-items:flex-end;padding:16px;color:#fff}
.vstory .shot .ph-tag{background:rgba(0,0,0,.42);padding:.35em .8em;border-radius:999px;font-size:.72rem;font-weight:800}
@media(max-width:900px){.vstory-grid{grid-template-columns:1fr;gap:26px}.vstory .shot{min-height:220px;order:-1}}

/* ---------- Reusable image slot ----------
   Empty = dashed placeholder; .filled = the actual picture. */
.img-slot{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:6px;aspect-ratio: 16 / 9;
    height: unset; background:var(--cream);background-size:cover;background-position:center;width: 100%;}
.img-slot::after{content:"";position:absolute;inset:10px;border:2px dashed rgba(159,34,16,.22);
  border-radius:10px;pointer-events:none}
.img-slot svg{width:30px;height:30px;color:rgba(159,34,16,.4)}
.img-slot span{font-size:.64rem;font-weight:800;letter-spacing:.09em;text-transform:uppercase;
  color:rgba(159,34,16,.5);text-align:center;padding:0 10px}
.img-slot.filled::after,.img-slot.filled svg,.img-slot.filled span{display:none;content:none}
.img-slot.sm{height:120px}
.img-slot.tall{height:100%;min-height:330px;border-radius:var(--radius)}

.deal-sched{display:inline-block;background:var(--red);color:var(--gold);font-weight:800;font-size:.8rem;padding:.4em .95em;border-radius:999px}
.lunch{background:linear-gradient(180deg,var(--cream),var(--cream-2))}
.lunch-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.ltile{background:#fff;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-soft);
  border:1px solid rgba(159,34,16,.1);display:flex;flex-direction:column}
.ltile .lt-body{padding:20px 22px 22px}
.ltile .price{font-family:var(--font-display);color:var(--red);font-size:2rem;line-height:1}
.ltile h4{margin:6px 0 3px}.ltile p{font-size:.82rem;color:var(--ink-soft);margin:0}

.dcards{display:grid;grid-template-columns:repeat(auto-fit,minmax(205px,1fr));gap:16px}
.dcard{background:var(--paper);color:var(--ink);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);
  display:flex;flex-direction:column}
.dcard .img-slot {
    background: var(--cream-2);
    background-size: cover;
    aspect-ratio: 16 / 9;
    height: unset;
    background-position: center;
}
.loc-card .lc-img {
    min-height: 200px;
}
.cat-grid .shot:after, .cat-grid .shot:before {
    content: "";
    position: absolute;
    background: url(/assets/images/star.webp);
    width: 30px;
    height: 30px;
    left: 15px;
    top: 93px;
    background-size: cover;
    background-repeat: no-repeat;
    transition: transform 0.5s ease-in-out;
    transform: scale(0);
}
.cat-grid .shot:before {
    background: url(/assets/images/star-img.webp);
    top: 30px;
    right: 40px;
    left: unset;
    background-size: cover;
    background-position: center;
}
.cat-grid .cat-tile:hover > .shot:after {
  transform: scale(1.5);
}
.cat-grid .cat-tile:hover > .shot:before {
  transform: scale(1.1);
}
.dcard .top{padding:18px 16px;color:#fff;background:linear-gradient(150deg,var(--red-bright),var(--red-deep));margin-top:auto}
.dcard .top .day{font-weight:800;text-transform:uppercase;letter-spacing:.1em;font-size:.7rem;opacity:.9}
.dcard .top .big{font-family:var(--font-display);font-weight:400;font-size:1.4rem;line-height:1;margin-top:4px}

/* ---------- Happy Hour / Bottomless Brunch feature sections ---------- */
.deal-feature .df-grid{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:stretch}
.deal-feature .df-grid.reverse .df-media{order:2}
.deal-feature .df-media{border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.deal-feature .df-body{display:flex;flex-direction:column;justify-content:center}
.deal-feature .df-lede{margin:.4em 0 .2em;opacity:.92}
.deal-feature .df-note{font-size:.84rem;background:rgba(255,255,255,.4);border-radius:12px;padding:12px;margin-top:12px}
@media(max-width:900px){.deal-feature .df-grid{grid-template-columns:1fr}
  .deal-feature .df-grid.reverse .df-media{order:0}
  .img-slot.tall{min-height:220px}}

.panel{border-radius:var(--radius);padding:28px;box-shadow:var(--shadow)}
.panel.hh{background:linear-gradient(160deg,var(--red),var(--red-deep));color:var(--cream)}
.panel.brunch {
    background: linear-gradient(160deg,var(--gold),var(--gold-deep));
    color: var(--red-deep);
    padding: 50px 30px;
}
.panel h3 {
    font-family: var(--font-display);
    font-weight: 400;
    font-size: 2.2rem;
    margin: 20px 0 5px;
}
.panel.hh h3{color:var(--gold)}
.hh-list{list-style:none;margin:10px 0 0;padding:0}
.hh-list li{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px dashed rgba(255,255,255,.28);font-weight:600}
.hh-list li .pr{font-family:var(--font-display)}
.brunch .big{font-family:var(--font-display);font-size:2.6rem;line-height:1}
.na-note{background:#fff;border:1px dashed rgba(159,34,16,.35);border-radius:14px;padding:16px;text-align:center;color:var(--ink-soft);margin-top:20px}

.order-cards{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;max-width:760px;margin:0 auto}
.ocard{background:var(--paper);color:var(--ink);border-radius:var(--radius);padding:26px;text-align:center;box-shadow:var(--shadow)}
.ocard .ic{font-size:2.2rem}

.dish-row{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.dish{background:#fff;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-soft);border:1px solid rgba(159,34,16,.1)}
.dish .img{height:150px;display:grid;place-items:center;font-size:3rem;color:#fff;position:relative;
  background:linear-gradient(150deg,var(--red-bright),var(--red-deep));background-size:cover;background-position:center}
.dish .img .pr{position:absolute;top:10px;right:10px;background:var(--gold);color:var(--red-deep);font-weight:800;font-size:.78rem;padding:.25em .6em;border-radius:999px}
.dish .b{padding:14px 15px}.dish .b b{display:block}.dish .b small{color:var(--ink-soft)}

.menu-nav{position:sticky;top:78px;z-index:40;background:var(--paper);border-bottom:2px solid rgba(159,34,16,.12)}
.menu-nav .wrap{display:flex;gap:8px;overflow-x:auto;padding:12px 22px}
.menu-nav a{white-space:nowrap;font-weight:800;font-size:.8rem;padding:.5em .95em;border-radius:999px;background:var(--cream);color:var(--red-deep)}
.menu-nav a:hover{background:var(--red);color:var(--gold)}
.m-cat{scroll-margin-top:150px;padding-top:36px}
.m-cat h3{font-family:var(--font-display);font-weight:400;color:var(--red);font-size:1.8rem}
.m-list{display:grid;grid-template-columns:1fr 1fr;gap:0 46px}
.mi{display:flex;gap:12px;padding:13px 0;border-bottom:1px dashed rgba(159,34,16,.2)}
.mi-thumb{width:56px;height:56px;flex:none;border-radius:10px;background:linear-gradient(150deg,#f3e3bf,#edcf92);
  display:grid;place-items:center;font-size:1.4rem;position:relative;border:1px solid rgba(159,34,16,.12);background-size:cover;background-position:center}
.mi .r1{display:flex;justify-content:space-between;gap:12px;align-items:baseline}
.mi .n{font-weight:800}.mi .price{font-family:var(--font-display);color:var(--red)}
.mi .d{font-size:.85rem;color:var(--ink-soft);margin-top:2px}
.mi .t i{font-style:normal;font-size:.62rem;font-weight:800;background:var(--cream);color:var(--red-deep);padding:.15em .5em;border-radius:5px;margin-right:4px}

.map-embed,.rev-embed{border-radius:var(--radius);overflow:hidden;border:3px solid var(--gold);box-shadow:var(--shadow)}
.map-embed iframe,.rev-embed iframe{display:block;width:100%;border:0}

/* sibling venues strip */
.other-venues{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media(max-width:860px){.other-venues{grid-template-columns:1fr}}

@media(max-width:1000px){.lunch-grid{grid-template-columns:1fr 1fr}.dcards{grid-template-columns:1fr 1fr}
  .dish-row{grid-template-columns:1fr 1fr}.order-cards{grid-template-columns:1fr}}
@media(max-width:767px){.contact-venues{grid-template-columns:1fr}
.wrap {
    padding: 0 15px;
} 
.hero-overlay {
    background: linear-gradient(178deg, rgb(0 0 0), rgb(0 0 0 / 22%)), radial-gradient(70% 60% at 76% 38%, rgb(237 13 13 / 0%), #00000045 70%);
}
.hero-inner {
    padding: 50px 0 80px;
}
.cat-tile .shot {
    background-position: center;
}
.topbar {
    display: none;
}
.cat-grid {
    gap: 30px 15px;
}
.cat-grid .shot:after, .cat-grid .shot:before {
    width: 15px;
    height: 15px;
    top: 74px;
}
.cat-grid .shot:before {
    top: 20px;
    right: 32px;
}
    
}
@media(max-width:767px){
    .m-list{grid-template-columns:1fr}.menu-nav{top:66px}.order-table {
    font-size: 10px;}
.order-table td {
    padding: 11px 8px;
}
.lhero .bg:after {
    background: linear-gradient(179deg, rgb(0 0 0 / 54%), rgb(0 0 0 / 22%)), radial-gradient(70% 60% at 76% 38%, rgb(0 0 0 / 0%), #00000000 70%);
}
.mini {
    font-size: 8px;
    font-weight: 800;
    padding: .4em .7em;
    border-radius: 999px;
    background: var(--cream);
    color: var(--red-deep);
}
.about_sec .wrap{grid-template-columns: 1fr;}
.btn {
    padding: 8px 20px;
}
}
@media(max-width:560px){.lunch-grid,.dcards,.dish-row{grid-template-columns:1fr}}

/* ===================================================================
   V1 — What's On hub, offer pages and offer terms
   =================================================================== */
.wo-filter{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin:0 0 6px}
.wo-chip{display:inline-flex;align-items:center;padding:9px 18px;border-radius:999px;border:1px solid var(--line,#d8cfc0);
  background:#fff;color:var(--ink,#2a1a10);font-weight:600;font-size:14px;text-decoration:none;transition:.2s}
.wo-chip:hover{border-color:var(--red-deep,#8c1d1d)}
.wo-chip.is-on{background:var(--red-deep,#8c1d1d);color:#fff;border-color:var(--red-deep,#8c1d1d)}
.wo-filter-note{text-align:center;margin-top:14px;color:var(--ink-soft,#5b4a3a)}

.wo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:26px}
.wo-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line,#e2d8c8);border-radius:20px;
  overflow:hidden;text-decoration:none;color:inherit;transition:transform .25s ease,box-shadow .25s ease}
.wo-card:hover{transform:translateY(-4px);box-shadow:0 16px 38px rgba(42,26,16,.16)}
.wo-media{width:100%;/*aspect-ratio:4/3;*/overflow:hidden;background:var(--cream,#f6ecd8)}
.wo-media img{width:100%;height:100%;object-fit:cover;display:block}
.wo-body{padding:20px 22px 24px;display:flex;flex-direction:column;gap:8px;flex:1}
.wo-day{font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--red-deep,#8c1d1d);font-weight:700}
.wo-body h3{margin:0;font-size:22px}
.wo-price{font-size:20px;font-weight:800;color:var(--ink,#2a1a10)}
.wo-lede{margin:0;color:var(--ink-soft,#5b4a3a);font-size:15px;line-height:1.55}
.wo-venues{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:4px}
.wo-venues-label{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft,#5b4a3a);margin-right:2px}
.wo-venue{display:inline-block;padding:4px 10px;border-radius:999px;background:var(--cream,#f6ecd8);
  border:1px solid var(--line,#e2d8c8);font-size:12px;font-weight:600}
.wo-qual{font-size:13px;color:var(--red-deep,#8c1d1d);font-weight:600}
.wo-link{margin-top:auto;padding-top:10px;font-weight:700;color:var(--red-deep,#8c1d1d)}
.wo-terms-link{text-align:center;margin-top:34px}

.offer-facts{background:var(--red-deep,#8c1d1d);color:#fff;padding:26px 0}
.of-row{display:flex;flex-wrap:wrap;gap:34px;justify-content:center}
.of-item{display:flex;flex-direction:column;gap:4px;text-align:center}
.of-k{font-size:11px;letter-spacing:.2em;text-transform:uppercase;opacity:.8}
.of-v{font-size:20px;font-weight:800}

.offer-grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:40px;align-items:start}
.offer-side{position:sticky;top:100px}
.offer-photo{border-radius:18px;overflow:hidden}
.offer-photo img{width:100%;display:block}
.offer-block{margin-top:34px}
.offer-block h2,.offer-venues h2{font-size:24px;margin:0 0 12px}
.offer-list{margin:0;padding-left:0;list-style:none;display:flex;flex-direction:column;gap:9px}
.offer-list li{position:relative;padding-left:20px;line-height:1.55}
.offer-list li:before{position:absolute;left:0;top:0;font-weight:700}
.offer-list.yes li:before{content:"✓";color:#1f7a3f}
.offer-list.no li:before{content:"✕";color:#b3261e}
.offer-list.terms li:before{content:"•";color:var(--red-deep,#8c1d1d)}
.offer-shortterms{background:var(--cream,#f6ecd8);border:1px solid var(--line,#e2d8c8);border-radius:16px;padding:22px 24px}
.offer-terms-link{margin:16px 0 0;font-weight:700}
.offer-faq{border-bottom:1px solid var(--line,#e2d8c8);padding:12px 0}
.offer-faq summary{cursor:pointer;font-weight:700;font-size:16px}
.offer-faq p{margin:10px 0 2px;color:var(--ink-soft,#5b4a3a);line-height:1.6}
.ov-row{display:flex;flex-wrap:wrap;gap:10px}
.ov-note{margin-top:10px;color:var(--ink-soft,#5b4a3a);font-size:14px}
.ov-secondary{margin-top:10px;font-weight:700}
.offer-back{text-align:center;font-weight:600}

/* V2 review 4 — the offer booking block is a venue chooser, not one button. */
.offer-book{margin-top:16px}
.offer-book-title{font-size:20px;margin:0 0 4px}
.offer-book-note{margin:0 0 12px;color:var(--ink-soft,#5b4a3a);font-size:14px;line-height:1.5}
.offer-book-btn{display:block;width:100%;text-align:center}
.offer-book-btn + .offer-book-btn{margin-top:8px}

.ot-wrap{max-width:860px}
.ot-sec{margin-bottom:44px}
.ot-sec h2{font-size:26px;margin:0 0 14px}
.ot-sec ul{padding-left:20px;display:flex;flex-direction:column;gap:9px;line-height:1.6}
.ot-offer{margin:18px 0}
.ot-offer h3{font-size:19px;margin:0 0 6px}
.ot-offer p{margin:0;color:var(--ink-soft,#5b4a3a);line-height:1.6}
.ot-updated{color:var(--ink-soft,#5b4a3a);font-style:italic}

@media(max-width:900px){
  .offer-grid{grid-template-columns:1fr}
  .offer-side{position:static;order:-1}
  .of-row{gap:20px}
}
.offer-uplink{margin:8px 0 0;font-weight:700}
.offer-uplink a{color:var(--red-deep,#8c1d1d)}

/* V1 Fix 12, part 2 — list thumbnail more than doubled.
   120x120 on desktop, 96x96 on a phone. The gradient fallback background is
   removed because a thumbnail now only ever renders when a real photo exists. */
.mi-thumb{width:120px;height:120px;border-radius:12px;background:none;
  background-size:cover;background-position:center;font-size:0}
@media(max-width:640px){
  .mi-thumb{width:96px;height:96px}
}

/* V1 section 15 — venue deal cards are links through to their offer pages */
.dcard-link,.ltile-link{text-decoration:none;color:inherit;display:block;transition:transform .25s ease,box-shadow .25s ease}
.dcard-link:hover,.ltile-link:hover{transform:translateY(-4px);box-shadow:0 14px 32px rgba(0,0,0,.22)}
.dcard-qual{margin-top:6px;font-size:12px;opacity:.85}
.dcard-cta{display:inline-block;margin-top:10px;font-weight:800;font-size:13px;letter-spacing:.04em}

/* V1 Fix 15 — venue trading hours, seven rows, Monday first */
.hours-table{width:100%;border-collapse:collapse;margin-top:6px}
.hours-table th{text-align:left;font-weight:600;padding:4px 10px 4px 0;font-size:14px;color:var(--ink-soft);white-space:nowrap}
.hours-table td{text-align:right;padding:4px 0;font-size:14px;font-variant-numeric:tabular-nums}
.hours-table tr.is-today th,.hours-table tr.is-today td{font-weight:800;color:var(--red-deep)}
.hours-status{margin:10px 0 0;font-weight:800;font-size:14px}
.hours-status.is-open,.vstatus.is-open{color:#0e7c3a}
.hours-status.is-shut,.vstatus.is-shut{color:var(--red)}

/* ===== V1 — What's On carousel on the homepage ===== */
.wo-carousel{position:relative}
.wo-track{display:flex;gap:22px;overflow-x:auto;scroll-behavior:smooth;scroll-snap-type:x mandatory;
  padding:6px 4px 14px;-ms-overflow-style:none;scrollbar-width:none}
.wo-track::-webkit-scrollbar{display:none}
.wo-track > .wo-card{flex:0 0 clamp(260px,30%,340px);scroll-snap-align:start}
/* soft blurred edges so cards fade out rather than cut off */
.wo-carousel:before,.wo-carousel:after{content:"";position:absolute;top:0;bottom:14px;width:74px;z-index:3;
  pointer-events:none;transition:opacity .25s ease}
.wo-carousel:before{left:-2px;background:linear-gradient(90deg,var(--paper,#faf4e6) 18%,rgba(250,244,230,0) 100%);
  -webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);
  -webkit-mask-image:linear-gradient(90deg,#000 30%,transparent 100%);mask-image:linear-gradient(90deg,#000 30%,transparent 100%)}
.wo-carousel:after{right:-2px;background:linear-gradient(270deg,var(--paper,#faf4e6) 18%,rgba(250,244,230,0) 100%);
  -webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);
  -webkit-mask-image:linear-gradient(270deg,#000 30%,transparent 100%);mask-image:linear-gradient(270deg,#000 30%,transparent 100%)}
.wo-carousel.at-start:before{opacity:0}
.wo-carousel.at-end:after{opacity:0}
.wo-nav{position:absolute;top:38%;z-index:4;width:46px;height:46px;border-radius:50%;border:1px solid var(--line,#e2d8c8);
  background:#fff;color:var(--red-deep,#8c1d1d);font-size:26px;line-height:1;cursor:pointer;
  box-shadow:0 6px 18px rgba(42,26,16,.18);transition:transform .2s ease,opacity .2s ease}
.wo-nav:hover{transform:scale(1.08)}
.wo-nav.prev{left:-10px}
.wo-nav.next{right:-10px}
.wo-nav[disabled]{opacity:.3;cursor:default;transform:none}
@media(max-width:760px){
  .wo-track > .wo-card{flex:0 0 78%}
  .wo-nav{display:none}
  .wo-carousel:before,.wo-carousel:after{width:42px}
}

/* ===== V1 — hours dialog on the venue pages ===== */
.hours-today{margin:2px 0 4px;font-weight:800;font-size:14px}
.hours-open-btn{display:block;width:100%;text-align:left;background:none;border:0;padding:0;cursor:pointer;
  font:inherit;font-size:14px;color:var(--ink-soft,#5d4a3c)}
.hours-open-btn span{color:var(--red,#9f2210);font-weight:700;text-decoration:underline}
.hours-open-btn:hover span{text-decoration:none}
.hours-modal{position:fixed;inset:0;z-index:900;display:flex;align-items:center;justify-content:center;padding:20px}
.hours-modal[hidden]{display:none}
.hours-backdrop{position:absolute;inset:0;background:rgba(20,10,6,.55);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.hours-panel{position:relative;z-index:2;background:var(--paper,#faf4e6);border-radius:18px;padding:26px 26px 22px;
  width:min(460px,100%);max-height:88vh;overflow:auto;box-shadow:0 30px 70px rgba(20,10,6,.4)}
.hours-panel h3{margin:0 0 4px;font-size:24px}
.hours-x{position:absolute;top:10px;right:12px;background:none;border:0;font-size:30px;line-height:1;
  cursor:pointer;color:var(--ink-soft,#5d4a3c)}
.hours-x:hover{color:var(--red,#9f2210)}
.hours-panel .hours-table{margin:14px 0 4px}
.hours-panel .hours-table th{padding:7px 12px 7px 0}
.hours-panel .hours-table td{padding:7px 0}
.hours-panel .hours-table tr.is-today th,.hours-panel .hours-table tr.is-today td{
  background:rgba(159,34,16,.08);color:var(--red-deep,#6d1409)}
.hours-panel .hours-table tr.is-today th{border-radius:8px 0 0 8px;padding-left:8px}
.hours-panel .hours-table tr.is-today td{border-radius:0 8px 8px 0;padding-right:8px}
.today-tag{display:inline-block;margin-left:7px;background:var(--red,#9f2210);color:#fff;font-size:10px;
  font-weight:800;letter-spacing:.08em;text-transform:uppercase;padding:2px 7px;border-radius:999px;vertical-align:1px}
.hours-where{margin-top:16px;padding-top:14px;border-top:1px solid var(--line,#e3d7c2)}
.hw-k{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft,#5d4a3c)}
.hw-v{font-weight:600;margin-top:3px}
.hours-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px}
.hours-actions .btn{flex:1 1 auto;text-align:center}
.hours-tz{margin:12px 0 0;font-size:12px;color:var(--ink-soft,#5d4a3c)}
/* the outline button is styled for dark hero backgrounds; on the light
   dialog panel it needs the ink colours instead */
.hours-panel .btn-outline{color:var(--red-deep,#6d1409);border-color:var(--red-deep,#6d1409);background:transparent}
.hours-panel .btn-outline:hover{background:var(--red-deep,#6d1409);color:#fff}

/* ===== V1 — gallery goes full-bleed, with bigger images =====
   The viewport breaks out of .wrap to the full screen width, and the desktop
   count drops from four slides to three so each image is substantially larger.
   getVisibleSlides() in index.php is kept in step with these breakpoints. */
.gallery-slider__viewport{
  width:100vw;
  max-width:100vw;
  margin-left:calc(50% - 50vw);
  margin-right:calc(50% - 50vw);
}
.gallery-slider__track{gap:14px}
.gallery-slide{
  flex:0 0 calc((100vw - 28px) / 3);
  border-radius:0;                 /* square corners read as edge-to-edge */
  aspect-ratio:4 / 5;
}
@media (max-width:1400px){
  .gallery-slide{flex-basis:calc((100vw - 28px) / 3)}
}
@media (max-width:991px){
  .gallery-slide{flex-basis:calc((100vw - 14px) / 2)}
}
@media (max-width:767px){
  .gallery-slide{flex-basis:calc((100vw - 14px) / 2)}
}
@media (max-width:480px){
  .gallery-slide{flex-basis:92vw}
}

/* V1 — mobile drawer header carries the white logo instead of the wordmark */
.m-logo{display:inline-flex;align-items:center}
.m-logo img{height:44px;width:auto;display:block}
