/* Approved smoked-glass margins; the original deep green photographic ribbon stays intact. */
.dinner-story { display: block; background: #252820; }
.story-only { display: none; }
.native-scroll .dinner-story[data-snap] { scroll-snap-align: start; scroll-snap-stop: normal; }
.native-scroll .dinner-story [data-snap] { scroll-snap-align: none; scroll-snap-stop: normal; }
.native-scroll.is-story-reading #main { scroll-snap-type: none; }
.native-scroll.is-story-reading .sq-nav { visibility: hidden; pointer-events: none; }
.native-scroll .journey--cinematic { scroll-margin-top: 0; }
.native-scroll .story-scene { scroll-margin-top: 82px; }
.native-scroll.is-story-reading:not(.menu-open) .site-header { color: #fffaf0; background: linear-gradient(105deg, #b8a06b19, #34382e66 52%, #bfa57714), #20251fe6; border-bottom-color: #f1e3c129; }
.native-scroll.is-story-reading:not(.menu-open) .header-actions .button { color: #fffaf0; background: transparent; border-color: #e8dcc44d; }
.native-scroll.is-story-reading:not(.menu-open) .site-header :is(a, button):focus-visible { outline: 2px solid #fffaf0; outline-offset: 4px; }
.native-scroll.is-story-reading:not(.menu-open) .formats-dropdown a:focus-visible { outline-color: #2c2622; }
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .native-scroll.is-story-reading:not(.menu-open) .site-header { background-color: #20251fa6; -webkit-backdrop-filter: blur(24px) saturate(.75); backdrop-filter: blur(24px) saturate(.75); }
}
.journey--cinematic { --story-ink: #fffaf0; --story-muted: #fff9ef; --story-accent: #eef1d9; --story-ground: #151b15; position: relative; isolation: isolate; overflow: clip; color: var(--story-ink); background: #252820; padding: 96px 28px 72px; }
.story-scenes [data-story-reveal="pending"] { opacity: 0; }
.story-scenes { display: grid; gap: 0; width: min(100%, 760px); margin-inline: auto; container-type: inline-size; }
.story-step { --story-width: min(calc(100vw - 56px), 760px); --story-unit: calc((var(--story-width) - clamp(44px, calc(var(--story-width) * .09), 68px)) / 100); --story-gutter: clamp(44px, 9%, 68px); --story-rail-x: calc(var(--story-gutter) / 2); --story-marker-top: clamp(22px, 6vw, 50px); --story-arrow-bottom: clamp(12px, 3.7vw, 28px); position: relative; isolation: isolate; padding-left: var(--story-gutter); min-width: 0; container-type: inline-size; }
/* Reuse each chapter's photograph beneath a static smoked surface; no extra image assets. */
.story-ambient { position: absolute; z-index: -1; top: 0; bottom: 0; left: 50%; width: 100vw; transform: translateX(-50%); overflow: hidden; pointer-events: none; background: #252820; -webkit-mask-image: linear-gradient(transparent, #000 80px, #000 calc(100% - 80px), transparent); mask-image: linear-gradient(transparent, #000 80px, #000 calc(100% - 80px), transparent); }
.story-ambient::before { content: ''; position: absolute; inset: -72px; background: var(--scene-photo) center / cover no-repeat; filter: blur(clamp(30px, 5vw, 64px)) saturate(.78); opacity: .85; }
.story-ambient::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, #1e241f66, #20251f94 42%, #25282066), linear-gradient(180deg, #161e191a, #17201940); }
.story-step:first-child .story-ambient { top: -96px; -webkit-mask-image: linear-gradient(#000 calc(100% - 80px), transparent); mask-image: linear-gradient(#000 calc(100% - 80px), transparent); }
.story-step:last-child .story-ambient { bottom: -72px; -webkit-mask-image: linear-gradient(transparent, #000 80px); mask-image: linear-gradient(transparent, #000 80px); }
.story-scene { --story-rail: 7.1%; --story-inset: 10.7%; --story-lead: clamp(22px, calc(4 * var(--story-unit)), 30px); --story-enter: clamp(58px, calc(16 * var(--story-unit)), 110px); --story-exit: clamp(32px, calc(9 * var(--story-unit)), 68px); --story-ground: #151b15; display: block; min-height: calc(125 * var(--story-unit)); padding: 74% 7.5% 13% var(--story-inset); border-radius: 0; overflow: hidden; box-shadow: -1px 0 0 #f4ecda29, 1px 0 0 #f4ecda29; }
.story-step:first-child .story-scene { --story-lead: 0px; --story-enter: 0px; border-radius: 18px 18px 0 0; }
.story-step:last-child .story-scene { --story-exit: 0px; border-radius: 0 0 18px 18px; }
.story-scene::before, .story-scene::after { content: none; }
.story-step::before, .story-step::after { content: ''; position: absolute; left: var(--story-rail-x); width: 1px; pointer-events: none; background: linear-gradient(to bottom, #ead7a6 var(--story-read, 0%), #e3e5d147 var(--story-read, 0%)); }
.story-step::before { top: 0; height: calc(var(--story-marker-top) - 7px); }
.story-step:first-child::before { display: none; }
.story-step::after { top: calc(var(--story-marker-top) + 26px); bottom: 0; }
.story-step:last-child::after { bottom: calc(var(--story-arrow-bottom) + 22px); }
.story-number { left: var(--story-rail-x); top: var(--story-marker-top); color: #eee2c7; font: 300 clamp(13px, calc(3.1 * var(--story-unit)), 24px)/1.2 'Helvetica Neue', Arial, sans-serif; }
.story-divider { position: absolute; z-index: 1; left: var(--story-inset); right: 7.5%; top: clamp(12px, calc(2.4 * var(--story-unit)), 18px); height: 1px; pointer-events: none; background: linear-gradient(90deg, #ead6b025, #ead6b0a6 50%, #ead6b025); }
.story-divider::after { content: ''; position: absolute; left: 50%; top: -2px; width: 5px; height: 5px; background: #ead6b0; box-shadow: 0 0 0 3px var(--story-ground); transform: translateX(-50%) rotate(45deg); }
.story-scene-label { display: none; }
.story-copy, .story-scene--menu .story-copy, .story-scene--ingredients .story-copy, .story-scene--taste .story-copy, .story-scene--preparation .story-copy, .story-scene--evening .story-copy { width: 100%; max-width: none; }
.story-copy h3, .story-scene--ingredients h3, .story-scene--taste h3, .story-scene--preparation h3 { max-width: none; margin: 0; color: var(--story-ink); font: 300 clamp(44px, calc(13.4 * var(--story-unit)), 102px)/1.02 var(--font-heading); letter-spacing: -.04em; text-wrap: balance; text-shadow: 0 2px 18px #28361e30; }
.story-body, .story-scene--ingredients .story-body, .story-scene--taste .story-body, .story-scene--preparation .story-body { max-width: none; margin-top: clamp(15px, calc(3.3 * var(--story-unit)), 25px); color: var(--story-muted); font: 400 clamp(14px, calc(3.05 * var(--story-unit)), 22px)/1.48 'Helvetica Neue', Arial, sans-serif; text-shadow: 0 1px 8px #23341e2b; }
.story-body p + p { margin-top: clamp(14px, calc(3.1 * var(--story-unit)), 23px); }
.story-next { left: calc(var(--story-rail-x) - 22px); bottom: var(--story-arrow-bottom); display: grid; place-items: center; width: 44px; height: 44px; min-height: 44px; max-width: none; gap: 0; color: #eee2c7; }
.story-next > svg { width: clamp(28px, calc(6.2 * var(--story-unit)), 44px); height: clamp(28px, calc(6.2 * var(--story-unit)), 44px); padding: 7px; border-color: #e8dcc459; background: #252820d9; }
.story-next { z-index: 1; }
.story-next:hover > svg { background: #4b4c3be6; }
.journey--cinematic :is(a, button):focus-visible { outline-color: var(--story-ink); }
.journey--cinematic .story-next:focus-visible { outline-color: #fffaf0; }
.story-next > span { display: none; }
.story-media::before { content: ''; position: absolute; inset: -20px; background: var(--scene-photo) center / cover no-repeat; filter: blur(18px) brightness(1.2) contrast(.88) saturate(.9); opacity: .76; transform: translate3d(0, var(--story-drift, 0px), 0); }
.story-photo { position: relative; width: 100%; height: 68%; object-fit: cover; object-position: center top; filter: saturate(.96) brightness(1.1) contrast(.94); -webkit-mask-image: linear-gradient(#000 calc(70 * var(--story-unit)), transparent calc(136 * var(--story-unit))); mask-image: linear-gradient(#000 calc(70 * var(--story-unit)), transparent calc(136 * var(--story-unit))); }
.story-shade { background: linear-gradient(180deg, transparent calc(40 * var(--story-unit)), #151b151a calc(54 * var(--story-unit)), #151b15d9 calc(82 * var(--story-unit)), #151b15e5 calc(115 * var(--story-unit)), #151b15bf 100%); }
.story-step--conversation, .story-scene--conversation { --scene-photo: url("../media/chef/letter/conversation-reference.png"); }
.story-scene--conversation h3 { font-size: clamp(45px, calc(16 * var(--story-unit)), 116px); }
.story-scene--conversation .story-media::before { background-position: center bottom; filter: blur(12px) brightness(1.24) contrast(.88); }
.story-scene--conversation .story-photo { position: absolute; inset: 0 auto auto 0; height: auto; width: 100%; object-fit: contain; object-position: center top; -webkit-mask-image: linear-gradient(#000 calc(78 * var(--story-unit)), transparent calc(140 * var(--story-unit))); mask-image: linear-gradient(#000 calc(78 * var(--story-unit)), transparent calc(140 * var(--story-unit))); }
.story-step--menu, .story-scene--menu { --scene-photo: url("../media/chef/letter/menu-planning.webp"); }
.story-scene--menu .story-photo { object-position: center top; }
.story-step--ingredients, .story-scene--ingredients { --scene-photo: url("../media/chef/letter/menu/duck-ingredients.webp"); }
.story-scene--ingredients { min-height: 0; padding-top: clamp(54px, calc(12 * var(--story-unit)), 84px); }
.story-scene--ingredients .story-shade { background: #151b15e6; }
.story-scene--ingredients h3 { font-size: clamp(38px, calc(10.4 * var(--story-unit)), 74px); }
.story-products { margin-top: 26px; max-width: none; gap: 22px; }
.story-products dt { font-size: clamp(15px, calc(2.5 * var(--story-unit)), 19px); }
.story-products dd { margin: 5px 0 0; color: var(--story-muted); font-size: clamp(14px, calc(2.3 * var(--story-unit)), 17px); line-height: 1.55; }
.story-ingredient-details { position: static; display: grid; grid-template-columns: 1fr 1fr; width: 100%; margin: 0 0 26px; gap: 14px; }
.story-detail-photo { display: block; height: auto; aspect-ratio: 3 / 2; border-radius: 5px; }
.story-ingredient-main { grid-column: 1 / -1; }
.story-ingredient-main .story-detail-photo { aspect-ratio: 4 / 3; }
.story-step--taste, .story-scene--taste { --scene-photo: url("../media/chef/letter/menu/duck-pan.webp"); }
.story-scene--taste { min-height: 0; padding: clamp(54px, calc(12 * var(--story-unit)), 84px) clamp(10px, calc(3 * var(--story-unit)), 20px) clamp(36px, calc(8 * var(--story-unit)), 56px); }
.story-scene--taste .story-shade { background: linear-gradient(180deg, #414b4033, #151b15e6 calc(96 * var(--story-unit)), #151b15f2 100%), radial-gradient(ellipse at 55% 24%, #66726373, transparent 68%); }
.story-scene--taste .story-photo { height: 100%; filter: blur(24px) saturate(.8) brightness(1.1); opacity: .3; }
.story-scene--taste .story-copy { width: auto; margin-inline: 7.7% 4.5%; }
/* The original plate diagram: two notes on each side, joined to the ingredients. */
.story-taste-diagram { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.6fr) minmax(0, 1fr); grid-template-rows: repeat(2, auto); align-items: center; gap: clamp(28px, calc(6 * var(--story-unit)), 42px) clamp(8px, calc(1.7 * var(--story-unit)), 12px); margin-top: clamp(28px, calc(6 * var(--story-unit)), 44px); }
.story-plate { display: contents; position: static; width: auto; transform: none; }
.story-plate-image { grid-column: 2; grid-row: 1 / 3; align-self: center; position: relative; z-index: 1; min-width: 0; }
.story-plate img { filter: drop-shadow(0 16px 24px #283a2330); }
.story-plate-point { width: 6px; height: 6px; font-size: 0; background: #f6e9cb; border-color: #151b15; box-shadow: 0 0 0 2px #151b1533; }
.story-notes { display: contents; }
.story-notes li { position: relative; z-index: 3; display: block; min-width: 0; align-self: center; overflow-wrap: break-word; }
.story-notes li:nth-child(1) { grid-column: 1; grid-row: 1; text-align: right; }
.story-notes li:nth-child(2) { grid-column: 3; grid-row: 1; }
.story-notes li:nth-child(3) { grid-column: 1; grid-row: 2; text-align: right; }
.story-notes li:nth-child(4) { grid-column: 3; grid-row: 2; }
.story-note-heading { display: flex; align-items: baseline; gap: 5px; margin-bottom: 7px; }
.story-notes li:nth-child(odd) .story-note-heading { justify-content: flex-end; }
.story-note-heading > span { display: none; flex: 0 0 auto; color: var(--story-accent); font: 400 10px/1.3 var(--font-body); }
.story-notes h4 { margin: 0; font-size: clamp(13px, calc(2.7 * var(--story-unit)), 19px); line-height: 1.35; }
.story-notes p { margin: 0; color: var(--story-muted); font-size: clamp(12px, calc(2.3 * var(--story-unit)), 16px); line-height: 1.5; }
.story-taste-leaders { position: absolute; inset: 0; z-index: 2; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.story-taste-leaders path { fill: none; stroke: #e4d5b494; stroke-width: .85; vector-effect: non-scaling-stroke; }
.story-step--preparation, .story-scene--preparation { --scene-photo: url("../media/chef/preparation-poster.webp"); }
.story-scene--preparation { min-height: 0; padding-top: 111%; }
.story-photo--film-backdrop { height: 100%; -webkit-mask-image: none; mask-image: none; filter: blur(22px) brightness(1.16) contrast(.88); opacity: .65; }
.story-film { top: 0; right: 0; width: 100%; height: calc(108 * var(--story-unit)); object-fit: contain; object-position: center top; }
.story-scene--preparation .story-shade { background: linear-gradient(180deg, transparent calc(78 * var(--story-unit)), #151b1533 calc(90 * var(--story-unit)), #151b15db calc(108 * var(--story-unit)), #151b15e6 calc(125 * var(--story-unit))); }
.story-scene--preparation h3 { font-size: clamp(40px, calc(11.5 * var(--story-unit)), 82px); }
.story-film-controls { margin-top: 20px; gap: 8px 18px; font-size: clamp(12px, calc(2.1 * var(--story-unit)), 16px); }
.story-film-controls button { color: var(--story-ink); }
.story-step--evening, .story-scene--evening { --scene-photo: url("../media/chef/letter/evening-chef-wine.webp"); }
.story-scene--evening .story-photo { object-position: 45% top; }
.story-scene--evening h3 { max-width: 10ch; }
.story-contact { color: var(--story-ink); border-bottom-color: #fff3d666; font-size: clamp(14px, calc(2.5 * var(--story-unit)), 18px); }
.story-scenes .story-scene :is(.story-media, .story-shade) { -webkit-mask-image: linear-gradient(to bottom, transparent var(--story-lead), #000 var(--story-enter), #000 calc(100% - var(--story-exit)), transparent 100%); mask-image: linear-gradient(to bottom, transparent var(--story-lead), #000 var(--story-enter), #000 calc(100% - var(--story-exit)), transparent 100%); }
@media (max-width: 767px) {
  .journey--cinematic { padding: 68px 16px 36px; }
  .story-step:first-child .story-ambient { top: -68px; }
  .story-step:last-child .story-ambient { bottom: -36px; }
  .story-step:first-child .story-scene { border-radius: 15px 15px 0 0; }
  .story-step:last-child .story-scene { border-radius: 0 0 15px 15px; }
  .native-scroll .story-scene { scroll-margin-top: 62px; }
}
/* On narrow screens the notes flank the upper and lower edges of a larger plate. */
@container (max-width: 440px) {
  .story-taste-diagram { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(3, auto); column-gap: 28px; row-gap: 20px; }
  .story-plate-image { grid-column: 1 / -1; grid-row: 2; width: 72%; justify-self: center; }
  .story-notes li { align-self: start; }
  .story-notes li:nth-child(1) { grid-column: 1; grid-row: 1; }
  .story-notes li:nth-child(2) { grid-column: 2; grid-row: 1; }
  .story-notes li:nth-child(3) { grid-column: 1; grid-row: 3; }
  .story-notes li:nth-child(4) { grid-column: 2; grid-row: 3; }
  .story-notes h4 { font-size: 15px; }
  .story-notes p { font-size: 14px; line-height: 1.5; }
}
@media (max-width: 359px) {
  .journey--cinematic { padding-inline: 12px; }
  .story-copy h3 { font-size: 40px; }
  .story-scene--ingredients h3, .story-scene--preparation h3 { font-size: 35px; }
  .story-body { font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .story-scenes [data-story-reveal] { opacity: 1 !important; }
  .story-media::before { transform: none; }
}
@media print { .story-scenes [data-story-reveal] { opacity: 1 !important; transform: none !important; } .journey--cinematic { padding: 0; } .story-scene { min-height: 0; } .story-ambient { display: none; } }

@media (max-width: 767px) { .story-step { --story-width: calc(100vw - 32px); } }
@media (max-width: 359px) { .story-step { --story-width: calc(100vw - 24px); } }
@supports (width: 1cqw) { .story-step { --story-unit: 1cqw; } }

@supports not (container-type: inline-size) {
@media (max-width: 516px) {
  .story-taste-diagram { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(3, auto); column-gap: 28px; row-gap: 20px; }
  .story-plate-image { grid-column: 1 / -1; grid-row: 2; width: 72%; justify-self: center; }
  .story-notes li { align-self: start; }
  .story-notes li:nth-child(1) { grid-column: 1; grid-row: 1; }
  .story-notes li:nth-child(2) { grid-column: 2; grid-row: 1; }
  .story-notes li:nth-child(3) { grid-column: 1; grid-row: 3; }
  .story-notes li:nth-child(4) { grid-column: 2; grid-row: 3; }
  .story-notes h4 { font-size: 15px; }
  .story-notes p { font-size: 14px; line-height: 1.5; }
}
}