/* ════════════════════════════════════════════════════════════════════════════
   MIAMI DONUTS
   LOOK (round 2, 5 Nov 2026): photo-led and editorial. A full-bleed photograph opens every page
   (home hero and a 46vh photo header on every inner page), set on a dark scrim that fades from
   the left and bottom edge. Cream ground, one deep teal for buttons, one true tomato for small
   accents, a big serif for headlines and a clean system sans. Thin dividers, small radii.
   No stickers, no blobs, no coral washed with white: buttons are solid and saturated.
   MOTION: a very slow zoom on the home hero and a short fade-and-rise on scroll; both off under
   prefers-reduced-motion. Never overflow:hidden on an ancestor of a sticky element (the header).
   Round 3 (5 Nov): the Bots On Staff sales band and its CSS are gone; the header floats over the hero photo.
   ════════════════════════════════════════════════════════════════════════════ */
:root{
  --tomato:#c8412a;--tomato-d:#a93520;--berry:#a8330f;--berry-d:#8f2a0c;
  --teal:#0f4c4a;--teal-d:#0a3836;--tealtint:#e3efec;
  --cream:#faf6ee;--paper:#fffdf9;--sand:#f1eadb;
  --ink:#12363a;--ink2:#2d5256;--ink3:#3f5e61;
  --scrim:7,22,22;
  --line:#e4dccb;
  --r:10px;--r-sm:8px;
  --sh:0 1px 2px rgba(18,54,58,.06),0 8px 22px -14px rgba(18,54,58,.22);
  --sh2:0 2px 4px rgba(18,54,58,.06),0 18px 40px -18px rgba(18,54,58,.3);
  --ease:cubic-bezier(.2,.8,.2,1);
  --fd:"Iowan Old Style","Palatino Linotype",Palatino,"URW Palladio L","Book Antiqua",Georgia,serif;
  --f:ui-rounded,"SF Pro Rounded","Nunito","Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;
  --hh:68px;--hdr:68px;
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none !important}
html{-webkit-text-size-adjust:100%;overflow-x:clip;scroll-padding-top:calc(var(--hh) + 24px)}
body{margin:0;background:var(--cream);color:var(--ink2);font:400 17px/1.65 var(--f);-webkit-font-smoothing:antialiased;overflow-x:clip}
img{max-width:100%;display:block;height:auto}
svg{flex:none}
a{color:var(--teal);text-underline-offset:3px;text-decoration-thickness:1.5px}
a:hover{color:var(--teal-d)}
a:focus-visible,button:focus-visible,summary:focus-visible,label:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid var(--ink);outline-offset:3px;border-radius:6px}
h1,h2,h3,h4{font-family:var(--fd);color:var(--ink);font-weight:600;margin:0 0 .5em;line-height:1.1;letter-spacing:-.015em;overflow-wrap:break-word;text-wrap:balance}
h1{font-size:clamp(2.7rem,5.4vw,4.9rem);line-height:1.02;letter-spacing:-.028em}
h2{font-size:clamp(1.9rem,3.6vw,3rem)}
h3{font-size:clamp(1.2rem,1.7vw,1.4rem);line-height:1.2}
p{margin:0 0 1em}
em,.hl{font-style:italic}
.skip{position:absolute;left:12px;top:-60px;z-index:2000;background:var(--ink);color:#fff;padding:10px 16px;border-radius:8px;font-weight:700;text-decoration:none}
.skip:focus{top:10px;color:#fff}
.vh{position:absolute !important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.tw{width:100%;max-width:1180px;margin:0 auto;padding:0 clamp(18px,4vw,40px)}
.ts{padding:clamp(56px,8vw,112px) 0;position:relative}
.ts--paper{background:var(--paper)}
.ts--sand{background:var(--sand)}
.ts--paper,.ts--sand{border-block:1px solid var(--line)}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font:700 .78rem/1.2 var(--f);letter-spacing:.16em;text-transform:uppercase;color:var(--ink3);margin:0 0 16px}
.eyebrow::before{content:"";width:22px;height:2px;background:var(--tomato)}
.lead{font-size:clamp(1.05rem,1.4vw,1.2rem);color:var(--ink2);max-width:60ch}
.head{max-width:720px;margin:0 0 clamp(30px,4.4vw,52px)}
.head--c{margin-inline:auto;text-align:center}.head--c .eyebrow{justify-content:center}.head--c .lead{margin-inline:auto}
.fine{font-size:.88rem;color:var(--ink3)}
.row{display:flex;flex-wrap:wrap;gap:12px 14px;align-items:center}
.tlink{font-weight:700;color:var(--teal);text-decoration:none;border-bottom:2px solid var(--tomato);padding-bottom:1px}
.tlink:hover{color:var(--teal-d);border-bottom-color:var(--teal-d)}

/* ── utility strip ─────────────────────────────────────── */
.utilbar{background:var(--paper);border-bottom:1px solid var(--line);color:var(--ink2);font-size:.82rem}
.utilbar__in{max-width:1180px;margin:0 auto;padding:6px clamp(18px,4vw,40px);display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.ub{display:inline-flex;align-items:center;gap:7px;color:inherit;text-decoration:none;white-space:nowrap}
.ub svg{width:15px;height:15px}
a.ub:hover{color:var(--teal);text-decoration:underline}
.ub__dot{width:8px;height:8px;border-radius:50%;background:#7b8c8d}
[data-state=open] .ub__dot{background:#1f9d62}
[data-state=soon] .ub__dot{background:#d99a10}
.ub__push{flex:1}
.ub__sep{width:1px;height:14px;background:var(--line)}
/* tablet and small laptop: keep the info bar to ONE row (address moves to the header drawer / footer / visit page) */
@media (max-width:1100px) and (min-width:761px){.utilbar__in{flex-wrap:nowrap;gap:12px}.ub--addr,.ub__sep--addr{display:none}}
/* phone: the info bar is hidden (status, address and phone live in the header, drawer and footer) */
@media (max-width:760px){.utilbar{display:none}}

/* ── header, nav, drawer ──────────────────────────────────────────────── */
.hx-sentinel{height:1px;margin-bottom:-1px}
.hx-navq{position:absolute;opacity:0;pointer-events:none}
.hx-hd{position:sticky;top:0;z-index:600;background:transparent;border-bottom:1px solid transparent;transition:background .25s var(--ease),box-shadow .2s var(--ease),border-color .2s}
.hx-shrunk .hx-hd{background:rgba(250,246,238,.97);border-bottom-color:var(--line);box-shadow:0 8px 24px -14px rgba(18,54,58,.3)}
/* over the photo (not yet scrolled): white wordmark and links; the hero is pulled up behind the header */
html:not(.hx-shrunk) .hx-brand,html:not(.hx-shrunk) .hx-brand__n,html:not(.hx-shrunk) .hx-nav__t,html:not(.hx-shrunk) .hx-burger,html:not(.hx-shrunk) .hx-call{color:#fff}
html:not(.hx-shrunk) .hx-brand__n i{color:#ffe3b3}
html:not(.hx-shrunk) .hx-brand__tag{color:#fff}
html:not(.hx-shrunk) .hx-burger{border-color:#fff}
html:not(.hx-shrunk) .hx-nav__t:hover{background:rgba(var(--scrim),.45);color:#fff}
html:not(.hx-shrunk) .hx-nav__t[aria-current=page]{background:rgba(var(--scrim),.55);color:#fff}
html:not(.hx-shrunk) .hx-hd .tb{background:var(--tomato);border-color:var(--tomato)}
.hx-hd__in{max-width:1180px;margin:0 auto;height:var(--hh);padding:0 clamp(18px,4vw,40px);display:flex;align-items:center;gap:clamp(10px,2vw,26px)}
.hx-brand{display:inline-flex;align-items:center;gap:11px;text-decoration:none;color:var(--ink)}
.bk-brand__mark{width:40px;height:40px;flex:none}
.hx-brand__t{display:grid;line-height:1.05}
.hx-brand__n{font:600 1.4rem/1 var(--fd);letter-spacing:-.02em;color:var(--ink)}
.hx-brand__n i{color:var(--teal)}
.hx-brand__tag{font:600 .62rem/1.2 var(--f);letter-spacing:.16em;text-transform:uppercase;color:var(--ink3);margin-top:4px}
/* the drawer is a cream panel: its wordmark is ink and tomato in every header state (it used to inherit the white-over-photo colours) */
html body .hx-drawer .hx-brand,html body .hx-drawer .hx-brand__n{color:var(--ink)}
html body .hx-drawer .hx-brand__n i{color:var(--berry)}
.hx-nav{margin-left:auto}
.hx-nav__list{display:flex;gap:2px;list-style:none;margin:0;padding:0;align-items:center}
.hx-nav__t{display:inline-flex;align-items:center;gap:5px;padding:10px 13px;border-radius:999px;font-weight:600;font-size:.95rem;color:var(--ink);text-decoration:none;transition:background .18s var(--ease),color .18s}
.hx-nav__t svg{width:11px;height:11px;transition:transform .2s var(--ease)}
.hx-nav__t:hover{background:var(--sand);color:var(--ink)}
.hx-nav__t[aria-current=page]{color:var(--teal);background:var(--tealtint)}
.hx-dd{position:relative}
.hx-dd.is-open>.hx-nav__t svg{transform:rotate(180deg)}
.hx-drop,.hx-mega{position:absolute;left:0;top:calc(100% + 8px);min-width:260px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh2);padding:10px;opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .16s,transform .2s var(--ease),visibility 0s .2s;z-index:50}
.hx-dd.is-open>.hx-drop,.hx-dd.is-open>.hx-mega{opacity:1;visibility:visible;transform:none;transition-delay:0s}
.hx-drop a,.hx-mega a{display:block;padding:9px 12px;border-radius:8px;text-decoration:none;color:var(--ink)}
.hx-drop a:hover,.hx-mega a:hover{background:var(--sand)}
.hx-drop b,.hx-mega b{display:block;font-weight:700}
.hx-drop small,.hx-mega small{display:block;color:var(--ink3);font-size:.82rem}
.hx-mega{min-width:min(560px,90vw)}
.hx-mega__grid{display:grid;grid-template-columns:1fr 1fr;gap:2px}
.hx-mega__ico{display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--tealtint);color:var(--teal);margin-right:8px;float:left;margin-top:2px}
.hx-mega__ico svg{width:17px;height:17px}
.hx-mega a{overflow:hidden}
.hx-mega a b,.hx-mega a small{margin-left:38px}
/* buttons: solid deep teal; on a photograph, solid tomato. Never a washed-out coral. */
.tb{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:.65rem 1.5rem;border-radius:999px;background:var(--teal);color:#fff;border:1.5px solid var(--teal);font:700 1rem/1.1 var(--f);text-decoration:none;cursor:pointer;transition:background .18s var(--ease),border-color .18s,color .18s,transform .18s var(--ease),box-shadow .18s;position:relative}
.tb svg{width:19px;height:19px}
.tb:hover{background:var(--teal-d);border-color:var(--teal-d);color:#fff;transform:translateY(-1px)}
.tb:active{transform:none}
.tb--ghost{background:transparent;color:var(--ink);border-color:var(--ink)}
.tb--ghost:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.tb--sm{min-height:44px;padding:.45rem 1.1rem;font-size:.92rem}
.hx-hd .tb{min-height:44px;padding:.5rem 1.2rem;font-size:.95rem}
.tb__s{display:none}
.tb__n{display:inline-grid;place-items:center;min-width:24px;height:24px;border-radius:12px;background:var(--tomato);color:#fff;font-size:.78rem;padding:0 6px}
.tb__n[hidden]{display:none}
.on-photo .tb{background:var(--tomato);border-color:var(--tomato);color:#fff}
.on-photo .tb:hover{background:var(--tomato-d);border-color:var(--tomato-d)}
.on-photo .tb--ghost{background:transparent;border-color:#fff;color:#fff}
.on-photo .tb--ghost:hover{background:#fff;color:var(--ink);border-color:#fff}
.on-dark .tb{background:#fff;border-color:#fff;color:var(--ink)}
.on-dark .tb:hover{background:var(--sand);border-color:var(--sand);color:var(--ink)}
.on-dark .tb--ghost{background:transparent;border-color:#fff;color:#fff}
.on-dark .tb--ghost:hover{background:#fff;color:var(--ink)}
.on-dark .tlink{color:#fff;border-bottom-color:var(--tomato)}
.hx-call{display:none;width:46px;height:46px;border-radius:50%;border:1.5px solid var(--ink);background:transparent;align-items:center;justify-content:center;color:var(--ink)}
.hx-call svg{width:20px;height:20px}
.hx-burger{display:none;align-items:center;justify-content:center;gap:9px;width:48px;height:48px;border-radius:12px;border:1.5px solid var(--ink);background:transparent;color:var(--ink);cursor:pointer;flex:none}
.hx-burger__i{display:block;position:relative;width:24px;height:18px}
.hx-burger__i i{position:absolute;left:0;width:24px;height:2.5px;border-radius:2px;background:currentColor;transition:transform .26s var(--ease),width .26s var(--ease)}
.hx-burger__i i:nth-child(1){top:0}.hx-burger__i i:nth-child(2){top:7.5px;width:16px}.hx-burger__i i:nth-child(3){top:15px}
.hx-burger__w{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.hx-navq:checked~.hx-hd .hx-burger__i i:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
.hx-navq:checked~.hx-hd .hx-burger__i i:nth-child(2){transform:scaleX(0)}
.hx-navq:checked~.hx-hd .hx-burger__i i:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}
/* the open drawer sits ABOVE the chat launcher (z 900) and the launcher also hides while it is open */
.hx-drawer{position:fixed;inset:0 0 0 auto;width:min(420px,100vw);background:var(--paper);z-index:1200;transform:translateX(104%);transition:transform .3s var(--ease);display:flex;flex-direction:column;border-left:1px solid var(--line);visibility:hidden}
.hx-navq:checked~.hx-drawer{transform:none;visibility:visible}
.hx-navq:checked~.launch{visibility:hidden;opacity:0;pointer-events:none}
.hx-backdrop{position:fixed;inset:0;background:rgba(7,22,22,.5);z-index:1150;opacity:0;pointer-events:none;transition:opacity .25s}
.hx-navq:checked~.hx-backdrop{opacity:1;pointer-events:auto}
.hx-lock{overflow:hidden}
.hx-drawer__hd{display:flex;justify-content:space-between;align-items:center;padding:14px 18px;border-bottom:1px solid var(--line)}
.hx-x{width:48px;height:48px;border-radius:12px;border:1.5px solid var(--ink);background:transparent;position:relative;cursor:pointer}
.hx-x i{position:absolute;left:12px;top:21.5px;width:22px;height:2.5px;background:var(--ink);border-radius:2px;transform:rotate(45deg)}.hx-x i+i{transform:rotate(-45deg)}
.hx-drawer__nav{padding:12px 14px;overflow:auto;flex:1;display:grid;align-content:start;gap:2px}
.hx-drawer__nav>a,.hx-acc summary{display:block;padding:13px 14px;border-radius:10px;font:600 1.2rem/1.2 var(--fd);color:var(--ink);text-decoration:none;cursor:pointer;list-style:none}
.hx-acc summary::-webkit-details-marker{display:none}
.hx-drawer__nav>a:hover,.hx-acc summary:hover{background:var(--sand)}
.hx-drawer__nav>a.hx-drawer__small{font:600 1rem/1.2 var(--f);color:var(--ink2);padding:11px 14px}
.hx-drawer__nav>a[aria-current=page]{background:var(--tealtint);color:var(--teal)}
.hx-acc div{display:grid;padding:0 0 8px 14px}
.hx-acc div a{padding:10px 12px;color:var(--ink2);text-decoration:none;font-weight:600;border-radius:8px}.hx-acc div a:hover{background:var(--sand)}
.hx-drawer__ft{padding:16px 18px calc(16px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--line);display:grid;gap:10px}
.hx-drawer__meta{display:flex;justify-content:space-between;color:var(--ink3);font-size:.85rem;gap:10px}
@media (max-width:959px){
  .hx-nav,.hx-call{display:none}
  .hx-hd__in>.tb{margin-left:auto}.hx-burger{display:inline-flex}
  .hx-hd__in{gap:10px}
}
@media (max-width:520px){:root{--hh:60px}.hx-brand__tag{display:none}.hx-brand__n{font-size:1.25rem}.bk-brand__mark{width:34px;height:34px}.hx-brand{gap:8px}
  .hx-hd .tb{padding:.4rem .9rem;min-height:44px}.tb__l{display:none}.tb__s{display:inline}.hx-burger{width:44px;height:44px}}
@media (min-width:960px){.hx-drawer,.hx-backdrop{display:none}}
@media (min-width:960px) and (max-width:1179px){.hx-brand__tag{display:none}.hx-brand__n{font-size:1.3rem;white-space:nowrap}.hx-nav__t{padding:9px 8px;font-size:.88rem;white-space:nowrap}.hx-hd .tb{padding:.45rem .9rem}}

/* ── PHOTO HEROES: a full-bleed picture opens every page ─────────────────
   The header floats over the picture (the hero is pulled up by the header height). Home: fills the first
   screen at desktop, ~60svh on a phone. Inner pages: about 46vh (about 44svh on a phone). Desktop scrim fades from
   the left and bottom edge. PHONE scrim is ONE bottom gradient (max .64) that exists only behind the text,
   plus a faint top strip so the white wordmark reads; the top of the picture is clean. */
.hero-full,.ph{position:relative;isolation:isolate;overflow:hidden;color:#fff;background:#12363a;display:flex;align-items:flex-end;margin-top:calc(var(--hh) * -1)}
.hero-full picture{display:contents}
.hero-full__img,.ph__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-3}
.hero-full::before,.ph::before{content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(var(--scrim),.68) 0,rgba(var(--scrim),.68) 64px,rgba(var(--scrim),0) 170px),
             linear-gradient(0deg,rgba(var(--scrim),.34) 0%,rgba(var(--scrim),.16) 34%,rgba(var(--scrim),0) 62%),
             linear-gradient(90deg,rgba(var(--scrim),.76) 0%,rgba(var(--scrim),.7) 40%,rgba(var(--scrim),0) 80%)}
/* order hero, wide screens: the photo sits in the right 56% and fades into the ink ground, so the sharp donut is in the clear half and never behind the headline */
@media (min-width:821px){
  .ph--r .ph__img{left:auto;width:56%;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 46%);mask-image:linear-gradient(90deg,transparent 0,#000 46%)}
  .ph--r::before{background:linear-gradient(180deg,rgba(var(--scrim),.68) 0,rgba(var(--scrim),.68) 64px,rgba(var(--scrim),0) 170px),linear-gradient(90deg,rgba(var(--scrim),.5) 0%,rgba(var(--scrim),.4) 40%,rgba(var(--scrim),0) 66%)}
}
.hero-full h1,.ph h1{color:#fff;text-shadow:0 1px 18px rgba(var(--scrim),.45)}
.hero-full{min-height:clamp(560px,calc(100svh - 30px),900px)}
.hero-full__in{width:100%;max-width:1180px;margin:0 auto;padding:calc(var(--hh) + clamp(40px,8vw,110px)) clamp(18px,4vw,40px) clamp(44px,6.4vw,92px)}
.hero-full .kick,.ph .kick{display:block;font:700 .8rem/1.2 var(--f);letter-spacing:.2em;text-transform:uppercase;color:#fff;margin:0 0 18px}
.hero-full h1{font-size:clamp(2.7rem,6.6vw,6rem);line-height:1;letter-spacing:-.03em;max-width:13ch;margin-bottom:.38em}
.hero-full h1 em{color:#ffe3b3}
.hero-full__sub{font-size:clamp(1.08rem,1.6vw,1.35rem);color:#fff;max-width:36ch;margin:0 0 1.6em;text-shadow:0 1px 14px rgba(var(--scrim),.5)}
/* the home hero's one quiet moment, once, CSS only: the photo settles in, a glaze highlight sweeps across it, the headline words rise */
@media (min-width:0px){
  .hero-full__img{animation:settle 2.8s cubic-bezier(.16,.7,.2,1) both;transform-origin:62% 55%}
  @keyframes settle{from{transform:scale(1.13)}to{transform:scale(1)}}
  .hero-full::after{content:"";position:absolute;inset:0;z-index:-2;pointer-events:none;background:linear-gradient(105deg,rgba(255,240,210,0) 36%,rgba(255,240,210,.2) 47%,rgba(255,252,240,.38) 50%,rgba(255,240,210,.2) 53%,rgba(255,240,210,0) 64%);transform:translateX(-115%);animation:sheen 1.9s cubic-bezier(.45,.05,.25,1) .7s both}
  @keyframes sheen{to{transform:translateX(115%)}}
  .hero-full h1 .w{display:inline-block;animation:wordup .9s var(--ease) both;animation-delay:calc(.25s + var(--i) * .1s)}
  @keyframes wordup{from{opacity:0;transform:translateY(.5em)}to{opacity:1;transform:none}}
  .hero-full .kick{animation:fadeup .8s var(--ease) .1s both}
  .hero-full__sub,.hero-full .row{animation:fadeup .9s var(--ease) 1.05s both}
  @keyframes fadeup{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
}
.ph{min-height:calc(46vh + var(--hh))}
.ph__in{width:100%;max-width:1180px;margin:0 auto;padding:calc(var(--hh) + clamp(28px,5vw,64px)) clamp(18px,4vw,40px) clamp(28px,3.6vw,48px)}
.ph h1{font-size:clamp(2.5rem,5.6vw,4.8rem);margin-bottom:.3em;max-width:16ch}
.ph__sub{font-size:clamp(1.02rem,1.5vw,1.25rem);color:#fff;max-width:46ch;margin:0 0 1.2em;text-shadow:0 1px 14px rgba(var(--scrim),.5)}
.ph .row{margin-top:.4em}
@media (max-width:820px){
  /* phone and small tablet: the picture stays clean. A faint strip behind the wordmark, and ONE plateau (max .64) only behind the text block */
  .hero-full,.ph{padding-top:var(--hh)}
  .hero-full::before,.ph::before{background:linear-gradient(180deg,rgba(var(--scrim),.64) 0,rgba(var(--scrim),.64) 56px,rgba(var(--scrim),0) 140px)}
  .hero-full__in,.ph__in{padding:46px 18px 24px;background:linear-gradient(0deg,rgba(var(--scrim),.64) 0,rgba(var(--scrim),.64) calc(100% - 46px),rgba(var(--scrim),0) 100%)}
  .hero-full{min-height:60svh}
  .ph{min-height:44svh}
  .hero-full h1{font-size:clamp(2.35rem,10.4vw,3rem);max-width:12ch}
  .hero-full__sub{font-size:1.02rem;margin-bottom:1.1em}
  .hero-full .kick,.ph .kick{margin-bottom:12px;font-size:.74rem}
  .hero-full .row{gap:10px}.hero-full .row .tb{flex:1 1 auto;padding-inline:1.1rem}
  .ph h1{font-size:clamp(2.1rem,9.6vw,2.7rem);max-width:14ch}
  .ph__sub{font-size:1rem;margin-bottom:.9em}
}

/* ── cards ────────────────────────────────────────────────────────────── */
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,2.4vw,30px)}
@media (max-width:900px){.grid{grid-template-columns:1fr 1fr}}
@media (min-width:621px) and (max-width:900px){.grid>.pcard:last-child:nth-child(odd){grid-column:1/-1;flex-direction:row}.grid>.pcard:last-child:nth-child(odd) .pcard__ph{flex:0 0 46%;width:46%;aspect-ratio:auto}.grid>.pcard:last-child:nth-child(odd) .pcard__b{flex:1;align-content:center}}
@media (max-width:620px){.grid{grid-template-columns:1fr;gap:20px}}
.pcard{display:flex;flex-direction:column;background:var(--paper);border-radius:var(--r);overflow:hidden;color:var(--ink2);text-decoration:none;border:1px solid var(--line);transition:box-shadow .25s var(--ease),transform .25s var(--ease)}
a.pcard:hover{box-shadow:var(--sh2);transform:translateY(-3px);color:var(--ink2)}
.pcard__ph{position:relative;aspect-ratio:5/4;background:var(--sand);overflow:hidden}
.pcard__ph img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.grid--sp .pcard__ph{aspect-ratio:1800/944}
a.pcard:hover .pcard__ph img{transform:scale(1.03)}
.pcard__tag{position:absolute;left:12px;top:12px;font:700 .85rem/1 var(--f);letter-spacing:.06em;background:var(--ink);color:#fff;padding:7px 11px;border-radius:999px}
.pcard__b{padding:20px 22px 24px;display:grid;gap:4px;align-content:start}
.pcard__b h3{margin:0 0 .15em}
.pcard__b p{margin:0 0 .5em;font-size:.97rem}
.pcard__price{display:flex;align-items:baseline;gap:8px;margin:.4em 0 0 !important}
.pcard__price span{font-size:.8rem;color:var(--ink3);text-transform:uppercase;letter-spacing:.08em}
.pcard__price b{font:600 1.35rem/1 var(--fd);color:var(--berry)}
.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,6vw,88px);align-items:center}
.split--r>:first-child{order:2}
@media (max-width:860px){.split{grid-template-columns:1fr}.split--r>:first-child{order:0}}
.split__ph{margin:0;border-radius:var(--r);overflow:hidden;box-shadow:var(--sh2);background:var(--sand);max-width:640px;width:100%;justify-self:center}
.split__ph img{width:100%;height:auto}
.split__ph figcaption{padding:10px 16px;font-size:.84rem;color:var(--ink3);background:var(--paper);border-top:1px solid var(--line)}
.ticks{list-style:none;margin:1.2em 0 1.6em;padding:0;display:grid;gap:12px}
.ticks li{position:relative;padding-left:30px}
.ticks li::before{content:"";position:absolute;left:2px;top:.55em;width:12px;height:7px;border-left:2.5px solid var(--teal);border-bottom:2.5px solid var(--teal);transform:rotate(-45deg)}
.gcard{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:22px 24px}
.gcard__k{font:700 .76rem/1 var(--f);letter-spacing:.14em;text-transform:uppercase;color:var(--ink3);margin:0 0 12px}
.gcard__big{font:600 1.4rem/1.2 var(--fd);color:var(--ink)}

/* ── home bands ───────────────────────────────────────────────────────── */
.band-photo{position:relative;isolation:isolate;overflow:hidden;background:#12363a;color:#fff;display:flex;align-items:center}
.band-photo__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.band-photo::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(var(--scrim),.9) 0%,rgba(var(--scrim),.74) 40%,rgba(var(--scrim),.2) 80%,rgba(var(--scrim),.08) 100%)}
.band-photo h2{color:#fff}
.band-photo .lead{color:#fff;max-width:44ch}
.band-photo .eyebrow{color:#fff}
.band-photo__in{width:100%;max-width:1180px;margin:0 auto;padding:clamp(64px,9vw,130px) clamp(18px,4vw,40px)}
.band-photo__txt{max-width:560px}
/* phone: the top of the picture stays clean; one .64 plateau only behind the text block */
@media (max-width:700px){.band-photo::before{display:none}.band-photo{align-items:flex-end}
  .band-photo__in{padding:180px 18px 36px;background:linear-gradient(0deg,rgba(var(--scrim),.64) 0,rgba(var(--scrim),.64) calc(100% - 56px),rgba(var(--scrim),0) 100%)}}
/* visit pickup band: words on ink, the WHOLE box photo beside them (a full-bleed crop of a wide box shot is two blurry donuts). Stacks, photo on top, below 860px */
.band-photo--stack{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);align-items:stretch;background:var(--ink)}
.band-photo--stack::before{display:none}
.band-photo--stack .band-photo__img{position:relative;inset:auto;order:2;width:100%;height:100%;min-height:340px;object-fit:cover;z-index:0}
.band-photo--stack .band-photo__in{order:1;max-width:none;margin:0;display:flex;align-items:center;padding:clamp(44px,6vw,88px) clamp(24px,4vw,64px) clamp(44px,6vw,88px) max(clamp(18px,4vw,40px),calc((100vw - 1180px)/2 + 40px))}
@media (max-width:860px){.band-photo--stack{display:block}
  .band-photo--stack .band-photo__img{height:auto;min-height:0;aspect-ratio:1800/944}
  .band-photo--stack .band-photo__in{display:block;padding:28px 18px 36px;background:none}}
/* menu teaser: a big photograph with the menu rows on a solid panel */
.teaser{position:relative;isolation:isolate;overflow:hidden;background:#12363a}
.teaser__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-1}
.teaser__in{max-width:1180px;margin:0 auto;padding:clamp(48px,7vw,96px) clamp(18px,4vw,40px);display:flex;justify-content:flex-end}
.teaser__panel{background:var(--paper);border-radius:var(--r);padding:clamp(24px,3.4vw,44px);width:min(500px,100%);box-shadow:var(--sh2)}
.teaser__panel h2{font-size:clamp(1.8rem,3vw,2.5rem)}
@media (max-width:760px){.teaser{background:var(--paper)}.teaser__img{position:relative;display:block;height:clamp(220px,62vw,340px);z-index:0}.teaser__in{padding:0 clamp(18px,4vw,40px) 44px;margin-top:-52px;position:relative;z-index:1}}
/* the office-box band: dark ground, photo bleeds off one side */
.ts--ink{background:var(--ink);color:#e6efee;padding:0}
.ts--ink h2,.ts--ink h3{color:#fff}
.ts--ink .eyebrow{color:#fff}
.ts--ink .lead{color:#e6efee}
.boxband{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);align-items:stretch}
.boxband__txt{padding:clamp(48px,7vw,104px) clamp(18px,4vw,64px) clamp(48px,7vw,104px) max(clamp(18px,4vw,40px),calc((100vw - 1180px)/2 + 40px))}
.boxband__ph{margin:0;position:relative;min-height:380px}
.boxband__ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@media (max-width:860px){.boxband{grid-template-columns:1fr}.boxband__ph{min-height:0;aspect-ratio:3/2;order:-1}.boxband__txt{padding:44px clamp(18px,4vw,40px) 56px}}
.mrows{list-style:none;margin:1.2em 0 1.8em;padding:0;border-top:1px solid var(--line)}
.ts--ink .mrows{border-top-color:rgba(255,255,255,.28)}
.mrows li{display:flex;align-items:baseline;gap:14px;padding:14px 0;border-bottom:1px solid var(--line)}
.ts--ink .mrows li{border-bottom-color:rgba(255,255,255,.28)}
.mrows a{font:600 1.12rem/1.3 var(--fd);color:var(--ink);text-decoration:none}
.ts--ink .mrows a{color:#fff}
.mrows a:hover{color:var(--teal)}
.ts--ink .mrows a:hover{color:#ffe3b3}
.mrows small{flex:1;color:var(--ink3);font-size:.88rem}
.ts--ink .mrows small{color:#cfdcdb}
.mrows b{font:600 1.1rem/1 var(--fd);color:var(--berry);white-space:nowrap}
.ts--ink .mrows b{color:#ffe3b3}
.visit{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:clamp(28px,6vw,88px);align-items:center}
@media (max-width:860px){.visit{grid-template-columns:1fr}}
.revs{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.4vw,30px)}
@media (max-width:900px){.revs{grid-template-columns:1fr}}
.rev{margin:0;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:26px 26px 24px;display:grid;gap:14px;align-content:start}
.rev__hd{display:flex;align-items:center;gap:12px}
.rev__av{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--ink);color:#fff;font-weight:800;font-size:.9rem}
.rev__hd small{display:block;color:var(--berry);font-size:.74rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.rev blockquote{margin:0;color:var(--ink);font:400 1.1rem/1.55 var(--fd)}
.revsum{margin-top:6px;font-size:.92rem;color:var(--ink3);max-width:62ch}

/* ── menu ─────────────────────────────────────────────────────────────── */
.rail{position:sticky;top:var(--hh);z-index:40;background:rgba(250,246,238,.97);border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.rail::-webkit-scrollbar{display:none}
.rail__in{display:flex;gap:8px;padding:10px clamp(18px,4vw,40px) 10px max(clamp(18px,4vw,40px),calc((100vw - 1180px)/2 + 40px));width:max-content;min-width:100%}
.rail a{white-space:nowrap;padding:9px 16px;min-height:44px;display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:999px;background:var(--paper);color:var(--ink);font-weight:600;text-decoration:none;font-size:.92rem;transition:border-color .18s}
.rail a:hover{border-color:var(--ink3)}.rail a.is-on,.rail a.is-on:hover{background:var(--ink);color:#fff;border-color:var(--ink)}
.m-sec{padding:clamp(34px,5vw,64px) 0 clamp(8px,2vw,24px);scroll-margin-top:calc(var(--hh) + 70px)}
.m-ban{position:relative;isolation:isolate;overflow:hidden;border-radius:var(--r);background:#12363a;color:#fff;display:flex;align-items:flex-end;aspect-ratio:2.7/1;min-height:230px;margin-bottom:clamp(16px,2.4vw,28px)}
@media (max-width:700px){.m-ban{aspect-ratio:auto;min-height:270px}}
.m-ban__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.m-ban::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,rgba(var(--scrim),.84) 0%,rgba(var(--scrim),.5) 38%,rgba(var(--scrim),.1) 60%,rgba(var(--scrim),0) 100%),linear-gradient(90deg,rgba(var(--scrim),.6) 0%,rgba(var(--scrim),0) 75%)}
.m-ban__in{padding:clamp(22px,3vw,36px)}
.m-ban h2{color:#fff;margin:0 0 .2em;text-shadow:0 1px 14px rgba(var(--scrim),.45)}
.m-ban .lead{color:#fff;margin:0;max-width:52ch;font-size:clamp(.98rem,1.3vw,1.1rem)}
.m-sec__hd{margin-bottom:clamp(14px,2vw,22px)}
.m-sec__hd h2{margin-bottom:.25em}.m-sec__hd .lead{margin:0}
.items{display:grid;grid-template-columns:repeat(2,1fr);gap:0 clamp(24px,5vw,64px);border-top:1px solid var(--line)}
@media (max-width:820px){.items{grid-template-columns:1fr}}
.item{display:grid;grid-template-columns:1fr auto;grid-template-areas:"h a" "pr pr" "d d";gap:4px 14px;align-items:start;padding:18px 0;border-bottom:1px solid var(--line)}
.item h3{grid-area:h;font-size:1.18rem;margin:0}
.item__d{grid-area:d;margin:0;font-size:.92rem;color:var(--ink2)}
.item__p{grid-area:pr;display:flex;gap:2px 16px;flex-wrap:wrap;align-items:baseline}
.item__p span{font:600 1.08rem/1.3 var(--fd);color:var(--berry);white-space:nowrap}
.item__p small{font:600 .78rem var(--f);text-transform:uppercase;letter-spacing:.08em;color:var(--ink3);margin-right:4px}
.item__add{grid-area:a;justify-self:end}
.add{width:44px;height:44px;border-radius:50%;border:1.5px solid var(--teal);background:transparent;color:var(--teal);font:600 1.4rem/1 var(--f);cursor:pointer;transition:background .18s,color .18s}
.add:hover,.add.is-added{background:var(--teal);color:#fff}
.item.is-hidden{display:none}
.badge{display:inline-block;font-size:.78rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;border-radius:999px;padding:3px 10px;background:#fff;color:var(--berry-d);border:1.5px solid var(--berry-d);margin-left:8px;vertical-align:middle;font-family:var(--f);line-height:1.2}
.filters{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:6px}
.filters label{display:inline-flex;gap:8px;align-items:center;padding:8px 16px;border:1px solid var(--line);border-radius:999px;background:var(--paper);font-weight:600;color:var(--ink);cursor:pointer;min-height:44px}
.filters input{accent-color:var(--teal);width:18px;height:18px}
.filters output{font-weight:600;color:var(--ink2)}
.tray{position:fixed;left:50%;bottom:calc(14px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:800}
.tray .tb{box-shadow:0 14px 34px -10px rgba(8,40,38,.6)}
@media (max-width:560px){.tray{left:12px;right:12px;transform:none;max-width:none}.tray .tb{width:100%;font-size:.95rem;padding:.5rem 1rem}
  /* with the tray showing, the chat launcher stacks above it instead of covering it */
  body:has(#tray:not([hidden])) .launch{bottom:calc(86px + env(safe-area-inset-bottom,0px))}}
.m-sec.is-empty{display:none}
/* photo cards (tiles, breakfast) and box rows */
.bcards{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.4vw,28px);margin:0 0 clamp(14px,2vw,22px)}
.bcards--2{grid-template-columns:repeat(2,1fr)}
@media (max-width:860px){.bcards{grid-template-columns:1fr 1fr}}
/* tablet: an odd last card spans both columns, photo left and words right */
@media (min-width:561px) and (max-width:860px){.bcards--3 .bcard:last-child{grid-column:1/-1;flex-direction:row}.bcards--3 .bcard:last-child .bcard__ph{flex:0 0 46%;width:46%;aspect-ratio:auto}.bcards--3 .bcard:last-child .bcard__b{flex:1;align-content:center}}
@media (max-width:560px){.bcards,.bcards--2{grid-template-columns:1fr}.bcard__ph{aspect-ratio:16/9}}
.bcard{display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.bcard__ph{width:100%;aspect-ratio:3/2;background:var(--sand);overflow:hidden;margin:0}
.bcard__ph img{width:100%;height:100%;object-fit:cover}
.bcard__b{display:grid;grid-template-columns:1fr auto;grid-template-areas:"h a" "p a" "d d";gap:2px 14px;padding:18px 20px 20px;align-items:center}
.bcard__b h3{grid-area:h;margin:0;font-size:1.2rem}
.bcard__b .item__p{grid-area:p}
.bcard__b .item__d{grid-area:d;margin-top:6px}
.bcard__b .item__add{grid-area:a}
.bcard.item{display:flex;flex-direction:column;padding:0;border:1px solid var(--line)}
.bcard.item.is-hidden{display:none}
.brow{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(20px,4vw,56px);align-items:center;padding:clamp(16px,2.4vw,28px) 0;border-bottom:1px solid var(--line)}
.brow:nth-child(even) .brow__ph{order:2}
.brow__ph{margin:0;border-radius:var(--r);overflow:hidden;background:var(--sand)}
.brow__ph img{width:100%;height:auto}
.brow__b h3{font-size:clamp(1.4rem,2.2vw,1.8rem);margin-bottom:.2em}
.brow__p{display:flex;gap:4px 18px;flex-wrap:wrap;margin:.2em 0 .5em}
.brow__p span{font:600 1.25rem/1.3 var(--fd);color:var(--berry)}
.brow__p small{font:600 .78rem var(--f);text-transform:uppercase;letter-spacing:.08em;color:var(--ink3);margin-right:5px}
.brow__cap{font-size:.86rem;color:var(--ink3);margin:0 0 .9em}
.brow.item{display:grid;grid-template-areas:none;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(20px,4vw,56px);align-items:center;padding:clamp(16px,2.4vw,28px) 0}
.brows{border-top:1px solid var(--line);margin-bottom:clamp(14px,2vw,22px)}
.brows .brow:first-child{border-top:0}
.brow.item.is-hidden{display:none}
@media (max-width:700px){.brow,.brow.item{grid-template-columns:1fr}.brow:nth-child(even) .brow__ph{order:0}}
.brow .item__add{grid-area:auto;justify-self:start;margin-top:.5em}
.brow--nophoto,.brow.brow--nophoto{grid-template-columns:1fr}
.brow--nophoto .brow__b{max-width:60ch}
.cap{font-size:.84rem;color:var(--ink3);margin:8px 2px 0}

/* ── forms ────────────────────────────────────────────────────────────── */
.form{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:clamp(22px,3.4vw,42px);display:grid;gap:20px}
.form__row{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
@media (max-width:640px){.form__row{grid-template-columns:1fr}}
.field{display:grid;gap:6px}
.field>label,.field>legend,.field>span.l{font-weight:700;color:var(--ink);font-size:.95rem}
.field input[type=text],.field input[type=tel],.field input[type=date],.field input[type=number],.field select,.field textarea{width:100%;font:500 1rem/1.3 var(--f);color:var(--ink);background:var(--cream);border:1.5px solid var(--line);border-radius:8px;padding:12px 14px;min-height:48px}
.field textarea{min-height:92px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{background:#fff;border-color:var(--teal)}
.field small{color:var(--ink3);font-size:.84rem}
.reqlist{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.reqlist li{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center;background:var(--cream);border:1px solid var(--line);border-radius:8px;padding:9px 12px;font-weight:600;color:var(--ink)}
.reqlist .q{display:inline-flex;align-items:center;gap:8px}
.reqlist .q button{width:44px;height:44px;border-radius:50%;border:1.5px solid var(--line);background:var(--paper);font:600 1.1rem/1 var(--f);cursor:pointer;color:var(--ink)}
.reqlist .tot{font-weight:800;color:var(--berry)}
.empty{padding:22px;border:1.5px dashed var(--ink3);border-radius:10px;text-align:center;color:var(--ink2);background:var(--cream)}
.empty .hand{display:block;font:italic 600 1.4rem var(--fd);color:var(--teal)}
.form__done{background:var(--tealtint);border:1px solid #b3d3cd;border-radius:10px;padding:18px 20px;color:var(--ink);font-weight:500}
.form__done b{font:600 1.4rem/1.2 var(--fd);display:block;margin-bottom:6px}
.form__done ul{margin:.4em 0 .6em;padding-left:1.2em}
.formgrid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(22px,3.4vw,48px);align-items:start}
@media (max-width:960px){.formgrid{grid-template-columns:1fr}}

/* ── hours, find-us card, faq, prose, facts ────────────────────────────── */
.hours{border-collapse:collapse;width:100%;max-width:440px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.hours th,.hours td{padding:12px 18px;text-align:left;border-bottom:1px solid var(--line);color:var(--ink)}.hours th{font-weight:600}.hours td{text-align:right;font-weight:600}
.hours tr:last-child th,.hours tr:last-child td{border-bottom:0}
.hours tr.is-today{background:var(--tealtint)}
.findus{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:clamp(22px,3vw,34px);display:grid;gap:0}
.findus h3{margin:0 0 .6em}
.findus dl{margin:0;display:grid;gap:0}
.findus .fr{display:grid;grid-template-columns:7.5rem 1fr;gap:4px 16px;padding:14px 0;border-top:1px solid var(--line)}
.findus dt{font:700 .78rem/1.5 var(--f);letter-spacing:.12em;text-transform:uppercase;color:var(--ink3);padding-top:.15em}
.findus dd{margin:0;color:var(--ink)}
.findus dd small{display:block;color:var(--ink3);font-size:.9rem}
@media (max-width:480px){.findus .fr{grid-template-columns:1fr}}
.faq details{background:var(--paper);border:1px solid var(--line);border-radius:10px;margin-bottom:12px;padding:0 22px}
.faq summary{cursor:pointer;list-style:none;padding:18px 34px 18px 0;font:600 1.15rem/1.3 var(--fd);color:var(--ink);position:relative;min-height:48px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:0;top:50%;margin-top:-14px;width:28px;height:28px;border-radius:50%;background:var(--tealtint);color:var(--teal-d);display:grid;place-items:center;font:600 1.2rem/1 var(--f);transition:transform .25s var(--ease)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding-bottom:18px;margin:0;color:var(--ink2)}
.prose{max-width:740px}.prose h2{font-size:clamp(1.5rem,2.6vw,2rem);margin-top:1.8em}.prose li{margin-bottom:.4em}
.facts{display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-block:1px solid var(--line)}
@media (max-width:820px){.facts{grid-template-columns:repeat(2,1fr)}}
.fact{padding:26px 18px;text-align:center;border-right:1px solid var(--line)}
.fact:last-child{border-right:0}
@media (max-width:820px){.fact:nth-child(2n){border-right:0}.fact:nth-child(-n+2){border-bottom:1px solid var(--line)}}
.fact b{display:block;font:600 clamp(2.2rem,4vw,3.2rem)/1 var(--fd);color:var(--teal);font-variant-numeric:tabular-nums;margin-bottom:6px}
.fact span{font-weight:600;color:var(--ink2);font-size:.95rem}
.people{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.4vw,30px);margin-top:28px}
@media (max-width:760px){.people{grid-template-columns:1fr}}
.person{border-top:2px solid var(--ink);padding-top:14px}
.person h3{margin-bottom:.2em}.person p{margin:0;font-size:.96rem}
.cta-row{display:flex;flex-wrap:wrap;gap:12px 14px;align-items:center;margin-top:1.4em}
.band{border-block:1px solid var(--line)}
.band .split{align-items:center}

/* ── reveal: one subtle fade-and-rise, CSS only, off under reduced motion ── */
@media (min-width:0px){
  @supports (animation-timeline:view()){
    .rv{animation:rise linear both;animation-timeline:view();animation-range:entry 0% entry 35%}
    @keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
  }
}
@media (prefers-reduced-motion:reduce) and (max-width:0px){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none !important;transition:none !important}
  a.pcard:hover{transform:none}
}

/* ── footer ───────────────────────────────────────────────────────────── */
.foot{background:var(--sand);border-top:1px solid var(--line);color:var(--ink2);padding:clamp(44px,6vw,80px) 0 28px}
.ft__grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:clamp(22px,3vw,48px)}
@media (max-width:860px){.ft__grid{grid-template-columns:1fr 1fr}}.ft__hours1{display:none;margin:0}
@media (max-width:520px){.ft__grid{grid-template-columns:1fr 1fr;gap:28px 18px}.ft__grid>div:first-child,.ft__hrs{grid-column:1/-1}.ft__hrs .ft__hours{display:none}.ft__hrs .ft__hours1{display:block}.foot h4{margin-bottom:10px}.foot li a{padding:7px 0}}
.foot .ft__h{color:var(--ink);font:700 .76rem/1 var(--f);letter-spacing:.16em;text-transform:uppercase;margin-bottom:16px}
.foot ul{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.foot li a{display:inline-block;padding:5px 0}
.foot a{color:var(--ink2);text-decoration:none}.foot a:hover{color:var(--teal);text-decoration:underline}
.foot p{font-size:.95rem}
.ft__brand{display:flex;align-items:center;gap:10px;font:600 1.4rem/1 var(--fd);color:var(--ink)}
.ft__addr{line-height:1.7}
.ft__hours li{font-size:.92rem}
.ft__hours li span{display:inline-block;width:42px;font-weight:700;color:var(--ink)}
.ft__hours li.is-today{color:var(--teal-d);font-weight:700}
.ft__legal{margin:36px 0 0;padding-top:20px;border-top:1px solid var(--line);font-size:.84rem;color:var(--ink3)}
.ft__samp{font-weight:600;font-size:.8em}
.ft__bots{margin:14px 0 0;font-size:.9rem;color:var(--ink2)}
.ft__bots a{font-weight:700;color:var(--teal);text-decoration:underline}

/* ── chat ─────────────────────────────────────────────────────────────── */
.launch{position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:900;display:inline-flex;align-items:center;gap:6px;min-height:60px;padding:0 18px 0 6px;border-radius:999px;background:var(--teal);color:#fff;border:0;box-shadow:0 14px 30px -10px rgba(8,40,38,.65);font:700 1rem/1 var(--f);cursor:pointer;transition:background .18s,transform .2s var(--ease)}
.launch:hover{background:var(--teal-d);transform:translateY(-2px)}
.launch[aria-expanded=true]{display:none}
.lcup{width:56px;height:56px;flex:none;filter:drop-shadow(0 2px 0 rgba(18,54,58,.25))}
/* the chat launcher is a small round icon at every width: it fades out while the page scrolls and while the footer is in view, and on the menu it stays off once the visitor has scrolled past the top (so it never rides over text or the + buttons); the tray pill and the header lead to the request */
.launch{padding:0;min-height:0;width:56px;height:56px;justify-content:center;right:max(12px,env(safe-area-inset-right,0px));transition:opacity .25s,transform .25s var(--ease),background .18s}
.launch .lchat__lg,.launch .lchat__sm{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.lcup{width:52px;height:52px}
html.is-scrolling .launch,html.ft-in .launch{opacity:0;pointer-events:none;transform:translateY(10px)}
html.hx-shrunk body.pg-menu .launch{visibility:hidden;opacity:0;pointer-events:none}
@media (min-width:0px){.lcup{animation:lcupbob 3.4s ease-in-out infinite}}
@keyframes lcupbob{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-3px) rotate(3deg)}}
.lchat__sm{display:none}@media (max-width:560px){.lchat__lg{display:none}.lchat__sm{display:inline}}
.chatbox{position:fixed;right:16px;bottom:calc(16px + env(safe-area-inset-bottom,0px));z-index:1100;width:min(390px,calc(100vw - 32px));height:min(640px,calc(100vh - 32px));display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);border-radius:16px;box-shadow:0 30px 70px -20px rgba(18,54,58,.45);overflow:hidden}
.chatbox[hidden]{display:none}
.chatbox__hd{display:flex;align-items:center;gap:10px;padding:12px 14px;background:var(--tealtint);border-bottom:1px solid var(--line);color:var(--ink);font-weight:700}
.chat__mark{width:34px;height:34px}.chatbox__t{flex:1}
.chatbox__x{width:44px;height:44px;border-radius:50%;border:1.5px solid var(--ink);background:transparent;font:600 1.4rem/1 var(--f);color:var(--ink);cursor:pointer}
.log{flex:1;overflow:auto;padding:14px;display:grid;gap:10px;align-content:start;background:var(--cream);overscroll-behavior:contain}
.msg{max-width:88%;padding:10px 14px;border-radius:14px 14px 14px 4px;background:var(--paper);border:1px solid var(--line);color:var(--ink);font-weight:500;font-size:.95rem;white-space:pre-line}
.msg--me{justify-self:end;background:var(--tealtint);border-color:#b3d3cd;border-radius:14px 14px 4px 14px}
.opts{display:flex;flex-wrap:wrap;gap:8px;padding:10px 12px;border-top:1px solid var(--line);max-height:44%;overflow:auto;background:var(--paper)}
.chip{font:600 .9rem/1.2 var(--f);color:var(--ink);background:var(--cream);border:1px solid var(--line);border-radius:999px;padding:8px 14px;cursor:pointer;min-height:44px;transition:background .15s,border-color .15s}
.chip:hover{background:var(--tealtint);border-color:var(--teal)}
.ask{display:flex;gap:8px;padding:10px 12px;border-top:1px solid var(--line);background:var(--paper)}
.ask__in{flex:1;cursor:text;font-weight:500;border-radius:999px}.ask__go{background:var(--teal);color:#fff;border-color:var(--teal)}.ask__go:hover{background:var(--teal-d)}
.chatbox__fine{margin:0;padding:8px 14px;font-size:.78rem;color:var(--ink3);border-top:1px solid var(--line);background:var(--paper)}
@media (max-width:560px){.chatbox{inset:0;width:100%;height:100dvh;border-radius:0;border:0}}
@media print{.utilbar,.hx-hd,.launch,.chatbox{display:none}}
.cta-row .tb,.row .tb{white-space:normal}


/* photo bands and the questions page */
.pstrip{margin:0;position:relative;overflow:hidden;background:var(--sand);height:clamp(200px,30vw,400px)}
.pstrip img{width:100%;height:100%;object-fit:cover}
.faqwrap{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:clamp(28px,5vw,64px);align-items:start}
.faqwrap__ph{margin:0;border-radius:var(--r);overflow:hidden;box-shadow:var(--sh2);position:sticky;top:calc(var(--hh) + 24px);aspect-ratio:4/5;background:var(--sand)}
.faqwrap__ph img{width:100%;height:100%;object-fit:cover}
@media (max-width:860px){.faqwrap{grid-template-columns:1fr}.faqwrap__ph{position:relative;top:auto;aspect-ratio:16/10}}
.hint{margin:-4px 0 16px;font-size:.95rem;font-weight:700;color:var(--berry)}
.hint[hidden]{display:none}