/* v35 "bubbly" iOS-style layer — visual only */
:root{--r-pill:999px;--r-lg:22px;--r-md:16px;--ui-font:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Inter","Inter Fallback",system-ui,"Segoe UI",Roboto,sans-serif;--glass-shadow:0 8px 32px rgba(51,24,26,.18);--soft:0 6px 22px rgba(51,24,26,.10),0 1px 3px rgba(51,24,26,.06)}
/* frosted glass header */
header{background:rgba(94,26,26,.86)!important;-webkit-backdrop-filter:saturate(180%) blur(20px);backdrop-filter:saturate(180%) blur(20px)}
header.scrolled{background:rgba(94,26,26,.90)!important;box-shadow:var(--glass-shadow)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){header,header.scrolled{background:rgba(94,26,26,.97)!important}}
header .logo img,header .logo{border-radius:14px}
/* UI font for controls */
nav a,button,.btn-primary,.btn-outline,.btn-order,.btn-call,.btn-submit,.tab-btn,.social-pill,.open-badge,.section-order-link,.bar-order,.lang-toggle,input,select,textarea{font-family:var(--ui-font)}
/* pill buttons */
.btn-primary,.btn-outline,.btn-order,.btn-call,.btn-submit,.tab-btn,.section-order-link,.social-pill,.cta-phone,header .header-actions a,header .header-actions button,.hero-btns a{border-radius:var(--r-pill)!important}
.btn-primary,.btn-order,.btn-submit{box-shadow:0 6px 18px rgba(200,32,42,.22),inset 0 1px 0 rgba(255,255,255,.25)}
.btn-order{box-shadow:0 4px 14px rgba(239,200,90,.30),inset 0 1px 0 rgba(255,255,255,.5)}
.btn-primary,.btn-outline,.btn-order,.btn-call,.btn-submit,.tab-btn,.social-pill,.section-order-link,.qcard,.feat-card,.delivery-card,.chicken-card,.menu-item.has-img,.bar-order,.hero-btns a{transition:transform .18s cubic-bezier(.3,.7,.4,1.4),box-shadow .2s,background .2s,border-color .2s!important}
@media (hover:hover){.btn-primary:hover,.btn-outline:hover,.btn-order:hover,.btn-call:hover,.btn-submit:hover,.tab-btn:hover,.social-pill:hover,.section-order-link:hover,.hero-btns a:hover{transform:scale(1.04)}}
.btn-primary:active,.btn-outline:active,.btn-order:active,.btn-call:active,.btn-submit:active,.tab-btn:active,.social-pill:active,.section-order-link:active,.qcard:active,.feat-card:active,.delivery-card:active,.chicken-card:active,.bar-order:active,.hero-btns a:active{transform:scale(.96)!important}
/* cards */
.menu-item,.review-card,.qcard,.feat-card,.delivery-card,.chicken-card{border-radius:var(--r-lg)!important;box-shadow:var(--soft)}
.menu-item{border-color:rgba(237,223,200,.7)}
.mi-thumb,.mi-thumb img,.feat-card img,.chicken-card img,.dish-link img{border-radius:var(--r-md)}
.feat-card,.chicken-card{overflow:hidden}
main img:not([class*="ico"]):not(.avatar):not([width="16"]):not([width="20"]):not([width="24"]){border-radius:var(--r-md)}
main section img[src*="logo"]{border-radius:0}
iframe{border-radius:var(--r-lg)}
input,select,textarea{border-radius:14px!important}
.open-badge{border-radius:var(--r-pill)}
/* accessible focus */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:3px solid #EFC85A!important;outline-offset:3px;box-shadow:0 0 0 6px rgba(200,32,42,.35)!important;border-radius:var(--r-pill)}
input:focus-visible,select:focus-visible,textarea:focus-visible{border-radius:14px}
@media (prefers-reduced-motion:reduce){*{transition:none!important}.btn-primary:hover,.btn-order:hover{transform:none}}

/* v36 mobile customer UX — targets, contrast, offsets. No copy changes. */
:root{--ux-bar:70px}
header{background:rgba(94,26,26,.94)!important}
header.scrolled{background:rgba(94,26,26,.97)!important}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){header,header.scrolled{background:rgba(94,26,26,.98)!important}}

/* Hero copy sits on a photo. A dark scrim keeps white and gold text at AA. */
#home .content{background:rgba(36,10,12,.82);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:22px;box-shadow:0 12px 36px rgba(0,0,0,.28)}
#home h1,#home .hero-tagline,#home .hero-hours,#home .content>p:not(.hero-eyebrow){color:#fff}
#home .hero-eyebrow{color:#FFE7A3}
#home .content>p{text-shadow:0 1px 2px rgba(0,0,0,.35)}

/* Promo bar: white 12px text failed on #EC2027 (~4.4:1). #9B1620 is ~8:1. */
.ann-deal{background:#9B1620!important;background:linear-gradient(90deg,#6E1016 0%,#9B1620 52%,#6E1016 100%)!important}
.ann-btn,.ann-deal .ann-btn{min-height:44px;padding:.45rem .9rem;flex-shrink:0}
.ann-close{width:44px;height:44px;min-width:44px;min-height:44px}
.ann-deal .ann-inner,.ann-inner{padding-right:3.4rem}

.logo a{min-width:44px;min-height:44px;align-items:center;justify-content:center}
@media (max-width:1024px){
  .nav-toggle{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;width:44px;height:44px;min-width:44px;min-height:44px;padding:0;flex:0 0 44px}
  .nav-toggle span{margin:4px 0}
  #main-nav a{min-height:44px;padding:.55rem 1.35rem;display:flex;align-items:center;width:100%;box-sizing:border-box}
}

/* Clear the fixed header (70px) under the announcement bar.
   #catering gets a smaller bump so Plan Your Order stays above the quote bar. */
@media (max-width:768px){
  main>section:first-of-type:not(#home):not(#catering){padding-top:calc(var(--ux-bar) + 1.25rem)}
  #catering{padding-top:calc(var(--ux-bar) + .45rem)}
  body{padding-bottom:calc(76px + env(safe-area-inset-bottom))}
  .catering-cta{flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:center;column-gap:.5rem;row-gap:.15rem;max-width:100%;width:auto}
  .catering-cta .cta-phone{margin-left:0}
}
#menu .menu-tabs{top:calc(var(--ux-bar) + var(--ann-h));background:var(--cream);z-index:40}
/* scroll-padding-top (80px + ann bar) stacks with this margin.
   Phone tabs are one row: 70px leaves ~12px under them.
   At 769px and up the tabs wrap to two rows (~120px), so the offset grows. */
#menu .menu-section{scroll-margin-top:70px}
@media (min-width:769px){
  #menu .menu-section{scroll-margin-top:122px}
}
/* The add buttons sit on the right edge of each card. Keep the
   back-to-top control on the left so it does not cover them.
   Once the order chip is open, lift this button above that chip. */
@media (max-width:768px){
  #back-to-top{right:auto;left:1rem}
  body:has(#cart-fab.show) #back-to-top{bottom:calc(132px + env(safe-area-inset-bottom))}
}

.tab-btn,.gallery-chips .chip{min-height:44px;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center}
.footer-link,.footer-nav a,.footer-pills a,.social-pill,.maps-btn,.address-link{min-height:44px;box-sizing:border-box}
.footer-link,.footer-nav a,.social-pill,.maps-btn,.address-link{display:inline-flex;align-items:center}
.footer-pills a{display:inline-flex;align-items:center}
.footer-social a{width:44px;height:44px;min-width:44px;min-height:44px}
.social-pill{min-height:44px}
.address-link{padding:.4rem 0}
.info-block a[href^="tel:"]{display:inline-flex;align-items:center;min-height:44px;font-size:1.2rem;font-weight:800;color:var(--brown)}

.add-btn,.qty-btn{width:44px;height:44px;min-width:44px;min-height:44px;font-size:1.35rem}
.add-btn::before,.qty-btn::before{content:none!important}

/* Name leads, price stays scannable, rows have room for a 44px add control. */
.item-name{font-size:1.05rem}
.item-price{font-size:1.12rem;font-weight:800}
.menu-grid{gap:1.15rem}
.menu-item .dish-link{display:inline-flex;align-items:center;min-height:44px}

/* "Plan Your Order" + phone were adjacent inline, so they read as one word. */
.catering-cta{gap:.5rem}
.catering-cta .cta-phone{margin-left:.55rem}

img.brand-ico{width:1em;height:1em}

a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:3px solid #FFE7A3!important;outline-offset:2px;box-shadow:0 0 0 3px #1A0808,0 0 0 6px #FFE7A3!important}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
