/* =============================================================================
   Agave Fresh Mex & Cantina — stylesheet
   Plain CSS, no build step, no framework. Layout is CSS Grid/Flex only.
   ========================================================================== */

/* ---------------------------------------------------------------- tokens */
:root{
  --ink:#1b1714;
  --ink-soft:#4d443d;
  --muted:#6d635a;
  --paper:#fffdf9;
  --cream:#fbf5ec;
  --cream-2:#f5ece0;
  --line:#e6dbcb;
  --line-dark:#2e2823;

  --charcoal:#12100e;
  --charcoal-2:#1d1916;

  --chile:#c0392b;
  --chile-dark:#9c2a1e;
  --agave:#3f6b4d;
  --agave-dark:#2f5039;
  --marigold:#e08e2c;

  --radius:14px;
  --radius-lg:22px;
  --shadow-sm:0 1px 2px rgba(27,23,20,.06), 0 2px 8px rgba(27,23,20,.05);
  --shadow:0 4px 12px rgba(27,23,20,.08), 0 14px 34px rgba(27,23,20,.09);
  --shadow-lg:0 10px 30px rgba(27,23,20,.12), 0 30px 70px rgba(27,23,20,.14);

  --wrap:1180px;
  --serif:'Fraunces', ui-serif, Georgia, 'Times New Roman', serif;
  --sans:'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
}

/* ---------------------------------------------------------------- reset */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth;}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:.001ms!important; transition-duration:.001ms!important;}
}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--sans); font-size:17px; line-height:1.65;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block; height:auto;}
a{color:var(--chile-dark); text-decoration:none;}
a:hover{text-decoration:underline;}
h1,h2,h3,h4{font-family:var(--serif); line-height:1.14; margin:0 0 .5em; letter-spacing:-.015em;}
h1{font-size:clamp(2.1rem,4.6vw,3.5rem); font-weight:900;}
h2{font-size:clamp(1.6rem,3vw,2.4rem); font-weight:800;}
h3{font-size:1.2rem; font-weight:700;}
h4{font-size:1rem; font-weight:700;}
p{margin:0 0 1em;}
ul,ol{margin:0 0 1em; padding-left:1.15em;}
table{border-collapse:collapse; width:100%;}
:focus-visible{outline:3px solid var(--marigold); outline-offset:2px; border-radius:4px;}

.sr-only{
  position:absolute!important; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0;
}
.skip{
  position:absolute; left:-9999px; top:0; z-index:200;
  background:var(--charcoal); color:#fff; padding:12px 18px; border-radius:0 0 10px 0;
}
.skip:focus{left:0;}

.wrap{width:min(var(--wrap),calc(100% - 40px)); margin-inline:auto;}
section{padding:clamp(48px,6vw,84px) 0;}
section.tight{padding:clamp(28px,3.5vw,44px) 0;}
.lede{font-size:1.075rem; color:var(--ink-soft); max-width:66ch;}
.eyebrow{
  display:inline-block; font-size:.72rem; font-weight:700; letter-spacing:.16em;
  text-transform:uppercase; color:var(--chile-dark); margin-bottom:10px;
}
.cream{background:var(--cream);}
.cream2{background:var(--cream-2);}
.dark{background:var(--charcoal); color:var(--cream);}
.dark h2,.dark h3{color:#fff;}
.dark .lede,.dark p{color:#d9cdbd;}
.dark .eyebrow{color:var(--marigold);}

.sec-head{
  display:flex; align-items:flex-end; justify-content:space-between;
  gap:24px; flex-wrap:wrap; margin-bottom:34px;
}
.sec-head h2{margin-bottom:.35em;}
.sec-head .lede{margin:0;}

/* ---------------------------------------------------------------- buttons */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font-family:var(--sans); font-weight:650; font-size:.95rem; line-height:1;
  padding:14px 22px; border-radius:999px; border:1.5px solid transparent;
  cursor:pointer; text-decoration:none!important; white-space:nowrap;
  transition:transform .16s ease, box-shadow .16s ease, background-color .16s ease, color .16s ease;
}
.btn:hover{transform:translateY(-1px);}
.btn:active{transform:translateY(0);}
.btn-sm{padding:10px 16px; font-size:.87rem;}
.btn-lg{padding:17px 30px; font-size:1.02rem;}
.btn-primary{background:var(--chile); color:#fff; box-shadow:0 6px 18px rgba(192,57,43,.28);}
.btn-primary:hover{background:var(--chile-dark); box-shadow:0 10px 24px rgba(192,57,43,.34);}
.btn-agave{background:var(--agave); color:#fff;}
.btn-agave:hover{background:var(--agave-dark);}
.btn-outline{border-color:var(--line); color:var(--ink); background:#fff;}
.btn-outline:hover{border-color:var(--ink); background:#fff;}
.btn-outline-light{border-color:rgba(255,255,255,.45); color:#fff; background:transparent;}
.btn-outline-light:hover{background:rgba(255,255,255,.12); border-color:#fff;}
.btn-ghost{border-color:var(--line); color:var(--ink); background:transparent;}
.btn-ghost:hover{border-color:var(--ink);}
.cta-row{display:flex; gap:12px; flex-wrap:wrap;}

/* ---------------------------------------------------------------- header */
header.site{
  position:sticky; top:0; z-index:100;
  background:rgba(255,253,249,.86); backdrop-filter:saturate(160%) blur(12px);
  border-bottom:1px solid transparent; transition:border-color .2s, box-shadow .2s, background .2s;
}
header.site.scrolled{border-bottom-color:var(--line); box-shadow:var(--shadow-sm);}
header.site .bar{
  display:flex; align-items:center; gap:22px; min-height:74px;
}
.brand{display:flex; align-items:center; gap:11px; text-decoration:none!important; flex-shrink:0;}
.brand-logo{
  position:relative; display:block; width:155px; height:68px;
  overflow:hidden; flex-shrink:0;
}
.brand-logo img{
  position:absolute; width:155px; height:155px; max-width:none;
  left:0; top:-30px; object-fit:contain;
}
.brand .mark{
  width:38px; height:38px; border-radius:50%; flex-shrink:0;
  background:
    radial-gradient(circle at 32% 30%, var(--marigold), transparent 58%),
    conic-gradient(from 210deg, var(--chile), var(--agave), var(--marigold), var(--chile));
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.55);
}
.brand .word{
  font-family:var(--serif); font-weight:900; font-size:1.32rem; color:var(--ink);
  line-height:1; display:flex; flex-direction:column; gap:3px;
}
.brand .word small{
  font-family:var(--sans); font-size:.56rem; font-weight:700; letter-spacing:.15em;
  text-transform:uppercase; color:var(--chile-dark);
}
footer.site .brand .word{color:#fff;}
footer.site .brand .word small{color:var(--marigold);}

nav.primary{margin-left:auto;}
nav.primary > ul{display:flex; align-items:center; gap:4px; list-style:none; margin:0; padding:0;}
nav.primary a,
nav.primary .sub-toggle{
  display:inline-flex; align-items:center; gap:6px;
  font-size:.92rem; font-weight:550; color:var(--ink); padding:9px 13px;
  border-radius:9px; text-decoration:none!important; background:none; border:0;
  font-family:var(--sans); cursor:pointer; white-space:nowrap;
}
nav.primary a:hover,nav.primary .sub-toggle:hover{background:var(--cream-2); color:var(--chile-dark);}
nav.primary a[aria-current="page"]{color:var(--chile-dark); background:var(--cream-2);}
.has-sub{position:relative;}
.caret{
  width:0; height:0; border-left:4px solid transparent; border-right:4px solid transparent;
  border-top:5px solid currentColor; opacity:.6; transition:transform .18s ease;
}
.has-sub.open .caret{transform:rotate(180deg);}
ul.sub{
  position:absolute; top:calc(100% + 8px); left:0; min-width:240px;
  background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  box-shadow:var(--shadow); padding:8px; margin:0; list-style:none;
  display:none; max-height:min(70vh,520px); overflow-y:auto;
}
.has-sub.open ul.sub{display:block;}
ul.sub a{display:block; padding:9px 12px; font-size:.9rem; border-radius:8px;}

.header-actions{display:flex; align-items:center; gap:10px; flex-shrink:0;}
.header-actions .ico{font-size:.95em;}

.nav-toggle{
  display:none; flex-direction:column; justify-content:center; gap:5px;
  width:44px; height:44px; padding:0 10px; margin-left:auto;
  background:none; border:1px solid var(--line); border-radius:11px; cursor:pointer;
}
.nav-toggle span{display:block; height:2px; background:var(--ink); border-radius:2px; transition:transform .2s, opacity .2s;}
body.nav-open .nav-toggle span:nth-child(1){transform:translateY(7px) rotate(45deg);}
body.nav-open .nav-toggle span:nth-child(2){opacity:0;}
body.nav-open .nav-toggle span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* ---------------------------------------------------------------- hero */
.hero{
  position:relative; color:#fff; padding:0; isolation:isolate;
  background:var(--charcoal);
}
.hero-media{position:absolute; inset:0; z-index:-2; overflow:hidden;}
.hero-media img{width:100%; height:100%; object-fit:cover;}
.hero::after{
  content:""; position:absolute; inset:0; z-index:-1;
  background:
    linear-gradient(100deg, rgba(12,10,9,.94) 0%, rgba(12,10,9,.80) 42%, rgba(12,10,9,.36) 72%, rgba(12,10,9,.55) 100%),
    linear-gradient(to top, rgba(12,10,9,.85), transparent 45%);
}
.hero-inner{padding:clamp(64px,8vw,116px) 0 clamp(52px,6vw,86px);}
.hero-copy{max-width:660px;}
.hero .eyebrow{color:var(--marigold);}
.hero h1{color:#fff; margin-bottom:.4em; text-wrap:balance;}
.hero .lede{color:#e6dbcd; font-size:clamp(1.05rem,1.6vw,1.2rem); max-width:56ch;}
.hero .cta-row{margin:30px 0 0;}

.area-hero{
  min-height:clamp(540px,72vh,760px);
}
.area-hero::after{
  background:
    linear-gradient(to top, rgba(12,10,9,.94) 0%, rgba(12,10,9,.72) 42%, rgba(12,10,9,.12) 78%),
    linear-gradient(90deg, rgba(12,10,9,.5), transparent 66%);
}
.area-hero .hero-media img{object-position:center 48%;}
.area-hero .hero-inner{
  min-height:clamp(540px,72vh,760px);
  display:flex; align-items:flex-end;
  padding:clamp(72px,10vw,132px) 0 clamp(44px,6vw,76px);
}
.area-hero .hero-copy{max-width:780px;}
.area-hero h1{
  margin:0 0 10px; font-family:var(--sans);
  font-size:clamp(.95rem,1.8vw,1.35rem); font-weight:700;
  letter-spacing:-.01em;
}
.area-hero-title{
  max-width:18ch; margin:0 0 18px;
  color:#fff; font-family:var(--serif); font-weight:900;
  font-size:clamp(2.25rem,5.3vw,4.4rem); line-height:1.04;
  letter-spacing:-.025em; text-wrap:balance;
}
.area-hero .lede{
  max-width:68ch; margin:0;
  color:#f1e8dc; font-size:clamp(1rem,1.5vw,1.15rem);
  text-shadow:0 1px 10px rgba(0,0,0,.35);
}

.trust{
  display:flex; flex-wrap:wrap; gap:12px; margin:34px 0 0; padding:0; list-style:none;
}
.trust li{
  display:flex; align-items:center; gap:9px;
  background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.20);
  border-radius:999px; padding:9px 16px; font-size:.87rem; color:#f2e9dd;
  backdrop-filter:blur(4px);
}
.trust b{font-family:var(--serif); font-size:1.05rem; color:var(--marigold); font-weight:800;}

.hero-cards{
  display:grid; grid-template-columns:repeat(3,1fr); gap:14px;
  margin-top:clamp(34px,4vw,52px);
}
.hero-card{
  background:rgba(255,255,255,.09); border:1px solid rgba(255,255,255,.18);
  border-radius:var(--radius); padding:18px 20px; backdrop-filter:blur(6px);
}
.hero-card h3{font-size:1rem; color:#fff; margin-bottom:4px;}
.hero-card p{margin:0; font-size:.9rem; color:#cfc3b4;}
.hero-card a{color:var(--marigold); font-weight:600; font-size:.9rem;}

/* ---------------------------------------------------------------- gallery */
.shot-grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:14px;
}
.shot{
  position:relative; display:block; border-radius:var(--radius); overflow:hidden;
  background:var(--charcoal); text-decoration:none!important; box-shadow:var(--shadow-sm);
  transition:transform .22s ease, box-shadow .22s ease;
}
.shot:hover{transform:translateY(-3px); box-shadow:var(--shadow);}
.shot img{
  aspect-ratio:4/3; width:100%; object-fit:cover;
  transition:transform .4s ease, opacity .25s ease;
}
.shot:hover img{transform:scale(1.05); opacity:.82;}
.shot-body{
  position:absolute; left:0; right:0; bottom:0; padding:32px 14px 13px;
  display:flex; flex-direction:column; gap:1px;
  background:linear-gradient(to top, rgba(12,10,9,.9), transparent);
}
.shot-title{font-family:var(--serif); font-weight:800; color:#fff; font-size:1.06rem; line-height:1.2;}
.shot-meta{font-size:.76rem; color:var(--marigold); font-weight:600;}

/* ---------------------------------------------------------------- cards */
.card-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:18px;}
.card{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  padding:22px 22px 20px; box-shadow:var(--shadow-sm);
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
  display:flex; flex-direction:column;
}
.card:hover{transform:translateY(-2px); box-shadow:var(--shadow); border-color:#d8c9b3;}
.card h3{margin-bottom:.4em;}
.card h3 a{color:var(--ink);}
.card h3 a:hover{color:var(--chile-dark);}
.card p{font-size:.94rem; color:var(--ink-soft); margin-bottom:.8em;}
.card .more{
  margin-top:auto; font-weight:650; font-size:.9rem; color:var(--chile-dark);
  display:inline-flex; align-items:center; gap:5px;
}
.menu-items{list-style:none; padding:0; margin:0 0 14px; font-size:.9rem;}
.menu-items li{
  padding:6px 0; border-bottom:1px dashed var(--line); color:var(--ink-soft);
}
.menu-items li:last-child{border-bottom:0;}

.cat-list{list-style:none; padding:0; margin:0; display:grid;
  grid-template-columns:repeat(4,1fr); gap:14px;}
.cat-list li{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  padding:16px 18px; font-weight:650; box-shadow:var(--shadow-sm);
}
.cat-list li a{color:var(--ink);}
.cat-list li a:hover{color:var(--chile-dark);}

/* ---------------------------------------------------------------- images */
.cat-photo{
  width:100%; max-height:400px; object-fit:cover;
  border-radius:var(--radius-lg); box-shadow:var(--shadow); margin:0 0 32px;
}
.photo-strip{padding:0;}
.photo-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:12px;}
.photo-grid img{
  width:100%; aspect-ratio:4/3; object-fit:cover;
  border-radius:var(--radius); box-shadow:var(--shadow-sm);
}

/* ---------------------------------------------------------------- menu page */
.menu-toc{
  list-style:none; display:flex; flex-wrap:wrap; gap:8px; margin:22px 0 0; padding:0;
}
.menu-toc a{
  display:inline-block; padding:7px 14px; background:#fff;
  border:1px solid var(--line); border-radius:999px;
  font-size:.84rem; font-weight:600; color:var(--ink);
}
.menu-toc a:hover{border-color:var(--chile); color:var(--chile-dark); text-decoration:none;}

/* ---------------------------------------------------------------- hours/two-col */
.two-col{display:grid; grid-template-columns:1.1fr .9fr; gap:44px; align-items:start;}
table.hours th{
  text-align:left; font-weight:600; color:var(--ink-soft); font-family:var(--sans);
  font-size:.95rem; padding:11px 0; border-bottom:1px solid var(--line);
}
table.hours td{
  text-align:right; padding:11px 0; border-bottom:1px solid var(--line);
  font-variant-numeric:tabular-nums; font-weight:600;
}
.related{
  background:var(--cream); border:1px solid var(--line);
  border-radius:var(--radius); padding:24px 26px;
}
.related h4{margin-bottom:12px;}
.related ul{list-style:none; padding:0; margin:0;}
.related li{padding:8px 0; border-bottom:1px solid var(--line);}
.related li:last-child{border-bottom:0;}

/* ---------------------------------------------------------------- owner */
.owner{display:grid; grid-template-columns:auto 1fr; gap:32px; align-items:center;}
.avatar{
  width:104px; height:104px; border-radius:50%; display:grid; place-items:center;
  font-family:var(--serif); font-weight:900; font-size:2.1rem; color:#fff;
  background:linear-gradient(140deg,var(--chile),var(--agave));
  box-shadow:inset 0 0 0 3px rgba(255,255,255,.2);
  flex-shrink:0;
}
.avatar.mark{
  background:
    radial-gradient(circle at 32% 30%, var(--marigold), transparent 58%),
    conic-gradient(from 210deg, var(--chile), var(--agave), var(--marigold), var(--chile));
}
.pill-row{display:flex; gap:9px; flex-wrap:wrap; margin-top:16px;}
.pill{
  background:rgba(255,255,255,.10); border:1px solid rgba(255,255,255,.22);
  color:#f0e6d9; border-radius:999px; padding:7px 15px; font-size:.83rem; font-weight:600;
}

/* ---------------------------------------------------------------- FAQ */
/* Rendered <details open> — answers are visible on first paint for AI crawlers. */
.faq{background:var(--cream);}
.faq-list{display:grid; gap:12px; margin-top:26px;}
.faq-item{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  padding:20px 24px; box-shadow:var(--shadow-sm);
}
.faq-item summary{
  cursor:pointer; list-style:none; display:flex; align-items:flex-start;
  justify-content:space-between; gap:16px;
  font-family:var(--serif); font-weight:700; font-size:1.09rem;
  line-height:1.3; color:var(--ink);
}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{
  content:"–"; flex-shrink:0; font-family:var(--sans); font-size:1.4rem;
  line-height:1; color:var(--chile); transition:transform .2s ease;
}
.faq-item:not([open]) summary::after{content:"+";}
.faq-item .a{
  margin-top:12px; padding-top:14px; border-top:1px solid var(--line);
  color:var(--ink-soft); font-size:.99rem;
}
.faq-item .a p:last-child{margin-bottom:0;}
.faq-item .a ul{margin:.5em 0 0; padding-left:1.2em;}
.faq-item .a li{margin-bottom:.3em;}
.faq-item .a a{font-weight:600; text-decoration:underline; text-underline-offset:2px;}

/* ---------------------------------------------------------------- areas */
.area-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:16px;}
.area-card{
  background:#fff; border:1px solid var(--line); border-radius:var(--radius);
  padding:20px 22px; box-shadow:var(--shadow-sm); display:flex; flex-direction:column;
  transition:transform .18s ease, box-shadow .18s ease;
}
.area-card:hover{transform:translateY(-2px); box-shadow:var(--shadow);}
.area-card h3{margin-bottom:6px; font-size:1.15rem;}
.area-card h3 a{color:var(--ink);}
.area-card h3 a:hover{color:var(--chile-dark);}
.area-meta{
  display:flex; gap:14px; flex-wrap:wrap; font-size:.83rem;
  color:var(--muted); font-weight:600; margin-bottom:10px;
}
.area-meta span{display:inline-flex; align-items:center; gap:5px;}
.area-card p{font-size:.92rem; color:var(--ink-soft); margin-bottom:.8em;}
.area-card .more{margin-top:auto; font-weight:650; font-size:.89rem; color:var(--chile-dark);}

.fact-row{
  display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin:0 0 34px; padding:0;
  list-style:none;
}
.fact{
  background:var(--cream); border:1px solid var(--line);
  border-radius:var(--radius); padding:16px 18px;
}
.fact .k{
  display:block; font-size:.71rem; letter-spacing:.13em; text-transform:uppercase;
  color:var(--muted); font-weight:700; margin-bottom:4px;
}
.fact .v{font-family:var(--serif); font-weight:800; font-size:1.12rem; color:var(--ink); line-height:1.25;}

.map-card{
  background:var(--charcoal); border-radius:var(--radius-lg); overflow:hidden;
  border:1px solid var(--line-dark); box-shadow:var(--shadow);
}
.map-card iframe{width:100%; height:300px; border:0; display:block; filter:grayscale(.2) contrast(1.05);}
.map-card .card-foot{padding:18px 20px; color:var(--paper);}
.map-card .card-foot .addr{font-weight:650; margin-bottom:4px;}
.map-card .card-foot a{color:var(--marigold); font-weight:600;}

/* ---------------------------------------------------------------- breadcrumb */
.breadcrumb{background:var(--cream); border-bottom:1px solid var(--line);}
.breadcrumb .wrap{padding:11px 0; font-size:.83rem; color:var(--muted);}
.breadcrumb a{color:var(--muted);}
.breadcrumb a:hover{color:var(--chile-dark);}
.breadcrumb .sep{margin:0 8px; opacity:.5;}
.breadcrumb [aria-current]{color:var(--ink); font-weight:600;}

/* ---------------------------------------------------------------- ticker */
.ticker{
  overflow:hidden; white-space:nowrap; background:var(--charcoal);
  border-top:1px solid var(--line-dark); border-bottom:1px solid var(--line-dark);
  padding:16px 0;
}
.ticker-track{display:inline-block; animation:ticker-scroll 32s linear infinite;}
.ticker-track span{
  display:inline-block; font-family:var(--serif); font-weight:800; text-transform:uppercase;
  letter-spacing:.06em; font-size:1.3rem; color:var(--marigold); padding:0 28px;
}
@keyframes ticker-scroll{ from{transform:translateX(0);} to{transform:translateX(-50%);} }
@media (prefers-reduced-motion:reduce){ .ticker-track{animation:none;} }

/* ---------------------------------------------------------------- CTA band */
.cta-band{
  background:linear-gradient(135deg,var(--chile-dark),var(--chile) 55%,#8f2419);
  color:#fff; text-align:center;
}
.cta-band h2{color:#fff; max-width:26ch; margin:0 auto .9em; text-wrap:balance;}
.cta-band .cta-row{justify-content:center;}

/* ---------------------------------------------------------------- picado */
.picado{
  height:14px;
  background:
    linear-gradient(-45deg, transparent 66%, var(--chile) 0) 0 0/18px 18px repeat-x,
    linear-gradient(45deg, transparent 66%, var(--chile) 0) 0 0/18px 18px repeat-x;
  opacity:.85;
}
.picado.agave{
  background:
    linear-gradient(-45deg, transparent 66%, var(--agave) 0) 0 0/18px 18px repeat-x,
    linear-gradient(45deg, transparent 66%, var(--agave) 0) 0 0/18px 18px repeat-x;
}
.picado.chile{}

/* ---------------------------------------------------------------- footer */
footer.site{background:var(--charcoal); color:#c9bcac; padding:60px 0 26px; font-size:.92rem;}
footer.site .cols{
  display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:40px; padding-bottom:38px;
}
footer.site h4{color:#fff; font-family:var(--sans); font-size:.76rem;
  letter-spacing:.14em; text-transform:uppercase; margin-bottom:14px;}
footer.site ul{list-style:none; padding:0; margin:0;}
footer.site li{margin-bottom:8px;}
footer.site a{color:#c9bcac;}
footer.site a:hover{color:var(--marigold);}
footer.site address{font-style:normal; margin:14px 0 16px; line-height:1.8;}
footer.site address a.tel{color:#fff; font-weight:650; font-size:1.05rem;}
footer.site .about-col p{max-width:38ch;}
footer.site .about-col .brand{margin-bottom:14px;}
footer.site .legal{
  border-top:1px solid rgba(255,255,255,.12); padding-top:22px;
  display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap;
  font-size:.82rem; color:#8d8175;
}

/* ---------------------------------------------------------------- mobile order bar */
/* Hidden by default (desktop/tablet); shown fixed to the bottom of the
   viewport on phones only, see the 640px breakpoint below. Stays in view
   while scrolling so Order Online and Call are always one tap away. */
.mobile-order-bar{
  display:none;
  position:fixed; left:0; right:0; bottom:0; z-index:150;
  gap:10px; padding:10px 14px calc(10px + env(safe-area-inset-bottom));
  background:rgba(255,253,249,.94); backdrop-filter:saturate(160%) blur(12px);
  border-top:1px solid var(--line); box-shadow:0 -6px 20px rgba(27,23,20,.10);
}
.mobile-order-bar .btn{flex:1 1 0; padding:13px 14px;}
body.nav-open .mobile-order-bar{display:none;}

/* ---------------------------------------------------------------- lightbox */
.lightbox{
  position:fixed; inset:0; z-index:200; display:none;
  background:rgba(10,8,7,.92); padding:5vh 5vw; place-items:center;
}
.lightbox.open{display:grid;}
.lightbox figure{margin:0; max-width:min(1100px,92vw); text-align:center;}
.lightbox img{max-height:78vh; width:auto; margin-inline:auto; border-radius:var(--radius); box-shadow:var(--shadow-lg);}
.lightbox figcaption{color:#d8ccbd; font-size:.9rem; margin-top:14px;}
.lb-close{
  position:absolute; top:18px; right:22px; width:46px; height:46px;
  background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.3);
  color:#fff; font-size:1.7rem; line-height:1; border-radius:50%; cursor:pointer;
}
.lb-close:hover{background:rgba(255,255,255,.22);}
body.lb-open{overflow:hidden;}

/* ---------------------------------------------------------------- reveal */
.reveal{opacity:0; transform:translateY(14px); transition:opacity .55s ease, transform .55s ease;}
.reveal.in{opacity:1; transform:none;}

/* ---------------------------------------------------------------- responsive */
/* The header phone button is the first thing to go — it duplicates the footer
   and the hero CTA, so dropping it buys room before the nav has to collapse. */
@media (max-width:1200px){
  .header-actions .btn-ghost{display:none;}
}

@media (max-width:1080px){
  .shot-grid,.photo-grid{grid-template-columns:repeat(3,1fr);}
  .cat-list{grid-template-columns:repeat(2,1fr);}
  footer.site .cols{grid-template-columns:1fr 1fr; gap:32px;}
}

@media (max-width:1024px){
  /* backdrop-filter would make this header a containing block for its
     position:fixed descendants, collapsing the mobile nav panel to the
     header's own height. Drop it here so the panel resolves to the viewport. */
  header.site{backdrop-filter:none; background:var(--paper);}
  .nav-toggle{display:flex;}
  nav.primary{
    position:fixed; inset:74px 0 0; margin:0; background:var(--paper);
    border-top:1px solid var(--line); padding:18px 20px 40px;
    overflow-y:auto; overscroll-behavior:contain; display:none;
  }
  body.nav-open{overflow:hidden;}
  body.nav-open nav.primary{display:block;}
  nav.primary > ul{flex-direction:column; align-items:stretch; gap:2px;}
  nav.primary a,nav.primary .sub-toggle{
    width:100%; justify-content:space-between; padding:14px 12px; font-size:1.02rem;
    border-bottom:1px solid var(--line); border-radius:0;
  }
  ul.sub{
    position:static; display:none; box-shadow:none; border:0; border-radius:0;
    padding:0 0 8px 12px; max-height:none; background:transparent;
  }
  .has-sub.open ul.sub{display:block;}
  ul.sub a{font-size:.95rem; padding:11px 12px; border-bottom:1px dashed var(--line);}

  .card-grid,.area-grid{grid-template-columns:repeat(2,1fr);}
  .two-col,.owner{grid-template-columns:1fr; gap:28px;}
  .owner{text-align:left;}
  .hero-cards{grid-template-columns:1fr;}
  .fact-row{grid-template-columns:repeat(2,1fr);}
}

@media (max-width:640px){
  body{font-size:16px; padding-bottom:calc(66px + env(safe-area-inset-bottom));}
  .shot-grid,.photo-grid{grid-template-columns:repeat(2,1fr);}
  .card-grid,.area-grid,.cat-list{grid-template-columns:1fr;}
  .sec-head{flex-direction:column; align-items:flex-start;}
  .cta-row .btn{flex:1 1 100%;}
  .hero-inner{padding-top:52px;}
  .trust li{font-size:.82rem; padding:8px 13px;}
  footer.site .cols{grid-template-columns:1fr; gap:26px;}
  footer.site .legal{flex-direction:column; gap:6px;}
  .faq-item{padding:17px 18px;}
  .faq-item summary{font-size:1.02rem;}
  /* The sticky bottom bar takes over the Order Online CTA at this width, so
     drop it from the header to avoid showing the same button twice. */
  .header-actions .btn-primary{display:none;}
  .mobile-order-bar{display:flex;}
}

@media print{
  header.site,footer.site,.cta-band,.nav-toggle,.lightbox,.mobile-order-bar{display:none!important;}
  body{font-size:12pt;}
  .faq-item{break-inside:avoid;}
}