.menu-page {
  background: var(--color-obsidian-950);
}

.menu-page .button {
  min-height: 3rem;
}

.menu-hero {
  position: relative;
  min-height: 42.5rem;
  overflow: hidden;
  background: var(--color-black-1000);
}

.menu-hero__image,
.menu-hero__image::after {
  position: absolute;
  inset: 0;
}

.menu-hero__image::after {
  content: "";
  background: rgba(5, 5, 5, 0.38);
}

.menu-hero__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 62% center;
  filter: saturate(0.28) contrast(1.06);
}

.menu-hero__container {
  position: relative;
  z-index: 1;
  display: flex;
  width: min(100% - (2 * var(--gutter)), var(--container-main));
  min-height: 42.5rem;
  min-width: 0;
  margin-inline: auto;
  align-items: flex-end;
  padding-block: var(--space-9);
}

.menu-hero__content {
  display: flex;
  width: min(100%, 40.625rem);
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-5);
}

.menu-hero__content .eyebrow,
.menu-hero__content h1,
.menu-hero__lead,
.menu-hero__meta {
  margin: 0;
}

.menu-hero__content h1 {
  max-width: 39rem;
  font-size: clamp(3.5rem, 5.1vw, 4.5rem);
}

.menu-hero__lead {
  max-width: 39rem;
  font-size: var(--text-lead);
  line-height: var(--leading-lead);
}

.menu-hero__actions,
.menu-closing__actions {
  display: flex;
  min-width: 0;
  flex-wrap: wrap;
  align-items: stretch;
  gap: var(--space-3);
}

.menu-hero__actions > a,
.menu-closing__actions > a {
  min-width: 11.25rem;
}

.menu-hero__meta {
  color: var(--color-text-muted);
  font-size: var(--text-meta);
  line-height: var(--leading-meta);
}

.menu-rhythm__container {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: var(--space-8);
}

.menu-rhythm__intro {
  width: min(100%, 35rem);
  min-width: 0;
}

.menu-rhythm__intro .eyebrow,
.menu-rhythm__intro h2,
.menu-rhythm__intro .lead {
  margin-bottom: 0;
}

.menu-rhythm__intro h2 {
  margin-top: var(--space-3);
}

.menu-rhythm__intro .lead {
  margin-top: var(--space-5);
}

.menu-rhythm__principles {
  display: grid;
  min-width: 0;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-6);
}

.menu-principle {
  min-width: 0;
  border-top: var(--border-hairline);
  padding-top: var(--space-5);
}

.menu-principle__number,
.menu-step__number,
.menu-list__number,
.menu-list__label {
  margin: 0;
  color: var(--color-text-muted);
  font-size: var(--text-meta);
  font-weight: 600;
  letter-spacing: 0.12em;
  line-height: var(--leading-meta);
  text-transform: uppercase;
}

.menu-principle h3 {
  margin: var(--space-4) 0 var(--space-4);
  font-size: clamp(1.85rem, 2.4vw, 2.25rem);
}

.menu-principle p:last-child {
  max-width: 18.75rem;
  margin-bottom: 0;
}

.menu-overview__container {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-7);
}

.menu-overview__head,
.menu-overview__note {
  min-width: 0;
}

.menu-overview__head {
  width: min(100%, 42rem);
}

.menu-overview__head .eyebrow,
.menu-overview__head h2 {
  margin-bottom: 0;
}

.menu-overview__head h2 {
  margin-top: var(--space-3);
}

.menu-overview__note {
  display: flex;
  width: min(100%, 35rem);
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-4);
}

.menu-overview__note p {
  margin: 0;
}

.menu-list {
  width: 100%;
  min-width: 0;
  border-top: var(--border-hairline);
}

.menu-list__item {
  display: grid;
  min-width: 0;
  grid-template-columns: minmax(3rem, 1fr) minmax(0, 5fr) minmax(0, 4fr) minmax(5rem, 2fr);
  column-gap: var(--space-5);
  align-items: start;
  border-bottom: var(--border-hairline);
  padding-block: var(--space-6);
}

.menu-list__top {
  display: contents;
}

.menu-list__number {
  grid-column: 1;
  padding-top: var(--space-2);
}

.menu-list__label {
  grid-column: 4;
  grid-row: 1;
  justify-self: end;
  padding-top: var(--space-2);
}

.menu-list__item h3 {
  grid-column: 2;
  margin: 0;
  font-size: clamp(2rem, 3.3vw, 3rem);
}

.menu-list__item--main h3 {
  font-size: clamp(2.2rem, 3.9vw, 3.35rem);
}

.menu-list__item > p {
  grid-column: 3;
  margin: 0;
  color: var(--color-text-muted);
}

.menu-list__item:hover h3,
.menu-list__item:focus-within h3 {
  color: var(--color-snow-100);
}

.menu-overview__action {
  min-width: 12rem;
}

.menu-kitchen__container,
.menu-table__container {
  display: grid;
  min-width: 0;
  grid-template-columns: minmax(0, 7fr) minmax(0, 1fr) minmax(0, 4fr);
  align-items: start;
}

.menu-kitchen__figure {
  grid-column: 1;
  width: 100%;
  min-width: 0;
  margin: 0;
  aspect-ratio: 4 / 3;
}

.menu-kitchen__figure img,
.menu-table__figure img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(0.24) contrast(1.06);
}

.menu-kitchen__figure img {
  object-position: 55% center;
}

.menu-kitchen__content {
  display: flex;
  grid-column: 3;
  width: min(100%, 31.25rem);
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-5);
  padding-top: var(--space-4);
}

.menu-kitchen__content .eyebrow,
.menu-kitchen__content h2,
.menu-kitchen__content > .text-link {
  margin: 0;
}

.menu-kitchen__content h2 {
  margin-top: var(--space-3);
}

.menu-kitchen__copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: var(--space-5);
}

.menu-kitchen__copy p {
  margin: 0;
}

.menu-kitchen__copy p + p {
  border-top: var(--border-hairline);
  padding-top: var(--space-5);
}

.menu-chef {
  background: var(--color-black-1000);
}

.menu-chef__container {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: var(--space-8);
}

.menu-chef__head {
  width: min(100%, 43.75rem);
  min-width: 0;
}

.menu-chef__head .eyebrow,
.menu-chef__head h2,
.menu-chef__lead {
  margin-bottom: 0;
}

.menu-chef__head h2 {
  margin-top: var(--space-3);
}

.menu-chef__lead {
  max-width: 38.75rem;
  margin-top: var(--space-5);
  font-size: var(--text-lead);
  line-height: var(--leading-lead);
}

.menu-chef__lead span {
  font-family: var(--font-heading);
  font-size: 1.35em;
}

.menu-chef__steps {
  display: grid;
  min-width: 0;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.menu-step {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-4);
  padding-inline: var(--space-6);
  border-left: var(--border-hairline);
}

.menu-step:first-child {
  padding-left: 0;
  border-left: 0;
}

.menu-step:last-child {
  padding-right: 0;
}

.menu-step h3,
.menu-step p,
.menu-step .text-link {
  margin: 0;
}

.menu-step h3 {
  font-size: clamp(1.85rem, 2.4vw, 2.25rem);
}

.menu-step > p:not(.menu-step__number) {
  max-width: 20rem;
}

.menu-table__content {
  display: flex;
  grid-column: 1;
  width: min(100%, 28.125rem);
  min-width: 0;
  flex-direction: column;
  align-self: center;
  align-items: flex-start;
  gap: var(--space-5);
}

.menu-table__content .eyebrow,
.menu-table__content h2,
.menu-table__content p,
.menu-table__content .text-link {
  margin: 0;
}

.menu-table__content h2 {
  max-width: 28.125rem;
  margin-top: var(--space-3);
}

.menu-table__content > p {
  max-width: 26.875rem;
}

.menu-table__figure {
  grid-column: 3 / 4;
  width: calc(100% + ((100vw - min(100vw - (2 * var(--gutter)), var(--container-main))) / 2));
  min-width: 0;
  min-height: 100%;
  margin: 0;
  aspect-ratio: 3 / 2;
  justify-self: end;
}

.menu-table__figure img {
  object-position: 58% center;
}

.menu-preferences__container {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-7);
}

.menu-preferences__head {
  width: min(100%, 35rem);
  min-width: 0;
}

.menu-preferences__head .eyebrow,
.menu-preferences__head h2 {
  margin-bottom: 0;
}

.menu-preferences__head h2 {
  margin-top: var(--space-3);
}

.menu-preferences__cards {
  display: grid;
  width: 100%;
  min-width: 0;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-5);
}

.menu-preference-card {
  min-width: 0;
  padding: var(--space-6);
  border: var(--border-hairline);
  background: var(--color-anthracite-900);
}

.menu-preference-card h3,
.menu-preference-card p {
  margin: 0;
}

.menu-preference-card h3 {
  margin-bottom: var(--space-5);
}

.menu-preference-card p {
  max-width: 29.375rem;
}

.menu-preferences__action {
  display: flex;
  width: min(100%, 43.75rem);
  min-width: 0;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-5);
}

.menu-preferences__action p {
  flex: 1 1 25rem;
  min-width: 0;
  margin: 0;
}

.menu-preferences__action .button {
  flex: 0 1 auto;
  min-width: 10.75rem;
}

.menu-faq__container {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-7);
}

.menu-faq__head {
  width: min(100%, 35rem);
  min-width: 0;
}

.menu-faq__head .eyebrow,
.menu-faq__head h2 {
  margin-bottom: 0;
}

.menu-faq__head h2 {
  margin-top: var(--space-3);
}

.menu-faq__list {
  width: min(100%, 66.25rem);
  min-width: 0;
  border-top: var(--border-hairline);
}

.menu-faq__item {
  min-width: 0;
  border-bottom: var(--border-hairline);
}

.menu-faq__item h3 {
  margin: 0;
  font-family: var(--font-body);
  font-size: 1.0625rem;
  font-weight: 600;
  letter-spacing: 0;
  line-height: 1.45;
}

.menu-faq__trigger {
  display: grid;
  width: 100%;
  min-width: 0;
  grid-template-columns: minmax(0, 1fr) 2rem;
  gap: var(--space-4);
  padding: var(--space-5) 0;
  background: transparent;
  color: var(--color-text);
  text-align: left;
}

.menu-faq__trigger > span:first-child {
  min-width: 0;
}

.menu-faq__indicator {
  position: relative;
  width: 2rem;
  min-width: 2rem;
  height: 2rem;
}

.menu-faq__indicator::before,
.menu-faq__indicator::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 0.875rem;
  height: 1px;
  background: currentColor;
  content: "";
  transform: translate(-50%, -50%);
  transition: transform var(--transition-fast);
}

.menu-faq__indicator::after {
  transform: translate(-50%, -50%) rotate(90deg);
}

.menu-faq__trigger[aria-expanded="true"] .menu-faq__indicator::after {
  transform: translate(-50%, -50%) rotate(0deg);
}

.menu-faq__panel {
  width: min(100%, 38.75rem);
  min-width: 0;
  padding-bottom: var(--space-5);
}

.menu-faq__panel p {
  margin: 0;
  color: var(--color-text-muted);
}

.menu-faq__more {
  margin-top: var(--space-2);
}

.menu-closing {
  position: relative;
  overflow: hidden;
  background: var(--color-black-1000);
}

.menu-closing::before {
  position: absolute;
  inset: 0;
  background-image: radial-gradient(rgba(245, 245, 242, 0.035) 0.6px, transparent 0.6px);
  background-size: 5px 5px;
  content: "";
  opacity: 0.55;
  pointer-events: none;
}

.menu-closing__container {
  position: relative;
  z-index: 1;
  display: flex;
  min-width: 0;
  justify-content: center;
  padding-block: var(--space-10);
}

.menu-closing__content {
  display: flex;
  width: min(100%, 38.75rem);
  min-width: 0;
  flex-direction: column;
  align-items: center;
  gap: var(--space-5);
  text-align: center;
}

.menu-closing__content .eyebrow,
.menu-closing__content h2,
.menu-closing__content p {
  margin: 0;
}

.menu-closing__content h2 {
  margin-top: var(--space-3);
}

.menu-closing__content p {
  max-width: 38.75rem;
}

.menu-closing__actions {
  justify-content: center;
}

@media (max-width: 980px) {
  .menu-kitchen__container,
  .menu-table__container {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-6);
  }

  .menu-kitchen__figure,
  .menu-kitchen__content,
  .menu-table__content,
  .menu-table__figure {
    grid-column: 1;
  }

  .menu-kitchen__content,
  .menu-table__content {
    width: min(100%, 35rem);
    padding-top: 0;
  }

  .menu-table__figure {
    width: 100%;
    min-height: 0;
    justify-self: stretch;
    aspect-ratio: 4 / 3;
  }
}

@media (max-width: 920px) {
  .menu-rhythm__principles {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-6);
  }

  .menu-principle p:last-child {
    max-width: 35rem;
  }
}

@media (max-width: 900px) {
  .menu-list__item {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-4);
  }

  .menu-list__top {
    display: flex;
    width: 100%;
    min-width: 0;
    justify-content: space-between;
    gap: var(--space-4);
  }

  .menu-list__number,
  .menu-list__label {
    padding-top: 0;
  }

  .menu-list__item h3,
  .menu-list__item--main h3,
  .menu-list__item > p {
    width: 100%;
  }

  .menu-list__item h3,
  .menu-list__item--main h3 {
    font-size: clamp(2rem, 5vw, 2.5rem);
  }

  .menu-list__item > p {
    max-width: 35rem;
  }
}

@media (max-width: 880px) {
  .menu-chef__steps {
    grid-template-columns: minmax(0, 1fr);
    border-top: var(--border-hairline);
  }

  .menu-step,
  .menu-step:first-child,
  .menu-step:last-child {
    padding: var(--space-5) 0;
    border: 0;
    border-bottom: var(--border-hairline);
  }

  .menu-step > p:not(.menu-step__number) {
    max-width: 35rem;
  }
}

@media (max-width: 760px) {
  .menu-hero {
    display: flex;
    min-height: 0;
    flex-direction: column;
    overflow: visible;
  }

  .menu-hero__image {
    position: relative;
    height: 38vh;
    min-height: 16rem;
    max-height: 25rem;
  }

  .menu-hero__image img {
    object-position: 55% center;
  }

  .menu-hero__container {
    width: min(100% - (2 * var(--gutter)), var(--container-main));
    min-height: 0;
    padding-block: var(--space-7) var(--space-8);
  }

  .menu-hero__content {
    width: 100%;
  }

  .menu-hero__content h1 {
    max-width: 100%;
    font-size: clamp(2.625rem, 10vw, 3.5rem);
    line-height: 1;
  }

  .menu-hero__lead {
    max-width: 100%;
    font-size: 1.125rem;
  }

  .menu-preferences__cards {
    grid-template-columns: minmax(0, 1fr);
  }

  .menu-preferences__action {
    flex-direction: column;
    align-items: flex-start;
  }

  .menu-preferences__action .button {
    width: auto;
  }
}

@media (max-width: 639px) {
  .menu-rhythm__container,
  .menu-overview__container,
  .menu-chef__container,
  .menu-preferences__container,
  .menu-faq__container {
    gap: var(--space-6);
  }

  .menu-kitchen__container,
  .menu-table__container {
    gap: var(--space-5);
  }

  .menu-rhythm__intro h2,
  .menu-overview__head h2,
  .menu-kitchen__content h2,
  .menu-chef__head h2,
  .menu-table__content h2,
  .menu-preferences__head h2,
  .menu-faq__head h2,
  .menu-closing__content h2 {
    font-size: clamp(2.5rem, 11vw, 2.625rem);
  }

  .menu-principle h3,
  .menu-step h3 {
    font-size: 2rem;
  }

  .menu-preference-card {
    padding: var(--space-5);
  }

  .menu-closing__container {
    justify-content: flex-start;
    padding-block: var(--space-9);
  }

  .menu-closing__content {
    width: 100%;
    align-items: flex-start;
    text-align: left;
  }

  .menu-closing__actions {
    width: 100%;
    justify-content: flex-start;
  }
}

@media (max-width: 520px) {
  .menu-hero__actions,
  .menu-closing__actions {
    width: 100%;
    flex-direction: column;
  }

  .menu-hero__actions > a,
  .menu-closing__actions > a,
  .menu-preferences__action .button {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  .menu-faq__indicator::before,
  .menu-faq__indicator::after {
    transition: none;
  }
}
