/* Bob’s daytime / after-dark rhythm. The approved first hero is untouched. */
:root {
  --porcelain: #f7f8fc;
  --paper: #ffffff;
  --ink: #171a32;
  --ink-muted: #535970;
  --day-violet: #6042b5;
  --day-teal: #176b73;
}
.surface-light {
  --white: var(--ink);
  --muted: var(--ink-muted);
  --line: #1a234122;
  --lavender: var(--day-violet);
  --cyan: var(--day-teal);
  color: var(--ink);
  color-scheme: light;
  background: var(--porcelain);
  border-color: var(--line);
}
.surface-light::selection { background: #d9d2fa; color: var(--ink); }
.surface-light .eyebrow { color: #454c65; }
.surface-light .section-number { color: var(--day-violet); }
.surface-light .outline-text { -webkit-text-stroke-color: #363d62; }
.surface-light .text-shimmer {
  color: var(--day-violet);
  background: none;
  -webkit-text-fill-color: currentColor;
}
.surface-light .text-link { border-bottom-color: #333a6650; }
.surface-light .text-link:hover { color: var(--day-violet); }
.surface-light .button-light { color: #fff; background: var(--ink); }
.surface-light .button-light:hover { background: var(--day-violet); }
.surface-light .button-ghost { color: var(--ink); border-color: #343c6a55; background: transparent; }
.surface-light .button-ghost:hover { background: #e9e5f7; }
.surface-light :focus-visible { outline-color: #6547be; }

/* Daylight food photography: generous landscape frames and an orderly ribbon. */
.flavors.surface-light {
  padding-top: 110px;
  padding-bottom: 75px;
  background:
    radial-gradient(ellipse at 96% 5%, #e3ddf9 0, transparent 44%),
    radial-gradient(ellipse at 0 96%, #e3f1f1 0, transparent 45%),
    #f9fafd;
}
.flavors .section-top { align-items: flex-end; }
.flavors .section-aside { max-width: 245px; }
.flavors .section-aside > p { font-size: 13px; }
.flavors .round, .flavors .carousel-pause {
  min-width: 44px;
  min-height: 44px;
  border-color: #252e6240;
  background: #ffffff8a;
}
.flavors .carousel-pause { min-width: 104px; }
.flavors .round:hover { color: #fff; background: var(--ink); }
.flavors .ribbon-shell { margin-top: 40px; padding: 0 0 15px; }
.flavors .ribbon-halo { display: none; }
.flavors .ribbon-window { padding: 15px 0 32px; }
.flavors .ribbon-track, .flavors .ribbon-group { gap: 26px; }
.flavors .food-card,
.flavors .food-card:nth-child(n) {
  width: clamp(310px, 32vw, 480px);
  max-width: none;
  transform: none;
}
.flavors .food-card:hover,
.flavors .food-card:focus-visible { transform: translateY(-5px); }
.flavors .food-image {
  aspect-ratio: 1672 / 941;
  border-radius: 18px;
  background: #eeedf3;
  border: 1px solid #26315715;
  box-shadow: 0 12px 28px #24325412;
}
.flavors .food-image img { object-position: var(--photo-focal, 50% 50%); }
.flavors .food-card:hover img { transform: scale(1.025); }
.flavors .food-arrow { background: #fff; color: var(--ink); }
.flavors .food-card:hover .food-arrow { background: #e7dfff; }
.flavors .food-caption { padding: 19px 2px 0; }
.flavors .food-caption h3 { font-size: 17px; letter-spacing: -.03em; }
.flavors .food-caption p { font-size: 11px; color: #61677b; }
.flavors .carousel-footer p { font-size: 10px; color: #535970; }

/* A calm, dark editorial interlude separates the two light photographic acts. */
.manifesto {
  margin-top: 0;
  padding-top: 135px;
  padding-bottom: 145px;
  background:
    radial-gradient(ellipse at 88% 8%, #48377368, transparent 55%),
    radial-gradient(ellipse at 0 100%, #20556257, transparent 56%),
    #14162f;
}
.manifesto h2 { line-height: 1.17; }
.manifesto-bottom p { font-size: 14px; color: #caccdf; }
.manifesto-bottom { margin-top: 55px; }

/* Bright gallery, dark ink, and the same autonomous upright spiral. */
.helix-section.surface-light {
  background:
    radial-gradient(ellipse at 75% 46%, #e6e3f7, transparent 58%),
    radial-gradient(ellipse at 0 10%, #eaf4f3, transparent 45%),
    #f7f8fc;
}
.helix-section.surface-light .helix-copy h2 { color: var(--ink); }
.helix-section.surface-light .helix-description { font-size: 13px; color: #535970; }
.helix-section.surface-light .helix-photo-note { font-size: 10px; color: #60667a; }
.helix-section.surface-light .helix-card {
  border-color: #262e4924;
  background: #e4e5ed;
  box-shadow: 0 10px 24px #23244313;
}
.helix-section.surface-light .helix-card img { object-position: var(--photo-focal, 50% 50%); }
.helix-section.surface-light .helix-caption { color: #fff; }
.helix-section.surface-light .helix-actions .text-link { min-height: 44px; }
.has-motion .helix-section.surface-light:not(.is-grid) .helix-card { box-shadow: none; }
.has-motion .helix-section.surface-light:not(.is-grid) .helix-card:focus-visible {
  box-shadow: 0 16px 55px #33335a40, 0 0 0 3px #6042b5;
}

/* The menu stays in the evening palette; ordering comes back into the light. */
.menu-section {
  background:
    radial-gradient(ellipse at 4% 22%, #40356675, transparent 58%),
    radial-gradient(ellipse at 100% 93%, #1d506056, transparent 60%),
    #11152e;
}
.menu-intro-bottom > p { font-size: 13px; }
.visit.surface-light {
  padding-top: 105px;
  padding-bottom: 105px;
  background:
    radial-gradient(ellipse at 4% 0, #e8e3f7, transparent 48%),
    radial-gradient(ellipse at 100% 100%, #e0f0ef, transparent 46%),
    #fafbfe;
}
.visit.surface-light .visit-panel {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  overflow: visible;
  grid-template-columns: 1fr 1.22fr;
  gap: 6vw;
}
.visit.surface-light .visit-glow { display: none; }
.visit.surface-light .visit-copy h2 { font-size: clamp(56px, 5.8vw, 89px); line-height: 1.16; }
.visit.surface-light .visit-lead { color: #535970; font-size: 14px; }
.visit.surface-light .visit-image { border-color: #26314b24; box-shadow: 0 20px 55px #27315117; }
.visit.surface-light .visit-image > span { color: #fff; background: var(--ink); }
.visit.surface-light .visit-address { padding-top: 27px; }
.visit.surface-light .visit-address > p { font-size: 17px; }
.visit.surface-light .visit-address > a { border-color: #303b6a2d; min-height: 44px; }
.visit.surface-light .visit-address > small { color: #62677a; font-size: 11px; }
.footer { background: #11142c; padding-top: 35px; }

/* Scroll scrubbing is driven by current position, in both directions. */
[data-scrub-title] { position: relative; }
.scrub-visual { display: block; }
.scrub-word { display: inline-block; vertical-align: baseline; }
.scrub-word-inner { display: inline-block; transform-origin: 50% 80%; }
.has-motion .scrub-word-inner { will-change: transform, opacity; }
.has-motion .reveal { will-change: transform, opacity; }
.reveal:focus-within { filter: none !important; }
.scene-outside .scrub-word-inner, .scene-outside .reveal { will-change: auto; }
html:not(.has-motion) .scrub-word-inner,
html:not(.has-motion) .reveal {
  opacity: 1 !important;
  transform: none !important;
  filter: none !important;
  will-change: auto;
}

@media (min-width: 1700px) {
  .flavors .food-card, .flavors .food-card:nth-child(n) { width: 500px; }
}
@media (max-width: 1150px) {
  .flavors .food-card, .flavors .food-card:nth-child(n) { width: 38vw; }
  .visit.surface-light .visit-panel { gap: 4vw; grid-template-columns: 1fr 1.12fr; }
}
@media (max-width: 900px) {
  .visit.surface-light .visit-copy h2 { font-size: 6.1vw; }
  .visit.surface-light .visit-lead { font-size: 13px; }
  .visit.surface-light .visit-address > p { font-size: 15px; }
}
@media (max-width: 700px) {
  .flavors.surface-light { padding-top: 72px; padding-bottom: 48px; }
  .flavors .section-top { display: block; }
  .flavors .section-aside { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 27px; max-width: none; }
  .flavors .section-aside > p { font-size: 11px; margin: 0; }
  .flavors .carousel-controls { gap: 6px; }
  .flavors .round { width: 44px; height: 44px; }
  .flavors .carousel-pause { min-width: 83px; height: 44px; padding: 0 10px; }
  .flavors .ribbon-shell { margin-top: 22px; }
  .flavors .ribbon-track, .flavors .ribbon-group { gap: 18px; }
  .flavors .food-card, .flavors .food-card:nth-child(n) { width: 84vw; }
  .flavors .food-image { border-radius: 15px; }
  .flavors .food-caption h3 { font-size: 16px; }
  .flavors .food-caption p { font-size: 11px; }
  .flavors .carousel-footer { align-items: flex-start; gap: 22px; }
  .flavors .carousel-footer p { font-size: 10px; }
  .manifesto { padding-top: 80px; padding-bottom: 90px; }
  .manifesto h2 { line-height: 1.19; }
  .manifesto-bottom { margin-top: 33px; }
  .manifesto-bottom p { font-size: 13px; }
  .helix-section.surface-light .helix-description,
  .has-motion .helix-section.surface-light:not(.is-grid) .helix-description { font-size: 12px; }
  .helix-section.surface-light .helix-photo-note,
  .has-motion .helix-section.surface-light:not(.is-grid) .helix-photo-note { font-size: 10px; }
  .menu-intro-bottom > p { font-size: 12px; }
  .visit.surface-light { padding-top: 75px; padding-bottom: 75px; }
  .visit.surface-light .visit-panel { display: block; padding: 0; }
  .visit.surface-light .visit-copy h2 { font-size: 12.6vw; }
  .visit.surface-light .visit-details { margin-top: 42px; }
  .visit.surface-light .visit-lead { font-size: 14px; }
  .visit.surface-light .visit-buttons { gap: 12px; }
  .visit.surface-light .visit-buttons .button { min-height: 48px; font-size: 11px; }
  .visit.surface-light .visit-address > p { font-size: 17px; }
  .visit.surface-light .visit-address > a { font-size: 13px; }
  .footer { padding-top: 28px; }
}
@media (max-width: 359px) {
  .flavors .section-aside { display: block; }
  .flavors .carousel-controls { margin-top: 20px; }
  .flavors .section-aside > p br { display: none; }
  .flavors .carousel-footer { display: block; }
  .flavors .carousel-footer .text-link { margin-top: 14px; }
  .visit.surface-light .visit-buttons .button { font-size: 10px; padding: 12px 15px; }
}
@media (prefers-reduced-motion: reduce) {
  .scrub-word-inner, .reveal { opacity: 1 !important; transform: none !important; filter: none !important; will-change: auto; }
  .flavors .food-card:hover, .flavors .food-card:focus-visible { transform: none; }
}

/* Responsive derivatives preserve the full edited artwork wherever cropping harms the subject. */
.food-image > picture, .helix-card > picture, .visit-image > picture { display:block; width:100%; height:100%; }
.flavors .food-image img { object-fit:contain; }
.helix-section.surface-light .helix-card[data-photo-fit="contain"] { background:#f2f0f4; }
.helix-section.surface-light .helix-card[data-photo-fit="contain"] img { object-fit:contain; }
