/* Ali Usta · Design System 2.0. Foundations → semantic tokens → components.
   Business content and appearance preferences remain in the content document. */
:root {
  --ds-space-1: .25rem;
  --ds-space-2: .5rem;
  --ds-space-3: .75rem;
  --ds-space-4: 1rem;
  --ds-space-5: 1.25rem;
  --ds-space-6: 1.5rem;
  --ds-space-8: 2rem;
  --ds-space-10: 2.5rem;
  --ds-space-12: 3rem;
  --ds-space-16: 4rem;
  --ds-space-24: 6rem;
  --ds-text-caption: .8125rem;
  --ds-text-small: .9375rem;
  --ds-text-body: 1rem;
  --ds-text-lead: 1.125rem;
  --ds-text-title: clamp(1.25rem, 1.1rem + .45vw, 1.625rem);
  --ds-text-section: clamp(2rem, 1.5rem + 2.3vw, 3.5rem);
  --ds-text-hero: clamp(3.5rem, 2rem + 4vw, 6rem);
  --ds-leading: 1.65;
  --ds-control: 2.75rem;
  --ds-control-primary: 3.25rem;
  --ds-radius-control: calc(var(--radius, 16px) * .5 + 4px);
  --ds-radius-card: calc(var(--radius, 16px) + 8px);
  --ds-radius-panel: calc(var(--radius, 16px) + 16px);
  --ds-canvas: var(--cream);
  --ds-surface: var(--paper);
  --ds-text: var(--ink);
  --ds-text-secondary: var(--muted);
  --ds-surface-text: var(--card-ink);
  --ds-surface-secondary: var(--card-muted);
  --ds-action: var(--button-orange);
  --ds-on-action: var(--on-orange, #fff);
  --ds-focus: var(--accent-text);
  --ds-separator: var(--line);
  --ds-control-border: color-mix(in srgb, var(--ink) 38%, var(--cream));
  --ds-duration: 180ms;
  --ds-easing: cubic-bezier(.2, .7, .2, 1);
  --ds-gutter: clamp(1rem, 4.5vw, 4rem);
  --ds-header-height: 5rem;
}
html:has(.grill-theme) {scroll-padding-top: calc(var(--ds-header-height) + 1.5rem)}
.grill-theme {font-size: var(--ds-text-body); line-height: var(--ds-leading); background: var(--ds-canvas); color: var(--ds-text); color-scheme: dark}
.grill-theme .container {width: min(var(--width), calc(100% - 2 * var(--ds-gutter)))}
.grill-theme ::selection {background: var(--ds-action); color: var(--ds-on-action)}
.grill-theme :is(h1,h2,h3,p) {overflow-wrap: break-word}
.grill-theme :is(h1,h2,h3) {font-weight: 600; font-style: normal; text-wrap: balance; text-transform: none; letter-spacing: -.04em; line-height: 1.13}
.grill-theme h2 {font-size: var(--ds-text-section)}
.grill-theme h3 {font-size: var(--ds-text-title); letter-spacing: -.025em}
.grill-theme :is(button,a,input,select,textarea,summary) {touch-action: manipulation}
.grill-theme :is(button,a,input,select,textarea,summary):focus-visible {outline: 3px solid var(--ds-focus); outline-offset: 4px}
.grill-theme #main:focus {outline: none}
.grill-theme .skip-link {background: var(--ds-text); color: var(--ds-canvas); border-radius: var(--ds-radius-control); min-height: var(--ds-control)}
.grill-theme :is(button,[role="button"]):disabled,.grill-theme [aria-disabled="true"] {cursor: not-allowed; opacity: .55}
.grill-theme :is(input,select,textarea) {font-size: var(--ds-text-body)}

/* Navigation: a quiet, stable header and an explicit mobile disclosure. */
.grill-theme .site-header {background: color-mix(in srgb, var(--ds-canvas) 94%, transparent); backdrop-filter: blur(18px); border-bottom: 1px solid var(--ds-separator)}
.grill-theme .header-inner {height: auto; min-height: var(--ds-header-height); gap: var(--ds-space-6); padding-block: var(--ds-space-3); flex-wrap: wrap}
.grill-theme .wordmark {min-width: 0; flex-shrink: 1; gap: var(--ds-space-3)}
.grill-theme :is(.brand-logo,.footer-logo) {object-fit: contain; clip-path: none; transform: none; flex: none; background: transparent}
.grill-theme .brand-logo {width: 3.25rem; height: 3.25rem}
.grill-theme .logo-words {font-size: 1.0625rem; line-height: 1.25; letter-spacing: -.025em; text-transform: none; font-weight: 650}
.grill-theme .logo-words small {font-size: .625rem; font-weight: 500; letter-spacing: .12em; margin-bottom: .35rem; color: var(--ds-text-secondary)}
.grill-theme .logo-dot {display: none}
.grill-theme .site-header nav {gap: var(--ds-space-6); align-items: center; margin-inline: auto}
.grill-theme .site-header nav a {display: inline-flex; align-items: center; min-height: var(--ds-control); font-size: var(--ds-text-caption); letter-spacing: 0; color: var(--ds-text-secondary); white-space: nowrap}
.grill-theme .site-header nav a:hover {color: var(--ds-text)}
.grill-theme .site-header nav a:after {height: 2px; background: var(--ds-action)}
.grill-theme .header-call {flex: none}
.grill-theme .mobile-menu-toggle {display: none}

/* One control grammar, with visible hover, focus, selected and disabled states. */
.grill-theme :is(.button,.order-add,.order-open,.finder-actions button,.menu-no-results button,.order-back,.order-send) {
  min-height: var(--ds-control-primary); padding: .875rem 1.5rem; border-radius: var(--ds-radius-control);
  font-size: var(--ds-text-small); font-weight: 600; line-height: 1.4; letter-spacing: -.015em;
  transition: background-color var(--ds-duration) var(--ds-easing), border-color var(--ds-duration) var(--ds-easing), box-shadow var(--ds-duration) var(--ds-easing);
}
.grill-theme .button:hover {transform: none}
.grill-theme :is(.button-orange,.order-add,.finder-submit,.order-send,.order-dock) {background: var(--ds-action); color: var(--ds-on-action); border-color: var(--ds-action)}
.grill-theme :is(.button-outline,.header-call,.finder-reset,.menu-no-results button,.order-back,.order-open) {border: 1px solid var(--ds-control-border); background: transparent; color: var(--ds-text)}
.grill-theme .header-call {font-size: var(--ds-text-caption); min-height: var(--ds-control); padding: .75rem 1.125rem; border-radius: 99px}
.grill-theme .text-link {min-height: var(--ds-control); font-size: var(--ds-text-small); line-height: 1.5; gap: .75rem}
.grill-theme .text-link [data-copy] {font-size: inherit}
.grill-theme .text-link:hover {text-decoration: underline; text-underline-offset: .3em; border-color: transparent}
.grill-theme :is(.menu-filters button,.video-filters button,.view-switch button) {min-height: var(--ds-control); min-width: var(--ds-control); padding: .65rem 1.25rem; font-size: .875rem; line-height: 1.5; border-radius: 99px; letter-spacing: 0; font-weight: 500}
.grill-theme .menu-filters button {border-color: var(--ds-control-border); background: transparent; color: var(--ds-text-secondary)}
.grill-theme .menu-filters button[aria-pressed="true"] {background: var(--ds-text); color: var(--ds-canvas); border-color: var(--ds-text); font-weight: 600}
.grill-theme .view-switch {padding: .25rem; border: 1px solid var(--ds-separator); border-radius: 99px; gap: .25rem; background: transparent}
.grill-theme .view-switch button {padding-inline: 1rem}
.grill-theme .view-switch button[aria-pressed="true"] {background: var(--ds-surface); color: var(--ds-text)}

/* Hero: legible editorial type and one unobstructed, real photograph. */
.grill-theme .hero,.grill-theme .hero.image-first {grid-template-columns: 1.05fr 1fr; gap: clamp(2rem, 5vw, 5rem); padding-block: 4.5rem 5rem; align-items: center}
.grill-theme .hero-copy {padding: 0; min-width: 0}
.grill-theme .hero h1 {font-size: var(--ds-text-hero); font-weight: 600; line-height: 1.06; margin: 1.75rem 0; letter-spacing: -.065em; text-transform: none}
.grill-theme .hero h1 .hero-lead {color: var(--ds-text)}
.grill-theme .hero h1 .hero-accent {color: var(--accent-text); font-style: normal}
.grill-theme .hero-copy>p {font-size: var(--ds-text-lead); line-height: 1.8; max-width: 43ch; color: var(--ds-text-secondary)}
.grill-theme .eyebrow {font-size: .6875rem; letter-spacing: .13em; line-height: 1.6; font-weight: 600}
.grill-theme .hero .eyebrow {gap: .75rem; color: var(--ds-text-secondary)}
.grill-theme .hero .eyebrow:before {content: ""; width: .5rem; height: .5rem; border-radius: 50%; background: var(--accent-text); flex: none}
.grill-theme .tiny-sun {display: none}
.grill-theme .hero-actions {gap: 1.75rem; margin-top: 2.25rem; flex-wrap: wrap}
.grill-theme .hero-actions .button {padding-inline: 1.5rem; border-radius: 99px; font-size: var(--ds-text-small)}
.grill-theme .hero-actions .text-link {font-size: var(--ds-text-small)}
.grill-theme .hero-note {font-size: var(--ds-text-caption); line-height: var(--ds-leading); margin-top: 2rem; padding-top: 1.25rem; border-top: 1px solid var(--ds-separator); max-width: 43ch; color: var(--ds-text-secondary)}
.grill-theme .note-line {display: none}
.grill-theme :is(.hero-hours,.business-status) {font-size: .875rem; line-height: 1.6}
.grill-theme .hero-visual {padding: 0; margin: 0; min-width: 0}
.grill-theme .hero-visual:before {content: none}
.grill-theme .hero-frame {height: 34rem; border-radius: var(--ds-radius-panel); background: var(--ds-surface); box-shadow: none}
.grill-theme .hero-frame>img {object-position: var(--hero-focus,center 62%); filter: none}
.grill-theme .hero-frame:after {inset: 50% 0 0; background: linear-gradient(transparent,#11180edb)}
.grill-theme .photo-caption {inset: auto 2rem 2rem; padding: 0; border: 0; background: transparent; border-radius: 0; display: flex; flex-direction: column; align-items: start; gap: .5rem; color: #fff}
.grill-theme .photo-caption>span:first-child,.grill-theme .photo-caption>span:first-child>span {font-size: .625rem; letter-spacing: .12em}
.grill-theme .photo-caption>span:last-child,.grill-theme .photo-caption>span:last-child>span {font-family: var(--heading-font),sans-serif; font-size: 1.625rem; font-style: normal; letter-spacing: -.025em}
.grill-theme .hero-sticker {right: 1.25rem; top: 1.25rem; left: auto; width: 6rem; height: 6rem; border-radius: 50%; transform: none; box-shadow: none; background: var(--ds-action); color: #fff}
.grill-theme .hero-sticker span {font-size: .5rem; letter-spacing: .06em}
.grill-theme .hero-sticker b {font: 600 .875rem var(--heading-font),sans-serif}
.grill-theme .hero.image-first .hero-sticker {left: 1.25rem; right: auto}
.grill-theme .hero-video-teaser {font-size: var(--ds-text-small); margin-top: 1.5rem}
.grill-theme .hero-video-teaser small {font-size: var(--ds-text-caption)}

/* Section rhythm and a calm, static brand ribbon. */
body.grill-theme[data-section-spacing] :is(.menu-section,.about-section,.gallery-section,.reels-section,.news-section,.reviews-section,.contact-section) {padding-block: var(--section-space, 80px)}
.grill-theme .statement {background: var(--ds-surface); color: var(--ds-text-secondary); border-block: 1px solid var(--ds-separator); padding-block: 1.25rem}
.grill-theme .statement-track {animation: none; gap: 2.75rem; width: 100%}
.grill-theme .statement-group {justify-content: space-between; width: 100%; min-width: max-content; gap: 2rem}
.grill-theme .statement-message {font: 500 .6875rem var(--site-font),sans-serif; letter-spacing: .12em}
.grill-theme .statement-separator {font-size: .75rem; color: var(--accent-text)}
.grill-theme .statement-duplicate,.grill-theme .statement-toggle {display: none}
.grill-theme .service-strip {margin-block: 0 2rem}
.grill-theme .service-strip ul {border-radius: var(--ds-radius-card)}
.grill-theme .service-strip :is(strong,small,.meal-card-badges span) {font-size: var(--ds-text-caption); line-height: 1.65}
.grill-theme .section-top {gap: 3rem; align-items: end}
.grill-theme .section-top>p {font-size: var(--ds-text-body); line-height: 1.8; flex-basis: 36%; max-width: 45ch; color: var(--ds-text-secondary)}
.grill-theme .section-eyebrow {margin-bottom: 1rem; color: var(--accent-text)}
.grill-theme :is(.about-heading h2,.gallery-copy h2) {font-size: var(--ds-text-section); line-height: 1.15}
.grill-theme :is(.about-section,.gallery-layout) {gap: 5rem}
.grill-theme .about-section {border-top: 1px solid var(--ds-separator)}
.grill-theme :is(.about-copy p,.gallery-copy p,.reels-intro,.reviews-intro>p,.news-info>p) {font-size: var(--ds-text-body); line-height: 1.8; color: var(--ds-text-secondary)}
.grill-theme .about-copy p {margin-block: 1.5rem}
.grill-theme .about-signature {font-family: var(--site-font),sans-serif; font-size: .75rem; font-style: normal; letter-spacing: .08em; border: 0; border-left: 2px solid var(--accent-text); padding: .25rem 0 .25rem 1rem; border-radius: 0}

/* Menu discovery and cards share the same tokens as every other surface. */
.grill-theme .menu-discovery {gap: 1.5rem; margin: 2.5rem 0 2rem; align-items: start}
.grill-theme .menu-search {background: transparent; border: 0; padding: 0}
.grill-theme .menu-search>label {font-size: var(--ds-text-small); margin-bottom: .75rem; letter-spacing: 0; font-weight: 500}
.grill-theme .menu-search-field {min-height: 3.5rem; border: 1px solid var(--ds-control-border); border-radius: var(--ds-radius-control); background: var(--ds-surface); padding-inline: 1rem; color: var(--ds-surface-text)}
.grill-theme .menu-search-field:focus-within {border-color: var(--ds-focus); box-shadow: 0 0 0 1px var(--ds-focus)}
.grill-theme .menu-search-field input {font-size: var(--ds-text-body); min-height: 3rem; height: auto; line-height: 1.5; padding-block: .75rem; color: var(--ds-surface-text)}
.grill-theme .menu-search-field button {min-width: var(--ds-control); font-size: var(--ds-text-caption)}
.grill-theme .menu-search>small {font-size: var(--ds-text-caption); line-height: 1.6; margin-top: .5rem; max-width: 56ch}
.grill-theme .toast-finder {border: 1px solid var(--ds-separator); border-radius: var(--ds-radius-card); background: var(--ds-surface); color: var(--ds-surface-text)}
.grill-theme .finder-toggle {padding: 1.5rem; min-height: 7rem; background: transparent; color: inherit; border-radius: inherit}
.grill-theme .finder-toggle strong {font: 600 1.5rem var(--heading-font),sans-serif; letter-spacing: -.04em; text-transform: none}
.grill-theme .finder-eyebrow {font-size: .625rem; letter-spacing: .1em; margin-bottom: .5rem; color: var(--card-accent)}
.grill-theme .finder-toggle>span:last-child {width: var(--ds-control); height: var(--ds-control); border-radius: 50%; border-color: var(--ds-control-border)}
.grill-theme #finder-panel {padding: 1.5rem}
.grill-theme .finder-intro,.grill-theme .finder-status {font-size: var(--ds-text-small); line-height: var(--ds-leading)}
.grill-theme .finder-fields {gap: 1rem}
.grill-theme .finder-fields>label {font-size: var(--ds-text-small)}
.grill-theme .finder-fields :is(input,select) {font-size: 1rem; min-height: var(--ds-control-primary); border-color: var(--ds-control-border); border-radius: var(--ds-radius-control); background: var(--ds-canvas); color: var(--ds-text)}
.grill-theme .finder-fields small,.grill-theme .finder-note {font-size: var(--ds-text-caption); line-height: 1.6}
.grill-theme .finder-card {border-radius: var(--ds-radius-card); background: var(--ds-canvas)}
.grill-theme .finder-card-body {padding: 1.5rem}
.grill-theme .finder-card h3 {font-size: var(--ds-text-title)}
.grill-theme .finder-card p,.grill-theme .finder-card-actions>a {font-size: var(--ds-text-small)}
.grill-theme .menu-filters {gap: .75rem; margin-bottom: 0; padding-block: .75rem; scrollbar-width: thin}
.grill-theme .menu-category-summary {padding-block: 1.5rem 2rem; gap: 1.5rem; flex-wrap: wrap; border: 0}
.grill-theme .menu-category-summary h3 {font-size: 1.25rem; text-transform: none; letter-spacing: -.025em; margin: 0; font-weight: 500}
.grill-theme .menu-toolbar {gap: 1rem; flex-wrap: wrap; min-width: 0}
.grill-theme .menu-toolbar>#menu-count {font-size: var(--ds-text-caption); color: var(--ds-text-secondary)}
.grill-theme .order-open {min-height: var(--ds-control); padding: .625rem 1rem; border-radius: 99px; font-size: .8125rem}
.grill-theme .menu-card {border: 1px solid var(--ds-separator); border-radius: var(--ds-radius-card); background: var(--ds-surface); box-shadow: none; transition: border-color var(--ds-duration) var(--ds-easing); color: var(--ds-surface-text)}
.grill-theme .menu-card:hover {transform: none}
.grill-theme .menu-card .menu-info,.grill-theme .menu-card.pending-photo .menu-info {padding: 1.75rem}
.grill-theme .menu-info h3,.grill-theme .menu-card.pending-photo .menu-info h3 {font-size: 1.375rem; line-height: 1.4; font-weight: 600; letter-spacing: -.035em; margin: 0 0 1rem; min-height: 0; text-wrap: pretty}
.grill-theme .menu-card .compact-category {font-size: .625rem; line-height: 1.6; letter-spacing: .12em; color: var(--card-accent); text-transform: uppercase; margin-bottom: 1.25rem}
.grill-theme .product-description {font-size: var(--ds-text-small); line-height: 1.7; color: var(--ds-surface-secondary); margin: 0 0 1.75rem}
.grill-theme .menu-image {background: var(--ds-canvas)}
.grill-theme .menu-label {background: var(--ds-canvas); color: var(--ds-text); border-radius: 99px; padding: .5rem .875rem; font-size: .6875rem}
.grill-theme .menu-bottom {border-top: 1px solid var(--ds-separator); padding-top: 1.25rem; gap: 1rem; flex-wrap: wrap; align-items: center}
.grill-theme .menu-price,.grill-theme .menu-card.pending-photo .menu-price {font: 600 1.5rem var(--heading-font),sans-serif; letter-spacing: -.04em; color: var(--ds-surface-text); font-variant-numeric: tabular-nums}
.grill-theme .order-add {border-radius: 99px; min-height: var(--ds-control); padding: .65rem 1rem; font-size: .8125rem}
.grill-theme .order-add[data-in-order="true"] {background: transparent; border-color: var(--card-accent); color: var(--card-accent)}
.grill-theme .menu-contact-links {width: 100%; padding-top: 0; justify-content: start}
.grill-theme .menu-whatsapp {border: 0; padding: .5rem 0; min-height: var(--ds-control); font-size: var(--ds-text-caption); color: var(--ds-surface-secondary); justify-content: start}
.grill-theme .menu-whatsapp:hover {color: var(--ds-surface-text); text-decoration: underline}
.grill-theme .product-badges>span {font-size: .6875rem; padding: .25rem .625rem; color: var(--card-accent); background: transparent; border-color: currentColor; border-radius: 99px}
.grill-theme .menu-no-results {border: 1px solid var(--ds-separator); border-radius: var(--ds-radius-card); padding: 2rem}
.grill-theme .menu-no-results h3 {font-size: 1.5rem}
.grill-theme .menu-no-results p {font-size: var(--ds-text-small)}

/* Media, reviews and contact are variations of the same surface. */
.grill-theme .gallery-section {background: var(--ds-surface); border-block: 1px solid var(--ds-separator)}
.grill-theme .gallery-copy {color: var(--ds-surface-text)}
.grill-theme .gallery-copy p {color: var(--ds-surface-secondary)}
.grill-theme .gallery-track,.grill-theme .slider-photo {border-radius: var(--ds-radius-panel)}
.grill-theme .slider-photo {border: 1px solid var(--ds-separator)}
.grill-theme .slider-arrow {width: var(--ds-control); height: var(--ds-control); border: 1px solid var(--ds-control-border); background: transparent; color: var(--ds-text); border-radius: 50%}
.grill-theme .slider-dots {gap: 0}
.grill-theme .slider-dots button,.grill-theme .slider-dots button[aria-pressed="true"] {width: var(--ds-control); height: var(--ds-control); background: transparent; flex-shrink: 0}
.grill-theme .slider-dots button:before {inset: 18px; background: var(--ds-text-secondary); border-radius: 50%}
.grill-theme .slider-dots button[aria-pressed="true"]:before {inset: 16px; background: var(--ds-text)}
.grill-theme :is(.slider-status,.slider-hint,.reels-note,.reel-cover-action,.reel-caption .text-link) {font-size: var(--ds-text-caption); line-height: 1.6}
.grill-theme :is(.reel-card,.news-card,.review-card,.reviews-trust) {border-radius: var(--ds-radius-card)}
.grill-theme :is(.reel-caption,.news-info,.review-card) {padding: 1.5rem}
.grill-theme .review-card {background: var(--ds-surface); color: var(--ds-surface-text); border-color: var(--ds-separator)}
.grill-theme .review-card :is(blockquote p,details>p,.review-owner-reply p) {font-size: var(--ds-text-small); line-height: 1.8}
.grill-theme .review-card summary {min-height: var(--ds-control); padding-block: .75rem; font-size: .875rem; cursor: pointer}
.grill-theme :is(.curated-review-note,.review-meta,.review-owner-reply,.selected-review-source,.reviews-trust small) {font-size: var(--ds-text-caption); line-height: 1.6}
.grill-theme .selected-reviews-heading {gap: 1rem; flex-wrap: wrap}
.grill-theme .selected-reviews-heading h3 {font-size: 1.5rem}
.grill-theme .selected-reviews-heading>span {font-size: var(--ds-text-small)}
.grill-theme .contact-grid {gap: 1.5rem; border: 0; margin-top: 2.5rem}
.grill-theme .contact-card {border: 1px solid var(--ds-separator); border-radius: var(--ds-radius-card); padding: 2rem; display: flex; background: var(--ds-surface); color: var(--ds-surface-text)}
.grill-theme .contact-card:last-child,.grill-theme .contact-card:nth-child(2) {border: 1px solid var(--ds-separator)}
.grill-theme .contact-icon {width: 3rem; height: 3rem; border: 1px solid var(--ds-separator); background: transparent; color: var(--card-accent); border-radius: 50%; margin: 0 0 2rem}
.grill-theme .contact-card>small {font-size: .625rem; line-height: 1.6; letter-spacing: .12em; color: var(--ds-surface-secondary)}
.grill-theme .contact-card h3 {font-size: var(--ds-text-title); line-height: 1.4; margin: .875rem 0; letter-spacing: -.025em}
.grill-theme .contact-card p {font-size: var(--ds-text-small); line-height: 1.7; margin-bottom: 1.5rem; color: var(--ds-surface-secondary)}
.grill-theme .contact-card .button {min-height: 3rem; padding: .75rem 1rem; border-radius: 99px; border-color: var(--ds-control-border); color: var(--ds-surface-text); background: transparent; font-size: .875rem}
.grill-theme .hours {font-size: var(--ds-text-small); line-height: 1.6; margin-top: 1.5rem}
.grill-theme footer {padding-block: 2.5rem; border-top: 1px solid var(--ds-separator); background: var(--ds-canvas); color: var(--ds-text)}
.grill-theme .footer-inner {gap: 1.5rem; flex-wrap: wrap}
.grill-theme .footer-name {font-size: 1rem; line-height: 1.4; letter-spacing: -.025em}
.grill-theme .footer-logo {width: 3rem; height: 3rem}
.grill-theme .footer-inner>span {font: 400 var(--ds-text-small) var(--site-font),sans-serif; color: var(--ds-text-secondary)}
.grill-theme .footer-inner>a:last-child,.grill-theme .footer-policy a {min-height: var(--ds-control); display: inline-flex; align-items: center; font-size: var(--ds-text-caption)}
.grill-theme .footer-policy {align-items: center; flex-wrap: wrap; gap: .75rem; color: var(--ds-text-secondary)}
.grill-theme .whatsapp-float {background: var(--ds-surface); color: var(--ds-text); border: 1px solid var(--ds-control-border); border-radius: 99px; font-size: var(--ds-text-caption); min-height: var(--ds-control-primary); box-shadow: 0 .25rem 1rem #0002}

/* Native dialogs keep focus containment, Escape and return-focus behavior. */
.grill-theme dialog {border-radius: var(--ds-radius-panel); background: var(--ds-surface); color: var(--ds-surface-text)}
.grill-theme dialog::backdrop {background: #080d09b8; backdrop-filter: blur(6px)}
.grill-theme .lightbox button {width: var(--ds-control); height: var(--ds-control)}
.grill-theme .lightbox figcaption,.grill-theme .photo-counter {font-size: var(--ds-text-caption)}
.grill-theme dialog.order-dialog {border: 1px solid var(--ds-separator); border-radius: var(--ds-radius-panel); max-height: calc(100dvh - 2rem); color-scheme: dark}
.grill-theme .order-panel {padding: 2rem}
.grill-theme .order-heading h2 {font-size: 2rem}
.grill-theme :is(.order-total strong,.order-line-total) {font-family: var(--heading-font),var(--site-font),sans-serif; font-variant-numeric: tabular-nums; letter-spacing: -.035em}
.grill-theme .order-line h3 {font-size: 1.125rem; line-height: 1.4; letter-spacing: -.025em}
.grill-theme .order-description {font-size: var(--ds-text-body); line-height: var(--ds-leading)}
.grill-theme :is(.order-eyebrow,.order-note-hint,.order-price-note,.order-send-hint,.order-confirmation,.order-line-description span,.order-remove,.order-clear) {font-size: var(--ds-text-caption); line-height: 1.6}
.grill-theme :is(.order-close,.order-quantity button,.order-remove,.order-clear) {min-width: var(--ds-control); min-height: var(--ds-control)}
.grill-theme .order-close {color: var(--ds-surface-text)}
.grill-theme .order-note-label {font-size: var(--ds-text-small)}
.grill-theme :is(.order-note,.order-quantity input) {font-size: var(--ds-text-body); border-color: var(--ds-control-border); border-radius: var(--ds-radius-control); background: var(--ds-canvas); color: var(--ds-text)}
.grill-theme .order-quantity {border-color: var(--ds-control-border); border-radius: var(--ds-radius-control)}
.grill-theme .order-quantity input {border-radius: 0}
.grill-theme .order-dock {border-radius: 99px}
.grill-theme .toast {background: var(--ds-text); color: var(--ds-canvas); font-size: var(--ds-text-small); border-radius: var(--ds-radius-control)}

@media (hover: hover) and (pointer: fine) {
  .grill-theme :is(.button-orange,.order-add,.finder-submit,.order-send):hover {filter: none; background: color-mix(in srgb,var(--ds-action) 86%,#000); border-color: color-mix(in srgb,var(--ds-action) 86%,#000)}
  .grill-theme .menu-card:hover {border-color: var(--ds-control-border)}
  .grill-theme :is(.header-call,.order-open,.slider-arrow,.finder-reset):hover {background: var(--ds-surface); border-color: var(--ds-text-secondary)}
}
@media (max-width: 1100px) {
  .grill-theme .site-header nav {gap: 1rem}
  .grill-theme .hero,.grill-theme .hero.image-first {gap: 2.5rem}
  .grill-theme .hero h1 {font-size: clamp(3.5rem,7vw,5.5rem)}
  .grill-theme :is(.about-section,.gallery-layout) {gap: 3rem}
  .grill-theme .menu-card .menu-info,.grill-theme .menu-card.pending-photo .menu-info {padding: 1.5rem}
}
@media (max-width: 960px) {
  :root {--ds-header-height: 4.5rem}
  .grill-theme .header-inner {gap: 1rem}
  .grill-theme .site-header nav {display: none; order: 4; flex-basis: 100%; flex-wrap: wrap; padding: .5rem 0; gap: .5rem 1.5rem; border-top: 1px solid var(--ds-separator)}
  .grill-theme .site-header nav .nav-optional {display: inline-flex}
  .grill-theme .mobile-menu-toggle {display: inline-flex; justify-content: center; align-items: center; min-width: var(--ds-control); min-height: var(--ds-control); padding: .5rem; margin-left: auto; border: 1px solid var(--ds-control-border); border-radius: 50%; background: transparent; color: var(--ds-text); cursor: pointer}
  .grill-theme .mobile-menu-toggle[aria-expanded="true"] {background: var(--ds-surface)}
  .grill-theme .site-header:has(.mobile-menu-toggle[aria-expanded="true"]) nav {display: flex}
  .grill-theme .hero,.grill-theme .hero.image-first {grid-template-columns: minmax(0,1fr); gap: 2.5rem; padding-block: 3rem 4rem}
  .grill-theme .hero h1 {font-size: clamp(3.5rem,9vw,5.5rem); max-width: 13ch}
  .grill-theme .hero-copy>p {max-width: 55ch}
  .grill-theme .hero-frame {height: 30rem}
}
@media (max-width: 800px) {
  .grill-theme .section-top {align-items: start; gap: 1.5rem}
  .grill-theme :is(.about-section,.gallery-layout) {gap: 2rem}
  .grill-theme .contact-card {padding: 1.5rem}
}
@media (max-width: 560px) {
  :root {--ds-gutter: 1.25rem; --ds-header-height: 4.5rem}
  .grill-theme {padding-bottom: calc(5.25rem + env(safe-area-inset-bottom))}
  .grill-theme .brand-logo {width: 2.75rem; height: 2.75rem}
  .grill-theme .logo-words {font-size: .8125rem; letter-spacing: -.025em}
  .grill-theme .logo-words small {font-size: .5625rem; letter-spacing: .08em}
  .grill-theme .wordmark {gap: .625rem; flex: 1}
  .grill-theme .header-inner {gap: .5rem; padding-block: .75rem}
  .grill-theme .header-call {padding: .625rem; width: var(--ds-control); border: 0; margin-left: 0}
  .grill-theme .header-call [data-call-label] {display: none}
  .grill-theme .header-call svg {width: 1.125rem}
  .grill-theme .hero,.grill-theme .hero.image-first {gap: 2rem; padding-block: 2.5rem 3rem}
  .grill-theme .hero h1 {font-size: clamp(3.125rem,13vw,4.5rem); line-height: 1.08; letter-spacing: -.06em; margin: 1.5rem 0}
  .grill-theme .hero .eyebrow {font-size: .625rem; letter-spacing: .09em}
  .grill-theme .hero-copy>p {font-size: var(--ds-text-body); line-height: 1.8; max-width: 45ch}
  .grill-theme .hero-actions {gap: 1.5rem; margin-top: 1.75rem}
  .grill-theme .hero-note {margin-top: 1.5rem; font-size: var(--ds-text-caption)}
  .grill-theme .hero-visual {margin: 0; padding: 0}
  .grill-theme .hero-frame {height: 23rem; border-radius: var(--ds-radius-card)}
  .grill-theme .photo-caption {inset: auto 1.5rem 1.5rem}
  .grill-theme .photo-caption>span:last-child,.grill-theme .photo-caption>span:last-child>span {font-size: 1.375rem}
  body.grill-theme[data-section-spacing] :is(.menu-section,.about-section,.gallery-section,.reels-section,.news-section,.reviews-section,.contact-section) {padding-block: min(var(--section-space,72px),3.5rem)}
  .grill-theme .section-top {flex-direction: column; gap: 1.25rem}
  .grill-theme .section-top>p {flex-basis: auto; font-size: var(--ds-text-small)}
  .grill-theme .menu-section>.section-top {margin-bottom: 0}
  .grill-theme .menu-discovery {grid-template-columns: minmax(0,1fr); gap: 1.5rem; margin-block: 2rem 1rem}
  .grill-theme .finder-toggle {min-height: 6rem; padding: 1.25rem}
  .grill-theme #finder-panel {padding: 1.25rem}
  .grill-theme .finder-fields {grid-template-columns: minmax(0,1fr)}
  .grill-theme .menu-filters {position: static; gap: .5rem; padding-block: 1rem; border: 0; flex-wrap: nowrap; overflow: auto; max-width: 100%}
  .grill-theme .menu-filters button {white-space: nowrap; flex: none; padding-inline: 1.125rem}
  .grill-theme .menu-category-summary {align-items: start; gap: 1rem; padding-block: 1rem 1.5rem}
  .grill-theme .menu-toolbar {width: 100%; gap: .5rem; justify-content: space-between}
  .grill-theme .menu-toolbar #menu-view-switch {display: none}
  .grill-theme .menu-card .menu-info,.grill-theme .menu-card.pending-photo .menu-info {padding: 1.5rem}
  .grill-theme .menu-info h3,.grill-theme .menu-card.pending-photo .menu-info h3 {font-size: 1.375rem}
  .grill-theme .menu-card .compact-category {margin-bottom: 1rem}
  .grill-theme .product-description {font-size: var(--ds-text-small)}
  .grill-theme .menu-bottom {gap: 1rem}
  .grill-theme .gallery-layout {gap: 2.5rem}
  .grill-theme .slider-controls {gap: .5rem; flex-wrap: wrap}
  .grill-theme .slider-dots {max-width: 48%}
  .grill-theme .contact-grid {gap: 1rem; margin-top: 2rem}
  .grill-theme .contact-card,.grill-theme .contact-card.contact-social {grid-column: auto; padding: 1.5rem}
  .grill-theme .contact-icon {margin-bottom: 1.5rem}
  .grill-theme .contact-card h3 {font-size: 1.375rem}
  .grill-theme .footer-inner {align-items: start}
  .grill-theme .footer-name {font-size: .875rem; max-width: 100%}
  .grill-theme .footer-inner>span {font-size: var(--ds-text-small)}
  .grill-theme .mobile-actions {padding: .5rem .75rem calc(.5rem + env(safe-area-inset-bottom)); gap: .375rem; background: color-mix(in srgb,var(--ds-canvas) 96%,transparent); border-top: 1px solid var(--ds-separator); backdrop-filter: blur(18px)}
  .grill-theme .mobile-actions a {display: flex; flex-direction: column; gap: .25rem; min-height: 3.5rem; border: 1px solid transparent; border-radius: var(--ds-radius-control); font-size: .625rem; font-weight: 500; background: transparent; color: var(--ds-text-secondary); padding: .5rem .25rem; white-space: normal; text-align: center}
  .grill-theme .mobile-actions svg {width: 1.125rem; height: 1.125rem}
  .grill-theme .mobile-actions a:first-child {background: var(--ds-surface); color: var(--ds-text)}
  .grill-theme .mobile-actions .mobile-whatsapp {color: var(--ds-text)}
  .grill-theme .order-dock {right: 1rem; bottom: calc(5.25rem + env(safe-area-inset-bottom)); max-width: calc(100% - 2rem); padding: .75rem 1.25rem; min-height: 3.75rem}
  .grill-theme dialog.order-dialog {width: calc(100% - 1.5rem); max-height: calc(100dvh - 1.5rem); border-radius: var(--ds-radius-card)}
  .grill-theme .order-panel {padding: 1.25rem}
  .grill-theme .order-heading h2 {font-size: 1.75rem}
  .grill-theme .order-line {gap: 1rem}
  .grill-theme .order-line h3 {font-size: 1rem}
}
/* Editor overrides remain authoritative at every breakpoint. */
@media (min-width: 561px) {
  body.grill-theme[data-hero-size="custom"] .hero-frame {height: var(--hero-height)}
}
@media (max-width: 560px) {
  body.grill-theme[data-mobile-hero-size="custom"] .hero-frame {height: var(--mobile-hero-height)}
}
@media (prefers-reduced-motion: reduce) {
  html:has(.grill-theme) {scroll-behavior: auto}
  .grill-theme *, .grill-theme *:before, .grill-theme *:after {animation: none !important; transition: none !important; scroll-behavior: auto !important}
}
@media (forced-colors: active) {
  .grill-theme :is(button,.button,input,select,textarea) {border: 1px solid ButtonText}
  .grill-theme :is(button,a,input,select,textarea):focus-visible {outline-color: Highlight}
  .grill-theme [aria-pressed="true"] {outline: 2px solid Highlight; outline-offset: -3px}
}