:root {
  --red: #710117;
  --red-dark: #52000f;
  --white: #ffffff;
  --blue: #54627b;
  --beige: #ecd5bb;
  --beige-light: #f8efe5;
  --ink: #171717;
  --muted: #68635e;
  --line: #dedede;
  --surface: #f4f4f4;
  --max: 1240px;
  --header-height: 72px;
  --rail-height: 124px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--white); font-family: Arial, Helvetica, sans-serif; font-size: 16px; letter-spacing: 0; }
html.menu-open, body.menu-open { overflow: hidden; overscroll-behavior: none; }
body.menu-open { position: fixed; width: 100%; }
img { display: block; max-width: 100%; }
a { color: inherit; }
button { font: inherit; }

.skip-link { position: fixed; left: 16px; top: -80px; z-index: 100; padding: 12px 16px; color: var(--white); background: var(--ink); }
.skip-link:focus { top: 16px; }

.announcement { min-height: 32px; display: grid; place-items: center; padding: 7px 16px; color: var(--white); background: var(--red); font-size: 12px; font-weight: 800; text-align: center; text-transform: uppercase; }
.site-header { position: sticky; top: 0; z-index: 50; border-bottom: 1px solid rgba(23,23,23,0.12); background: rgba(255,255,255,0.98); backdrop-filter: blur(10px); }
.header-inner { width: min(calc(100% - 48px), var(--max)); min-height: var(--header-height); margin: 0 auto; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 28px; }
.brand { width: 146px; height: 64px; overflow: visible; display: flex; align-items: center; justify-self: start; }
.brand img { width: 146px; height: auto; }
.desktop-nav { display: flex; align-items: center; justify-content: center; gap: 38px; }
.desktop-nav a, .mobile-nav a, .footer-column a, .footer-column span { font-size: 14px; font-weight: 800; text-decoration: none; }
.desktop-nav a:hover, .footer-column a:hover { color: var(--red); }
.header-actions { display: flex; align-items: center; justify-content: flex-end; gap: 12px; }

.button { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; padding: 13px 20px; border: 2px solid var(--red); border-radius: 4px; color: var(--white); background: var(--red); font-size: 14px; font-weight: 900; line-height: 1.2; text-align: center; text-decoration: none; cursor: pointer; transition: color 180ms ease, background 180ms ease, border-color 180ms ease; }
.button:hover { color: var(--red); background: var(--white); }
.button:focus-visible, .menu-toggle:focus-visible, .mobile-nav-close:focus-visible, .mobile-nav a:focus-visible, .carousel-arrow:focus-visible, .carousel-dot:focus-visible, .category-arrow:focus-visible, .category-link:focus-visible { outline: 3px solid var(--blue); outline-offset: 4px; }
.button-small { min-height: 42px; padding: 10px 16px; }
.button-light { border-color: var(--white); color: var(--red); background: var(--white); }
.button-light:hover { color: var(--white); background: transparent; }
.button-secondary { color: var(--red); background: var(--white); }
.contact-actions { width: min(100%, 620px); margin: 0 auto; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.contact-actions-hero { width: 100%; margin: 0; }
.contact-button { width: 100%; min-height: 52px; gap: 10px; padding: 13px 16px; }
.contact-icon { width: 20px; height: 20px; flex: 0 0 20px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }

.menu-toggle { width: 42px; height: 42px; display: none; align-items: center; justify-content: center; flex-direction: column; gap: 5px; border: 0; background: transparent; cursor: pointer; }
.menu-toggle span { width: 22px; height: 2px; background: var(--ink); transition: transform 180ms ease, opacity 180ms ease; }
.menu-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.menu-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
.mobile-nav { position: fixed; inset: 0; z-index: 200; overflow-y: auto; overscroll-behavior: contain; color: var(--ink); background: #fff; isolation: isolate; }
.mobile-nav[hidden] { display: none; }
.mobile-nav-header { min-height: var(--header-height); display: flex; align-items: center; justify-content: space-between; padding: max(8px, env(safe-area-inset-top)) 28px 8px; border-bottom: 1px solid var(--line); background: #fff; }
.mobile-nav-brand { width: 132px; display: flex; align-items: center; }
.mobile-nav-brand img { width: 100%; height: auto; }
.mobile-nav-close { position: relative; width: 46px; height: 46px; flex: 0 0 46px; border: 0; color: var(--ink); background: transparent; cursor: pointer; }
.mobile-nav-close span { position: absolute; left: 11px; top: 22px; width: 24px; height: 2px; background: currentColor; }
.mobile-nav-close span:first-child { transform: rotate(45deg); }
.mobile-nav-close span:last-child { transform: rotate(-45deg); }
.mobile-nav-links { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; padding: 34px 28px calc(38px + env(safe-area-inset-bottom)); background: #fff; }
.mobile-nav-links a { position: relative; display: inline-block; padding: 9px 0; color: var(--ink); font-size: 32px; font-weight: 900; line-height: 1.12; text-decoration: none; }
.mobile-nav-links a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: 3px; height: 3px; background: var(--red); transition: right 180ms ease; }
.mobile-nav-links a:hover, .mobile-nav-links a:focus-visible { color: var(--red); }
.mobile-nav-links a:hover::after, .mobile-nav-links a:focus-visible::after { right: 0; }

.eyebrow { margin: 0 0 14px; font-size: 12px; font-weight: 900; text-transform: uppercase; }
.eyebrow-red { color: var(--red); }
.eyebrow-blue { color: var(--blue); }
.section-shell { width: min(calc(100% - 48px), var(--max)); margin: 0 auto; }

/* Approved V4 campaign system */
.campaign-carousel { position: relative; height: 520px; overflow: hidden; background: var(--beige-light); touch-action: pan-y; }
.campaign-track, .campaign-slide { position: absolute; inset: 0; }
.campaign-slide { visibility: hidden; opacity: 0; transition: opacity 450ms ease, visibility 450ms ease; }
.campaign-slide.is-active { visibility: visible; opacity: 1; }
.theme-beige { background: var(--beige); }
.theme-white { background: var(--white); }
.theme-red { color: var(--white); background: var(--red); }
.theme-blue { color: var(--white); background: var(--blue); }
.campaign-inner { position: relative; width: min(calc(100% - 48px), var(--max)); height: 100%; margin: 0 auto; display: flex; align-items: center; }
.campaign-copy { position: relative; z-index: 3; width: 47%; padding: 54px 34px 82px 0; }
.campaign-copy h1, .campaign-copy h2 { max-width: 570px; margin: 0; font-size: 58px; font-weight: 900; line-height: 0.98; }
.campaign-copy > p:not(.eyebrow) { margin: 20px 0 28px; font-size: 22px; font-weight: 800; line-height: 1.35; }
.campaign-copy h2 + .button { margin-top: 28px; }
.campaign-media { position: absolute; top: 28px; right: 0; bottom: 52px; width: 54%; overflow: hidden; border-radius: 6px; background: var(--red); }
.campaign-media::before { content: ""; position: absolute; inset: 16px; z-index: 1; border: 1px solid rgba(255,255,255,0.72); border-radius: 3px; pointer-events: none; }
.campaign-media img { width: 100%; height: 100%; object-fit: cover; transition: transform 6.5s ease; }
.campaign-media img.hero-food-contain { object-fit: contain; }
.campaign-slide.is-active .campaign-media img { transform: scale(1.035); }
.campaign-slide:nth-child(1) .campaign-media img { object-position: center 53%; }
.campaign-slide:nth-child(2) .campaign-media img { object-position: center 58%; }
.campaign-slide:nth-child(3) .campaign-media img { object-position: center 42%; }
.campaign-slide:nth-child(4) .campaign-media img { object-position: center 50%; }
.qa-mode .campaign-media img { transition: none; transform: none; }
.qa-section-menu .campaign-carousel, .qa-section-menu .updates-capture { display: none; }
.qa-section-rail .campaign-carousel, .qa-section-rail .updates-capture, .qa-section-rail .category-section { display: none; }
.qa-section-locations .campaign-carousel,
.qa-section-locations .updates-capture,
.qa-section-locations .category-section,
.qa-section-locations .category-nav-sticky,
.qa-section-locations .menu-canvas { display: none; }
.media-blue { background: var(--blue); }
.media-light { background: var(--beige-light); }
.media-beige { background: var(--beige); }
.carousel-controls { position: absolute; z-index: 8; left: 50%; bottom: 20px; width: min(calc(100% - 48px), var(--max)); display: flex; align-items: center; justify-content: flex-start; gap: 12px; transform: translateX(-50%); }
.carousel-arrow { width: 40px; height: 40px; border: 1px solid var(--red); border-radius: 50%; color: var(--red); background: rgba(255,255,255,0.9); font-size: 20px; cursor: pointer; }
.carousel-arrow:hover { color: var(--white); background: var(--red); }
.carousel-dots { display: flex; gap: 8px; padding: 0 5px; }
.carousel-dot { width: 9px; height: 9px; padding: 0; border: 1px solid var(--red); border-radius: 50%; background: var(--white); cursor: pointer; }
.carousel-dot.is-active { background: var(--red); }

.updates-capture { padding: 66px 24px 70px; border-bottom: 1px solid var(--line); background: var(--white); text-align: center; }
.updates-capture-inner { max-width: 760px; margin: 0 auto; }
.updates-capture h2 { margin: 0; font-size: 42px; font-weight: 900; line-height: 1.05; }
.updates-capture p:not(.eyebrow) { max-width: 660px; margin: 18px auto 26px; color: var(--muted); font-size: 18px; line-height: 1.5; }

.category-section { padding: 56px 0 28px; background: var(--white); scroll-margin-top: var(--header-height); }
.category-heading { text-align: center; }
.category-heading h2 { margin: 0; font-size: 42px; line-height: 1.05; }
.category-nav-sticky { position: relative; z-index: 38; border-bottom: 1px solid var(--line); background: var(--white); }
.category-nav-wrap { display: grid; grid-template-columns: 44px minmax(0, 960px) 44px; justify-content: center; align-items: center; gap: 18px; min-height: var(--rail-height); }
.category-rail { display: flex; justify-content: center; align-items: stretch; gap: 10px; overflow-x: auto; scrollbar-width: none; scroll-behavior: smooth; scroll-snap-type: x proximity; }
.category-rail::-webkit-scrollbar { display: none; }
.category-link { position: relative; flex: 0 0 150px; min-height: 104px; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 8px; padding: 10px 8px 13px; color: #727985; font-size: 14px; font-weight: 900; text-decoration: none; scroll-snap-align: center; transition: color 180ms ease; }
.category-link::after { content: ""; position: absolute; left: 18px; right: 18px; bottom: 0; height: 3px; background: transparent; }
.category-link:hover, .category-link.is-active { color: var(--red); }
.category-link.is-active::after { background: var(--red); }
.category-icon { width: 50px; height: 50px; overflow: visible; fill: none; stroke: currentColor; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
.category-arrow { width: 44px; height: 44px; border: 1px solid #c8c8c8; border-radius: 50%; color: var(--ink); background: var(--white); font-size: 20px; cursor: pointer; }
.category-arrow:hover:not(:disabled) { border-color: var(--red); color: var(--white); background: var(--red); }
.category-arrow:disabled { color: #bcbcbc; cursor: default; }

.menu-canvas { background: var(--white); }
.menu-section { padding: 78px 0 86px; border-bottom: 1px solid var(--line); background: var(--white); scroll-margin-top: var(--header-height); }
.menu-section-heading { max-width: 680px; margin-bottom: 34px; }
.menu-section-heading h2 { margin: 0; font-size: 46px; line-height: 1.05; }
.menu-section-heading > p:not(.eyebrow) { margin: 15px 0 0; color: var(--muted); font-size: 17px; line-height: 1.5; }
.product-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.product-grid-three { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.product-grid-single { max-width: 608px; grid-template-columns: minmax(0, 1fr); }
.product-card { min-width: 0; overflow: hidden; display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 8px; background: var(--white); }
.product-media { height: 310px; overflow: hidden; padding: 12px; background: var(--surface); }
.product-media img { width: 100%; height: 100%; border-radius: 5px; object-fit: cover; }
.product-media img[src*="v6-"] { object-fit: contain; }
.product-media img.product-image-contain { object-fit: contain; }
.product-card:nth-child(1) .product-media img { object-position: center 52%; }
.product-card:nth-child(2) .product-media img { object-position: center 46%; }
.product-copy { flex: 1; min-height: 150px; padding: 24px; background: var(--white); }
.product-copy-with-action { min-height: 230px; display: flex; flex-direction: column; }
.product-title { display: block; }
.product-copy h3 { margin: 0; font-size: 25px; line-height: 1.12; }
.product-copy strong { flex: 0 0 auto; color: var(--red); font-size: 22px; }
.product-copy p { margin: 15px 0 0; color: var(--muted); line-height: 1.5; }
.product-inquiry-button { width: 100%; min-height: 46px; margin-top: auto; padding: 11px 18px; border-radius: 4px; }
.product-inquiry-button:hover { border-color: var(--red-dark); color: var(--white); background: var(--red-dark); }
.product-inquiry-button:active { border-color: var(--red-dark); color: var(--white); background: var(--red-dark); transform: translateY(1px); }
.side-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.side-card .product-media { height: 230px; }
.side-card .product-copy { min-height: 142px; }
.side-card .product-copy h3 { font-size: 21px; }
.pending-products { min-height: 130px; display: grid; place-items: center; padding: 24px; border: 1px dashed #b8b8b8; border-radius: 8px; color: var(--muted); background: var(--surface); font-weight: 800; text-align: center; }

.locations-section { padding: 78px 0 86px; background: var(--white); scroll-margin-top: var(--header-height); }
.locations-layout { display: grid; gap: 34px; }
.locations-intro { display: grid; grid-template-columns: 1fr 1fr; align-items: end; column-gap: 48px; }
.locations-intro .eyebrow { grid-column: 1 / -1; }
.locations-intro h2 { margin: 0; font-size: 46px; line-height: 1.05; }
.locations-intro > p:not(.eyebrow) { max-width: 410px; margin: 0 0 4px; color: var(--muted); font-size: 17px; line-height: 1.5; }
.location-listing { display: grid; grid-template-columns: 72px 1fr auto; gap: 28px; align-items: center; padding: 28px; border: 1px solid var(--line); border-radius: 8px; background: var(--white); }
.location-marker { width: 62px; height: 62px; display: grid; place-items: center; border-radius: 50%; background: var(--red); }
.location-marker span { position: relative; width: 20px; height: 20px; border: 5px solid var(--white); border-radius: 50%; }
.location-marker span::after { content: ""; position: absolute; left: 3px; top: 12px; width: 7px; height: 15px; background: var(--white); transform: rotate(45deg); }
.location-region { margin: 0 0 7px; color: var(--red); font-size: 11px; font-weight: 900; text-transform: uppercase; }
.location-main h3 { margin: 0; font-size: 28px; }
.location-main > p:not(.location-region) { margin: 9px 0 18px; color: var(--muted); }
.location-main .location-support { margin-top: -4px; color: var(--muted); font-size: 14px; }
.location-main dl { display: flex; gap: 32px; margin: 0; }
.location-main dl div { display: grid; gap: 5px; }
.location-main dt { font-size: 10px; font-weight: 900; text-transform: uppercase; }
.location-main dd { margin: 0; font-size: 14px; }
.location-actions { display: grid; justify-items: end; gap: 14px; }
.text-link-disabled { color: var(--muted); cursor: not-allowed; text-decoration: none; }
.text-link { color: var(--red); font-size: 14px; font-weight: 900; text-decoration: none; }
.text-link:hover { text-decoration: underline; text-underline-offset: 5px; }

footer { color: var(--white); background: var(--ink); }
.footer-shell { width: min(calc(100% - 48px), var(--max)); margin: 0 auto; display: grid; grid-template-columns: 1.7fr 0.8fr 1fr 0.8fr; gap: 52px; padding: 66px 0 56px; }
.footer-brand img { width: 175px; filter: brightness(0) invert(1); }
.footer-brand p { margin: 18px 0 0; color: #cfcaca; line-height: 1.5; }
.footer-column { display: grid; align-content: start; justify-items: start; gap: 13px; }
.footer-column h2 { margin: 0 0 8px; color: var(--beige); font-size: 13px; text-transform: uppercase; }
.footer-column span { color: #cfcaca; }
.footer-column a:hover { color: var(--beige); }
.footer-bottom { width: min(calc(100% - 48px), var(--max)); margin: 0 auto; display: flex; justify-content: space-between; gap: 24px; padding: 22px 0 28px; border-top: 1px solid #3b3838; color: #a9a5a5; font-size: 12px; }
.footer-legal { display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: 18px; }
.footer-legal a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.footer-legal a:hover { color: var(--white); }

.privacy-main { min-height: 62vh; padding: 72px 0 88px; }
.privacy-content { max-width: 820px; }
.privacy-content h1 { margin: 0; font-size: 48px; line-height: 1.05; }
.privacy-content h2 { margin: 38px 0 12px; font-size: 24px; }
.privacy-content p, .privacy-content li { color: var(--muted); line-height: 1.65; }
.privacy-content ul { padding-left: 22px; }
.privacy-content .button { margin-top: 22px; }

@media (max-width: 960px) {
  .header-inner { grid-template-columns: 1fr auto; }
  .desktop-nav { display: none; }
  .menu-toggle { display: flex; }
  .campaign-copy { width: 50%; }
  .campaign-copy h1, .campaign-copy h2 { font-size: 48px; }
  .category-link { flex-basis: 132px; }
  .product-media { height: 270px; }
  .product-grid-three { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .side-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .location-listing { grid-template-columns: 62px 1fr; align-items: start; }
  .location-actions { grid-column: 2; justify-items: start; }
  .footer-shell { grid-template-columns: 1.6fr 1fr 1fr; }
  .footer-brand { grid-column: 1 / -1; }
}

@media (max-width: 640px) {
  :root { --header-height: 62px; --rail-height: 104px; }
  .header-inner, .section-shell, .footer-shell, .footer-bottom, .campaign-inner, .carousel-controls { width: min(calc(100% - 32px), var(--max)); }
  .brand { width: 108px; height: 50px; }
  .brand img { width: 108px; }
  .button-small { min-height: 40px; padding: 9px 11px; font-size: 12px; }
  .header-actions { gap: 5px; }
  .mobile-nav-header { min-height: var(--header-height); padding-right: 16px; padding-left: 16px; }
  .mobile-nav-brand { width: 108px; }
  .mobile-nav-links { gap: 8px; padding: 28px 22px calc(32px + env(safe-area-inset-bottom)); }
  .mobile-nav-links a { font-size: 30px; }

  .campaign-carousel { height: 680px; }
  .campaign-inner { display: block; padding-top: 18px; }
  .campaign-media { top: 18px; right: 0; bottom: auto; width: 100%; height: 290px; }
  .campaign-copy { position: absolute; left: 0; right: 0; bottom: 64px; width: 100%; padding: 28px 6px 0; }
  .campaign-copy h1, .campaign-copy h2 { max-width: 360px; font-size: 40px; }
  .campaign-copy > p:not(.eyebrow) { margin: 12px 0 18px; font-size: 18px; }
  .campaign-copy h2 + .button { margin-top: 18px; }
  .theme-red .campaign-copy, .theme-blue .campaign-copy { color: var(--white); }
  .carousel-controls { bottom: 14px; justify-content: space-between; }
  .carousel-dots { order: 2; }
  .carousel-prev { order: 1; }
  .carousel-next { order: 3; }

  .updates-capture { padding: 54px 20px 58px; }
  .updates-capture h2 { font-size: 34px; }
  .updates-capture p:not(.eyebrow) { font-size: 16px; }
  .updates-capture .button { width: 100%; }

  .category-section { padding: 46px 0 24px; }
  .category-heading h2 { font-size: 34px; }
  .category-nav-sticky { position: sticky; top: var(--header-height); }
  .category-nav-sticky .section-shell { width: 100%; }
  .category-nav-wrap { grid-template-columns: 38px minmax(0, 1fr) 38px; gap: 3px; min-height: var(--rail-height); padding: 0 4px; }
  .category-arrow { width: 36px; height: 36px; font-size: 17px; }
  .category-rail { justify-content: flex-start; gap: 2px; scroll-padding: 0 46px; }
  .category-link { flex-basis: 92px; min-height: 96px; gap: 4px; padding: 9px 4px 11px; font-size: 12px; }
  .category-link::after { left: 12px; right: 12px; }
  .category-icon { width: 42px; height: 42px; }

  .menu-section { padding: 60px 0 68px; scroll-margin-top: calc(var(--header-height) + var(--rail-height) - 1px); }
  .menu-section-heading { margin-bottom: 26px; }
  .menu-section-heading h2 { font-size: 36px; }
  .menu-section-heading > p:not(.eyebrow) { font-size: 15px; }
  .product-grid, .side-grid { grid-template-columns: 1fr; gap: 18px; }
  .product-media { height: 235px; padding: 9px; }
  .product-copy { min-height: 132px; padding: 20px; }
  .product-title { gap: 12px; }
  .product-copy h3 { font-size: 22px; }
  .product-copy strong { font-size: 20px; }
  .side-card .product-media { height: 210px; }
  .side-card .product-copy { min-height: 124px; }
  .locations-section { padding: 60px 0 68px; scroll-margin-top: calc(var(--header-height) + var(--rail-height)); }
  .locations-intro { grid-template-columns: 1fr; gap: 15px; }
  .locations-intro h2 { font-size: 36px; }
  .location-listing { grid-template-columns: 1fr; gap: 20px; padding: 22px; }
  .location-main dl { flex-direction: column; gap: 14px; }
  .location-actions { grid-column: 1; justify-items: stretch; }
  .location-actions .button { width: 100%; }

  .footer-shell { grid-template-columns: 1fr 1fr; gap: 36px 22px; padding: 52px 0 44px; }
  .footer-brand { grid-column: 1 / -1; }
  .footer-column:nth-child(4) { grid-column: 1 / -1; }
  .footer-bottom { align-items: flex-start; flex-direction: column; }
  .footer-legal { justify-content: flex-start; gap: 14px 18px; }
  .privacy-main { padding: 52px 0 68px; }
  .privacy-content h1 { font-size: 38px; }
}

@media (max-width: 520px) {
  .contact-actions { grid-template-columns: 1fr; gap: 10px; }
}

@media (prefers-reduced-motion: reduce) {
  html, .category-rail { scroll-behavior: auto; }
  .campaign-slide, .campaign-media img, .button, .category-link { transition: none; }
}
