#restaurant-page { overflow: clip; }
#restaurant-page .section { scroll-margin-top: 2rem; }
#restaurant-page .eyebrow { color: var(--color-deep-eucalyptus); }
#restaurant-page .surface--dark .eyebrow { color: var(--color-golden-mustard); }

.restaurant-hero { padding: var(--space-8) 0 var(--space-9); }
.restaurant-hero__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 1fr) minmax(0, 6fr); align-items: center; gap: var(--space-5); }
.restaurant-hero__copy { grid-column: 1 / 2; min-width: 0; max-width: 35rem; }
.restaurant-hero__copy .lead { max-width: 34rem; }
.restaurant-hero__actions { margin-bottom: var(--space-5); }
.restaurant-hero__meta { margin: 0; padding: var(--space-3) var(--space-4); border: var(--border-subtle); max-width: 35rem; font-size: var(--text-utility); line-height: var(--line-utility); }
.restaurant-hero__media { grid-column: 3 / 4; width: 100%; height: 35rem; margin: 0; }
.restaurant-hero__media img { object-position: 66% center; }

.restaurant-atmosphere__intro { width: min(100%, 42rem); margin-bottom: var(--space-7); }
.restaurant-atmosphere__cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); }
.restaurant-atmosphere__card { position: relative; min-width: 0; display: flex; flex-direction: column; gap: var(--space-3); }
.restaurant-atmosphere__card > * { min-width: 0; }
.restaurant-atmosphere__card h3, .restaurant-atmosphere__card p { margin: 0; }
.restaurant-atmosphere__card p { max-width: 34ch; }
.restaurant-atmosphere__card--blue { border-top: 3px solid var(--color-ocean-blue); }
.restaurant-atmosphere__card--sand { background: var(--color-pale-sand); }
.restaurant-corner-mark { color: var(--color-muted-coral); font-size: 1.25rem; line-height: 1; }

.restaurant-transition__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--space-7); align-items: start; }
.restaurant-transition__copy { min-width: 0; max-width: 35rem; padding-top: var(--space-5); }
.restaurant-transition__copy .status-label { margin-bottom: var(--space-4); }
.restaurant-transition__copy .lead { max-width: 56ch; }
.restaurant-transition__experience { min-width: 0; display: flex; flex-direction: column; gap: var(--space-5); }
.restaurant-transition__media { width: 100%; height: auto; aspect-ratio: 16 / 9; margin: 0; }
.restaurant-transition__media img { object-position: center; }
.restaurant-transition__steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-3); }
.restaurant-step { min-width: 0; display: flex; flex-direction: column; gap: var(--space-3); padding: var(--space-4); }
.restaurant-step > * { min-width: 0; }
.restaurant-step h3, .restaurant-step p { margin: 0; }
.restaurant-step p { max-width: 38ch; font-size: var(--text-utility); }
.restaurant-step__number { color: var(--color-deep-eucalyptus); font-family: var(--font-heading); font-size: 1.4rem; font-weight: var(--weight-bold); }

.restaurant-celebrate__top { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 1fr) minmax(0, 6fr); gap: var(--space-5); align-items: center; }
.restaurant-celebrate__copy { grid-column: 1 / 2; min-width: 0; max-width: 37rem; }
.restaurant-celebrate__copy .status-label { margin-bottom: var(--space-4); }
.restaurant-celebrate__copy .lead { max-width: 60ch; }
.restaurant-celebrate__media { grid-column: 3 / 4; width: 100%; aspect-ratio: 4 / 3; margin: 0; }
.restaurant-celebrate__media img { object-position: center; }
.restaurant-celebrate__blocks { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-5); margin-top: var(--space-7); }
.restaurant-celebrate__block { min-width: 0; display: flex; flex-direction: column; gap: var(--space-3); }
.restaurant-celebrate__block > * { min-width: 0; }
.restaurant-celebrate__block h3, .restaurant-celebrate__block p { margin: 0; }
.restaurant-celebrate__block p { max-width: 42ch; }
.restaurant-celebrate__block--sand { background: var(--color-pale-sand); }

.restaurant-private { position: relative; }
.restaurant-private__grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 1fr) minmax(0, 4fr); gap: var(--space-5); align-items: start; }
.restaurant-private__copy { grid-column: 1 / 2; min-width: 0; max-width: 42rem; }
.restaurant-private__copy .lead { max-width: 62ch; }
.restaurant-private__rail { grid-column: 3 / 4; min-width: 0; display: flex; flex-direction: column; gap: var(--space-4); }
.restaurant-private__card, .restaurant-private__next { min-width: 0; display: flex; flex-direction: column; gap: var(--space-3); }
.restaurant-private__card > *, .restaurant-private__next > * { min-width: 0; }
.restaurant-private__card h3, .restaurant-private__card p, .restaurant-private__next h3, .restaurant-private__next p { margin: 0; }
.restaurant-private__card p, .restaurant-private__next p { max-width: 36ch; }
.restaurant-private__card .content-list { margin: 0; }
.restaurant-private__next { background: var(--color-pale-sand); color: var(--color-charcoal); }
.restaurant-private__next h3 { color: var(--color-charcoal); }
.restaurant-private__next .button { align-self: flex-start; }

.restaurant-menu__heading { display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: var(--space-5); align-items: end; margin-bottom: var(--space-7); }
.restaurant-menu__intro { min-width: 0; max-width: 45rem; }
.restaurant-menu__intro .lead { max-width: 64ch; }
.restaurant-menu__action { min-width: 0; display: flex; justify-content: flex-end; }
.restaurant-menu__cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
.restaurant-menu__card { min-width: 0; display: flex; flex-direction: column; gap: var(--space-3); border-top: 3px solid var(--color-light-grey); }
.restaurant-menu__card > * { min-width: 0; }
.restaurant-menu__card h3, .restaurant-menu__card p { margin: 0; }
.restaurant-menu__card p { max-width: 30ch; }
.restaurant-menu__card--mustard { border-top-color: var(--color-golden-mustard); }
.restaurant-menu__card--green { border-top-color: var(--color-deep-eucalyptus); }
.restaurant-menu__card--inset { background: #f7eddf; }
.restaurant-menu__card--blue { border-top-color: var(--color-ocean-blue); }

.restaurant-late__layout { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 9fr); }
.restaurant-late__content { grid-column: 2 / 3; min-width: 0; }
.restaurant-late__content > .lead { max-width: 60ch; }
.restaurant-late__timeline { display: flex; flex-direction: column; gap: var(--space-5); margin: var(--space-7) 0 0; padding: 0; list-style: none; border-left: 2px solid var(--color-deep-eucalyptus); }
.restaurant-late__timeline > li { min-width: 0; display: grid; grid-template-columns: 3rem minmax(0, 1fr); gap: var(--space-4); padding-left: var(--space-5); }
.restaurant-late__timeline > li > * { min-width: 0; }
.restaurant-late__timeline h3, .restaurant-late__timeline p { margin: 0; }
.restaurant-late__timeline p { max-width: 44ch; }
.restaurant-late__number { display: flex; width: 2.5rem; height: 2.5rem; align-items: center; justify-content: center; border-radius: 50%; background: var(--color-muted-coral); color: var(--color-charcoal); font-size: var(--text-meta); font-weight: var(--weight-bold); }
.restaurant-late__timeline-card > div { padding: var(--space-5); border: var(--border-subtle); border-radius: var(--radius-card); background: var(--color-soft-white); }

.restaurant-comfort__intro { width: min(100%, 43rem); margin-bottom: var(--space-7); }
.restaurant-comfort__intro .lead { max-width: 66ch; }
.restaurant-comfort__note { max-width: 56ch; margin-bottom: 0; padding: var(--space-4); background: var(--color-pale-sand); }
.restaurant-comfort__cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-5); }
.restaurant-comfort__card { min-width: 0; display: flex; flex-direction: column; gap: var(--space-3); }
.restaurant-comfort__card > * { min-width: 0; }
.restaurant-comfort__card h3, .restaurant-comfort__card p { margin: 0; }
.restaurant-comfort__card p { max-width: 38ch; }
.restaurant-comfort__mark { color: var(--color-deep-eucalyptus); font-size: 1.4rem; line-height: 1; }
.restaurant-comfort__card--dark { border-color: var(--color-deep-eucalyptus); background: var(--color-deep-eucalyptus); color: var(--color-warm-ivory); }
.restaurant-comfort__card--dark h3, .restaurant-comfort__card--dark .restaurant-comfort__mark { color: var(--color-soft-white); }
.restaurant-comfort__card--dark a { color: var(--color-warm-ivory); }
.restaurant-comfort__card--sand { background: var(--color-pale-sand); }

.restaurant-booking__heading { width: min(100%, 38rem); margin-bottom: var(--space-7); }
.restaurant-booking__heading .lead { max-width: 56ch; }
.restaurant-booking__layout { display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: var(--space-5); align-items: start; }
.restaurant-booking__form { min-width: 0; display: flex; flex-direction: column; gap: var(--space-5); }
.restaurant-form__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-4); }
.restaurant-field { min-width: 0; }
.restaurant-field--full { grid-column: 1 / -1; }
.restaurant-field label { margin: 0 0 var(--space-2); }
.restaurant-field__error { min-height: 1.3em; margin: var(--space-1) 0 0; color: var(--color-danger); font-size: var(--text-utility); line-height: var(--line-utility); }
.restaurant-field [aria-invalid="true"] { border-color: var(--color-danger); }
.restaurant-consent { display: grid; grid-template-columns: 1.125rem minmax(0, 1fr); column-gap: var(--space-3); align-items: start; }
.restaurant-consent input { grid-column: 1; margin-top: 0.2rem; }
.restaurant-consent label { grid-column: 2; margin: 0; font-weight: var(--weight-regular); }
.restaurant-consent .restaurant-field__error { grid-column: 2; }
.restaurant-form__confirmation { padding: var(--space-4); border: 1px solid var(--color-success); border-radius: var(--radius-control); background: #eef6f0; color: var(--color-success); }
.restaurant-booking__note { min-width: 0; display: flex; flex-direction: column; gap: var(--space-4); padding: var(--space-5); border-radius: var(--radius-card); background: var(--color-pale-sand); }
.restaurant-booking__note > * { min-width: 0; }
.restaurant-booking__note h3, .restaurant-booking__note p { margin: 0; }
.restaurant-booking__note p { max-width: 36ch; }

.restaurant-final { padding-top: var(--space-7); }
.restaurant-final__card { width: min(100%, 43.75rem); margin-inline: auto; display: flex; flex-direction: column; align-items: center; gap: var(--space-4); padding: var(--space-7); text-align: center; }
.restaurant-final__card > * { min-width: 0; }
.restaurant-final__card h2, .restaurant-final__card p { margin: 0; }
.restaurant-final__card p { max-width: 52ch; }
.restaurant-final__actions { justify-content: center; }

@media (max-width: 63.99rem) {
  .restaurant-hero__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
  .restaurant-hero__copy { grid-column: 1; }
  .restaurant-hero__media { grid-column: 2; height: 29rem; }
  .restaurant-transition__grid { grid-template-columns: 1fr; gap: var(--space-6); }
  .restaurant-transition__copy { max-width: 42rem; padding-top: 0; }
  .restaurant-celebrate__top { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
  .restaurant-celebrate__copy { grid-column: 1; }
  .restaurant-celebrate__media { grid-column: 2; }
  .restaurant-private__grid { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
  .restaurant-private__copy { grid-column: 1; }
  .restaurant-private__rail { grid-column: 2; }
  .restaurant-booking__layout { grid-template-columns: 1fr; }
}

@media (max-width: 61.24rem) {
  .restaurant-atmosphere__cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .restaurant-atmosphere__card:last-child { grid-column: 1 / -1; }
  .restaurant-celebrate__top { grid-template-columns: 1fr; gap: var(--space-6); }
  .restaurant-celebrate__copy, .restaurant-celebrate__media { grid-column: 1; }
  .restaurant-celebrate__blocks { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .restaurant-celebrate__block:last-child { grid-column: 1 / -1; }
}

@media (max-width: 56.24rem) {
  .restaurant-private__grid { grid-template-columns: 1fr; gap: var(--space-6); }
  .restaurant-private__copy, .restaurant-private__rail { grid-column: 1; }
  .restaurant-late__layout { grid-template-columns: 1fr; }
  .restaurant-late__content { grid-column: 1; }
  .restaurant-menu__heading { grid-template-columns: 1fr; align-items: start; }
  .restaurant-menu__action { justify-content: flex-start; }
}

@media (max-width: 47.99rem) {
  .restaurant-hero { padding: var(--space-7) 0 var(--space-8); }
  .restaurant-hero__grid { grid-template-columns: 1fr; gap: var(--space-5); }
  .restaurant-hero__copy, .restaurant-hero__media { grid-column: 1; }
  .restaurant-hero__copy { max-width: 38.75rem; }
  .restaurant-hero__copy h1 { font-size: clamp(2.625rem, 12vw, 3rem); line-height: 1.02; }
  .restaurant-hero__media { width: calc(100% + (var(--container-padding) * 2)); height: auto; aspect-ratio: 4 / 3; margin-inline: calc(var(--container-padding) * -1); border-radius: 0; }
  .restaurant-hero__media img { object-position: 62% center; }
  .restaurant-transition__media { width: calc(100% + (var(--container-padding) * 2)); aspect-ratio: 4 / 3; margin-inline: calc(var(--container-padding) * -1); border-radius: 0; }
  .restaurant-transition__steps, .restaurant-atmosphere__cards, .restaurant-celebrate__blocks, .restaurant-comfort__cards { grid-template-columns: 1fr; }
  .restaurant-atmosphere__card:last-child, .restaurant-celebrate__block:last-child { grid-column: 1; }
  .restaurant-celebrate__blocks { margin-top: var(--space-6); }
  .restaurant-menu__cards { grid-template-columns: 1fr; }
  .restaurant-late__timeline { gap: var(--space-5); }
  .restaurant-late__timeline > li { grid-template-columns: 2.5rem minmax(0, 1fr); gap: var(--space-3); padding-left: var(--space-4); }
  .restaurant-late__timeline-card > div { padding: var(--space-4); }
  .restaurant-form__grid { grid-template-columns: 1fr; }
  .restaurant-field--full { grid-column: 1; }
  .restaurant-final__card { padding: var(--space-5); }
}

@media (max-width: 34.99rem) {
  .restaurant-hero__actions, .restaurant-final__actions { flex-direction: column; align-items: stretch; }
  .restaurant-hero__actions .button, .restaurant-final__actions .button { width: 100%; }
}

@media (prefers-reduced-motion: reduce) { #restaurant-page { scroll-behavior: auto; } }