:root {
  --c-accent: #df742a;
  --c-accent-strong: #c85d18;
  --c-accent-soft: #f4b878;
  --c-cream: #fff4df;
  --c-paper: #fffdf8;
  --c-paper-warm: #fff7eb;
  --c-text: #402c20;
  --c-muted: #776255;
  --c-dark: #38251a;
  --c-dark-2: #543524;
  --c-line: rgba(210, 103, 35, .24);
  --c-shadow: rgba(126, 66, 31, .17);
}

html {
  max-width: 100%;
  overflow-x: clip;
}

body {
  max-width: 100%;
  overflow-x: clip;
  background: var(--c-cream);
  color: var(--c-text);
}

.site-header.is-scrolled {
  background: rgba(255, 249, 239, .94);
  border-bottom: 1px solid var(--c-line);
  box-shadow: 0 10px 30px rgba(91, 50, 26, .12);
}

.site-header.is-scrolled .brand-main,
.site-header.is-scrolled .brand-sub,
.site-header.is-scrolled .desktop-nav a {
  color: var(--c-text);
}

.site-header .takeout-nav-link,
.primary-button,
.overlay-takeout-link,
.arrow-link,
.map-link,
.back-to-top,
.takeout-callout a {
  background: var(--c-accent);
  border-color: var(--c-accent);
  color: #fffdf8;
}

.overlay-panel,
.commitment-section,
footer {
  background: linear-gradient(145deg, var(--c-dark), var(--c-dark-2));
}

.welcome,
.order-section {
  background: var(--c-cream);
  color: var(--c-text);
}

.menu-section,
.recruit-section {
  background: linear-gradient(180deg, var(--c-paper), var(--c-paper-warm));
  color: var(--c-text);
}

.access-section {
  background: var(--c-dark);
}

.access-visual {
  background: linear-gradient(145deg, #ef8a42, #d66a24);
}

.section-kicker,
.eyebrow,
.side-title,
.menu-size-heading,
.house-price,
.order-number,
.access-map-caption,
.footer-brand,
.section-intro small,
.menu-title-block > strong,
.opening,
.takeout-section-heading > p,
.takeout-detail-card > p,
.takeout-ready > p {
  color: var(--c-accent);
}

.menu-section article,
.order-grid article,
.opening,
.recruit-team-card,
.takeout-flow-grid article,
.takeout-detail-card {
  background: color-mix(in srgb, var(--c-paper) 93%, var(--c-accent-soft));
  border-color: var(--c-line);
  box-shadow: 0 14px 34px var(--c-shadow);
}

.menu-category-grid article,
.menu-extras,
.takeout-callout,
.craft-list li,
.job-types,
.job-types span + span {
  border-color: var(--c-line);
}

.welcome-copy p,
.section-intro > p,
.menu-title-block > p,
.recruit-copy > p,
.takeout-status p,
.takeout-flow-grid p,
.takeout-detail-card dd,
.takeout-detail-card li {
  color: var(--c-muted);
}

.welcome-heading em,
.menu-title-block em,
.large-copy em,
.recruit-heading em,
.recruit-heading h2 span,
.job-types span,
.takeout-status-label span,
.takeout-detail-card dt,
.takeout-menu-copy > span {
  color: var(--c-accent);
}

.access-map-image {
  border-color: rgba(255, 255, 255, .38);
  box-shadow: 22px 25px rgba(112, 51, 20, .22);
}

.hero {
  background: #25140d;
}

.hero-video {
  display: block !important;
  object-fit: contain;
  object-position: center center;
  background: #25140d;
  filter: saturate(1.03) contrast(1.02);
}

.hero-shade {
  background:
    linear-gradient(90deg, rgba(24, 12, 7, .88) 0%, rgba(24, 12, 7, .5) 25%, rgba(24, 12, 7, .04) 50%, rgba(24, 12, 7, .42) 78%, rgba(24, 12, 7, .78) 100%),
    linear-gradient(0deg, rgba(18, 8, 4, .72) 0%, transparent 38%, rgba(18, 8, 4, .22) 100%);
}

.hero-copy > * {
  opacity: 0;
  filter: blur(7px);
  transform: translateY(18px);
}

.hero-copy.is-visible > * {
  animation: hero-copy-reveal 1.65s cubic-bezier(.22, 1, .36, 1) forwards;
}

.hero-copy.is-visible .eyebrow { animation-delay: 0s; }
.hero-copy.is-visible h1 { animation-delay: 1.1s; }
.hero-copy.is-visible .hero-lead { animation-delay: 2.4s; }
.hero-copy.is-visible .hero-actions { animation-delay: 3.7s; }

.hero-stamp,
.scroll-cue {
  opacity: 0;
  transition: opacity 1.5s ease 3.7s;
}

.hero.hero-ready .hero-stamp,
.hero.hero-ready .scroll-cue {
  opacity: 1;
}

.takeout-page,
.takeout-status,
.takeout-flow,
.takeout-details {
  background: var(--c-cream);
}

.takeout-menu {
  background: var(--c-dark);
}

.takeout-ready {
  background: radial-gradient(circle at 50% 0, rgba(223, 116, 42, .24), transparent 38%), var(--c-dark-2);
}

@media (max-width: 600px) {
  .hero {
    min-height: 0;
    aspect-ratio: 720 / 1018;
  }

  .hero-video {
    object-fit: contain;
    object-position: center center;
  }

  .hero-shade {
    background:
      linear-gradient(0deg, rgba(16, 7, 3, .88) 0%, rgba(16, 7, 3, .15) 50%, rgba(16, 7, 3, .25) 100%),
      linear-gradient(90deg, rgba(16, 7, 3, .2), transparent 45%, rgba(16, 7, 3, .2));
  }

  .hero-copy {
    padding-bottom: 76px;
  }

  .hero h1 {
    font-size: clamp(1.75rem, 9.4vw, 2.55rem);
  }

  .hero-lead {
    font-size: .76rem;
    line-height: 1.72;
  }

  .hero-actions {
    gap: 12px;
    margin-top: 19px;
  }

  .primary-button {
    padding: 14px 17px;
  }
}

@media (prefers-reduced-motion: reduce) {
  /* The TOP film is essential content. Keep it visible even when the base
     stylesheet disables decorative motion for this device preference. */
  .hero-video {
    display: block !important;
  }

  .hero-copy.is-visible > * {
    animation-duration: .01ms;
    animation-delay: 0s;
  }
}
