:root{--cream:#fff8eb;--cream2:#fff1dc;--white:#fff;--ink:#1f1613;--muted:#654d3f;--red:#c91616;--red-dark:#991111;--gold:#d79822;--green:#2e8a46;--line:#ead9c3;--shadow:0 18px 50px rgba(77,48,24,.12);--radius:24px;--max:1180px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:linear-gradient(180deg,var(--cream),#fffdf8 40%,var(--cream))}img{display:block;max-width:100%}a{color:inherit;text-decoration:none}button{font:inherit}.container{width:min(var(--max),calc(100% - 40px));margin:0 auto}.site-header{position:sticky;top:0;z-index:50;background:rgba(255,248,235,.94);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}.nav{height:82px;display:flex;align-items:center;justify-content:space-between;gap:20px}.brand{display:flex;align-items:center;gap:10px;font-weight:900}.brand-fleur{font-size:32px;color:var(--gold);line-height:1}.brand-text{display:grid;line-height:.88;text-transform:uppercase}.brand-text em{font-family:Georgia,serif;text-transform:none;font-size:17px;color:#3a251c}.brand-text strong{font-size:28px;color:var(--red);letter-spacing:-.035em}.brand-text small{font-size:12px;letter-spacing:.3em;color:var(--ink)}.desktop-nav{display:flex;align-items:center;gap:28px;font-size:14px;font-weight:900;text-transform:uppercase}.desktop-nav a:hover{color:var(--red)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:8px;padding:13px 20px;font-weight:1000;text-transform:uppercase;border:2px solid var(--red);letter-spacing:.02em;cursor:pointer;transition:.18s transform,.18s box-shadow,.18s background}.btn:hover{transform:translateY(-1px);box-shadow:0 14px 26px rgba(201,22,22,.14)}.btn-red{background:var(--red);color:white}.btn-red:hover{background:var(--red-dark)}.btn-outline{color:var(--red);background:white}.btn-small{padding:10px 14px;font-size:12px}.order-menu{position:relative}.order-trigger span{font-size:18px;transform:translateY(-1px)}.order-dropdown{position:absolute;right:0;top:calc(100% + 10px);width:292px;background:white;border:1px solid var(--line);border-radius:18px;box-shadow:0 20px 45px rgba(37,24,18,.18);padding:8px;display:none}.order-menu.open .order-dropdown,.order-menu:hover .order-dropdown,.order-menu:focus-within .order-dropdown{display:block}.order-dropdown a{display:flex;align-items:center;gap:14px;padding:13px 12px;border-radius:12px;border-bottom:1px solid rgba(234,217,195,.7)}.order-dropdown a:last-child{border-bottom:0}.order-dropdown a:hover{background:#fff5e5}.drop-icon{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#fff4df;color:var(--gold);font-weight:1000}.drop-icon.green{color:var(--green)}.drop-icon.red{color:#e33b20}.order-dropdown small{display:block;color:var(--muted);font-size:12px;margin-top:3px}.hamburger{display:none;background:transparent;border:0;width:44px;padding:8px}.hamburger span{display:block;height:3px;background:var(--ink);border-radius:2px;margin:6px 0}.mobile-panel{display:none;border-top:1px solid var(--line);padding:10px 20px 18px}.mobile-panel.open{display:block}.mobile-panel a{display:block;padding:12px 0;font-weight:900;text-transform:uppercase;border-bottom:1px solid var(--line)}.hero{padding:34px 0 22px;background:linear-gradient(180deg,#fff9ef,#fff2de)}.hero-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:28px;align-items:center}.kicker{color:var(--gold);text-transform:uppercase;font-weight:1000;letter-spacing:.12em;font-size:13px}.hero h1{margin:11px 0 15px;font-size:clamp(46px,5.5vw,82px);line-height:.88;text-transform:uppercase;letter-spacing:-.05em;font-weight:1000}.hero h1 span{color:var(--red);display:block}.hero p{color:#3b2923;font-size:18px;line-height:1.5;max-width:470px}.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:22px}.hero-image-card{border-radius:26px;overflow:hidden;box-shadow:var(--shadow);background:white;border:1px solid var(--line)}.hero-image-card img{width:100%;height:100%;object-fit:cover}.category-section{padding:44px 0}.section-heading{margin-bottom:24px}.section-heading.center{text-align:center}.section-heading h2{font-size:clamp(32px,4vw,52px);text-transform:uppercase;letter-spacing:-.04em;margin:7px 0}.section-heading p{color:var(--muted);line-height:1.5;margin:0 auto;max-width:680px}.category-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.category-card{appearance:none;border:1px solid var(--line);background:white;border-radius:22px;overflow:hidden;box-shadow:0 14px 34px rgba(77,48,24,.10);text-align:center;transition:.18s transform,.18s box-shadow;cursor:pointer;padding:0;color:var(--ink)}.category-card:hover{transform:translateY(-4px);box-shadow:0 22px 46px rgba(77,48,24,.15)}.category-card img{width:100%;aspect-ratio:1.12/1;object-fit:cover}.category-card b{display:block;padding:13px 10px 17px;text-transform:uppercase;font-size:20px;letter-spacing:-.02em}.category-card b:before{content:"— ✦ —";display:block;color:var(--gold);font-size:15px;margin-bottom:5px}.flavor-section{padding:36px 0 46px}.flavor-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:28px;align-items:center}.flavor-copy h2{font-size:clamp(42px,5vw,70px);line-height:.92;margin:8px 0 0;text-transform:uppercase;color:var(--red);letter-spacing:-.05em}.flavor-copy h3{margin:0 0 16px;font-size:30px;text-transform:uppercase}.flavor-copy p{color:#3b2923;line-height:1.55}.ingredient-list{display:flex;flex-wrap:wrap;gap:10px 18px;padding:0;margin:18px 0;list-style:none}.ingredient-list li{font-weight:800}.ingredient-list li:before{content:"✦";color:var(--red);margin-right:7px}.red-line{color:var(--red)!important;font-weight:1000}.image-panel{border:1px solid var(--line);border-radius:24px;overflow:hidden;box-shadow:var(--shadow);background:white}.promo-section{padding:28px 0 36px}.promo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.promo-card{display:grid;grid-template-columns:.9fr 1.1fr;gap:12px;align-items:center;background:white;border:1px solid var(--line);border-radius:22px;padding:20px;box-shadow:0 14px 34px rgba(77,48,24,.10);overflow:hidden}.promo-card h3{font-size:30px;color:var(--red);text-transform:uppercase;line-height:1;margin:0 0 10px}.promo-card p{font-size:14px;color:var(--muted);line-height:1.45}.promo-card img{border-radius:14px;max-height:210px;width:100%;object-fit:cover}.utility-section{padding:20px 0 42px}.utility-grid{display:grid;grid-template-columns:repeat(4,1fr);background:white;border:1px solid var(--line);border-radius:22px;box-shadow:0 14px 34px rgba(77,48,24,.08);overflow:hidden}.utility-card{display:grid;grid-template-columns:64px 1fr;gap:14px;padding:22px;border-right:1px solid var(--line)}.utility-card:last-child{border-right:0}.utility-card img{width:58px;height:58px;object-fit:contain}.utility-card h3{margin:0;text-transform:uppercase;font-size:20px}.utility-card p{margin:4px 0 8px;color:var(--muted);font-size:14px;line-height:1.35}.utility-card span{color:var(--red);font-weight:1000;text-transform:uppercase;font-size:13px}.connect-section{text-align:center;padding:10px 0 36px}.spice-divider{width:100%;max-height:95px;object-fit:cover;opacity:.95}.connect-section h2{color:var(--red);text-transform:uppercase;font-size:30px;margin:6px 0 18px}.socials{display:flex;justify-content:center;gap:16px}.socials a{width:48px;height:48px;border-radius:50%;background:#1f1613;color:white;display:grid;place-items:center;font-size:22px;font-weight:1000}.detail-view{background:linear-gradient(180deg,#fff8eb,#fffdf8)}.detail-hero{padding:42px 0 28px;background:linear-gradient(180deg,#fff3df,#fff8eb);border-bottom:1px solid var(--line)}.detail-hero-grid{display:grid;grid-template-columns:1fr .82fr;gap:28px;align-items:center}.back-btn{background:transparent;border:0;color:var(--red);font-weight:1000;text-transform:uppercase;cursor:pointer;padding:0 0 14px}.detail-hero h1{font-size:clamp(44px,5vw,74px);line-height:.9;margin:8px 0 12px;text-transform:uppercase;letter-spacing:-.05em;color:var(--red)}.detail-hero p{color:#3b2923;line-height:1.55;font-size:18px}.detail-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}.detail-image{border-radius:24px;overflow:hidden;border:1px solid var(--line);box-shadow:var(--shadow);background:white}.detail-image img{width:100%;height:320px;object-fit:cover}.detail-category-nav{position:sticky;top:82px;z-index:40;background:rgba(255,248,235,.96);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);padding:10px max(20px,calc((100% - var(--max))/2));display:flex;gap:10px;overflow-x:auto}.detail-category-nav button{white-space:nowrap;border:1px solid var(--line);background:white;border-radius:999px;padding:10px 14px;font-weight:900;cursor:pointer;color:var(--ink)}.detail-category-nav button.active{background:var(--red);color:white;border-color:var(--red)}.detail-content{padding:34px 0 54px}.detail-groups{display:grid;gap:20px}.menu-group{background:white;border:1px solid var(--line);border-radius:22px;box-shadow:0 12px 34px rgba(77,48,24,.08);overflow:hidden}.menu-group summary{list-style:none;cursor:pointer;padding:22px 24px;background:#fff4df;color:var(--ink);font-size:25px;font-weight:1000;text-transform:uppercase}.menu-group summary::-webkit-details-marker{display:none}.menu-group summary:after{content:"+";float:right;color:var(--red)}.menu-group[open] summary:after{content:"–"}.item-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:0}.menu-item{padding:22px 24px;border-top:1px solid var(--line)}.menu-item:nth-child(odd){border-right:1px solid var(--line)}.menu-item h3{margin:0 0 6px;font-size:23px;text-transform:uppercase}.menu-price{color:var(--red);font-weight:1000;margin-bottom:8px}.menu-item p{color:var(--muted);line-height:1.5;margin:0}.site-footer{background:#fff7e8;border-top:1px solid var(--line)}.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:28px;padding:36px 0}.site-footer h4{margin:0 0 10px;text-transform:uppercase}.site-footer p,.site-footer a{display:block;color:#5a473d;line-height:1.6;margin:0 0 6px}.site-footer b{color:var(--red)}.legal{background:#16110f;color:#dcc8b7;text-align:center;font-size:12px;padding:13px}@media(max-width:980px){.desktop-nav{display:none}.hamburger{display:block}.hero-grid,.flavor-grid,.detail-hero-grid{grid-template-columns:1fr}.category-grid{grid-template-columns:repeat(2,1fr)}.promo-grid{grid-template-columns:1fr}.utility-grid{grid-template-columns:1fr 1fr}.utility-card:nth-child(2){border-right:0}.utility-card{border-bottom:1px solid var(--line)}.footer-grid{grid-template-columns:1fr 1fr}.detail-category-nav{top:76px}}@media(max-width:620px){.container{width:min(100% - 28px,var(--max))}.nav{height:70px}.brand-fleur{font-size:22px}.brand-text strong{font-size:21px}.brand-text em{font-size:14px}.brand-text small{display:none}.order-menu{margin-left:auto}.order-trigger{display:none}.order-dropdown{right:-50px}.hero{padding:14px 0 10px}.hero-grid{gap:10px}.hero-copy{display:grid;grid-template-columns:1fr auto;align-items:end;gap:8px 12px}.hero-copy .kicker{grid-column:1/-1;font-size:10px;letter-spacing:.08em}.hero h1{font-size:28px;line-height:.92;margin:0}.hero p{display:none}.hero-actions{margin:0;justify-content:flex-end}.hero-actions .btn-outline{display:none}.hero-actions .btn-red{padding:10px 12px;font-size:11px}.hero-image-card{border-radius:14px;max-height:145px}.hero-image-card img{height:145px;object-fit:cover}.category-section{padding:26px 0}.section-heading h2{font-size:30px}.section-heading p{font-size:14px}.category-grid{grid-template-columns:repeat(2,1fr);gap:12px}.category-card{border-radius:16px}.category-card img{aspect-ratio:1.35/1;height:105px;object-fit:cover}.category-card b{font-size:13px;padding:8px 7px 10px}.category-card b:before{font-size:10px;margin-bottom:2px}.flavor-copy h2{font-size:38px}.flavor-copy h3{font-size:22px}.promo-card{grid-template-columns:1fr}.utility-grid{grid-template-columns:1fr}.utility-card{border-right:0}.footer-grid{grid-template-columns:1fr}.detail-hero{padding:24px 0 18px}.detail-hero h1{font-size:38px}.detail-hero p{font-size:15px}.detail-image img{height:180px}.detail-category-nav{top:70px;padding:8px 14px}.detail-category-nav button{padding:8px 11px;font-size:12px}.item-grid{grid-template-columns:1fr}.menu-item:nth-child(odd){border-right:0}.menu-group summary{font-size:20px;padding:18px}.menu-item{padding:18px}.menu-item h3{font-size:19px}}

/* V3 refinements */
.category-card{position:relative}
.category-icon{
  position:absolute;
  top:10px;
  left:10px;
  z-index:2;
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:rgba(255,255,255,.92);
  border:1px solid var(--line);
  box-shadow:0 8px 20px rgba(77,48,24,.12);
  font-size:24px;
}

/* V74 final neutral gray theme lock */
:root{
  --cream:#f3f4f6 !important;
  --cream2:#eceef1 !important;
  --white:#ffffff !important;
  --line:#d9dde3 !important;
  --shadow:0 18px 50px rgba(31,22,19,.08) !important;
}
body{
  background:linear-gradient(180deg,#f3f4f6,#fafbfc 40%,#f3f4f6) !important;
}
.site-header{
  background:rgba(243,244,246,.94) !important;
}
.hero,
.detail-view,
.detail-hero,
.static-view,
.site-footer,
.footer-tunes,
.category-section,
.flavor-section,
.promo-section,
.utility-section,
.connect-section,
.static-page,
.detail-content{
  background:transparent !important;
}
.hero{
  background:linear-gradient(180deg,#f7f8fa,#eef1f4) !important;
}
.detail-hero{
  background:linear-gradient(180deg,#f7f8fa,#eef1f4) !important;
}
.menu-group summary,
.menu-group-flat h2,
.support-card,
.drop-icon{
  background:#eef1f4 !important;
}
.support-form input,
.support-form textarea,
.support-form select{
  background:#f6f7f9 !important;
  border-color:#d9dde3 !important;
}
.support-form input[type="file"]{
  background:#ffffff !important;
}
.order-dropdown a:hover,
.btn-outline,
.detail-image,
.category-card,
.submenu-category-card,
.image-panel,
.promo-card,
.utility-grid{
  background:#ffffff !important;
}
.category-card img,
.detail-image img,
.image-panel img,
.promo-card img,
.submenu-category-card img{
  background:#eef1f4 !important;
}
.catering-card{
  background:linear-gradient(135deg,#ffffff,#eef1f4) !important;
}
.site-footer{
  border-top-color:#d9dde3 !important;
}
.site-footer p,
.site-footer a{
  color:#4f5b66 !important;
}
.detail-image img{
  height:210px;
}
.detail-category-nav{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:10px;
  overflow:visible;
}
.detail-category-nav .detail-nav-card{
  border-radius:14px;
  white-space:normal;
  min-height:70px;
  padding:10px 8px;
  display:grid;
  place-items:center;
  gap:4px;
  text-align:center;
  line-height:1.05;
  background:white;
}
.detail-nav-card span{
  font-size:24px;
  line-height:1;
}
.detail-nav-card b{
  display:block;
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:-.02em;
}
.detail-nav-card.active{
  background:var(--red);
  color:white;
}
.menu-group-flat{
  background:white;
  border:1px solid var(--line);
  border-radius:22px;
  box-shadow:0 12px 34px rgba(77,48,24,.08);
  overflow:hidden;
}
.menu-group-flat h2{
  margin:0;
  padding:20px 24px;
  background:#fff4df;
  color:var(--ink);
  font-size:25px;
  font-weight:1000;
  text-transform:uppercase;
}
.featured-item{
  border-left:6px solid var(--red);
  background:linear-gradient(90deg,rgba(201,22,22,.08),#fff);
}
.featured-item h3,
.featured-item .menu-price{
  color:var(--red);
  font-weight:1000;
}
.sauce-accordion{
  background:white;
  border:1px solid var(--line);
  border-radius:22px;
  box-shadow:0 12px 34px rgba(77,48,24,.08);
  overflow:hidden;
}
.sauce-accordion summary{
  list-style:none;
  cursor:pointer;
  padding:20px 24px;
  background:#1f1613;
  color:white;
  font-size:25px;
  font-weight:1000;
  text-transform:uppercase;
}
.sauce-accordion summary::-webkit-details-marker{display:none}
.sauce-accordion summary:after{
  content:"+";
  float:right;
  color:var(--gold);
}
.sauce-accordion[open] summary:after{
  content:"–";
}

@media(max-width:620px){
  .detail-image img{
    height:118px;
  }
  .detail-category-nav{
    grid-template-columns:repeat(4, minmax(0,1fr));
    gap:6px;
    padding:7px 10px;
  }
  .detail-category-nav .detail-nav-card{
    min-height:55px;
    padding:6px 4px;
    border-radius:10px;
  }
  .detail-nav-card span{
    font-size:18px;
  }
  .detail-nav-card b{
    font-size:9px;
  }
  .category-grid{
    grid-template-columns:repeat(4,1fr);
    gap:7px;
  }
  .category-card img{
    height:58px;
  }
  .category-icon{
    width:24px;
    height:24px;
    font-size:15px;
    top:5px;
    left:5px;
    border-radius:7px;
  }
  .category-card b{
    font-size:9px;
    padding:5px 3px 7px;
    line-height:1.05;
  }
  .section-heading{
    margin-bottom:14px;
  }
  .menu-group-flat h2,
  .sauce-accordion summary{
    font-size:19px;
    padding:16px;
  }
}


/* V4 refinements */
.legal{
  font-size:12px;
}
.top-socials{
  display:flex;
  align-items:center;
  gap:8px;
}
.top-socials a{
  width:34px;
  height:34px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:#1f1613;
  color:white;
  font-weight:1000;
  font-size:16px;
}
.hero-order-menu{
  display:inline-block;
}
.hero-order-menu .order-dropdown{
  left:0;
  right:auto;
  z-index:80;
}
.utility-button{
  appearance:none;
  border-top:0;
  border-left:0;
  border-bottom:0;
  background:white;
  text-align:left;
  color:var(--ink);
  cursor:pointer;
  font:inherit;
}
.utility-button:hover{
  background:#fff8eb;
}
.spice-divider{
  max-height:none!important;
  height:auto!important;
  object-fit:contain!important;
  object-position:center!important;
  margin:0 auto 12px;
}
.category-icon{
  display:none!important;
}
.detail-nav-card span{
  display:none!important;
}
.static-view{
  background:linear-gradient(180deg,#fff8eb,#fffdf8);
}
.static-page{
  padding:48px 0 70px;
}
.static-card{
  background:white;
  border:1px solid var(--line);
  border-radius:26px;
  box-shadow:var(--shadow);
  padding:34px;
}
.static-card h1{
  font-size:clamp(44px,6vw,78px);
  color:var(--red);
  text-transform:uppercase;
  letter-spacing:-.05em;
  line-height:.9;
  margin:8px 0 16px;
}
.static-card p{
  color:#3b2923;
  line-height:1.55;
  font-size:18px;
  max-width:760px;
}
.static-actions{
  margin-top:20px;
}
.support-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:16px;
  margin:22px 0;
}
.support-card{
  background:#fff4df;
  border:1px solid var(--line);
  border-radius:18px;
  padding:20px;
}
.support-card h2{
  margin:0 0 8px;
  text-transform:uppercase;
  color:var(--red);
}
.support-card p{
  margin:0;
}
.support-form{
  display:grid;
  gap:14px;
  max-width:760px;
}
.support-form label{
  display:grid;
  gap:7px;
  font-weight:900;
  text-transform:uppercase;
  font-size:13px;
}
.support-form input,
.support-form textarea,
.support-form select{
  width:100%;
  border:1px solid var(--line);
  border-radius:12px;
  padding:14px;
  background:#fffaf2;
  font:inherit;
  text-transform:none;
}
.support-form input[type="file"]{
  padding:12px;
  background:#ffffff;
}
.support-form textarea{
  min-height:130px;
  resize:vertical;
}
.support-helper{
  margin:0;
  color:#6c5750;
  font-size:13px;
  line-height:1.45;
  text-transform:none;
  font-weight:600;
}
.support-status{
  min-height:24px;
  font-size:14px;
  font-weight:700;
  line-height:1.4;
  color:#3b2923;
}
.support-status.pending{
  color:#6c5750;
}
.support-status.success{
  color:#2e8a46;
}
.support-status.error{
  color:var(--red);
}
.support-honeypot{
  position:absolute !important;
  left:-9999px !important;
  width:1px !important;
  height:1px !important;
  overflow:hidden !important;
}

@media(max-width:980px){
  .top-socials{
    display:none;
  }
}
@media(max-width:620px){
  .hero-order-menu{
    width:auto;
  }
  .hero-order-menu .order-trigger{
    display:inline-flex;
  }
  .hero-order-menu .order-dropdown{
    left:auto;
    right:0;
    width:280px;
  }
  .support-grid{
    grid-template-columns:1fr;
  }
  .static-card{
    padding:24px;
  }
  .static-card h1{
    font-size:40px;
  }
}


/* V5 logo + TBC Tunes footer link */
.brand{
  min-width:auto;
}
.site-logo{
  display:block;
  width:auto;
  height:54px;
  max-width:260px;
  object-fit:contain;
}
.footer-brand .site-logo{
  height:62px;
  max-width:300px;
}
.footer-tunes{
  padding:0 0 24px;
  text-align:center;
}
.footer-tunes a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:12px 18px;
  border-radius:999px;
  background:#1f1613;
  color:#fff8eb;
  font-weight:1000;
  text-transform:uppercase;
  letter-spacing:.02em;
  box-shadow:0 12px 26px rgba(77,48,24,.16);
}
.footer-tunes a:hover{
  background:var(--red);
}

@media(max-width:620px){
  .site-logo{
    height:42px;
    max-width:190px;
  }
  .footer-brand .site-logo{
    height:50px;
    max-width:230px;
  }
  .footer-tunes a{
    width:100%;
    font-size:13px;
    line-height:1.25;
    padding:12px 14px;
  }
}


/* V6: every Order Now button can open ordering dropdown */
.inline-order-menu{
  display:inline-block;
  position:relative;
}
.inline-order-menu .order-dropdown{
  left:0;
  right:auto;
  z-index:120;
}
.nav .order-menu .order-dropdown{
  right:0;
  left:auto;
}
.order-trigger .order-state{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:18px;
  height:18px;
  line-height:1;
  font-weight:1000;
}
.detail-actions .inline-order-menu,
.hero-actions .inline-order-menu{
  margin:0;
}
@media(max-width:620px){
  .inline-order-menu{
    width:100%;
  }
  .hero-actions .inline-order-menu{
    width:auto;
  }
  .inline-order-menu .order-trigger{
    width:100%;
  }
  .hero-actions .inline-order-menu .order-trigger{
    width:auto;
  }
  .inline-order-menu .order-dropdown{
    left:0;
    right:auto;
    width:min(292px, calc(100vw - 28px));
  }
  .hero-actions .inline-order-menu .order-dropdown{
    left:auto;
    right:0;
  }
}


/* V8: refreshed images, neutral beige, catering callout, tight footer */
:root{--cream:#efe9df;--cream2:#e7dfd3;--white:#fcfbf8;--line:#ddd2c4}
body{background:linear-gradient(180deg,#eee7dd,#f7f4ef 38%,#eee7dd)}
.site-header{background:rgba(252,251,248,.92)!important;border-bottom:1px solid var(--line)}
.hero,.category-section,.flavor-section,.promo-section,.utility-section,.connect-section,.detail-hero,.detail-content,.static-view{background:transparent}
.hero-image-card,.image-panel,.promo-card,.utility-card,.menu-group-flat,.sauce-accordion,.static-card{background:var(--white)!important;border-color:var(--line)!important}
.hero-image-card{padding:20px}
.hero-image-card img{width:100%;height:auto!important;max-height:520px;object-fit:contain!important;object-position:center;background:transparent!important}
.category-card,.detail-image{background:#f5f1ea}
.category-card img{width:100%;height:168px;object-fit:contain!important;object-position:center;background:#f5f1ea;padding:8px}
.detail-image img{width:100%;height:220px!important;object-fit:contain!important;object-position:center;background:#f5f1ea;padding:8px;border-radius:16px}
.image-panel img,.promo-card img{object-fit:contain!important;background:#f5f1ea}
.drop-icon{font-size:11px!important;font-weight:1000;letter-spacing:.03em}
.catering-callout{padding:4px 0 24px}
.catering-card{width:100%;display:grid;grid-template-columns:1fr auto;gap:22px;align-items:center;text-align:left;cursor:pointer;border:1px solid var(--line);background:linear-gradient(135deg,#fcfbf8,#eee7dd);border-radius:24px;box-shadow:0 14px 34px rgba(77,48,24,.08);padding:26px;color:var(--ink)}
.catering-card:hover{transform:translateY(-2px);box-shadow:0 22px 46px rgba(77,48,24,.13)}
.catering-card h2{margin:6px 0 8px;color:var(--red);text-transform:uppercase;letter-spacing:-.04em;font-size:clamp(30px,4vw,50px);line-height:.95}
.catering-card p{margin:0;color:#3c322b;line-height:1.5}
.catering-phone{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;background:var(--red);color:white;font-weight:1000;text-transform:uppercase;padding:14px 18px;white-space:nowrap}
.footer-grid{grid-template-columns:1.35fr 1fr 1.35fr!important;align-items:start}
.footer-combo{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.footer-combo h4{margin-top:0}
@media(max-width:780px){.catering-card{grid-template-columns:1fr}.catering-phone{width:100%}.footer-grid{grid-template-columns:1fr!important}.footer-combo{grid-template-columns:1fr 1fr}}
@media(max-width:620px){.hero-image-card img{max-height:300px}.category-card img{height:82px;padding:4px}.detail-image img{height:130px!important;padding:4px}}
@media(max-width:480px){.footer-combo{grid-template-columns:1fr;gap:12px}}


/* V22 updates */
.hero-image-card,
.image-panel {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
}
.hero-image-card img,
.image-panel img {
  display: block;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  object-fit: contain !important;
  object-position: center !important;
  width: 100%;
  height: auto;
}
.spice-divider{
  background: transparent !important;
  width: 100% !important;
  height: auto !important;
  max-height: 58px !important;
  object-fit: contain !important;
  object-position: center !important;
}
.detail-actions {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  flex-wrap: wrap !important;
}
.detail-actions .inline-order-menu {
  display: inline-block !important;
  width: auto !important;
  margin: 0 !important;
}
.detail-actions .inline-order-menu .order-trigger,
.detail-actions .btn-outline {
  width: auto !important;
  min-height: 48px !important;
}
.sides-accordion {
  background: white;
  border: 1px solid var(--line);
  border-radius: 22px;
  box-shadow: 0 12px 34px rgba(77,48,24,.08);
  overflow: hidden;
}
.sides-accordion summary {
  list-style: none;
  cursor: pointer;
  padding: 20px 24px;
  background: #fff4df;
  color: var(--ink);
  font-size: 25px;
  font-weight: 1000;
  text-transform: uppercase;
}
.sides-accordion summary::-webkit-details-marker { display:none; }
.sides-accordion summary:after { content: "+"; float: right; color: var(--red); }
.sides-accordion[open] summary:after { content: "–"; }
.footer-grid { grid-template-columns: 1.35fr 1fr 1.35fr !important; align-items: start !important; }
.footer-combo { display: grid !important; grid-template-columns: 1fr 1fr !important; gap: 22px !important; }
@media (max-width: 780px) {
  .footer-grid { grid-template-columns: 1fr !important; }
  .footer-combo { grid-template-columns: 1fr 1fr !important; }
}
@media (max-width: 760px) {
  .hero { padding: 22px 0 12px !important; }
  .hero-grid { grid-template-columns: 1fr !important; gap: 10px !important; }
  .hero-image-card {
    order: -1;
    max-width: 360px;
    width: 100%;
    margin: 0 auto 4px !important;
  }
  .hero-image-card img {
    max-height: 200px !important;
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
  }
  .hero-copy { position: relative; z-index: 1; }
  .hero h1 { font-size: clamp(38px, 10vw, 58px) !important; margin-top: 4px !important; }
  .hero p { font-size: 16px !important; max-width: none !important; }
  .category-section { padding-top: 22px !important; }
}
@media (max-width: 620px) {
  .detail-actions {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 10px !important;
  }
  .detail-actions .inline-order-menu,
  .detail-actions .btn-outline,
  .detail-actions .inline-order-menu .order-trigger {
    width: 100% !important;
  }
  .detail-actions .inline-order-menu .order-dropdown {
    left: auto !important;
    right: 0 !important;
    width: min(292px, calc(100vw - 28px)) !important;
  }
  .hero-image-card { max-width: 300px; }
  .hero-image-card img { max-height: 170px !important; }
  .category-card img { height: 82px; padding: 4px; }
  .detail-image img { height: 130px !important; padding: 4px; }
  .sides-accordion summary { font-size: 19px; padding: 16px; }
}
@media (max-width: 480px) {
  .footer-combo { grid-template-columns: 1fr 1fr !important; gap: 16px !important; }
  .hero-image-card { max-width: 260px; }
  .hero-image-card img { max-height: 150px !important; }
  .hero-actions { gap: 10px !important; }
}

/* ==========================================================
   V28 PRODUCTION LOCK — WHITE / OFF-WHITE + COMPACT MENU GRID
   Purpose:
   - Prevent the previous beige V8 theme from taking over.
   - Keep the page closer to a clean Chipotle-style white/off-white build.
   - Reduce the 8 main menu category image area by roughly one-third.
   - This block is intentionally last so it wins the cascade.
   ========================================================== */

:root{
  --cream:#ffffff !important;
  --cream2:#fbfaf7 !important;
  --white:#ffffff !important;
  --line:#eeeeee !important;
  --muted:#5b514b !important;
  --shadow:0 12px 30px rgba(31,22,19,.08) !important;
}

html,
body{
  background:#ffffff !important;
}

body{
  color:var(--ink);
}

.site-header,
.detail-category-nav,
.mobile-panel,
.order-dropdown{
  background:rgba(255,255,255,.96) !important;
  border-color:#eeeeee !important;
}

.hero,
.category-section,
.flavor-section,
.promo-section,
.utility-section,
.connect-section,
.detail-hero,
.detail-content,
.static-view,
.footer-tunes{
  background:#ffffff !important;
}

.site-footer{
  background:#ffffff !important;
  border-top:1px solid #eeeeee !important;
}

.category-card,
.detail-image,
.static-card,
.menu-group-flat,
.sauce-accordion,
.support-form,
.promo-card,
.utility-card,
.catering-card{
  background:#ffffff !important;
  border-color:#eeeeee !important;
}

.catering-card{
  background:linear-gradient(135deg,#ffffff,#fbfaf7) !important;
}

.category-card img,
.detail-image img,
.image-panel img,
.promo-card img,
.support-form input,
.support-form textarea{
  background:#ffffff !important;
}

/* Main 8-category menu grid: compacted by about 1/3 from the previous desktop 168px image height. */
.category-grid{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:14px !important;
}

.category-card{
  border-radius:18px !important;
  box-shadow:0 10px 24px rgba(31,22,19,.07) !important;
}

.category-card:hover{
  box-shadow:0 16px 34px rgba(31,22,19,.10) !important;
}

.category-card img{
  width:100% !important;
  height:112px !important;
  aspect-ratio:auto !important;
  object-fit:contain !important;
  object-position:center !important;
  padding:4px !important;
}

.category-card b{
  font-size:16px !important;
  line-height:1.05 !important;
  padding:9px 6px 12px !important;
}

.category-card b:before{
  font-size:11px !important;
  margin-bottom:3px !important;
}

@media(max-width:980px){
  .category-grid{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:10px !important;
  }
  .category-card img{
    height:74px !important;
    padding:3px !important;
  }
  .category-card b{
    font-size:11px !important;
    padding:7px 4px 9px !important;
  }
  .category-card b:before{
    font-size:9px !important;
    margin-bottom:2px !important;
  }
}

@media(max-width:620px){
  .category-section{
    padding-top:18px !important;
  }
  .category-grid{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:7px !important;
  }
  .category-card{
    border-radius:14px !important;
  }
  .category-card img{
    height:55px !important;
    padding:2px !important;
  }
  .category-card b{
    font-size:9px !important;
    padding:5px 3px 7px !important;
    line-height:1.05 !important;
  }
  .category-card b:before{
    font-size:8px !important;
    margin-bottom:1px !important;
  }
}

@media(max-width:390px){
  .category-grid{
    gap:6px !important;
  }
  .category-card img{
    height:50px !important;
  }
  .category-card b{
    font-size:8px !important;
  }
}



/* ==========================================================
   V29 PRODUCTION FIXES — DETAIL NAV IMAGE BUTTONS + WHITE MENU HEADERS
   Purpose:
   - Turn the detail category buttons into full image buttons.
   - Keep the 8-button set reduced and compiled.
   - Remove beige from the Gumbo / Sides style headers.
   - Prevent single-item groups from leaving a dead empty right column.
   ========================================================== */

.detail-category-nav{
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:12px !important;
  overflow:visible !important;
  align-items:stretch !important;
}

.detail-category-nav .detail-nav-card{
  display:flex !important;
  flex-direction:column !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:0 !important;
  min-height:auto !important;
  padding:0 !important;
  border-radius:18px !important;
  overflow:hidden !important;
  background:#ffffff !important;
  border:1px solid #eeeeee !important;
  box-shadow:0 8px 22px rgba(31,22,19,.07) !important;
}

.detail-category-nav .detail-nav-card:hover{
  transform:translateY(-2px);
  box-shadow:0 14px 28px rgba(31,22,19,.10) !important;
}

.detail-category-nav .detail-nav-card img{
  display:block !important;
  width:100% !important;
  height:92px !important;
  object-fit:contain !important;
  object-position:center !important;
  background:#ffffff !important;
  padding:4px !important;
}

.detail-category-nav .detail-nav-card b{
  display:block !important;
  width:100% !important;
  padding:10px 6px 12px !important;
  font-size:15px !important;
  line-height:1.05 !important;
  text-transform:uppercase !important;
  text-align:center !important;
  color:var(--ink) !important;
  background:#ffffff !important;
}

.detail-category-nav .detail-nav-card.active{
  border-color:var(--red) !important;
  background:#ffffff !important;
}

.detail-category-nav .detail-nav-card.active b{
  background:var(--red) !important;
  color:#ffffff !important;
}

.menu-group-flat,
.sides-accordion,
.sauce-accordion{
  background:#ffffff !important;
  border-color:#eeeeee !important;
}

.menu-group-flat h2,
.sides-accordion summary{
  background:#fbfaf7 !important;
  color:var(--ink) !important;
  border-bottom:1px solid #eeeeee !important;
}

.menu-group-flat h2{
  padding:20px 24px !important;
}

.item-grid{
  grid-template-columns:repeat(auto-fit,minmax(320px,1fr)) !important;
}

.menu-item,
.menu-item:nth-child(odd){
  border-right:0 !important;
}

@media(max-width:980px){
  .detail-category-nav{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:10px !important;
  }
  .detail-category-nav .detail-nav-card img{
    height:72px !important;
  }
  .detail-category-nav .detail-nav-card b{
    font-size:11px !important;
    padding:7px 4px 9px !important;
  }
  .item-grid{
    grid-template-columns:1fr !important;
  }
}

@media(max-width:620px){
  .detail-category-nav{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:7px !important;
    padding:8px 14px !important;
  }
  .detail-category-nav .detail-nav-card{
    border-radius:14px !important;
  }
  .detail-category-nav .detail-nav-card img{
    height:54px !important;
    padding:2px !important;
  }
  .detail-category-nav .detail-nav-card b{
    font-size:9px !important;
    padding:5px 3px 7px !important;
  }
  .menu-group-flat h2,
  .sides-accordion summary,
  .sauce-accordion summary{
    font-size:19px !important;
    padding:16px !important;
  }
  .item-grid{
    grid-template-columns:1fr !important;
  }
}


/* ==========================================================
   V30 PRIMARY CATEGORY TILE REDESIGN — HOME PAGE
   Purpose:
   - Replace the original primary/home category tiles with the cleaner tile style
     the user approved.
   - Make the category images feel more zoomed-in and use the full tile width.
   - Preserve the compact compiled 8-tile layout.
   ========================================================== */

.category-grid{
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:14px !important;
  align-items:stretch !important;
}

.category-card{
  display:grid !important;
  grid-template-rows:minmax(104px,1fr) auto !important;
  align-items:stretch !important;
  background:#ffffff !important;
  border:1px solid #e9e9e9 !important;
  border-radius:20px !important;
  overflow:hidden !important;
  padding:0 !important;
  box-shadow:none !important;
}

.category-card:hover{
  transform:translateY(-2px) !important;
  box-shadow:0 12px 24px rgba(31,22,19,.08) !important;
}

.category-card img{
  display:block !important;
  width:100% !important;
  height:104px !important;
  object-fit:cover !important;
  object-position:center center !important;
  background:#ffffff !important;
  padding:0 !important;
  margin:0 !important;
  transform:scale(1.18) !important;
  transform-origin:center center !important;
}

.category-card b{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:40px !important;
  width:100% !important;
  padding:10px 8px 11px !important;
  font-size:13px !important;
  font-weight:1000 !important;
  line-height:1 !important;
  letter-spacing:-.01em !important;
  text-transform:uppercase !important;
  background:#ffffff !important;
  color:var(--ink) !important;
}

.category-card b:before{
  display:none !important;
  content:none !important;
}

.category-card:hover b,
.category-card:focus-visible b,
.category-card:active b{
  background:var(--red) !important;
  color:#ffffff !important;
}

@media(max-width:980px){
  .category-grid{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:10px !important;
  }
  .category-card{
    grid-template-rows:minmax(74px,1fr) auto !important;
    border-radius:17px !important;
  }
  .category-card img{
    height:74px !important;
    transform:scale(1.16) !important;
  }
  .category-card b{
    min-height:34px !important;
    font-size:10px !important;
    padding:7px 4px 8px !important;
  }
}

@media(max-width:620px){
  .category-grid{
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:7px !important;
  }
  .category-card{
    grid-template-rows:minmax(58px,1fr) auto !important;
    border-radius:14px !important;
  }
  .category-card img{
    height:58px !important;
    transform:scale(1.18) !important;
  }
  .category-card b{
    min-height:29px !important;
    font-size:8px !important;
    padding:5px 3px 6px !important;
  }
}


/* ==========================================================
   V31 SUBMENU WIDTH MATCH — DETAIL CATEGORY NAV
   Purpose:
   - Make the submenu/detail category tiles use the same width, grid, gap,
     image height, label height, and responsive behavior as the primary menu.
   - Keep the submenu inside the same max-width container as the main menu.
   ========================================================== */

.detail-category-nav{
  width:min(var(--max),calc(100% - 40px)) !important;
  max-width:var(--max) !important;
  margin:0 auto !important;
  padding:10px 0 !important;
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:14px !important;
  align-items:stretch !important;
  overflow:visible !important;
  background:#ffffff !important;
  border-bottom:0 !important;
}

.detail-category-nav .detail-nav-card{
  display:grid !important;
  grid-template-rows:minmax(104px,1fr) auto !important;
  align-items:stretch !important;
  min-height:auto !important;
  width:100% !important;
  background:#ffffff !important;
  border:1px solid #e9e9e9 !important;
  border-radius:20px !important;
  overflow:hidden !important;
  padding:0 !important;
  box-shadow:none !important;
  text-align:center !important;
  white-space:normal !important;
}

.detail-category-nav .detail-nav-card:hover{
  transform:translateY(-2px) !important;
  box-shadow:0 12px 24px rgba(31,22,19,.08) !important;
}

.detail-category-nav .detail-nav-card img{
  display:block !important;
  width:100% !important;
  height:104px !important;
  object-fit:cover !important;
  object-position:center center !important;
  background:#ffffff !important;
  padding:0 !important;
  margin:0 !important;
  transform:scale(1.18) !important;
  transform-origin:center center !important;
}

.detail-category-nav .detail-nav-card b{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:40px !important;
  width:100% !important;
  padding:10px 8px 11px !important;
  font-size:13px !important;
  font-weight:1000 !important;
  line-height:1 !important;
  letter-spacing:-.01em !important;
  text-transform:uppercase !important;
  text-align:center !important;
  background:#ffffff !important;
  color:var(--ink) !important;
}

.detail-category-nav .detail-nav-card.active{
  border-color:var(--red) !important;
  background:#ffffff !important;
}

.detail-category-nav .detail-nav-card.active b,
.detail-category-nav .detail-nav-card:hover b,
.detail-category-nav .detail-nav-card:focus-visible b,
.detail-category-nav .detail-nav-card:active b{
  background:var(--red) !important;
  color:#ffffff !important;
}

@media(max-width:980px){
  .detail-category-nav{
    width:min(var(--max),calc(100% - 28px)) !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:10px !important;
    padding:8px 0 !important;
  }
  .detail-category-nav .detail-nav-card{
    grid-template-rows:minmax(74px,1fr) auto !important;
    border-radius:17px !important;
  }
  .detail-category-nav .detail-nav-card img{
    height:74px !important;
    transform:scale(1.16) !important;
  }
  .detail-category-nav .detail-nav-card b{
    min-height:34px !important;
    font-size:10px !important;
    padding:7px 4px 8px !important;
  }
}

@media(max-width:620px){
  .detail-category-nav{
    width:calc(100% - 28px) !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:7px !important;
    padding:7px 0 !important;
  }
  .detail-category-nav .detail-nav-card{
    grid-template-rows:minmax(58px,1fr) auto !important;
    border-radius:14px !important;
  }
  .detail-category-nav .detail-nav-card img{
    height:58px !important;
    transform:scale(1.18) !important;
  }
  .detail-category-nav .detail-nav-card b{
    min-height:29px !important;
    font-size:8px !important;
    padding:5px 3px 6px !important;
  }
}


/* ==========================================================
   V32 SUBMENU MATCHES PRIMARY MENU — FINAL LOCK
   Purpose:
   - Make the detail/submenu category selector visually match the approved
     primary category tiles exactly.
   - Remove the bad layout behavior: left-aligned images, partial label bars,
     and width mismatch.
   ========================================================== */

.detail-category-nav{
  width:min(var(--max),calc(100% - 40px)) !important;
  max-width:var(--max) !important;
  margin:0 auto 22px !important;
  padding:0 !important;
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:14px !important;
  overflow:visible !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

.detail-category-nav .detail-nav-card{
  display:grid !important;
  place-items:stretch !important;
  justify-items:stretch !important;
  align-items:stretch !important;
  grid-template-rows:minmax(104px,1fr) auto !important;
  min-height:0 !important;
  width:100% !important;
  padding:0 !important;
  margin:0 !important;
  background:#ffffff !important;
  border:1px solid #e9e9e9 !important;
  border-radius:20px !important;
  overflow:hidden !important;
  box-shadow:none !important;
  text-align:center !important;
  white-space:normal !important;
}

.detail-category-nav .detail-nav-card:hover{
  transform:translateY(-2px) !important;
  box-shadow:0 12px 24px rgba(31,22,19,.08) !important;
}

.detail-category-nav .detail-nav-card img{
  display:block !important;
  width:100% !important;
  min-width:100% !important;
  max-width:none !important;
  height:104px !important;
  object-fit:cover !important;
  object-position:center center !important;
  background:#ffffff !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  transform:scale(1.18) !important;
  transform-origin:center center !important;
}

.detail-category-nav .detail-nav-card b{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  align-self:stretch !important;
  justify-self:stretch !important;
  width:100% !important;
  min-height:40px !important;
  margin:0 !important;
  padding:10px 8px 11px !important;
  background:#ffffff !important;
  color:var(--ink) !important;
  font-size:13px !important;
  font-weight:1000 !important;
  line-height:1 !important;
  letter-spacing:-.01em !important;
  text-transform:uppercase !important;
  text-align:center !important;
}

.detail-category-nav .detail-nav-card b:before{
  display:none !important;
  content:none !important;
}

.detail-category-nav .detail-nav-card.active{
  border-color:var(--red) !important;
}

.detail-category-nav .detail-nav-card.active b,
.detail-category-nav .detail-nav-card:hover b,
.detail-category-nav .detail-nav-card:focus-visible b,
.detail-category-nav .detail-nav-card:active b{
  background:var(--red) !important;
  color:#ffffff !important;
}

@media(max-width:980px){
  .detail-category-nav{
    width:min(var(--max),calc(100% - 28px)) !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:10px !important;
  }
  .detail-category-nav .detail-nav-card{
    grid-template-rows:minmax(74px,1fr) auto !important;
    border-radius:17px !important;
  }
  .detail-category-nav .detail-nav-card img{
    height:74px !important;
    transform:scale(1.16) !important;
  }
  .detail-category-nav .detail-nav-card b{
    min-height:34px !important;
    font-size:10px !important;
    padding:7px 4px 8px !important;
  }
}

@media(max-width:620px){
  .detail-category-nav{
    width:calc(100% - 28px) !important;
    grid-template-columns:repeat(4,minmax(0,1fr)) !important;
    gap:7px !important;
  }
  .detail-category-nav .detail-nav-card{
    grid-template-rows:minmax(58px,1fr) auto !important;
    border-radius:14px !important;
  }
  .detail-category-nav .detail-nav-card img{
    height:58px !important;
    transform:scale(1.18) !important;
  }
  .detail-category-nav .detail-nav-card b{
    min-height:29px !important;
    font-size:8px !important;
    padding:5px 3px 6px !important;
  }
}


/* ==========================================================
   V33 SUBMENU HARD RESET — MATCH PRIMARY TILE BEHAVIOR
   Purpose:
   - Hard reset the detail/submenu category buttons so they behave exactly like
     the primary category tiles.
   - Fix the remaining broken behavior where the image and red rollover bar only
     filled part of the tile width.
   ========================================================== */

.detail-category-nav{
  position:sticky !important;
  top:82px !important;
  z-index:40 !important;
  width:min(var(--max),calc(100% - 40px)) !important;
  max-width:var(--max) !important;
  margin:0 auto 22px !important;
  padding:0 !important;
  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:14px !important;
  overflow:visible !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  backdrop-filter:none !important;
}

.detail-category-nav > button.category-card.detail-nav-card,
.detail-category-nav > button.detail-nav-card{
  appearance:none !important;
  -webkit-appearance:none !important;
  display:flex !important;
  flex-direction:column !important;
  align-items:stretch !important;
  justify-content:flex-start !important;
  width:100% !important;
  min-width:0 !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
  border:1px solid #e9e9e9 !important;
  border-radius:20px !important;
  background:#ffffff !important;
  box-shadow:none !important;
  text-align:center !important;
  white-space:normal !important;
  cursor:pointer !important;
}

.detail-category-nav > button.category-card.detail-nav-card:hover,
.detail-category-nav > button.detail-nav-card:hover{
  transform:translateY(-2px) !important;
  box-shadow:0 12px 24px rgba(31,22,19,.08) !important;
}

.detail-category-nav > button.category-card.detail-nav-card > img,
.detail-category-nav > button.detail-nav-card > img{
  display:block !important;
  flex:0 0 104px !important;
  width:100% !important;
  min-width:100% !important;
  max-width:100% !important;
  height:104px !important;
  min-height:104px !important;
  max-height:104px !important;
  object-fit:cover !important;
  object-position:center center !important;
  background:#ffffff !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  transform:scale(1.18) !important;
  transform-origin:center center !important;
}

.detail-category-nav > button.category-card.detail-nav-card > b,
.detail-category-nav > button.detail-nav-card > b{
  display:flex !important;
  flex:0 0 40px !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  min-width:100% !important;
  max-width:100% !important;
  min-height:40px !important;
  max-height:none !important;
  margin:0 !important;
  padding:10px 8px 11px !important;
  border:0 !important;
  background:#ffffff !important;
  color:var(--ink) !important;
  font-size:13px !important;
  font-weight:1000 !important;
  line-height:1 !important;
  letter-spacing:-.01em !important;
  text-transform:uppercase !important;
  text-align:center !important;
  box-sizing:border-box !important;
}

.detail-category-nav > button.category-card.detail-nav-card > b:before,
.detail-category-nav > button.detail-nav-card > b:before{
  display:none !important;
  content:none !important;
}

.detail-category-nav > button.category-card.detail-nav-card.active,
.detail-category-nav > button.detail-nav-card.active{
  border-color:var(--red) !important;
}

.detail-category-nav > button.category-card.detail-nav-card.active > b,
.detail-category-nav > button.detail-nav-card.active > b,
.detail-category-nav > button.category-card.detail-nav-card:hover > b,
.detail-category-nav > button.detail-nav-card:hover > b,
.detail-category-nav > button.category-card.detail-nav-card:focus-visible > b,
.detail-category-nav > button.detail-nav-card:focus-visible > b,
.detail-category-nav > button.category-card.detail-nav-card:active > b,
.detail-category-nav > button.detail-nav-card:active > b{
  background:var(--red) !important;
  color:#ffffff !important;
}

@media(max-width:980px){
  .detail-category-nav{
    top:76px !important;
    width:min(var(--max),calc(100% - 28px)) !important;
    gap:10px !important;
  }
  .detail-category-nav > button.category-card.detail-nav-card,
  .detail-category-nav > button.detail-nav-card{
    border-radius:17px !important;
  }
  .detail-category-nav > button.category-card.detail-nav-card > img,
  .detail-category-nav > button.detail-nav-card > img{
    flex-basis:74px !important;
    height:74px !important;
    min-height:74px !important;
    max-height:74px !important;
    transform:scale(1.16) !important;
  }
  .detail-category-nav > button.category-card.detail-nav-card > b,
  .detail-category-nav > button.detail-nav-card > b{
    flex-basis:34px !important;
    min-height:34px !important;
    font-size:10px !important;
    padding:7px 4px 8px !important;
  }
}

@media(max-width:620px){
  .detail-category-nav{
    top:70px !important;
    width:calc(100% - 28px) !important;
    gap:7px !important;
  }
  .detail-category-nav > button.category-card.detail-nav-card,
  .detail-category-nav > button.detail-nav-card{
    border-radius:14px !important;
  }
  .detail-category-nav > button.category-card.detail-nav-card > img,
  .detail-category-nav > button.detail-nav-card > img{
    flex-basis:58px !important;
    height:58px !important;
    min-height:58px !important;
    max-height:58px !important;
    transform:scale(1.18) !important;
  }
  .detail-category-nav > button.category-card.detail-nav-card > b,
  .detail-category-nav > button.detail-nav-card > b{
    flex-basis:29px !important;
    min-height:29px !important;
    font-size:8px !important;
    padding:5px 3px 6px !important;
  }
}


/* ==========================================================
   V34 BACKGROUND WHITE LOCK — REMOVE DETAIL-VIEW BEIGE ARTIFACT
   Purpose:
   - Eliminate the cream/beige background artifact visible after selecting a submenu item.
   - Force the selected/detail state to use the same solid white background throughout.
   ========================================================== */

html,
body{
  background:#ffffff !important;
}

.detail-view,
#detailView,
.detail-hero,
.detail-content,
.detail-category-nav,
#detailCategoryNav,
.detail-groups,
#detailGroups{
  background:#ffffff !important;
}

.detail-view{
  background-image:none !important;
}

.detail-hero{
  background-image:none !important;
  border-bottom:1px solid #eeeeee !important;
}

.detail-content{
  background-image:none !important;
}

.detail-category-nav{
  background:#ffffff !important;
  background-image:none !important;
}

.menu-group-flat,
.sides-accordion,
.sauce-accordion,
.menu-item,
.item-grid{
  background:#ffffff !important;
}


/* ==========================================================
   V35 GLOBAL WHITE LOCK — FINAL BACKGROUND UNIFICATION
   Purpose:
   - Lock all visible site states to a consistent white background.
   - Eliminate any remaining cream/beige drift from older theme layers.
   - Apply the white background to home, detail, static, footer, and shared containers.
   ========================================================== */

:root{
  --cream:#ffffff !important;
  --cream2:#ffffff !important;
  --white:#ffffff !important;
}

html,
body,
#homeView,
#detailView,
#staticView,
.home-view,
.detail-view,
.static-view,
.site-header,
.mobile-panel,
.hero,
.category-section,
.flavor-section,
.promo-section,
.utility-section,
.connect-section,
.catering-callout,
.detail-hero,
.detail-content,
.static-page,
.site-footer,
.footer-tunes,
.legal,
.container,
.section-heading,
.detail-groups,
.detail-category-nav,
#detailCategoryNav,
.order-dropdown,
.order-dropdown a,
.hero-image-card,
.image-panel,
.promo-card,
.utility-grid,
.utility-card,
.static-card,
.support-card,
.support-form,
.catering-card,
.menu-group-flat,
.sides-accordion,
.sauce-accordion,
.menu-item,
.item-grid{
  background:#ffffff !important;
  background-image:none !important;
}

body,
.home-view,
.detail-view,
.static-view{
  background-color:#ffffff !important;
}

.site-header,
.mobile-panel,
.detail-category-nav,
.site-footer{
  border-color:#eeeeee !important;
}

.detail-hero,
.hero,
.static-page,
.detail-content,
.category-section,
.flavor-section,
.promo-section,
.utility-section,
.connect-section,
.catering-callout{
  background-color:#ffffff !important;
}

/* Keep the footer legal strip aligned with the all-white requirement. */
.legal{
  color:#5a473d !important;
  border-top:1px solid #eeeeee !important;
}


/* ==========================================================
   V36 SEO CONTENT + GLOBAL WHITE LOCK
   Purpose:
   - Add visible local SEO and FAQ sections without changing the approved tile system.
   - Keep every SEO section on the same solid white background.
   ========================================================== */

.seo-local-section,
.faq-section{
  background:#ffffff !important;
  background-image:none !important;
  padding:26px 0 !important;
}
.seo-local-card,
.faq-card{
  background:#ffffff !important;
  border:1px solid #eeeeee !important;
  border-radius:22px !important;
  padding:28px !important;
  box-shadow:0 10px 24px rgba(31,22,19,.05) !important;
}
.seo-local-card h2,
.faq-card h2{
  margin:7px 0 12px !important;
  font-size:clamp(28px,3.5vw,46px) !important;
  line-height:.95 !important;
  text-transform:uppercase !important;
  letter-spacing:-.04em !important;
}
.seo-local-card p,
.faq-card p{
  color:#3b2923 !important;
  line-height:1.55 !important;
  max-width:900px !important;
}
.seo-menu-links{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:10px !important;
  margin-top:18px !important;
}
.seo-menu-links a{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  border:1px solid #e9e9e9 !important;
  border-radius:999px !important;
  padding:10px 14px !important;
  font-weight:1000 !important;
  text-transform:uppercase !important;
  font-size:12px !important;
  background:#ffffff !important;
}
.seo-menu-links a:hover{
  background:var(--red) !important;
  color:#ffffff !important;
  border-color:var(--red) !important;
}
.faq-card details{
  border-top:1px solid #eeeeee !important;
  padding:14px 0 !important;
}
.faq-card details:first-of-type{
  border-top:0 !important;
}
.faq-card summary{
  cursor:pointer !important;
  font-weight:1000 !important;
  text-transform:uppercase !important;
  color:var(--ink) !important;
}
.faq-card details p{
  margin:10px 0 0 !important;
}
.seo-static-page{
  background:#ffffff !important;
  padding:34px 0 60px !important;
}
.seo-static-card{
  background:#ffffff !important;
  border:1px solid #eeeeee !important;
  border-radius:22px !important;
  padding:28px !important;
  box-shadow:0 10px 24px rgba(31,22,19,.05) !important;
}
.seo-static-card h1{
  margin:8px 0 12px !important;
  font-size:clamp(34px,4vw,58px) !important;
  line-height:.92 !important;
  color:var(--red) !important;
  text-transform:uppercase !important;
  letter-spacing:-.05em !important;
}
.seo-static-card h2{
  margin:28px 0 0 !important;
  padding:18px 0 10px !important;
  border-top:1px solid #eeeeee !important;
  text-transform:uppercase !important;
}
.seo-static-card article{
  border-top:1px solid #eeeeee !important;
  padding:16px 0 !important;
}
.seo-static-card article h3{
  margin:0 0 6px !important;
  text-transform:uppercase !important;
}
.seo-static-card article p{
  margin:0 !important;
  line-height:1.5 !important;
  color:#3b2923 !important;
}
@media(max-width:620px){
  .seo-local-card,
  .faq-card,
  .seo-static-card{
    padding:20px !important;
    border-radius:18px !important;
  }
}


/* ==========================================================
   V37 VISUAL FINAL — BLACK ACCORDIONS + HERO MOBILE LOCK
   Purpose:
   - Make every menu/detail drop-down bar black with red plus/minus controls.
   - Make the hero kicker stronger, larger, and black instead of beige/gold.
   - Improve mobile portrait hero: headline sits above/over the hero image and
     the hero food image is roughly 50% larger than the prior mobile build.
   ========================================================== */

/* Stronger top hero kicker: replace beige/gold with a high-contrast black badge. */
.hero .kicker,
.hero-copy > .kicker{
  color:#1f1613 !important;
  font-size:clamp(16px,1.6vw,22px) !important;
  font-weight:1000 !important;
  letter-spacing:.08em !important;
  line-height:1.05 !important;
  text-shadow:none !important;
}

/* Menu/detail accordions: black bar with red plus/minus, consistent on Sides and House Sauces. */
.sides-accordion,
.sauce-accordion{
  border:1px solid #eeeeee !important;
  border-radius:22px !important;
  overflow:hidden !important;
  background:#ffffff !important;
  box-shadow:0 10px 24px rgba(31,22,19,.05) !important;
}

.sides-accordion summary,
.sauce-accordion summary,
.menu-group summary{
  list-style:none !important;
  cursor:pointer !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:18px !important;
  width:100% !important;
  margin:0 !important;
  padding:22px 24px !important;
  background:#1f1613 !important;
  background-image:none !important;
  color:#ffffff !important;
  border:0 !important;
  font-size:25px !important;
  font-weight:1000 !important;
  line-height:1 !important;
  text-transform:uppercase !important;
  letter-spacing:-.02em !important;
}

.sides-accordion summary::-webkit-details-marker,
.sauce-accordion summary::-webkit-details-marker,
.menu-group summary::-webkit-details-marker{
  display:none !important;
}

.sides-accordion summary:after,
.sauce-accordion summary:after,
.menu-group summary:after{
  content:"+" !important;
  float:none !important;
  color:var(--red) !important;
  font-size:28px !important;
  font-weight:1000 !important;
  line-height:1 !important;
  margin-left:auto !important;
}

.sides-accordion[open] summary:after,
.sauce-accordion[open] summary:after,
.menu-group[open] summary:after{
  content:"–" !important;
  color:var(--red) !important;
}

/* Optional site FAQ details also use the black/red drop-down language for consistency. */
.faq-card details{
  border:1px solid #eeeeee !important;
  border-radius:16px !important;
  overflow:hidden !important;
  margin:12px 0 !important;
  padding:0 !important;
  background:#ffffff !important;
}
.faq-card summary{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:14px !important;
  padding:16px 18px !important;
  background:#1f1613 !important;
  color:#ffffff !important;
  cursor:pointer !important;
  font-weight:1000 !important;
  text-transform:uppercase !important;
}
.faq-card summary:after{
  content:"+" !important;
  color:var(--red) !important;
  font-size:22px !important;
  font-weight:1000 !important;
  margin-left:auto !important;
}
.faq-card details[open] summary:after{
  content:"–" !important;
}
.faq-card details p{
  padding:0 18px 18px !important;
}

@media(max-width:620px){
  /* Mobile portrait hero: title/kicker ride on top of the larger food image. */
  .hero{
    padding:12px 0 18px !important;
  }
  .hero-grid{
    position:relative !important;
    display:block !important;
  }
  .hero-image-card{
    position:relative !important;
    width:100% !important;
    max-width:none !important;
    min-height:245px !important;
    height:245px !important;
    max-height:none !important;
    margin:0 auto !important;
    padding:0 !important;
    border-radius:20px !important;
    overflow:hidden !important;
    background:#ffffff !important;
  }
  .hero-image-card img{
    width:100% !important;
    height:245px !important;
    max-height:none !important;
    object-fit:cover !important;
    object-position:center center !important;
    padding:0 !important;
    margin:0 !important;
    transform:scale(1.08) !important;
    transform-origin:center center !important;
  }
  .hero-copy{
    position:absolute !important;
    z-index:3 !important;
    top:12px !important;
    left:12px !important;
    right:12px !important;
    display:block !important;
    max-width:calc(100% - 24px) !important;
    padding:10px 12px 12px !important;
    border-radius:16px !important;
    background:rgba(255,255,255,.90) !important;
    box-shadow:0 10px 22px rgba(31,22,19,.08) !important;
  }
  .hero-copy > .kicker{
    color:#1f1613 !important;
    font-size:13px !important;
    letter-spacing:.08em !important;
    margin:0 0 4px !important;
  }
  .hero h1{
    color:#1f1613 !important;
    font-size:clamp(31px,9.5vw,45px) !important;
    line-height:.9 !important;
    margin:0 !important;
    letter-spacing:-.045em !important;
  }
  .hero h1 span{
    color:var(--red) !important;
    display:inline !important;
  }
  .hero p{
    display:none !important;
  }
  .hero-actions{
    margin-top:8px !important;
    display:flex !important;
    justify-content:flex-start !important;
    gap:8px !important;
  }
  .hero-actions .btn-red{
    padding:9px 12px !important;
    font-size:11px !important;
  }
  .hero-actions .btn-outline{
    display:none !important;
  }
  .sides-accordion summary,
  .sauce-accordion summary,
  .menu-group summary{
    font-size:19px !important;
    padding:18px !important;
  }
}

@media(max-width:390px){
  .hero-image-card,
  .hero-image-card img{
    height:225px !important;
    min-height:225px !important;
  }
  .hero h1{
    font-size:clamp(28px,9vw,38px) !important;
  }
}

/* ==========================================================
   V38 LAYOUT CLEANUP — FAQ COMPACT + MOBILE PROMO LOCK
   Purpose:
   - Move FAQ to a compact single parent accordion near the bottom.
   - Support nested FAQ sub-accordions with a clean black/red dropdown style.
   - Keep Rewards/Goods cards side-by-side on mobile instead of stacking.
   - Keep Fire Up The Flavor directly below menu categories.
   - Remove visual weight from the old local SEO block by removing it from markup.
   ========================================================== */

/* Keep Fire Up The Flavor tight under menu categories. */
.category-section{
  padding-bottom:22px !important;
}
.flavor-section{
  padding-top:10px !important;
  padding-bottom:32px !important;
}

/* Compact FAQ parent accordion near bottom. */
.compact-faq-section{
  padding:20px 0 30px !important;
  background:#ffffff !important;
}
.compact-faq-card{
  padding:0 !important;
  border:0 !important;
  box-shadow:none !important;
  background:#ffffff !important;
}
.faq-parent{
  border:1px solid #eeeeee !important;
  border-radius:22px !important;
  overflow:hidden !important;
  background:#ffffff !important;
  box-shadow:0 10px 24px rgba(31,22,19,.05) !important;
}
.faq-parent > summary{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:18px !important;
  width:100% !important;
  padding:22px 24px !important;
  margin:0 !important;
  background:#1f1613 !important;
  color:#ffffff !important;
  cursor:pointer !important;
  font-size:clamp(22px,3vw,34px) !important;
  font-weight:1000 !important;
  line-height:1 !important;
  text-transform:uppercase !important;
  letter-spacing:-.03em !important;
}
.faq-parent > summary::-webkit-details-marker,
.faq-sub > summary::-webkit-details-marker{
  display:none !important;
}
.faq-parent > summary:after{
  content:"+" !important;
  color:var(--red) !important;
  font-size:34px !important;
  font-weight:1000 !important;
  margin-left:auto !important;
}
.faq-parent[open] > summary:after{
  content:"–" !important;
}
.faq-inner{
  padding:14px !important;
  display:grid !important;
  gap:10px !important;
  background:#ffffff !important;
}
.faq-sub{
  border:1px solid #eeeeee !important;
  border-radius:16px !important;
  overflow:hidden !important;
  background:#ffffff !important;
  margin:0 !important;
}
.faq-sub > summary{
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:14px !important;
  padding:16px 18px !important;
  background:#1f1613 !important;
  color:#ffffff !important;
  cursor:pointer !important;
  font-weight:1000 !important;
  text-transform:uppercase !important;
  letter-spacing:-.01em !important;
}
.faq-sub > summary:after{
  content:"+" !important;
  color:var(--red) !important;
  font-size:24px !important;
  font-weight:1000 !important;
  margin-left:auto !important;
}
.faq-sub[open] > summary:after{
  content:"–" !important;
}
.faq-answer{
  padding:16px 18px 18px !important;
  background:#ffffff !important;
}
.faq-answer p{
  margin:0 0 12px !important;
  color:#3b2923 !important;
  line-height:1.55 !important;
  max-width:950px !important;
}
.faq-answer p:last-child{
  margin-bottom:0 !important;
}
.faq-answer a{
  color:var(--red) !important;
  font-weight:1000 !important;
}
.faq-menu-links{
  display:flex !important;
  flex-wrap:wrap !important;
  gap:8px !important;
  margin-top:14px !important;
}
.faq-menu-links a{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  border:1px solid #e9e9e9 !important;
  border-radius:999px !important;
  padding:8px 12px !important;
  background:#ffffff !important;
  color:#1f1613 !important;
  font-size:11px !important;
  font-weight:1000 !important;
  text-transform:uppercase !important;
}
.faq-menu-links a:hover{
  background:var(--red) !important;
  color:#ffffff !important;
  border-color:var(--red) !important;
}

/* Promo card behavior: keep image beside text on tablet/mobile. */
.promo-card{
  grid-template-columns:minmax(0,.82fr) minmax(140px,1fr) !important;
}
.promo-card img{
  width:100% !important;
  height:auto !important;
  max-height:190px !important;
  object-fit:contain !important;
  object-position:center center !important;
  background:#ffffff !important;
}

@media(max-width:980px){
  .promo-grid{
    grid-template-columns:1fr !important;
    gap:14px !important;
  }
  .promo-card{
    grid-template-columns:minmax(0,.9fr) minmax(130px,.8fr) !important;
    min-height:0 !important;
    padding:18px !important;
    gap:12px !important;
  }
  .promo-card img{
    max-height:170px !important;
  }
}

@media(max-width:620px){
  .flavor-section{
    padding-top:4px !important;
    padding-bottom:24px !important;
  }
  .flavor-grid{
    gap:14px !important;
  }
  .compact-faq-section{
    padding:14px 0 24px !important;
  }
  .faq-parent{
    border-radius:18px !important;
  }
  .faq-parent > summary{
    padding:18px 18px !important;
    font-size:22px !important;
  }
  .faq-inner{
    padding:10px !important;
  }
  .faq-sub{
    border-radius:14px !important;
  }
  .faq-sub > summary{
    padding:14px 14px !important;
    font-size:13px !important;
  }
  .faq-answer{
    padding:13px 14px 15px !important;
  }

  .promo-section{
    padding:18px 0 28px !important;
  }
  .promo-grid{
    gap:12px !important;
  }
  .promo-card{
    display:grid !important;
    grid-template-columns:minmax(0,.86fr) minmax(112px,.78fr) !important;
    align-items:center !important;
    gap:10px !important;
    padding:16px !important;
    border-radius:20px !important;
  }
  .promo-card h3{
    font-size:clamp(22px,7.2vw,31px) !important;
    line-height:.95 !important;
    margin:0 0 8px !important;
  }
  .promo-card p{
    font-size:13px !important;
    line-height:1.35 !important;
    margin:0 0 10px !important;
  }
  .promo-card .btn,
  .promo-card .btn-small{
    padding:9px 11px !important;
    font-size:11px !important;
  }
  .promo-card img{
    width:100% !important;
    max-height:138px !important;
    object-fit:contain !important;
    object-position:center center !important;
    align-self:center !important;
  }
}

@media(max-width:390px){
  .promo-card{
    grid-template-columns:minmax(0,.92fr) minmax(96px,.62fr) !important;
    gap:8px !important;
    padding:14px !important;
  }
  .promo-card h3{
    font-size:22px !important;
  }
  .promo-card p{
    font-size:12px !important;
  }
  .promo-card img{
    max-height:118px !important;
  }
}


/* ==========================================================
   V39 FINAL MOBILE HERO + DETAIL ACTION FIXES
   Purpose:
   - Restore the mobile detail-page Order Now button next to All Categories.
   - Update the hero headline copy to All New / Flamin' Hot / Boudin Balls.
   - Reduce the mobile hero text overlay coverage and keep the three-line stack.
   ========================================================== */

.hero h1 .hero-line{
  display:block;
}
.hero h1 .line-one,
.hero h1 .line-three{
  color:#1f1613 !important;
}
.hero h1 .line-two{
  color:var(--red) !important;
}

@media(max-width:620px){
  .detail-actions{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:10px !important;
    align-items:stretch !important;
  }
  .detail-actions .btn-outline,
  .detail-actions .inline-order-menu,
  .detail-actions .inline-order-menu .order-trigger{
    display:inline-flex !important;
    width:100% !important;
    min-height:48px !important;
  }
  .detail-actions .inline-order-menu{
    margin:0 !important;
  }
  .detail-actions .inline-order-menu .order-dropdown{
    left:auto !important;
    right:0 !important;
    width:min(292px, calc(100vw - 28px)) !important;
  }

  .hero-copy{
    top:12px !important;
    left:12px !important;
    right:auto !important;
    width:auto !important;
    max-width:min(70%, 250px) !important;
    padding:7px 9px 8px !important;
    background:rgba(255,255,255,.78) !important;
    border-radius:14px !important;
  }
  .hero-copy > .kicker{
    margin:0 0 3px !important;
    font-size:12px !important;
    line-height:1 !important;
  }
  .hero h1{
    font-size:clamp(29px,9.2vw,41px) !important;
    line-height:.92 !important;
    margin:0 !important;
    letter-spacing:-.04em !important;
  }
  .hero h1 .hero-line{
    display:block !important;
  }
  .hero h1 .line-one,
  .hero h1 .line-three{
    color:#1f1613 !important;
  }
  .hero h1 .line-two{
    color:var(--red) !important;
  }
}


/* ==========================================================
   V40 HERO TEXT COPY ADJUSTMENT
   Purpose:
   - Put Cheeto back into the hero headline.
   - Force the hero headline to read on four lines:
     All New / Flamin' Hot / Cheeto / Boudin Balls.
   - Style Cheeto in a dark orange tone.
   ========================================================== */

.hero h1 .line-cheeto{
  display:block;
  color:#c96d12 !important;
}

@media(max-width:620px){
  .hero h1 .line-cheeto{
    display:block !important;
    color:#c96d12 !important;
  }
}


/* ==========================================================
   V41 MOBILE FOOTER + HERO REFINEMENT
   Purpose:
   - Keep Visit / Order / Explore next to each other in phone view.
   - Abbreviate the visible address to 28115 SW Fwy.
   - Refine the mobile hero text box so it stays over the image cleanly.
   - Make the kicker red and force the four-line mobile stack.
   ========================================================== */

@media(max-width:620px){
  .footer-grid{
    display:grid !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
    gap:14px !important;
    align-items:start !important;
  }
  .footer-grid > :first-child{
    grid-column:1 / -1 !important;
  }
  .footer-combo{
    display:contents !important;
  }
  .footer-grid h4{
    font-size:15px !important;
    margin:0 0 6px !important;
  }
  .footer-grid p,
  .footer-grid a,
  .footer-grid b{
    font-size:12px !important;
    line-height:1.35 !important;
  }

  .hero-copy{
    top:10px !important;
    left:10px !important;
    right:auto !important;
    width:fit-content !important;
    max-width:min(58%, 225px) !important;
    padding:6px 8px 7px !important;
    background:rgba(255,255,255,.70) !important;
    border-radius:12px !important;
    box-shadow:0 8px 18px rgba(31,22,19,.07) !important;
  }
  .hero-copy > .kicker{
    color:var(--red) !important;
    font-size:12px !important;
    line-height:1 !important;
    margin:0 0 4px !important;
    letter-spacing:.06em !important;
  }
  .hero h1{
    font-size:clamp(25px,8.4vw,34px) !important;
    line-height:.9 !important;
    margin:0 !important;
    letter-spacing:-.04em !important;
  }
  .hero h1 .hero-line,
  .hero h1 .line-one,
  .hero h1 .line-two,
  .hero h1 .line-cheeto,
  .hero h1 .line-three{
    display:block !important;
    white-space:nowrap !important;
  }
  .hero h1 .line-one,
  .hero h1 .line-three{
    color:#1f1613 !important;
  }
  .hero h1 .line-two{
    color:var(--red) !important;
  }
  .hero h1 .line-cheeto{
    color:#c96d12 !important;
  }
}


/* ==========================================================
   V42 MOBILE HERO OVERLAY FIT + BRIGHTER CHEETO
   Purpose:
   - Expand the mobile hero text panel slightly so all wording fits cleanly.
   - Brighten the Cheeto line color.
   ========================================================== */

@media(max-width:620px){
  .hero-copy{
    max-width:min(66%, 255px) !important;
    padding:8px 11px 9px !important;
    background:rgba(255,255,255,.76) !important;
  }
  .hero h1{
    font-size:clamp(24px,8.1vw,33px) !important;
    line-height:.9 !important;
  }
  .hero h1 .line-cheeto{
    color:#f39a17 !important;
  }
}


/* ==========================================================
   V44 TBC GOODS IMAGE + FAVICON UPDATE
   Purpose:
   - Use the uploaded lifestyle image in the TBC Goods promo card.
   - Keep the image clean and well-framed on desktop and mobile.
   ========================================================== */

#goods.promo-card img{
  object-fit:cover !important;
  object-position:center top !important;
  max-height:230px !important;
  background:#ffffff !important;
}

#goods .promo-copy p{
  max-width:28ch;
}

@media(max-width:620px){
  #goods.promo-card img{
    max-height:180px !important;
    object-position:center top !important;
  }
}


/* ==========================================================
   V45 TBC GOODS LANDING PAGE IMAGE LAYOUT
   Purpose:
   - Keep the homepage TBC Goods card as originally designed.
   - Place the uploaded family image on the TBC Goods landing/static page.
   - Crop and frame the image cleanly for desktop and mobile.
   ========================================================== */

.static-feature{
  display:grid;
  grid-template-columns:minmax(0,.95fr) minmax(320px,1.05fr);
  gap:30px;
  align-items:center;
}

.static-feature .static-copy p{
  max-width:38ch;
}

.static-feature .static-media{
  width:100%;
}

.static-feature .static-media img{
  width:100%;
  height:420px;
  object-fit:cover;
  object-position:center top;
  border-radius:22px;
  border:1px solid var(--line);
  box-shadow:0 14px 34px rgba(77,48,24,.10);
  background:#ffffff;
}

@media(max-width:980px){
  .static-feature{
    grid-template-columns:1fr;
    gap:22px;
  }
  .static-feature .static-media img{
    height:360px;
  }
}

@media(max-width:620px){
  .static-feature .static-media img{
    height:300px;
    object-position:center top;
  }
}


/* ==========================================================
   V47 FIND US SUBPAGE MAP EXPERIENCE
   ========================================================== */
.location-note{
  margin:16px 0 8px;
  padding:16px 18px;
  border:1px solid var(--line);
  border-radius:18px;
  background:#fffaf8;
}
.location-note p{margin:0 0 8px;}
.location-note p:last-child{margin-bottom:0;}
.map-preview{
  position:relative;
  display:block;
  width:100%;
  padding:0;
  border:0;
  background:transparent;
  cursor:zoom-in;
}
.map-preview img{
  width:100%;
  height:420px;
  object-fit:cover;
  object-position:center;
  border-radius:22px;
  border:1px solid var(--line);
  box-shadow:0 14px 34px rgba(77,48,24,.10);
  background:#ffffff;
}
.map-preview-badge{
  position:absolute;
  right:14px;
  bottom:14px;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.92);
  color:var(--ink);
  font-weight:800;
  font-size:13px;
  box-shadow:0 4px 14px rgba(0,0,0,.08);
}
.map-modal[hidden]{display:none !important;}
.map-modal{
  position:fixed;
  inset:0;
  z-index:200;
}
.map-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(25,18,14,.70);
}
.map-modal-dialog{
  position:relative;
  width:min(1100px, calc(100vw - 26px));
  max-height:calc(100vh - 26px);
  margin:13px auto;
  padding:18px;
  border-radius:24px;
  background:#ffffff;
  box-shadow:0 20px 60px rgba(0,0,0,.25);
  overflow:auto;
}
.map-close{
  position:absolute;
  top:10px;
  right:12px;
  width:40px;
  height:40px;
  border:0;
  border-radius:50%;
  background:#f3f1ef;
  color:var(--ink);
  font-size:28px;
  line-height:1;
  cursor:pointer;
}
.map-modal-toolbar{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:4px 42px 14px 0;
}
.map-zoom-wrap{
  overflow:auto;
  border-radius:20px;
  border:1px solid var(--line);
  background:#ffffff;
  cursor:zoom-in;
}
.map-zoom-wrap img{
  display:block;
  width:100%;
  height:auto;
  transition:transform .25s ease;
  transform-origin:center center;
}
.map-zoom-wrap.zoomed{cursor:zoom-out;}
.map-zoom-wrap.zoomed img{
  transform:scale(1.8);
}
.map-modal-help{
  margin:12px 0 2px;
  color:var(--muted);
  font-size:14px;
}
body.modal-open{overflow:hidden;}
@media(max-width:980px){
  .map-preview img{height:360px;}
}
@media(max-width:620px){
  .map-preview img{height:260px;}
  .map-modal-dialog{width:calc(100vw - 16px); margin:8px auto; padding:12px; border-radius:18px;}
  .map-close{top:8px; right:8px; width:36px; height:36px;}
  .map-modal-toolbar{margin-right:40px;}
  .map-zoom-wrap.zoomed img{transform:scale(2.1);}
  .location-note{padding:14px; border-radius:16px;}
}


/* ==========================================================
   V49 SOCIAL ICON UPDATE
   Purpose:
   - Use the uploaded Facebook and Instagram icons.
   - Remove TikTok and YouTube icons for now.
   ========================================================== */
.top-socials,
.socials{
  display:flex;
  align-items:center;
  gap:12px;
}
.top-socials a,
.socials a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:42px;
  height:42px;
  border-radius:50%;
  background:transparent !important;
  box-shadow:none !important;
  overflow:hidden;
  padding:0;
}
.socials a{
  width:58px;
  height:58px;
}
.top-socials a img,
.socials a img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:50%;
}
@media(max-width:620px){
  .top-socials{display:none;}
  .socials a{width:52px;height:52px;}
}


/* ==========================================================
   V50 SOCIAL ICON SWAP + SIZE ADJUSTMENT
   Purpose:
   - Swap in the latest uploaded Facebook and Instagram icons.
   - Reduce the visible icon size to 30px across the page.
   ========================================================== */
.top-socials,
.socials{
  display:flex;
  align-items:center;
  gap:10px;
}

.top-socials a,
.socials a{
  width:30px !important;
  height:30px !important;
  min-width:30px !important;
  min-height:30px !important;
  padding:0 !important;
  border-radius:50% !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  background:transparent !important;
  box-shadow:none !important;
  overflow:hidden !important;
}

.top-socials a img,
.socials a img{
  width:30px !important;
  height:30px !important;
  display:block !important;
  object-fit:cover !important;
  border-radius:50% !important;
}

@media(max-width:620px){
  .top-socials{display:none;}
  .socials a,
  .socials a img{
    width:30px !important;
    height:30px !important;
  }
}


/* ==========================================================
   V51 OUR VALUES PAGE
   Purpose:
   - Add a dedicated Our Values page linked from the header/mobile/footer.
   - Add a secondary Read Our Values button from the Fire Up The Flavor section.
   ========================================================== */
.values-read-more{
  margin-top:12px;
}
.static-rich-copy,
.values-story{
  max-width:920px;
}
.values-story p,
.static-rich-copy p{
  font-size:18px;
  line-height:1.68;
  color:#3b2923;
  margin:0 0 18px;
}
.values-story p:first-child{
  font-size:20px;
  color:#1f1613;
  font-weight:650;
}
@media(max-width:620px){
  .values-story p,
  .static-rich-copy p{
    font-size:16px;
    line-height:1.6;
  }
  .values-story p:first-child{
    font-size:17px;
  }
}


/* ==========================================================
   V52 OUR VALUES PORTRAIT LAYOUT
   Purpose:
   - Embed Larry Wilson portrait into the Our Values story.
   - Float the image into the article for a polished editorial flow.
   ========================================================== */
.values-story::after{
  content:"";
  display:block;
  clear:both;
}
.values-inline-portrait{
  margin:6px 0 18px;
}
.values-float-right{
  float:right;
  width:min(38%, 360px);
  margin:4px 0 18px 28px;
}
.values-inline-portrait img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:3 / 4;
  object-fit:cover;
  object-position:center top;
  border-radius:24px;
  box-shadow:0 18px 38px rgba(31,22,19,.16);
  border:1px solid rgba(31,22,19,.08);
  background:#fff;
}
.values-inline-portrait figcaption{
  margin-top:10px;
  color:#6c5750;
  font-size:14px;
  line-height:1.45;
  font-weight:600;
}
.our-values-page .seo-static-card,
.seo-static-card .values-story{
  max-width:980px;
}
@media(max-width:860px){
  .values-float-right{
    width:min(42%, 320px);
    margin-left:22px;
  }
}
@media(max-width:620px){
  .values-float-right{
    float:none;
    width:100%;
    max-width:360px;
    margin:10px auto 20px;
  }
  .values-inline-portrait figcaption{
    text-align:center;
    font-size:13px;
  }
}

/* V54 menu dock + support cleanup */
:root{
  --menu-tabs-top:92px;
}
.category-grid,
.section-heading{
  transition:transform .3s ease,opacity .3s ease,filter .3s ease;
}
.menu-tabs-sentinel{
  height:1px;
}
.menu-tabs-sticky{
  position:sticky;
  top:calc(var(--menu-tabs-top) - 1px);
  z-index:46;
  height:0;
  margin:0;
  pointer-events:none;
}
.menu-tabs-sticky::before{
  content:"";
  position:absolute;
  left:50%;
  top:0;
  transform:translateX(-50%);
  width:100vw;
  height:56px;
  background:#fff;
  border-bottom:1px solid rgba(31,22,19,.08);
  opacity:0;
  transition:opacity .22s ease;
  pointer-events:none;
  z-index:0;
}
.menu-tabs-track{
  display:none;
  align-items:center;
  justify-content:center;
  gap:10px;
  width:max-content;
  min-width:100%;
  overflow-x:auto;
  padding:8px 0 10px;
  border-radius:0;
  background:#fff !important;
  backdrop-filter:none !important;
  border:0 !important;
  box-shadow:none !important;
  scrollbar-width:none;
  opacity:0;
  visibility:hidden;
  transform:translateY(-14px);
  transform-origin:top center;
  transition:opacity .22s ease,transform .22s ease,visibility 0s linear .22s;
  position:relative;
  z-index:1;
}
.menu-tabs-track::-webkit-scrollbar{
  display:none;
}
.menu-tab-pill{
  appearance:none;
  border:1px solid rgba(31,22,19,.18);
  background:#fff;
  color:var(--ink);
  border-radius:999px;
  padding:11px 16px;
  white-space:nowrap;
  font:inherit;
  font-size:12px;
  font-weight:900;
  letter-spacing:.02em;
  text-transform:uppercase;
  cursor:pointer;
  transition:transform .18s ease,background .18s ease,color .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.menu-tab-pill:hover,
.menu-tab-pill:focus-visible{
  transform:translateY(-1px);
  background:#1f1613;
  color:#fff;
  border-color:#1f1613;
  box-shadow:none;
  outline:none;
}
.menu-tabs-docked .menu-tabs-sticky{
  pointer-events:auto;
}
.menu-tabs-docked .menu-tabs-sticky::before{
  opacity:1;
}
.menu-tabs-docked .menu-tabs-track{
  display:flex;
  opacity:1;
  visibility:visible;
  transform:translateY(0);
  transition-delay:0s;
}
.menu-tabs-docked .category-grid{
  transform:translateY(10px);
  opacity:.12;
  filter:none;
}
.detail-category-nav{
  position:sticky !important;
  top:calc(var(--menu-tabs-top) - 1px) !important;
  z-index:45 !important;
  display:block !important;
  overflow:visible;
  padding:2px 20px 10px !important;
  background:transparent !important;
  backdrop-filter:none !important;
  border:0 !important;
  box-shadow:none !important;
}
.detail-category-nav::before{
  content:"";
  position:absolute;
  left:50%;
  top:0;
  transform:translateX(-50%);
  width:100vw;
  height:56px;
  background:#fff;
  border-bottom:1px solid rgba(31,22,19,.08);
  pointer-events:none;
  z-index:0;
}
.detail-tabs-track{
  width:max-content;
  max-width:100%;
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  overflow-x:auto;
  scrollbar-width:none;
  position:relative;
  z-index:1;
}
.detail-tabs-track::-webkit-scrollbar{
  display:none;
}
.detail-tab-pill{
  flex:0 0 auto;
}
.detail-tab-pill .tab-pill-label{
  display:block;
  width:100%;
}
.detail-tab-pill .tab-pill-label.is-stacked{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
}
.detail-tab-pill .tab-pill-label.is-stacked span{
  display:block;
  line-height:1;
}
.detail-tab-pill.active{
  background:#1f1613 !important;
  color:#fff !important;
  border-color:#1f1613 !important;
}
.support-actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:20px;
}
@media(max-width:860px){
  .menu-tabs-track{
    justify-content:flex-start;
  }
  .detail-tabs-track{
    justify-content:flex-start;
  }
  .detail-menu-tabs-sticky::before{
    height:92px;
  }
  .detail-category-nav{
    padding-bottom:18px !important;
  }
  .detail-menu-tabs-sticky .detail-tabs-track,
  .detail-tabs-docked .detail-menu-tabs-sticky .detail-tabs-track{
    display:grid !important;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    width:calc(100% - 16px);
    min-width:0 !important;
    max-width:calc(100% - 16px);
    margin:0 auto;
    padding:8px 8px 10px;
    justify-content:stretch;
    row-gap:8px;
    column-gap:8px;
    overflow:visible;
  }
  .detail-tab-pill{
    flex:0 1 auto;
    width:100%;
    min-width:0;
    min-height:40px;
    padding:6px 5px;
    font-size:9px;
    white-space:normal;
    line-height:1.05;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    word-break:keep-all;
    overflow-wrap:break-word;
  }
  .detail-tab-pill .tab-pill-label.is-stacked{
    gap:2px;
  }
  .detail-tabs-docked .detail-category-grid{
    opacity:0 !important;
    pointer-events:none;
  }
}
@media(max-width:620px){
  .menu-tab-pill{
    padding:10px 12px;
    font-size:11px;
  }
  .menu-tabs-sticky::before,
  .detail-category-nav::before{
    height:52px;
  }
  .detail-category-nav{
    padding:2px 14px 10px !important;
  }
  .detail-tabs-track{
    gap:8px;
  }
}

/* V63 move docked menu behavior from home page to submenu pages */
.menu-tabs-sticky{
  display:none !important;
}
.menu-tabs-docked .category-grid{
  transform:none !important;
  opacity:1 !important;
}
.detail-category-nav{
  position:relative !important;
  top:auto !important;
  z-index:auto !important;
  padding:0 0 24px !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}
.detail-category-nav::before{
  display:none !important;
}
.detail-nav-shell{
  position:relative;
}
.detail-menu-tabs-sticky{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  z-index:60;
  height:0;
  pointer-events:none;
}
.detail-menu-tabs-sticky::before{
  content:"";
  position:absolute;
  left:50%;
  top:0;
  transform:translateX(-50%);
  width:100vw;
  height:56px;
  background:#fff;
  border-bottom:1px solid rgba(31,22,19,.08);
  opacity:0;
  transition:opacity .22s ease;
  pointer-events:none;
}
.detail-menu-tabs-sticky .detail-tabs-track{
  display:none !important;
  align-items:center;
  justify-content:center;
  gap:10px;
  width:max-content;
  min-width:100%;
  padding:8px 0 10px;
  background:transparent !important;
  opacity:0;
  visibility:hidden;
  transform:translateY(-14px);
  transform-origin:top center;
  transition:opacity .22s ease,transform .22s ease,visibility 0s linear .22s;
}
.detail-tabs-docked .detail-menu-tabs-sticky{
  position:fixed;
  top:calc(var(--menu-tabs-top) - 1px);
  left:0;
  width:100%;
  pointer-events:auto;
}
.detail-tabs-docked .detail-menu-tabs-sticky::before{
  opacity:1;
}
.detail-tabs-docked .detail-menu-tabs-sticky .detail-tabs-track{
  display:flex !important;
  opacity:1;
  visibility:visible;
  transform:translateY(0);
  transition-delay:0s;
}
.detail-category-grid{
  width:min(var(--max),calc(100% - 40px));
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  transition:transform .3s ease,opacity .3s ease;
}
.detail-category-grid .submenu-category-card{
  position:relative;
  display:block !important;
  overflow:hidden !important;
  padding:0 !important;
  border-radius:20px !important;
}
.detail-category-grid .submenu-category-card img{
  width:100% !important;
  min-width:100% !important;
  max-width:none !important;
  height:104px !important;
  min-height:104px !important;
  max-height:104px !important;
  aspect-ratio:auto !important;
  object-fit:cover !important;
  object-position:center center !important;
  background:#fff !important;
  padding:0 !important;
  margin:0 !important;
  border-radius:0 !important;
  display:block !important;
  transform:scale(1.18) !important;
  transform-origin:center center !important;
}
.detail-category-grid .submenu-category-card b{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:100% !important;
  min-height:40px !important;
  margin:0 !important;
  padding:10px 8px 11px !important;
  text-transform:uppercase !important;
  font-size:13px !important;
  font-weight:1000 !important;
  line-height:1 !important;
  letter-spacing:-.01em !important;
  background:#fff !important;
}
.detail-category-grid .submenu-category-card b:before{
  display:none !important;
  content:none !important;
}
.detail-category-grid .submenu-category-card.active{
  border-color:var(--red) !important;
}
.detail-category-grid .submenu-category-card.active b,
.detail-category-grid .submenu-category-card:hover b,
.detail-category-grid .submenu-category-card:focus-visible b,
.detail-category-grid .submenu-category-card:active b{
  background:var(--red) !important;
  color:#fff !important;
}
.detail-tabs-docked .detail-category-grid{
  transform:translateY(10px);
  opacity:.12;
}
@media(max-width:980px){
  .detail-category-grid{
    width:min(var(--max),calc(100% - 28px));
    gap:10px;
  }
  .detail-category-grid .submenu-category-card img{
    height:74px !important;
    min-height:74px !important;
    max-height:74px !important;
    transform:scale(1.16) !important;
  }
  .detail-category-grid .submenu-category-card b{
    font-size:10px;
    padding:7px 4px 8px;
  }
}
@media(max-width:620px){
  .detail-menu-tabs-sticky::before{
    height:92px;
  }
  .detail-category-nav{
    padding-bottom:18px !important;
  }
  .detail-menu-tabs-sticky .detail-tabs-track,
  .detail-tabs-docked .detail-menu-tabs-sticky .detail-tabs-track{
    display:grid !important;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    width:calc(100% - 16px);
    min-width:0 !important;
    max-width:calc(100% - 16px);
    margin:0 auto;
    padding:8px 8px 10px;
    justify-content:stretch;
    row-gap:8px;
    column-gap:8px;
    overflow:visible;
  }
  .detail-tab-pill{
    flex:0 1 auto;
    width:100%;
    min-width:0;
    min-height:40px;
    padding:6px 5px;
    font-size:9px;
    white-space:normal;
    line-height:1.05;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    word-break:keep-all;
    overflow-wrap:break-word;
  }
  .detail-tabs-docked .detail-category-grid{
    opacity:0 !important;
    pointer-events:none;
  }
  .detail-category-grid{
    width:calc(100% - 28px);
    gap:7px;
  }
  .detail-category-grid .submenu-category-card{
    border-radius:14px !important;
  }
  .detail-category-grid .submenu-category-card img{
    height:58px !important;
    min-height:58px !important;
    max-height:58px !important;
    transform:scale(1.18) !important;
  }
  .detail-category-grid .submenu-category-card b{
    min-height:29px !important;
    font-size:8px !important;
    padding:5px 3px 6px !important;
  }
}

/* V75 contrast cleanup for dark surfaces */
.site-footer h4,
.site-footer strong,
.site-footer b{
  color:#111111 !important;
}

.footer-tunes a,
.footer-tunes a:visited,
.footer-tunes a:hover,
.footer-tunes a:focus-visible{
  color:#ffffff !important;
}

.footer-tunes a{
  background:#1f1613 !important;
  border:1px solid #1f1613 !important;
}

.footer-tunes a:hover,
.footer-tunes a:focus-visible{
  background:var(--red) !important;
  border-color:var(--red) !important;
  outline:none;
}

.legal{
  background:#16110f !important;
  color:#ffffff !important;
  border-top:1px solid #2c2521 !important;
}

.socials a,
.sauce-accordion summary,
.menu-tab-pill:hover,
.menu-tab-pill:focus-visible,
.detail-tab-pill.active,
.detail-category-nav .detail-nav-card.active,
.detail-category-grid .submenu-category-card.active b,
.detail-category-grid .submenu-category-card:hover b,
.detail-category-grid .submenu-category-card:focus-visible b,
.detail-category-grid .submenu-category-card:active b{
  color:#ffffff !important;
}

.legal-version{
  display:inline-block;
  margin-left:6px;
  font-size:10px;
  line-height:1;
  letter-spacing:.08em;
  color:#b8bec6;
  vertical-align:middle;
}

/* V91 keep Order Now dropdown above submenu dock/tabs */
.site-header{
  z-index:140 !important;
}

.order-menu{
  z-index:150;
}

.order-dropdown{
  z-index:160 !important;
}

.footer-tunes a:first-of-type{
  background:var(--red) !important;
  border-color:var(--red) !important;
  color:#ffffff !important;
}

.footer-tunes a:first-of-type:hover,
.footer-tunes a:first-of-type:focus-visible{
  background:var(--red-dark) !important;
  border-color:var(--red-dark) !important;
}
