.cuisine-page {
  overflow: clip;
}

.cuisine-page__hero {
  padding-block: var(--space-9) var(--space-8);
}

.cuisine-page__hero-grid {
  display: grid;
  grid-template-columns: minmax(390px, 460px) minmax(430px, 610px);
  align-items: center;
  justify-content: space-between;
  gap: var(--space-8);
}

.cuisine-page__hero-copy,
.cuisine-page__hero-media,
.cuisine-page__drawer-copy,
.cuisine-page__drawer-media,
.cuisine-page__flowers-copy,
.cuisine-page__flowers-media {
  min-width: 0;
}

.cuisine-page__hero-copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-4);
  max-width: 460px;
}

.cuisine-page__hero-copy > * {
  margin: 0;
}

.cuisine-page__shelf-tag {
  position: relative;
  padding-inline-start: var(--space-4);
}

.cuisine-page__shelf-tag::before {
  position: absolute;
  top: 0.15em;
  left: 0;
  width: 10px;
  height: 10px;
  border: 1px solid var(--color-warm-charcoal);
  border-radius: 50% 45% 55% 45%;
  background: var(--color-muted-peach);
  content: "";
}

.cuisine-page__hero-copy h1 {
  font-size: clamp(2.25rem, 4.1vw, 3rem);
  line-height: 1.08;
}

.cuisine-page__hero-copy .intro {
  max-width: 44ch;
}

.cuisine-page__hero-actions {
  display: flex;
  width: 100%;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-2);
}

.cuisine-page__external-note,
.cuisine-page__final-note {
  font-size: var(--text-meta);
  line-height: 1.4;
}

.cuisine-page__play-button {
  position: relative;
  isolation: isolate;
}

.cuisine-page__play-button::after {
  position: absolute;
  z-index: -1;
  right: -4px;
  bottom: -5px;
  width: 100%;
  height: 100%;
  border: 1px solid var(--color-warm-charcoal);
  border-radius: var(--radius-control);
  content: "";
  transition: transform var(--transition-standard);
}

.cuisine-page__play-button:hover::after {
  transform: translate(-3px, -3px);
}

.cuisine-page__hero-media {
  width: 100%;
  max-width: 610px;
  margin: calc(var(--space-5) * -1) 0 0 auto;
  box-shadow: var(--paper-offset);
}

.cuisine-page__hero-media img {
  aspect-ratio: 4 / 3;
  object-fit: cover;
  object-position: center;
}

.cuisine-page__kitchen-inner,
.cuisine-page__flowers-inner,
.cuisine-page__method-inner,
.cuisine-page__routes-inner,
.cuisine-page__stories-inner,
.cuisine-page__takeaways-inner {
  min-width: 0;
}

.cuisine-page__reading-lead {
  width: 100%;
  max-width: 680px;
}

.cuisine-page__reading-lead p,
.cuisine-page__routes-intro p,
.cuisine-page__takeaways-intro p {
  max-width: 68ch;
}

.cuisine-page__gesture-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);
  margin: var(--space-6) 0 0;
}

.cuisine-page__gesture-grid > li {
  min-width: 0;
}

.cuisine-page__gesture {
  display: flex;
  min-width: 0;
  min-height: 100%;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-3);
  border: var(--border-soft);
  border-radius: var(--radius-card);
  padding: var(--space-5);
  transition: border-color var(--transition-standard), transform var(--transition-standard);
}

.cuisine-page__gesture > * {
  margin: 0;
}

.cuisine-page__gesture--blue { background: var(--color-powder-blue); }
.cuisine-page__gesture--sage { background: var(--color-sage); }
.cuisine-page__gesture--cream { background: var(--color-cream); }

.cuisine-page__gesture-icon {
  display: flex;
  width: 34px;
  height: 34px;
  align-items: center;
  justify-content: center;
  border-bottom: 2px solid var(--color-muted-peach);
  font-size: 1.3rem;
}

@media (hover: hover) and (pointer: fine) {
  .cuisine-page__gesture:hover {
    border-color: var(--color-warm-charcoal);
    transform: translateY(-2px);
  }
}

.cuisine-page__drawer-grid {
  display: grid;
  grid-template-columns: minmax(0, 52%) minmax(390px, 48%);
  align-items: start;
  gap: var(--space-7);
}

.cuisine-page__drawer-copy {
  width: 100%;
  max-width: 570px;
}

.cuisine-page__drawer-copy > p {
  max-width: 64ch;
}

.cuisine-page__observation-notes {
  display: grid;
  grid-template-columns: repeat(2, minmax(220px, 1fr));
  gap: var(--space-4);
  margin-top: var(--space-5);
}

.cuisine-page__observation-note {
  min-width: 0;
  border: var(--border-soft);
  border-radius: var(--radius-card);
  padding: var(--space-5);
  transition: border-color var(--transition-standard);
}

.cuisine-page__observation-note > *:last-child { margin-block-end: 0; }
.cuisine-page__observation-note--sage { background: var(--color-sage); }
.cuisine-page__observation-note--blue { background: var(--color-powder-blue); }

.cuisine-page__drawer-media {
  width: 100%;
  max-width: 500px;
  margin: var(--space-5) 0 0 auto;
}

.cuisine-page__drawer-media img {
  aspect-ratio: 3 / 2;
  object-fit: cover;
}

.cuisine-page__flowers-top {
  display: grid;
  grid-template-columns: minmax(0, 46%) minmax(420px, 54%);
  align-items: center;
  gap: var(--space-7);
}

.cuisine-page__flowers-copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-4);
  width: 100%;
  max-width: 450px;
  background: var(--color-powder-blue);
}

.cuisine-page__flowers-copy > * { margin: 0; }
.cuisine-page__flowers-copy p { max-width: 44ch; }

.cuisine-page__flowers-media {
  width: 100%;
  max-width: 590px;
  margin-left: auto;
}

.cuisine-page__flowers-media img {
  aspect-ratio: 4 / 3;
  object-fit: cover;
  object-position: center right;
}

.cuisine-page__space-note {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-3);
  margin-top: var(--space-6);
  border: var(--border-soft);
  border-radius: var(--radius-card);
  background: var(--color-sage);
  padding: var(--space-5);
}

.cuisine-page__space-note > * { margin: 0; }
.cuisine-page__space-note p { max-width: 68ch; }

.cuisine-page__materials-note {
  width: 100%;
  max-width: 680px;
  margin-top: var(--space-5);
}

.cuisine-page__materials-note p { max-width: 68ch; }

.cuisine-page__routes-intro {
  width: 100%;
  max-width: 680px;
  padding-bottom: var(--space-5);
  border-bottom: var(--border-soft);
}

.cuisine-page__route-main {
  display: grid;
  grid-template-columns: minmax(360px, 58fr) minmax(300px, 42fr);
  gap: var(--space-5);
  margin-top: var(--space-5);
}

.cuisine-page__route-card {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--space-3);
  border: var(--border-soft);
  border-radius: var(--radius-card);
  padding: var(--space-5);
}

.cuisine-page__route-card > * { margin: 0; }
.cuisine-page__route-card--cream { background: var(--color-cream); }
.cuisine-page__route-card--blue { background: var(--color-powder-blue); }
.cuisine-page__route-card p { max-width: 42ch; }

.cuisine-page__route-card a,
.cuisine-page__route-band a {
  font-weight: 700;
  text-decoration-color: var(--color-focus-blue);
}

.cuisine-page__route-band {
  display: grid;
  grid-template-columns: repeat(2, minmax(300px, 1fr));
  gap: var(--space-5);
  margin-top: var(--space-5);
  border: var(--border-soft);
  border-radius: var(--radius-card);
  background: var(--color-sage);
  padding: var(--space-5);
}

.cuisine-page__route-band > article { min-width: 0; }
.cuisine-page__route-band > article + article { border-inline-start: var(--border-soft); padding-inline-start: var(--space-5); }
.cuisine-page__route-band article > *:last-child { margin-block-end: 0; }

.cuisine-page__method-heading {
  width: 100%;
  max-width: 600px;
  margin-inline: auto;
  text-align: center;
}

.cuisine-page__method-heading p { max-width: 54ch; margin-inline: auto; }

.cuisine-page__principles {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 0;
  margin: var(--space-6) auto 0;
  padding: 0;
  width: 100%;
  max-width: 820px;
  overflow: hidden;
  border: var(--border-soft);
  border-radius: var(--radius-card);
  background: var(--color-cream);
  list-style: none;
}

.cuisine-page__principles > li {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr);
  min-width: 0;
  gap: var(--space-4);
  padding: var(--space-5);
}

.cuisine-page__principles > li + li { border-top: var(--border-soft); }
.cuisine-page__principle-number { font-family: var(--font-heading); font-size: 1.8rem; line-height: 1; color: var(--color-muted-peach); }
.cuisine-page__principles h3 { margin-bottom: var(--space-2); }
.cuisine-page__principles p { max-width: 60ch; margin-bottom: 0; }

.cuisine-page__story-main {
  width: 68%;
  max-width: 650px;
}

.cuisine-page__story-main p { max-width: 65ch; }

.cuisine-page__story-pair {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: var(--space-8);
  margin-top: var(--space-5);
}

.cuisine-page__story-note {
  min-width: 0;
  max-width: 390px;
  border: var(--border-soft);
  border-radius: var(--radius-card);
  padding: var(--space-5);
}

.cuisine-page__story-note > *:last-child { margin-block-end: 0; }
.cuisine-page__story-note--blue { justify-self: end; background: var(--color-powder-blue); }
.cuisine-page__story-note--sage { justify-self: start; background: var(--color-sage); }
.cuisine-page__story-note p { max-width: 38ch; }

.cuisine-page__takeaways-intro {
  width: 100%;
  max-width: 680px;
}

.cuisine-page__takeaway-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-5);
  margin-top: var(--space-5);
}

.cuisine-page__takeaway-grid > article {
  min-width: 0;
  border-top: 2px solid var(--color-warm-charcoal);
  padding-top: var(--space-4);
}

.cuisine-page__takeaway-grid article > *:last-child { margin-block-end: 0; }
.cuisine-page__takeaway-grid p { max-width: 32ch; }

.cuisine-page__breath {
  height: var(--space-8);
}

.cuisine-page__final {
  padding-bottom: var(--space-9);
}

.cuisine-page__final-panel {
  border: 1px solid var(--color-warm-charcoal);
  border-radius: var(--radius-sheet);
  background: var(--color-warm-charcoal);
  padding: var(--space-8) var(--container-gutter);
}

.cuisine-page__final-copy {
  display: flex;
  width: 100%;
  max-width: 620px;
  min-width: 0;
  flex-direction: column;
  align-items: center;
  gap: var(--space-4);
  margin-inline: auto;
  color: var(--color-paper-white);
  text-align: center;
}

.cuisine-page__final-copy > * { margin: 0; }
.cuisine-page__final-copy h2 { color: var(--color-paper-white); }
.cuisine-page__final-copy p { max-width: 52ch; }
.cuisine-page__final-note { color: rgb(255 253 245 / 0.82); }

.cuisine-page__play-button--final::after { border-color: var(--color-paper-white); }

@media (max-width: 900px) {
  .cuisine-page__hero { padding-block: var(--space-8); }
  .cuisine-page__hero-grid,
  .cuisine-page__drawer-grid,
  .cuisine-page__flowers-top {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-6);
  }

  .cuisine-page__hero-copy,
  .cuisine-page__drawer-copy,
  .cuisine-page__flowers-copy,
  .cuisine-page__hero-media,
  .cuisine-page__drawer-media,
  .cuisine-page__flowers-media {
    max-width: none;
    margin: 0;
  }

  .cuisine-page__hero-media { grid-row: 2; }
  .cuisine-page__drawer-media { grid-row: 2; }
  .cuisine-page__flowers-media { grid-row: 1; }
  .cuisine-page__flowers-copy { grid-row: 2; }

  .cuisine-page__gesture-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .cuisine-page__takeaway-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 850px) {
  .cuisine-page__route-main { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 800px) {
  .cuisine-page__story-main { width: 100%; max-width: none; }
  .cuisine-page__story-pair { grid-template-columns: minmax(0, 1fr); gap: var(--space-5); }
  .cuisine-page__story-note { width: 100%; max-width: none; justify-self: stretch; }
}

@media (max-width: 720px) {
  .cuisine-page__hero { padding-block: var(--space-6); }
  .cuisine-page__hero-grid { gap: var(--space-5); }
  .cuisine-page__hero-media { grid-row: 1; }
  .cuisine-page__hero-copy { grid-row: 2; padding: var(--space-5); }
  .cuisine-page__hero-copy h1 { font-size: clamp(2rem, 9vw, 2.125rem); }
  .cuisine-page__hero-copy .intro { max-width: none; }
  .cuisine-page__hero-actions { align-items: stretch; }
  .cuisine-page__hero-actions .button { width: 100%; }

  .cuisine-page__gesture-grid,
  .cuisine-page__takeaway-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-4);
  }

  .cuisine-page__observation-notes { grid-template-columns: minmax(0, 1fr); }
  .cuisine-page__flowers-top { gap: var(--space-5); }
  .cuisine-page__flowers-copy { padding: var(--space-5); }
  .cuisine-page__flowers-copy p,
  .cuisine-page__space-note p,
  .cuisine-page__materials-note p { max-width: none; }

  .cuisine-page__route-band { grid-template-columns: minmax(0, 1fr); gap: var(--space-4); }
  .cuisine-page__route-band > article + article { border-top: var(--border-soft); border-inline-start: 0; padding: var(--space-4) 0 0; }

  .cuisine-page__principles > li { grid-template-columns: 40px minmax(0, 1fr); padding: var(--space-4); }
  .cuisine-page__takeaway-grid > article + article { border-top: var(--border-soft); padding-top: var(--space-5); }

  .cuisine-page__breath { height: var(--space-6); }
  .cuisine-page__final { padding-bottom: var(--space-7); }
  .cuisine-page__final-panel { padding: var(--space-6) var(--space-5); }
  .cuisine-page__play-button--final { width: 100%; }
}

@media (max-width: 380px) {
  .cuisine-page__principles > li { grid-template-columns: minmax(0, 1fr); gap: var(--space-2); }
  .cuisine-page__principle-number { font-size: 1.35rem; }
}

@media (prefers-reduced-motion: reduce) {
  .cuisine-page__play-button::after,
  .cuisine-page__gesture,
  .cuisine-page__observation-note { transition: none; }

  .cuisine-page__play-button:hover::after,
  .cuisine-page__gesture:hover { transform: none; }
}
