:root{
    /* ---------------------------------------------------------------
       BRAND PALETTE — sampled directly from the Ohana BBQ logo artwork.
         deep green  #00472c  (41% of the mark — the "Ohana" script)
         brand red   #c1181f  (20% — the ring and "BBQ")
         flower gold #ffa600  ( 6% — the bird of paradise)
         cream       #ffffff  (33% — the fill)
       Every colour on this page derives from one of those four, which is
       what makes the logo sit inside the design instead of on top of it.
       --------------------------------------------------------------- */
    --red:#c1181f;
    --red-dark:#93121a;
    --red-light:#d8332a;
    --sunset-orange:#f5821f;
    --hibiscus-gold:#ffa600;
    --gold-soft:#ffc44d;
    --ocean:#00472c;          /* logo green — replaces the old teal */
    --ocean-dark:#002e1b;
    --palm:#0b5c3a;
    --sand:#fff7ea;
    --sand-dim:#f6e9d5;
    --dark:#00230f;           /* deep green — all dark section backgrounds */
    --dark-2:#00301a;
    --ink:#16211a;            /* body text */
    --ink-soft:#55635a;
    --white:#ffffff;
    --radius-lg:28px;
    --radius-md:18px;
    --radius-sm:10px;
    --shadow:0 20px 50px -20px rgba(36,26,22,.35);
    --shadow-sm:0 8px 24px -12px rgba(36,26,22,.3);
    --maxw:1200px;
    --ease:cubic-bezier(.22,1,.36,1);
    /* Ohana BBQ logo — full-colour artwork, three renderings:
       --logo-badge     : artwork on a cream disc, for deep-green backgrounds
       --logo-full      : artwork alone, for cream/light backgrounds
       --logo-watermark : cream monochrome, for the faint placeholder marks */
    --logo-badge:url('/images/ui/logo-badge.png');
    --logo-full:url('/images/ui/logo-badge.png');
    --logo-watermark:url('/images/ui/logo-watermark.png');
  }

  *,*::before,*::after{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    font-family:'Plus Jakarta Sans',system-ui,sans-serif;
    background:var(--sand);
    color:var(--ink);
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  img{max-width:100%;display:block;}
  a{color:inherit;text-decoration:none;}
  h1,h2,h3,h4{font-family:'Fraunces',serif;margin:0;line-height:1.05;letter-spacing:-0.01em;}
  p{margin:0;}
  ul{list-style:none;margin:0;padding:0;}
  button{font-family:inherit;cursor:pointer;border:none;background:none;}
  .container{max-width:var(--maxw);margin:0 auto;padding:0 22px;}

  /* ---------- Icons ---------- */
  .ico{
    width:1em;height:1em;flex-shrink:0;display:inline-block;vertical-align:-.14em;
    fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;
  }
  .ico-lg{width:1.15em;height:1.15em;}

  /* ---------- Accessibility ---------- */
  /* Visible keyboard focus ring — without this, keyboard and switch users
     cannot see where they are on the page. */
  :focus-visible{outline:3px solid var(--hibiscus-gold);outline-offset:3px;border-radius:4px;}
  .skip-link{
    position:absolute;left:-9999px;top:0;z-index:999;
    background:var(--red);color:#fff;padding:14px 22px;font-weight:700;border-radius:0 0 12px 0;
  }
  .skip-link:focus{left:0;}
  .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;
  }
  /* Respect the OS "reduce motion" setting — vestibular disorders, motion
     sickness. Content still appears, it just stops animating. */
  @media (prefers-reduced-motion:reduce){
    html{scroll-behavior:auto;}
    *,*::before,*::after{
      animation-duration:.01ms !important;animation-iteration-count:1 !important;
      transition-duration:.01ms !important;scroll-behavior:auto !important;
    }
    html.js-ready .reveal{opacity:1;transform:none;}
    .marquee{animation:none;}
    .scroll-cue{animation:none;}
  }
  .eyebrow{
    display:inline-flex;align-items:center;gap:8px;
    font-size:.72rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
    color:var(--red);
  }
  .eyebrow::before{content:"";width:22px;height:2px;background:var(--red);display:inline-block;border-radius:2px;}

  /* ---------- Reveal on scroll ---------- */
  /* Content is fully visible by default (no-JS / JS-failure safe). Only when
     JS confirms it's running (html.js-ready) do elements start hidden and
     animate in via IntersectionObserver below. */
  .reveal{transition:opacity .8s var(--ease),transform .8s var(--ease);}
  html.js-ready .reveal{opacity:0;transform:translateY(28px);}
  html.js-ready .reveal.in{opacity:1;transform:translateY(0);}
  /* Must come after the two rules above to win the cascade: with reduced
     motion the entrance animation is skipped entirely and everything is
     visible from the start, rather than waiting to be scrolled into view. */
  @media (prefers-reduced-motion:reduce){
    html.js-ready .reveal,
    html.js-ready .reveal.in{opacity:1;transform:none;}
  }

  /* ---------- Buttons ---------- */
  .btn{
    display:inline-flex;align-items:center;justify-content:center;gap:8px;
    padding:16px 30px;border-radius:100px;font-weight:700;font-size:.95rem;
    transition:transform .35s var(--ease),box-shadow .35s var(--ease),background .3s;
    white-space:nowrap;
  }
  .btn-primary{background:var(--red);color:var(--white);box-shadow:0 14px 30px -10px rgba(166,0,0,.55);}
  .btn-primary:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 20px 40px -12px rgba(166,0,0,.65);}
  .btn-outline{background:rgba(255,255,255,.12);color:var(--white);border:1.5px solid rgba(255,255,255,.7);backdrop-filter:blur(6px);}
  .btn-outline:hover{background:rgba(255,255,255,.22);transform:translateY(-3px);}
  .btn-dark{background:var(--dark);color:var(--sand);}
  .btn-dark:hover{transform:translateY(-3px);background:var(--red);}
  .btn-gold{background:var(--hibiscus-gold);color:var(--ink);box-shadow:0 14px 30px -12px rgba(242,177,52,.6);}
  .btn-gold:hover{transform:translateY(-3px) scale(1.02);}

  /* ---------- Photo slot placeholders ---------- */
  .photo-slot{
    position:relative;overflow:hidden;background-size:cover;background-position:center;
    display:flex;align-items:flex-end;
  }
  /* Placeholder tiles — one muted deep-green family with faint warm shifts,
     so a wall of "photo pending" slots reads as a calm, intentional set
     rather than competing blocks of colour. Swap in real photos and the
     whole grid comes alive without any other change. */
  .photo-slot.gradient-1{background:linear-gradient(155deg,#0c5136 0%,#023d26 55%,#012417 100%);}
  .photo-slot.gradient-2{background:linear-gradient(155deg,#14573a 0%,#054127 50%,#042a17 100%);}
  .photo-slot.gradient-3{background:linear-gradient(155deg,#0a4a33 0%,#023824 55%,#011f13 100%);}
  .photo-slot.gradient-4{background:linear-gradient(155deg,#0e4d31 0%,#04361f 55%,#021a10 100%);}
  /* faint warm bloom + logo watermark, shared by every slot */
  .photo-slot::before{
    content:"";position:absolute;inset:0;z-index:1;
    background:
      radial-gradient(60% 55% at 72% 18%, rgba(255,166,0,.16) 0%, rgba(255,166,0,0) 65%),
      var(--logo-watermark);
    background-size:auto, 34%;
    background-position:center, center;
    background-repeat:no-repeat, no-repeat;
    opacity:.16;
  }
  .photo-slot::after{
    content:"";position:absolute;inset:0;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140' viewBox='0 0 140 140'%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='0.14' stroke-width='1.4'%3E%3Cpath d='M10 90 Q35 60 10 30 M40 100 Q65 65 35 20 M70 110 Q95 70 60 15 M100 115 Q120 75 90 25'/%3E%3C/g%3E%3C/svg%3E");
    opacity:.5;mix-blend-mode:overlay;
  }
  .photo-slot .tag{
    position:relative;z-index:3;margin:12px;padding:7px 12px;
    color:rgba(255,247,234,.82);font-size:.68rem;font-weight:600;letter-spacing:.03em;
    background:rgba(0,0,0,.28);border:1px solid rgba(255,247,234,.16);
    backdrop-filter:blur(4px);border-radius:100px;
  }

  /* ================= NAV ================= */
  header::before{
    content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
    background:linear-gradient(180deg, rgba(0,20,9,.72) 0%, rgba(0,20,9,.45) 55%, rgba(0,20,9,0) 100%);
    transition:opacity .4s var(--ease);
  }
  header.scrolled::before{opacity:0;}
  header{
    position:fixed;top:0;left:0;right:0;z-index:100;
    padding:16px 0;transition:background .4s var(--ease),padding .4s var(--ease),box-shadow .4s;
  }
  header.scrolled{background:rgba(255,248,238,.92);backdrop-filter:blur(10px);padding:10px 0;box-shadow:0 4px 20px rgba(36,26,22,.08);}
  .nav-inner{display:flex;align-items:center;justify-content:space-between;}
  .logo{display:flex;align-items:center;gap:10px;font-family:'Fraunces',serif;font-weight:800;font-size:1.35rem;color:var(--white);transition:color .4s;}
  header.scrolled .logo{color:var(--ink);}
  /* ---- LOGO MARK ----
     The Ohana BBQ logo is embedded once as the --logo variable in :root
     (see top of this stylesheet) and reused by the header, footer, the
     footer sign-off, and the browser tab icon. To swap the logo later,
     replace that single data: URL and every instance updates at once.
     The logo sits on a white disc so its red ring and green script stay
     legible against the red header and the dark footer. */
  /* Two logo variants, each used where it reads best — no white "sticker"
     disc anywhere. On dark green the cream knockout is used; on the cream
     scrolled header the full-colour mark is used. The two crossfade. */
  /* One full-colour mark everywhere — no disc behind it, so it never reads
     as a sticker pasted onto the hero photo. A soft drop-shadow keeps the
     edge crisp where the photo behind is bright; it eases off once the
     header turns cream on scroll. */
  .logo-mark{
    position:relative;width:44px;height:44px;flex-shrink:0;
    background-image:var(--logo-full);background-size:contain;
    background-position:center;background-repeat:no-repeat;
    filter:drop-shadow(0 2px 6px rgba(0,0,0,.55));
    transition:filter .4s var(--ease);
  }
  header.scrolled .logo-mark{filter:drop-shadow(0 1px 3px rgba(0,0,0,.18));}
  .logo-inline{
    display:inline-block;width:17px;height:17px;vertical-align:-3px;margin-left:3px;
    background-image:var(--logo-full);background-size:contain;
    background-position:center;background-repeat:no-repeat;opacity:.9;
  }
  nav.links{display:flex;gap:32px;align-items:center;}
  nav.links a{font-weight:600;font-size:.92rem;color:var(--white);position:relative;transition:color .4s;}
  header.scrolled nav.links a{color:var(--ink);}
  nav.links a::after{content:"";position:absolute;left:0;bottom:-6px;width:0;height:2px;background:var(--red);transition:width .3s var(--ease);}
  nav.links a:hover::after{width:100%;}
  .nav-cta{display:flex;align-items:center;gap:14px;}
  .burger{display:none;width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.15);align-items:center;justify-content:center;color:#fff;transition:background .3s,color .3s;}
  header.scrolled .burger{color:var(--ink);background:var(--sand-dim);}

  @media (max-width:900px){
    nav.links{
      position:fixed;inset:0 0 0 auto;width:78%;max-width:340px;height:100vh;
      background:var(--dark);flex-direction:column;justify-content:center;gap:30px;
      transform:translateX(100%);transition:transform .5s var(--ease);padding:40px;
      z-index:300;pointer-events:none;visibility:hidden;
    }
    nav.links.open{
      transform:translateX(0);
      pointer-events:auto;visibility:visible;
    }
    nav.links a,
    header.scrolled nav.links a,
    header nav.links.open a{
      color:var(--sand)!important;font-size:1.2rem;
    }
    nav.links a::after{display:none;}
    .nav-cta .btn-primary{display:none;}
    .burger{display:flex;position:relative;z-index:310;}
    header{z-index:320;}
  }

  /* ================= HERO ================= */
  .hero{
    position:relative;min-height:100vh;display:flex;flex-direction:column;justify-content:flex-end;
    color:#fff;padding-top:120px;
  }
  .hero .photo-slot{position:absolute;inset:0;z-index:0;}
  /* Deep green ground with a warm bird-of-paradise glow — the logo's own
     two dominant hues, so the mark sits naturally on top of it. */
  .photo-slot.hero-bg{
    background:
      radial-gradient(85% 65% at 78% 12%, rgba(255,166,0,.30) 0%, rgba(255,166,0,0) 60%),
      radial-gradient(70% 55% at 12% 88%, rgba(193,24,31,.34) 0%, rgba(193,24,31,0) 62%),
      linear-gradient(160deg, #0b5c3a 0%, var(--ocean) 42%, var(--dark) 100%);
  }
  .hero::before{
    content:"";position:absolute;inset:0;z-index:1;
    background:linear-gradient(180deg, rgba(0,25,12,.55) 0%, rgba(0,25,12,.62) 45%, rgba(0,20,9,.95) 100%);
  }
  .hero-content{position:relative;z-index:2;padding-bottom:90px;}
  /* the live status pill is its own line so it never crowds the eyebrow */
  .hero-content .status-pill{display:inline-flex;margin-bottom:18px;}
  .hero-content .eyebrow{display:flex;}
  /* ---------- Live status pill ---------- */
  .status-pill{
    display:inline-flex;align-items:center;gap:10px;margin-bottom:22px;
    padding:9px 16px 9px 14px;border-radius:100px;
    background:rgba(0,0,0,.34);border:1px solid rgba(255,247,234,.28);
    backdrop-filter:blur(8px);
    font-size:.86rem;font-weight:600;color:#fff;letter-spacing:.01em;
    transition:background .3s,border-color .3s,transform .3s var(--ease);
  }
  .status-pill:hover{background:rgba(0,0,0,.5);border-color:rgba(255,247,234,.5);transform:translateY(-2px);}
  .status-dot{width:9px;height:9px;border-radius:50%;background:var(--hibiscus-gold);flex-shrink:0;}
  .status-arrow{opacity:.6;width:.9em;height:.9em;}
  .status-pill.is-open .status-dot{
    background:#38d17a;box-shadow:0 0 0 0 rgba(56,209,122,.65);animation:livePulse 2s infinite;
  }
  .status-pill.is-open{border-color:rgba(56,209,122,.55);}
  .status-pill.is-loading{opacity:.65;}
  .status-pill.is-closed .status-dot{background:rgba(255,247,234,.5);}
  @keyframes livePulse{
    0%{box-shadow:0 0 0 0 rgba(56,209,122,.6);}
    70%{box-shadow:0 0 0 9px rgba(56,209,122,0);}
    100%{box-shadow:0 0 0 0 rgba(56,209,122,0);}
  }
  @media (prefers-reduced-motion:reduce){.status-pill.is-open .status-dot{animation:none;}}

  .hero-content .eyebrow{color:var(--hibiscus-gold);}
  .hero-content .eyebrow::before{background:var(--hibiscus-gold);}
  .hero h1{
    font-size:clamp(3rem,9vw,6.2rem);font-weight:900;margin:14px 0 18px;
    text-wrap:balance;
  }
  .hero h1 em{font-style:italic;font-weight:500;color:var(--hibiscus-gold);}
  .hero-sub{font-size:clamp(1.05rem,2vw,1.3rem);max-width:560px;color:rgba(255,255,255,.88);margin-bottom:34px;line-height:1.55;}
  .hero-actions{display:flex;flex-wrap:wrap;gap:16px;margin-bottom:44px;}
  .hero-stats{display:flex;flex-wrap:wrap;gap:36px;border-top:1px solid rgba(255,255,255,.25);padding-top:26px;}
  .hero-stats div{display:flex;flex-direction:column;gap:2px;}
  .hero-stats strong{font-family:'Fraunces',serif;font-size:1.6rem;font-weight:700;color:var(--hibiscus-gold);}
  .hero-stats span{font-size:.78rem;color:rgba(255,255,255,.75);letter-spacing:.03em;}
  .scroll-cue{
    position:absolute;bottom:26px;left:50%;transform:translateX(-50%);z-index:2;
    display:flex;flex-direction:column;align-items:center;gap:8px;color:rgba(255,255,255,.8);font-size:.7rem;letter-spacing:.15em;
    animation:bob 2.4s ease-in-out infinite;
  }
  @keyframes bob{0%,100%{transform:translate(-50%,0);}50%{transform:translate(-50%,8px);}}

  /* ================= MARQUEE ================= */
  .marquee-wrap{background:var(--dark);overflow:hidden;padding:16px 0;border-top:1px solid rgba(255,255,255,.08);}
  .marquee{display:flex;width:max-content;animation:scroll 26s linear infinite;}
  .marquee span{
    font-family:'Fraunces',serif;font-style:italic;font-weight:500;font-size:1.15rem;color:var(--sand-dim);
    padding:0 28px;white-space:nowrap;display:flex;align-items:center;gap:28px;
  }
  .mq-flower{color:var(--hibiscus-gold);}
  @keyframes scroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}

  /* ================= SECTION HEADS ================= */
  /* scroll-margin keeps section headings clear of the fixed header when
     arriving via an anchor link (#menu, #schedule, …) */
  section,footer{scroll-margin-top:84px;}
  section{padding:110px 0;position:relative;}
  .section-head{max-width:640px;margin-bottom:56px;}
  .section-head h2{font-size:clamp(2.2rem,4.6vw,3.4rem);font-weight:700;margin-top:14px;}
  .section-head p{margin-top:18px;font-size:1.08rem;color:var(--ink-soft);line-height:1.65;}

  /* ================= STORY ================= */
  .story{background:var(--white);}
  .story-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;align-items:center;}
  .story-photo{
    border-radius:var(--radius-lg);aspect-ratio:3/2;box-shadow:var(--shadow);
    margin:0;position:relative;overflow:hidden;
  }
  .story-photo figcaption{
    position:absolute;left:0;right:0;bottom:0;z-index:3;
    padding:26px 20px 14px;
    background:linear-gradient(180deg, rgba(0,20,9,0) 0%, rgba(0,20,9,.78) 100%);
    color:rgba(255,247,234,.95);font-size:.78rem;font-weight:600;letter-spacing:.03em;
  }
  .story-text p{color:var(--ink-soft);font-size:1.05rem;line-height:1.75;margin-bottom:18px;}
  .story-badges{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:30px;}
  .story-badges div{
    background:var(--sand);border-radius:var(--radius-md);padding:16px 14px;
    border:1px solid var(--sand-dim);
  }
  @media (max-width:520px){.story-badges{grid-template-columns:1fr;}}
  .story-badges strong{display:block;font-family:'Fraunces',serif;font-size:1.5rem;color:var(--red);line-height:1.1;margin-bottom:4px;}
  .story-badges span{font-size:.78rem;color:var(--ink-soft);line-height:1.4;}
  @media (max-width:860px){.story-grid{grid-template-columns:1fr;gap:40px;}.story-photo{aspect-ratio:16/10;}}

  /* ================= MENU ================= */
  .menu{background:var(--sand);}
  .menu-tabs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:44px;}
  .menu-tab{
    padding:10px 22px;border-radius:100px;background:var(--white);border:1.5px solid var(--sand-dim);
    font-weight:700;font-size:.86rem;color:var(--ink-soft);transition:all .3s var(--ease);
  }
  .menu-tab.active,.menu-tab:hover{background:var(--red);border-color:var(--red);color:#fff;}
  .menu-group{display:none;}
  .menu-group.active{display:block;animation:fadeIn .5s var(--ease);}
  @keyframes fadeIn{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:translateY(0);}}
  .menu-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:22px;}
  .menu-card{
    background:var(--white);border-radius:var(--radius-md);overflow:hidden;display:flex;flex-direction:column;
    box-shadow:var(--shadow-sm);transition:transform .4s var(--ease),box-shadow .4s var(--ease);position:relative;
  }
  .menu-card:hover{transform:translateY(-8px);box-shadow:var(--shadow);}
  .menu-card .photo-slot{height:210px;}
  /* Real photography — object-fit lets any crop fill the slot cleanly */
  .photo-slot > img{
    position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:2;
  }
  /* the watermark/bloom is only for empty slots */
  .photo-slot.has-photo::before,.photo-slot.has-photo::after{display:none;}
  .menu-card-body{padding:22px;display:flex;flex-direction:column;gap:10px;flex:1;}
  .menu-card-top h3{font-size:1.18rem;font-weight:700;}
  .menu-card p{color:var(--ink-soft);font-size:.92rem;line-height:1.55;}
  .badge{
    position:absolute;top:14px;left:14px;z-index:3;background:var(--hibiscus-gold);color:var(--ink);
    font-size:.68rem;font-weight:800;letter-spacing:.04em;padding:6px 12px;border-radius:100px;text-transform:uppercase;
  }
  .menu-note{
    margin-top:40px;background:var(--white);border:1.5px dashed var(--red-light);border-radius:var(--radius-md);
    padding:24px 26px;display:flex;gap:16px;align-items:flex-start;
  }
  .menu-note .ic{font-size:1.4rem;}
  .menu-note p{color:var(--ink-soft);font-size:.94rem;line-height:1.6;}
  .menu-note strong{color:var(--ink);}
  .menu-cta{text-align:center;margin-top:50px;}

  /* ================= SCHEDULE ================= */
  .schedule{background:var(--dark);color:var(--sand);}
  .schedule .section-head p{color:rgba(255,248,238,.7);}
  .schedule .eyebrow{color:var(--hibiscus-gold);}
  .schedule .eyebrow::before{background:var(--hibiscus-gold);}
  .schedule-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:start;}
  @media (max-width:900px){.schedule-grid{grid-template-columns:1fr;}}
  .next-stop{
    background:linear-gradient(135deg, var(--red) 0%, var(--red-dark) 100%);border-radius:var(--radius-lg);
    padding:32px;margin-bottom:24px;box-shadow:0 25px 50px -20px rgba(166,0,0,.5);
  }
  .next-stop .eyebrow{color:#fff;}
  .next-stop .eyebrow::before{background:#fff;}
  .next-stop h3{font-size:1.7rem;margin:10px 0 6px;}
  .next-stop .meta{display:flex;flex-wrap:wrap;gap:18px;margin:16px 0 22px;font-size:.9rem;color:rgba(255,255,255,.9);}
  .next-stop .meta b{color:#fff;}
  .next-stop.is-live{
    background:linear-gradient(135deg,#0f7a45 0%,var(--ocean) 100%);
    box-shadow:0 25px 50px -20px rgba(15,122,69,.55);
  }
  .next-stop--empty{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);box-shadow:none;}
  .tonight-board{margin:16px 0 4px;padding:14px;border-radius:14px;background:rgba(0,0,0,.18);border:1px solid rgba(255,247,234,.16);}
  .tonight-board-label{font-size:.72rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--hibiscus-gold);margin-bottom:10px;}
  .tonight-board-list{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:0;padding:0;}
  @media (max-width:560px){.tonight-board-list{grid-template-columns:1fr;}}
  .tonight-board-list li{display:flex;align-items:center;gap:10px;background:rgba(0,0,0,.2);border-radius:12px;padding:10px 12px;font-size:.9rem;font-weight:600;color:#fff;}
  .tonight-board-list li.is-feature{grid-column:1/-1;background:linear-gradient(90deg,rgba(255,166,0,.22),rgba(193,24,31,.16));border:1px solid rgba(255,166,0,.3);}
  .tonight-board-list .tb-mark{flex:0 0 auto;width:26px;height:26px;border-radius:8px;display:grid;place-items:center;font-size:.78rem;font-weight:800;background:rgba(255,166,0,.18);color:var(--hibiscus-gold);}
  .tonight-board-list li.is-feature .tb-mark{background:var(--hibiscus-gold);color:var(--ink);}

  .live-dot{
    display:inline-block;width:8px;height:8px;border-radius:50%;background:#7dffb0;
    margin-right:7px;vertical-align:1px;animation:livePulse 2s infinite;
  }
  .next-note{
    margin:0 0 20px;padding:11px 14px;border-radius:12px;
    background:rgba(0,0,0,.18);font-size:.88rem;color:rgba(255,255,255,.92);
  }
  .next-actions{display:flex;gap:12px;flex-wrap:wrap;}
  .btn-ghost{
    background:transparent;color:rgba(255,255,255,.9);border:1.5px solid rgba(255,255,255,.32);
  }
  .btn-ghost:hover{background:rgba(255,255,255,.14);transform:translateY(-3px);}
  .sched-source{margin-top:16px;font-size:.78rem;color:rgba(255,248,238,.45);}
  .stop-actions{margin-left:auto;display:flex;gap:8px;flex-shrink:0;}
  .stop-icon{
    width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;
    background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);
    color:var(--sand);font-size:.95rem;transition:background .3s,transform .3s,color .3s;
  }
  .stop-icon:hover{background:var(--hibiscus-gold);color:var(--ink);transform:translateY(-2px);}
  .stop-list{display:flex;flex-direction:column;gap:14px;}
  .stop-row{
    display:flex;gap:18px;align-items:center;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);
    border-radius:var(--radius-md);padding:16px 18px;transition:background .3s;
  }
  .stop-row:hover{background:rgba(255,255,255,.09);}
  .stop-date{
    flex-shrink:0;width:60px;height:60px;border-radius:12px;background:var(--hibiscus-gold);color:var(--ink);
    display:flex;flex-direction:column;align-items:center;justify-content:center;font-weight:800;line-height:1.1;
  }
  .stop-date span{font-size:1.35rem;}
  .stop-date small{font-size:.6rem;letter-spacing:.05em;text-transform:uppercase;}
  .stop-info h4{font-size:1.02rem;font-weight:700;margin-bottom:2px;}
  .stop-info p{font-size:.84rem;color:rgba(255,248,238,.65);}
  .map-card{border-radius:var(--radius-lg);overflow:hidden;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);}
  /* dark backdrop so a slow or blocked map load never flashes a grey box */
  .map-frame{width:100%;height:320px;border:0;display:block;background:var(--dark-2);filter:grayscale(.15) contrast(1.05);}
  .map-card-foot{padding:20px 22px;display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;}
  .map-card-foot p{font-size:.85rem;color:rgba(255,248,238,.7);}
  .social-follow{margin-top:20px;display:flex;gap:12px;flex-wrap:wrap;}

  /* ================= GALLERY ================= */
  .gallery{background:var(--white);}
  .gallery-grid{
    display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:150px;gap:14px;
  }
  .gallery-grid .photo-slot{border-radius:var(--radius-sm);}
  /* 4-col mosaic that tiles without leaving a hole:
     row1-2: [ 1 (2x2) ][ 2 ][ 3 ]   row2: [ 4 (2 wide) ]
     row3:   [ 5 ][ 6 ][ 7 (2 wide) ] */
  .gallery-grid > *:nth-child(1){grid-column:span 2;grid-row:span 2;}
  @media (max-width:760px){
    .gallery-grid{grid-template-columns:repeat(2,1fr);grid-auto-rows:130px;}
    .gallery-grid > *:nth-child(1){grid-column:span 2;grid-row:span 2;}
      }
  .gallery-cta{text-align:center;margin-top:44px;}

  /* ================= TESTIMONIALS ================= */
  .reviews{background:var(--sand-dim);}
  /* Masonry columns rather than a rigid grid — the quotes vary a lot in
     length, and equal-height cells would leave big gaps under the short ones. */
  .review-grid{columns:3;column-gap:22px;margin-bottom:44px;}
  @media (max-width:980px){.review-grid{columns:2;}}
  @media (max-width:640px){.review-grid{columns:1;}}
  .review-card{
    break-inside:avoid;-webkit-column-break-inside:avoid;
    background:var(--white);border-radius:var(--radius-md);padding:26px;
    box-shadow:var(--shadow-sm);margin:0 0 22px;
    border:1px solid rgba(0,71,44,.06);
  }
  .stars{color:var(--hibiscus-gold);font-size:1rem;letter-spacing:2px;margin-bottom:14px;line-height:1;}
  .review-card blockquote{
    margin:0 0 20px;color:var(--ink);font-size:.98rem;line-height:1.65;
  }
  .review-who{display:flex;align-items:center;gap:12px;flex-wrap:wrap;}
  .avatar{
    width:40px;height:40px;border-radius:50%;background:var(--ocean);flex-shrink:0;
    display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;
    font-family:'Fraunces',serif;font-size:1rem;
  }
  .rv-meta{display:flex;flex-direction:column;gap:1px;}
  .rv-meta strong{font-size:.9rem;color:var(--ink);}
  .rv-meta > span{font-size:.75rem;color:var(--ink-soft);}
  .rv-excerpt{
    display:inline-block;margin-left:4px;padding:1px 6px;border-radius:100px;
    background:var(--sand-dim);color:var(--ink-soft);font-size:.66rem;font-weight:600;
  }
  .rv-tag{
    margin-left:auto;padding:4px 10px;border-radius:100px;
    background:var(--ocean);color:#fff;font-size:.68rem;font-weight:700;
    letter-spacing:.04em;text-transform:uppercase;
  }
  .review-cta{display:flex;gap:14px;flex-wrap:wrap;}
  @media (max-width:520px){.review-cta{flex-direction:column;}.review-cta .btn{width:100%;}}

  /* ================= CATERING ================= */
  .catering{background:var(--white);}
  .cat-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:start;}
  @media (max-width:900px){.cat-grid{grid-template-columns:1fr;}}
  .cat-info .eyebrow{color:var(--ocean);}
  .cat-info .eyebrow::before{background:var(--ocean);}
  .cat-list{margin-top:28px;display:flex;flex-direction:column;gap:18px;}
  .cat-list li{display:flex;gap:14px;align-items:flex-start;}
  .cat-list .num{
    flex-shrink:0;width:34px;height:34px;border-radius:50%;background:var(--ocean);color:#fff;
    display:flex;align-items:center;justify-content:center;font-weight:800;font-size:.85rem;
  }
  .cat-list h3{font-size:1rem;font-weight:700;margin-bottom:3px;}
  .cat-list p{font-size:.88rem;color:var(--ink-soft);}
  /* ---------- Catering estimator ---------- */
  .estimator{
    margin-top:32px;background:var(--sand);border:1px solid var(--sand-dim);
    border-radius:var(--radius-lg);padding:26px;
  }
  .est-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px;}
  .est-head h4{font-size:1.15rem;font-weight:700;}
  .est-tag{
    font-size:.64rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
    background:var(--ocean);color:#fff;padding:5px 10px;border-radius:100px;
  }
  .est-controls{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
  @media (max-width:520px){.est-controls{grid-template-columns:1fr;}}
  .est-field label{display:block;font-size:.78rem;font-weight:700;margin-bottom:8px;color:var(--ink-soft);}
  .est-field label b{color:var(--ocean);font-size:.95rem;}
  .est-field select{
    width:100%;padding:11px 13px;border-radius:var(--radius-sm);border:1.5px solid #e2d6c2;
    background:#fff;font-family:inherit;font-size:.9rem;color:var(--ink);
  }
  .est-field input[type=range]{width:100%;accent-color:var(--ocean);height:24px;}
  .est-blurb{margin-top:12px;font-size:.82rem;color:var(--ink-soft);font-style:italic;}
  .pkg-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:8px;}
  .pkg{
    text-align:left;padding:12px 14px;border-radius:var(--radius-sm);
    border:1.5px solid #e2d6c2;background:#fff;transition:all .25s var(--ease);
    display:flex;flex-direction:column;gap:3px;
  }
  .pkg:hover{border-color:var(--ocean);transform:translateY(-2px);}
  .pkg.active{background:var(--ocean);border-color:var(--ocean);}
  .pkg-name{font-weight:800;font-size:.88rem;color:var(--ink);}
  .pkg-sub{font-size:.72rem;color:var(--ink-soft);}
  .pkg.active .pkg-name,.pkg.active .pkg-sub{color:#fff;}
  .pkg.active .pkg-sub{color:rgba(255,255,255,.85);}
  .pkg-detail{
    margin-top:16px;padding:16px 18px;border-radius:var(--radius-md);
    background:#fff;border:1px solid var(--sand-dim);
  }
  .pkg-price{font-family:'Fraunces',serif;font-size:1.3rem;font-weight:700;color:var(--ocean);}
  .pkg-includes{font-size:.9rem;color:var(--ink);margin-top:4px;}
  .pkg-includes b{color:var(--ocean);}
  .pkg-note{margin-top:6px;font-size:.84rem;color:var(--ink-soft);}
  .est-total{
    margin-top:18px;padding:16px 18px;border-radius:var(--radius-md);
    background:var(--ocean);color:#fff;border-bottom:4px solid var(--hibiscus-gold);
  }
  .est-total-main{margin:0;line-height:1.15;}
  .est-total-label{display:block;font-size:.74rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--hibiscus-gold);margin-bottom:4px;}
  .est-total-amt{font-family:'Fraunces',serif;font-weight:900;font-size:clamp(2rem,8vw,2.5rem);color:#fff;letter-spacing:-.01em;font-variant-numeric:lining-nums tabular-nums;}
  .est-total-sub{margin:6px 0 0;font-size:.82rem;color:rgba(255,255,255,.85);}
  .est-cta{margin-top:14px;width:100%;}
  .est-note{margin-top:10px;font-size:.8rem;color:var(--ink-soft);text-align:center;}


  .cater-tier-label{
    font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;
    color:var(--ink-soft);margin:0 0 16px;font-weight:800;
    display:flex;align-items:baseline;gap:10px;
  }
  .cater-prem-hint{font-weight:600;letter-spacing:.04em;text-transform:none;font-size:.72rem;color:var(--hibiscus-gold);}


  /* Catering Menu — polished packages + Dropbox food cards */
  .cater-menu-board{margin-top:4px;}
  .cm-block{margin-bottom:56px;}
  .cm-block > h3{
    font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;
    color:var(--ink-soft);margin:0 0 8px;font-weight:800;
  }
  .cm-block-lead{
    font-size:.92rem;color:var(--ink-soft);margin:0 0 22px;max-width:52ch;line-height:1.55;
  }
  .cm-pkg-grid{
    display:grid;grid-template-columns:repeat(5,1fr);gap:14px;
  }
  @media (max-width:1100px){.cm-pkg-grid{grid-template-columns:repeat(3,1fr);}}
  @media (max-width:700px){.cm-pkg-grid{grid-template-columns:1fr 1fr;}}
  @media (max-width:420px){.cm-pkg-grid{grid-template-columns:1fr;}}
  .cm-pkg{
    background:#fff;border-radius:var(--radius-md);
    box-shadow:var(--shadow-sm);border:1px solid var(--sand-dim);
    display:flex;flex-direction:column;gap:8px;min-height:100%;
    padding:22px 18px 18px;position:relative;overflow:hidden;
    transition:transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s var(--ease);
  }
  .cm-pkg::before{
    content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--ocean);
  }
  .cm-pkg:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:#d4c4a8;}
  .cm-pkg-num{
    font-size:.68rem;font-weight:800;letter-spacing:.14em;
    text-transform:uppercase;color:var(--hibiscus-gold);margin:0;
  }
  .cm-pkg-name{font-family:'Fraunces',serif;font-size:1.2rem;font-weight:700;color:var(--ink);margin:0;line-height:1.2;}
  .cm-pkg-meta{
    display:inline-flex;align-self:flex-start;margin-top:2px;
    font-size:.68rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;
    color:var(--ocean);background:rgba(15,76,92,.09);padding:5px 10px;border-radius:100px;
  }
  .cm-pkg-inc{font-size:.82rem;color:var(--ink);line-height:1.5;margin-top:2px;}
  .cm-pkg-inc b{color:var(--ink-soft);font-weight:700;font-size:.72rem;letter-spacing:.04em;text-transform:uppercase;display:block;margin-bottom:2px;}
  .cm-pkg-note{font-size:.76rem;color:var(--ink-soft);margin-top:auto;padding-top:12px;border-top:1px solid var(--sand-dim);line-height:1.45;}
  .cm-pkg.is-luau{border-color:rgba(212,160,58,.55);background:linear-gradient(165deg,#fff 55%,#fff8e8 100%);}
  .cm-pkg.is-luau::before{background:var(--hibiscus-gold);}
  .cm-rate{
    margin-top:16px;display:inline-flex;align-items:center;gap:10px;flex-wrap:wrap;
    font-size:.88rem;color:var(--ink-soft);
  }
  .cm-rate strong{font-family:'Fraunces',serif;font-size:1.35rem;color:var(--ocean);font-weight:700;}

  .cater-tier{margin-bottom:10px;}
  .cater-tier-label{
    font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;
    color:var(--ink-soft);margin:0 0 16px;font-weight:800;
    display:flex;align-items:center;gap:10px;
  }
  .cater-tier-label::after{
    content:"";flex:1;height:1px;background:var(--sand-dim);
  }
  .cater-prem-hint{
    font-weight:700;letter-spacing:.04em;text-transform:uppercase;font-size:.65rem;
    color:var(--ink);background:var(--hibiscus-gold);padding:4px 9px;border-radius:100px;
  }
  #menu .menu-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;}
  #menu .menu-card .photo-slot{height:auto;aspect-ratio:4/3;}
  #menu .menu-card .photo-slot > img{object-position:center 35%;}
  #menu .menu-card-body{padding:16px 18px 18px;}
  #menu .menu-card-top h3{font-size:1.05rem;line-height:1.25;}
  .cm-photo-soon{
    aspect-ratio:4/3;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
    background:
      radial-gradient(80% 80% at 50% 20%, rgba(212,160,58,.18), transparent 60%),
      linear-gradient(145deg,#f3eadc,#e5d7c3);
    color:var(--ink-soft);text-align:center;padding:16px;
  }
  .cm-photo-soon strong{font-size:.72rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--ocean);}
  .cm-photo-soon span{font-size:.78rem;line-height:1.4;max-width:16ch;}

  /* proteins & sides reference */
  .cat-quote{
    margin:22px 0 0;padding:22px 24px;border-radius:var(--radius-md);
    background:var(--ocean);color:#fff;
  }
  .cat-quote .stars{color:var(--hibiscus-gold);margin-bottom:12px;}
  .cat-quote blockquote{margin:0 0 12px;font-size:.98rem;line-height:1.6;color:#fff;}
  .cat-quote figcaption{font-size:.78rem;color:rgba(255,255,255,.78);}
  .cat-quote figcaption a{color:var(--hibiscus-gold);text-decoration:underline;}
  .menu-ref{margin-top:20px;border-top:1px solid var(--sand-dim);padding-top:16px;}
  .menu-ref summary{
    cursor:pointer;font-weight:700;font-size:.88rem;color:var(--ocean);
    list-style:none;display:flex;align-items:center;gap:8px;
  }
  .menu-ref summary::-webkit-details-marker{display:none;}
  .menu-ref summary::before{content:"+";font-size:1.1rem;line-height:1;}
  .menu-ref[open] summary::before{content:"–";}
  .menu-ref-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:18px;}
  @media (max-width:560px){.menu-ref-grid{grid-template-columns:1fr;}}
  .menu-ref-grid h4{font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:10px;}
  .chips{display:flex;flex-wrap:wrap;gap:6px;}
  .chip{
    font-size:.78rem;padding:5px 11px;border-radius:100px;
    background:#fff;border:1px solid #e2d6c2;color:var(--ink);
  }
  .chip-prem{background:var(--hibiscus-gold);border-color:var(--hibiscus-gold);color:var(--ink);font-weight:600;}
  .chip-key{grid-column:1/-1;font-size:.74rem;color:var(--ink-soft);display:flex;align-items:center;gap:8px;}

  .cat-form{background:var(--sand);border-radius:var(--radius-lg);padding:36px;box-shadow:var(--shadow-sm);}
  .cat-form h3{font-size:1.4rem;margin-bottom:6px;}
  .cat-form>p{color:var(--ink-soft);font-size:.88rem;margin-bottom:24px;}
  .field{margin-bottom:16px;}
  .field label{display:block;font-size:.8rem;font-weight:700;margin-bottom:6px;color:var(--ink);}
  .field input,.field select,.field textarea{
    width:100%;padding:13px 15px;border-radius:var(--radius-sm);border:1.5px solid #e6d9c6;background:#fff;
    font-family:inherit;font-size:.92rem;color:var(--ink);transition:border-color .3s;
  }
  .field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--red);}
  .field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
  @media (max-width:460px){.field-row{grid-template-columns:1fr;}}
  .form-note{font-size:.76rem;color:var(--ink-soft);margin-top:10px;}

  /* ================= CTA BAND ================= */
  .cta-band{
    background:radial-gradient(120% 160% at 50% -20%, var(--sunset-orange) 0%, var(--red) 55%, var(--red-dark) 100%);
    color:#fff;text-align:center;padding:100px 0;
  }
  .cta-band h2{font-size:clamp(2rem,5vw,3.2rem);margin-bottom:18px;}
  .cta-band p{max-width:520px;margin:0 auto 34px;font-size:1.05rem;color:rgba(255,255,255,.88);}
  .cta-actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;}

  /* ================= FOOTER ================= */
  footer{background:var(--dark);color:rgba(255,248,238,.7);padding:70px 0 30px;}
  .footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:40px;margin-bottom:50px;}
  @media (max-width:800px){
    .footer-grid{grid-template-columns:1fr 1fr;gap:32px;}
    /* brand block gets the full row so the wordmark never wraps mid-name */
    .footer-brand{grid-column:1/-1;}
    .footer-brand p{max-width:none;}
  }
  .footer-brand .logo{color:var(--sand);margin-bottom:14px;}
  .footer-brand p{font-size:.9rem;line-height:1.6;max-width:280px;}
  .footer-col h2{color:var(--sand);font-size:.85rem;letter-spacing:.05em;text-transform:uppercase;margin-bottom:16px;}
  .footer-col ul{display:flex;flex-direction:column;gap:10px;}
  .footer-col a{font-size:.88rem;transition:color .3s;}
  .footer-col a:hover{color:var(--hibiscus-gold);}
  .footer-bottom{
    border-top:1px solid rgba(255,255,255,.1);padding-top:24px;display:flex;justify-content:space-between;
    flex-wrap:wrap;gap:12px;font-size:.8rem;
  }
  .footer-social{display:flex;gap:10px;}
  .footer-social a{
    width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;
    transition:background .3s,transform .3s;
  }
  .footer-social a:hover{background:var(--red);transform:translateY(-3px);}

  /* ================= STICKY MOBILE CTA ================= */
  .mobile-cta{
    display:none;position:fixed;bottom:0;left:0;right:0;z-index:90;
    background:rgba(36,26,22,.96);backdrop-filter:blur(10px);
    padding:10px 14px calc(10px + env(safe-area-inset-bottom));
    box-shadow:0 -8px 30px rgba(0,0,0,.3);
  }
  .mobile-cta-row{display:flex;gap:10px;}
  .mobile-cta a{
    flex:1;display:flex;flex-direction:column;align-items:center;gap:2px;padding:9px 4px;border-radius:14px;
    color:var(--sand);font-size:.68rem;font-weight:700;
  }
  .mobile-cta a.primary{background:var(--red);color:#fff;}
  .mobile-cta a .mi{font-size:1.15rem;}
  @media (max-width:760px){
    .mobile-cta{display:block;}
    body{padding-bottom:calc(76px + env(safe-area-inset-bottom));}
    html{scroll-padding-top:78px;scroll-padding-bottom:calc(90px + env(safe-area-inset-bottom));}
    section,footer{scroll-margin-top:78px;scroll-margin-bottom:calc(90px + env(safe-area-inset-bottom));}
    /* keep the whole hero above the sticky CTA bar */
    .hero{min-height:auto;padding-bottom:24px;}
    .hero-content{padding-bottom:36px;}
    .hero-stats{gap:18px 26px;padding-top:20px;}
    .hero-stats strong{font-size:1.3rem;}
    .scroll-cue{display:none;}
    section{padding:80px 0;}
    .gallery-grid{gap:8px;}
    /* Catering packages: readable stacked cards on phones */
    .cm-pkg-grid{grid-template-columns:1fr !important;gap:12px;}
    #menu .menu-grid{grid-template-columns:1fr 1fr;gap:12px;}
    #menu .menu-card-top h3{font-size:.95rem;}
    .cat-grid{gap:36px;}
    .mobile-cta a.is-active{background:var(--red);color:#fff;}
  }
  @media (max-width:420px){
    #menu .menu-grid{grid-template-columns:1fr;}
  }

/* ---------- SEO landing pages (catering / plate-lunch) ---------- */
.page-hero{
  position:relative;padding:140px 0 64px;background:var(--dark);color:var(--sand);
  overflow:hidden;
}
.page-hero .photo-slot{
  position:absolute;inset:0;z-index:0;
}
.page-hero .photo-slot img{
  width:100%;height:100%;object-fit:cover;opacity:.35;
}
.page-hero .container{position:relative;z-index:1;}
.page-hero h1{
  font-size:clamp(2rem,4.5vw,3.2rem);max-width:18ch;margin:14px 0 18px;color:var(--white);
}
.page-hero .lede{
  font-size:1.08rem;line-height:1.7;color:rgba(255,248,238,.85);max-width:52ch;margin-bottom:28px;
}
.page-hero .hero-ctas{display:flex;flex-wrap:wrap;gap:12px;}
.breadcrumbs{
  display:flex;flex-wrap:wrap;gap:8px;align-items:center;
  font-size:.82rem;font-weight:600;color:rgba(255,248,238,.7);margin-bottom:18px;
}
.breadcrumbs a{color:rgba(255,248,238,.9);text-decoration:underline;text-underline-offset:3px;}
.breadcrumbs .sep{opacity:.5;}
.seo-main{padding:56px 0 40px;}
.seo-layout{
  display:grid;grid-template-columns:1fr 320px;gap:48px;align-items:start;
}
@media (max-width:900px){.seo-layout{grid-template-columns:1fr;}}
.seo-prose h2{
  font-size:clamp(1.55rem,3vw,2rem);margin:42px 0 14px;color:var(--dark);
}
.seo-prose h2:first-child{margin-top:0;}
.seo-prose h3{
  font-size:1.15rem;margin:22px 0 8px;font-family:'Fraunces',serif;color:var(--ocean);
}
.seo-prose p{
  font-size:1.02rem;line-height:1.75;color:var(--ink-soft);margin:0 0 14px;
}
.seo-prose a{color:var(--ocean);font-weight:700;text-decoration:underline;text-underline-offset:3px;}
.seo-prose ul.checklist,.seo-prose ol.steps{
  margin:12px 0 20px;padding:0;display:flex;flex-direction:column;gap:10px;
}
.seo-prose ul.checklist{list-style:none;}
.seo-prose ul.checklist li{
  position:relative;padding:12px 14px 12px 42px;background:var(--white);
  border:1px solid #eadfcd;border-radius:var(--radius-sm);line-height:1.5;color:var(--ink);
}
.seo-prose ul.checklist li::before{
  content:"";position:absolute;left:14px;top:16px;width:14px;height:14px;
  border-radius:50%;background:var(--red);box-shadow:inset 0 0 0 3px var(--white);
}
.seo-prose ol.steps{list-style:none;counter-reset:step;}
.seo-prose ol.steps li{
  counter-increment:step;display:grid;grid-template-columns:36px 1fr;gap:14px;
  padding:14px 16px;background:var(--white);border:1px solid #eadfcd;border-radius:var(--radius-md);
}
.seo-prose ol.steps li::before{
  content:counter(step);width:36px;height:36px;border-radius:50%;
  background:var(--ocean);color:#fff;display:flex;align-items:center;justify-content:center;
  font-weight:800;font-size:.9rem;
}
.pkg-cards{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;margin:18px 0 24px;
}
.pkg-card{
  background:var(--white);border:1.5px solid #eadfcd;border-radius:var(--radius-md);padding:18px;
}
.pkg-card h3{margin:0 0 6px;font-size:1.15rem;color:var(--ink);}
.pkg-card p{margin:0;font-size:.92rem;line-height:1.55;color:var(--ink-soft);}
.pkg-card .tag{
  display:inline-block;font-size:.68rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  color:var(--red);margin-bottom:8px;
}
.two-col-lists{
  display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:16px 0 24px;
}
@media (max-width:620px){.two-col-lists{grid-template-columns:1fr;}}
.side-card{
  background:var(--sand-dim);border-radius:var(--radius-md);padding:18px;
}
.side-card h3{margin:0 0 10px;font-size:1.05rem;}
.side-card ul{list-style:disc;padding-left:1.2em;margin:0;display:flex;flex-direction:column;gap:6px;}
.side-card li{font-size:.95rem;line-height:1.45;color:var(--ink);}
.faq{margin:28px 0 10px;display:flex;flex-direction:column;gap:10px;}
.faq details{
  background:var(--white);border:1px solid #eadfcd;border-radius:var(--radius-md);padding:14px 18px;
}
.faq summary{
  cursor:pointer;font-weight:700;font-size:1.02rem;color:var(--ink);list-style:none;
  display:flex;justify-content:space-between;gap:12px;align-items:center;
}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+";color:var(--red);font-size:1.3rem;font-weight:700;}
.faq details[open] summary::after{content:"–";}
.faq details p{margin:12px 0 4px;font-size:.98rem;line-height:1.65;color:var(--ink-soft);}
.seo-aside{position:sticky;top:100px;display:flex;flex-direction:column;gap:16px;}
@media (max-width:900px){.seo-aside{position:static;}}
.aside-card{
  background:var(--white);border:1.5px solid #eadfcd;border-radius:var(--radius-lg);padding:22px;
  box-shadow:var(--shadow-sm);
}
.aside-card h2{font-size:1.2rem;margin:0 0 10px;}
.aside-card p{font-size:.92rem;line-height:1.55;color:var(--ink-soft);margin:0 0 14px;}
.aside-card .btn{width:100%;justify-content:center;margin-bottom:10px;}
.aside-card .btn:last-child{margin-bottom:0;}
.aside-meta{font-size:.88rem;line-height:1.6;color:var(--ink-soft);}
.aside-meta a{color:var(--ocean);font-weight:700;}
.seo-photo{
  border-radius:var(--radius-lg);overflow:hidden;margin:24px 0;
  border:1px solid #eadfcd;
}
.seo-photo img{width:100%;aspect-ratio:16/10;object-fit:cover;}
.seo-photo figcaption{
  padding:10px 14px;font-size:.82rem;color:var(--ink-soft);background:var(--sand-dim);
}
.inline-cta-row{display:flex;flex-wrap:wrap;gap:12px;margin:20px 0;}
.rate-pill{
  display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:999px;
  background:rgba(0,71,44,.08);color:var(--ocean);font-weight:700;font-size:.92rem;margin:8px 0 16px;
}

  .nav-phone{display:inline-flex;align-items:center;gap:7px;font-weight:700;font-size:.9rem;color:var(--white);white-space:nowrap;transition:color .4s;}
  header.scrolled .nav-phone{color:var(--ink);}
  .nav-phone:hover{color:var(--hibiscus-gold);}
  header.scrolled .nav-phone:hover{color:var(--red);}
  @media (max-width:1180px){.nav-phone .nav-phone-num{display:none;}}
  @media (max-width:900px){.nav-phone{display:none;}}
  .map-placeholder{
    width:100%;height:320px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;
    text-align:center;padding:24px;color:var(--sand);
    background:
      radial-gradient(70% 60% at 75% 15%, rgba(255,166,0,.16) 0%, rgba(255,166,0,0) 60%),
      radial-gradient(60% 55% at 15% 90%, rgba(193,24,31,.18) 0%, rgba(193,24,31,0) 62%),
      var(--dark-2);
  }
  .map-placeholder .ico{width:34px;height:34px;color:var(--hibiscus-gold);}
  .map-placeholder p{font-size:.85rem;color:rgba(255,248,238,.7);max-width:30ch;margin:0;}
  .sched-share-link{color:var(--hibiscus-gold);font-weight:700;text-decoration:underline;text-underline-offset:3px;}
  .sched-share-link:hover{color:var(--gold-soft);}
  .cm-pkg-price{font-family:'Fraunces',serif;font-size:1.22rem;font-weight:700;color:var(--ocean);line-height:1.2;margin-top:6px;padding-left:10px;border-left:3px solid var(--hibiscus-gold);}
  .cm-pkg-price .cm-pkg-from,.cm-pkg-price .cm-pkg-per{font-family:'Plus Jakarta Sans',system-ui,sans-serif;font-size:.74rem;font-weight:600;color:var(--ink-soft);letter-spacing:.01em;}
  .cm-pkg-price .cm-pkg-per{white-space:nowrap;}
  .cm-pkg-price .cm-pkg-from{text-transform:uppercase;letter-spacing:.06em;font-weight:700;color:#a86a00;}
  .cm-pkg-price-note{font-size:.7rem;font-style:italic;color:var(--ink-soft);padding-left:13px;margin-top:2px;margin-bottom:4px;}
  /* Fraunces macron fix: Google's Latin subset carries U+0304 but no mark positioning,
     so Chrome shapes "ā"/"ū" there as a + spacing macron ("Eha¯"). These tiny self-hosted
     Fraunces subsets (same font, incl. the precomposed glyphs) take over just those letters.
     Weights match the Google Fonts request so they join the same font-face sets. */
  @font-face{font-family:'Fraunces';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/fraunces-macron.woff2) format('woff2');unicode-range:U+0100-0101,U+016A-016B;}
  @font-face{font-family:'Fraunces';font-style:normal;font-weight:600;font-display:swap;src:url(/fonts/fraunces-macron.woff2) format('woff2');unicode-range:U+0100-0101,U+016A-016B;}
  @font-face{font-family:'Fraunces';font-style:normal;font-weight:700;font-display:swap;src:url(/fonts/fraunces-macron.woff2) format('woff2');unicode-range:U+0100-0101,U+016A-016B;}
  @font-face{font-family:'Fraunces';font-style:normal;font-weight:900;font-display:swap;src:url(/fonts/fraunces-macron.woff2) format('woff2');unicode-range:U+0100-0101,U+016A-016B;}
  @font-face{font-family:'Fraunces';font-style:italic;font-weight:500;font-display:swap;src:url(/fonts/fraunces-macron-italic.woff2) format('woff2');unicode-range:U+0100-0101,U+016A-016B;}
  .cm-truckside{display:flex;gap:14px;align-items:flex-start;margin-top:22px;padding:16px 20px;background:#fff8e8;border:1px solid rgba(212,160,58,.45);border-left:3px solid var(--hibiscus-gold);border-radius:var(--radius-sm);}
  .cm-truckside p{margin:0;font-size:.9rem;line-height:1.55;color:var(--ink);}
  .cm-truckside b{font-family:'Fraunces',serif;font-weight:700;color:var(--ocean);font-size:1rem;}
  .cm-truckside-icon{flex:none;width:34px;height:34px;border-radius:50%;background:var(--ocean);color:var(--hibiscus-gold);display:grid;place-items:center;margin-top:2px;}
  .cm-truckside-icon .ico{width:17px;height:17px;}
  .field-check{display:flex;align-items:flex-start;gap:11px;margin-bottom:16px;padding:13px 15px;background:#fff;border:1.5px solid #e6d9c6;border-radius:var(--radius-sm);transition:border-color .3s;cursor:pointer;}
  .field-check:focus-within{border-color:var(--red);}
  .field-check input{flex:none;width:18px;height:18px;margin:1px 0 0;accent-color:var(--ocean);cursor:pointer;}
  .field-check label{font-size:.88rem;font-weight:600;color:var(--ink);line-height:1.4;cursor:pointer;}
  .cm-chips{margin-top:28px;padding:20px 22px;background:#fff;border:1px solid var(--sand-dim);border-radius:var(--radius-sm);}
  .cm-chips-title{font-family:'Fraunces',serif;font-size:1.15rem;font-weight:700;color:var(--ink);margin:0;}
  .cm-chips .menu-ref-grid{margin-top:14px;}
  .cater-teaser-price{text-align:center;margin:36px 0 0;font-size:.98rem;color:var(--ink);}
  .cater-teaser-price b{font-family:'Fraunces',serif;font-weight:700;color:var(--ocean);font-size:1.08rem;white-space:nowrap;}
  .cater-teaser-price .cater-teaser-note{display:block;font-size:.75rem;font-style:italic;color:var(--ink-soft);margin-top:2px;}
  .cater-teaser-price + .cater-teaser-cta{margin-top:16px;}
  .cater-teaser-cta{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:36px;}
  @media (max-width:420px){#menu .cater-teaser .menu-grid{grid-template-columns:1fr 1fr;}}
  .hp-field{position:absolute!important;left:-10000px;width:1px;height:1px;overflow:hidden;}
  .form-thanks{text-align:center;padding:28px 8px;}
  .form-thanks h3{font-size:1.5rem;margin-bottom:10px;}
  .form-thanks p{color:var(--ink-soft);font-size:.95rem;line-height:1.6;}
  .form-error{margin-top:12px;font-size:.85rem;color:var(--red-dark);font-weight:600;}