:root {
  color-scheme: dark;
  --ink: #080909;
  --panel: #101212;
  --paper: #e8e5df;
  --muted: #aaa7a0;
  --line: rgba(232, 229, 223, .17);
  --accent: #d4482c;
  --display: "Bodoni 72", Didot, "Iowan Old Style", Georgia, serif;
  --body: "Avenir Next", Avenir, "Segoe UI", sans-serif;
  --frame: 1180px;
  --gutter: clamp(1.1rem, 3vw, 2.5rem);
  --section: clamp(4rem, 7vw, 6rem);
  --ease: cubic-bezier(.22, 1, .36, 1);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--ink); }
body { margin: 0; overflow-x: hidden; color: var(--paper); background: var(--ink); font: 1rem/1.55 var(--body); }
body.menu-open { overflow: hidden; }
img, video { display: block; max-width: 100%; }
img { height: auto; background: var(--panel); }
a { color: inherit; text-decoration: none; }
button { color: inherit; font: inherit; }
::selection { color: var(--paper); background: var(--accent); }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }

.skip-link { position: fixed; z-index: 1000; top: 1rem; left: 1rem; padding: .7rem 1rem; color: var(--ink); background: var(--paper); transform: translateY(-160%); transition: transform .2s; }
.skip-link:focus { transform: none; }
.section-pad { padding: var(--section) var(--gutter); }
.eyebrow { margin: 0 0 1.25rem; color: var(--accent); font-size: .68rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; }

.loader { position: fixed; z-index: 999; inset: 0; display: grid; place-content: center; gap: 1rem; color: var(--paper); background: var(--ink); transition: opacity .55s var(--ease), visibility .55s; }
.loader span { font: italic clamp(3rem, 8vw, 6rem)/1 var(--display); }
.loader i { width: 100%; height: 1px; background: linear-gradient(90deg, var(--accent) 50%, var(--line) 50%); background-size: 200% 100%; animation: loading 1.4s linear infinite; }
.loader.is-done { visibility: hidden; opacity: 0; }
@keyframes loading { to { background-position: -200% 0; } }

.site-header { position: fixed; z-index: 100; top: 0; left: 0; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; width: 100%; height: 68px; padding: 0 var(--gutter); border-bottom: 1px solid transparent; transition: background .3s, border-color .3s; }
.site-header.is-scrolled { border-color: var(--line); background: rgba(8, 9, 9, .9); backdrop-filter: blur(14px); }
.wordmark { justify-self: start; font: italic 1.55rem/1 var(--display); }
.desktop-nav { display: flex; gap: 1.8rem; }
.desktop-nav a, .header-cta { position: relative; font-size: .7rem; font-weight: 600; letter-spacing: .11em; text-transform: uppercase; }
.desktop-nav a::after, .header-cta::after { content: ""; position: absolute; right: 0; bottom: -.4rem; left: 0; height: 1px; background: var(--accent); transform: scaleX(0); transform-origin: right; transition: transform .28s var(--ease); }
.desktop-nav a:hover::after, .header-cta:hover::after { transform: scaleX(1); transform-origin: left; }
.header-cta { justify-self: end; }
.menu-toggle, .mobile-menu { display: none; }

.hero { position: relative; min-height: 100dvh; overflow: hidden; background: #050505; }
.hero-media, .hero-shade { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero-media { object-fit: cover; filter: saturate(.78) contrast(1.05); }
.hero-shade { background: linear-gradient(90deg, rgba(0,0,0,.7), rgba(0,0,0,.12) 62%, rgba(0,0,0,.3)), linear-gradient(0deg, rgba(0,0,0,.52), transparent 48%); }
.hero-copy { position: absolute; z-index: 1; top: 26%; left: max(var(--gutter), calc((100vw - var(--frame)) / 2)); max-width: 54rem; }
.hero-kicker { margin: 0 0 1.2rem; font-size: .7rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; }
.hero h1 { margin: 0; font: italic clamp(5rem, 11vw, 9.5rem)/.84 var(--display); letter-spacing: -.05em; }
.hero-line { margin: 1.3rem 0 0 8%; font: clamp(1.2rem, 1.7vw, 1.8rem)/1.1 var(--display); }
.hero-action { position: absolute; z-index: 2; right: max(var(--gutter), calc((100vw - var(--frame)) / 2)); bottom: 2rem; display: flex; gap: 1.4rem; align-items: center; min-width: 11.5rem; padding: .8rem 0; border-bottom: 1px solid var(--paper); font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; }
.hero-action span { margin-left: auto; color: var(--accent); font-size: 1rem; transition: transform .25s; }
.hero-action:hover span { transform: translate(.2rem, .2rem); }

.manifesto { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(16rem, .75fr); gap: clamp(2.5rem, 7vw, 6rem); align-items: center; max-width: var(--frame); margin: 0 auto; }
.manifesto-copy { max-width: 42rem; }
.manifesto h2, .section-heading h2, .craft h2, .project-copy h2, .gallery-copy h2, .reviews-heading h2 { margin: 0; font: clamp(2.9rem, 4.5vw, 4.3rem)/.95 var(--display); letter-spacing: -.038em; text-wrap: balance; }
.manifesto h2 em { color: var(--accent); font-weight: 400; line-height: 1.1; }
.manifesto-copy > p:last-child { max-width: 40ch; margin: 1.75rem 0 0; color: var(--muted); }
.manifesto-image { width: min(100%, 20rem); margin: 0; justify-self: end; }
.manifesto-image img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }

.craft, .project-section { display: grid; grid-template-columns: minmax(18rem, .78fr) minmax(0, 1.22fr); gap: clamp(2.5rem, 6vw, 5.5rem); align-items: center; max-width: var(--frame); margin: 2rem auto; padding: var(--section) var(--gutter); background: var(--panel); }
.craft-image, .project-image { width: min(100%, 26rem); margin: 0; overflow: hidden; }
.craft-image img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; }
.project-image img { width: 100%; aspect-ratio: 1; object-fit: cover; }
.craft-copy, .project-copy { padding: 0; }
.craft h2, .project-copy h2 { font-size: clamp(2.75rem, 4.1vw, 4rem); }
.craft-copy > p, .project-copy > p { max-width: 40ch; margin: 1.6rem 0; color: var(--muted); }
.craft-facts { max-width: 32rem; margin: 2.4rem 0 0; border-top: 1px solid var(--line); }
.craft-facts div { display: grid; grid-template-columns: 2.5rem 1fr; gap: 1rem; padding: .9rem 0; border-bottom: 1px solid var(--line); }
.craft-facts dt { color: var(--accent); font-size: .7rem; }
.craft-facts dd { margin: 0; }
.project-section { grid-template-columns: minmax(0, 1.2fr) minmax(18rem, .8fr); }
.project-image { order: 2; justify-self: end; }
.project-copy { order: 1; }
.text-link { display: inline-flex; padding: .8rem 0; border-bottom: 1px solid var(--line); color: var(--muted); font-size: .7rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }

.menu-section { max-width: var(--frame); margin: 0 auto; }
.section-heading { max-width: 46rem; margin-bottom: 3.5rem; }
.dish-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2rem 1.5rem; }
.dish, .dish-large, .dish-wide, .dish:nth-child(n) { grid-column: auto; margin: 0; }
.dish img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; filter: saturate(.82); transition: filter .4s, transform .55s var(--ease); }
.dish:hover img { filter: saturate(1); transform: scale(1.012); }
.dish div { padding-top: .85rem; border-top: 1px solid var(--line); }
.dish h3 { margin: 0; font: 1.1rem/1.2 var(--display); }
.dish p { margin: .35rem 0 0; color: var(--muted); font-size: .74rem; }

.ingredient-break { position: relative; max-width: var(--frame); min-height: 21rem; margin: 2rem auto; overflow: hidden; }
.ingredient-break img { width: 100%; height: 21rem; object-fit: cover; filter: brightness(.62) saturate(.76); }
.ingredient-break::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(8,9,9,.82), transparent 70%); }
.ingredient-break p { position: absolute; z-index: 1; left: var(--gutter); bottom: 2.2rem; max-width: 17ch; margin: 0; font: clamp(2.2rem, 4vw, 3.8rem)/.97 var(--display); letter-spacing: -.03em; }

.gallery-section { max-width: var(--frame); margin: 0 auto; }
.gallery-layout { display: grid; grid-template-columns: minmax(0, .8fr) minmax(20rem, 1.2fr); gap: clamp(3rem, 8vw, 7rem); align-items: center; }
.gallery-copy { max-width: 31rem; }
.gallery-copy p { max-width: 38ch; margin: 1.5rem 0 0; color: var(--muted); }
.gallery-controls { display: grid; grid-template-columns: 2.6rem auto 2.6rem; gap: 1rem; align-items: center; width: fit-content; margin-top: 2rem; }
.gallery-controls button { width: 2.6rem; height: 2.6rem; border: 1px solid var(--line); background: transparent; cursor: pointer; transition: color .2s, border-color .2s, transform .2s; }
.gallery-controls button:hover { color: var(--accent); border-color: var(--accent); }
.gallery-controls button:active { transform: scale(.96); }
.gallery-count { min-width: 4.2rem; color: var(--muted); font-size: .72rem; text-align: center; }
.gallery-count b { color: var(--paper); font-weight: 600; }
.gallery-stage { display: grid; place-items: center; min-height: 27rem; overflow: visible; touch-action: pan-y; }
.gallery-stack { position: relative; width: 17.5rem; height: 22rem; }
.stack-card { position: absolute; inset: 0; display: none; overflow: hidden; border: 1px solid var(--line); background: #0d0f0f; box-shadow: 0 18px 55px rgba(0,0,0,.28); cursor: pointer; transform-origin: 50% 90%; transition: transform .42s var(--ease), opacity .3s, filter .3s; }
.stack-card.is-front, .stack-card.is-left, .stack-card.is-right { display: block; }
.stack-card.is-front { z-index: 3; transform: translate(0, 0) rotate(0); }
.stack-card.is-left { z-index: 1; opacity: .74; filter: brightness(.75); transform: translate(-10px, 9px) rotate(-1.5deg); }
.stack-card.is-right { z-index: 2; opacity: .86; filter: brightness(.84); transform: translate(10px, 5px) rotate(1.5deg); }
.gallery-stack:hover .stack-card.is-left, .gallery-stack:focus-within .stack-card.is-left { transform: translate(-35px, 3px) rotate(-4deg); }
.gallery-stack:hover .stack-card.is-right, .gallery-stack:focus-within .stack-card.is-right { transform: translate(35px, 1px) rotate(4deg); }
.stack-card img { width: calc(100% - .8rem); height: 16.4rem; margin: .4rem; object-fit: cover; }
.stack-card div { padding: .6rem .8rem .8rem; }
.stack-card h3 { margin: 0; font: 1.08rem/1.15 var(--display); }
.stack-card p { margin: .25rem 0 0; color: var(--muted); font-size: .7rem; }
html:not(.js) .stack-card:nth-child(1), html:not(.js) .stack-card:nth-child(2), html:not(.js) .stack-card:nth-child(3) { display: block; }
html:not(.js) .stack-card:nth-child(1) { z-index: 3; }
html:not(.js) .stack-card:nth-child(2) { z-index: 2; transform: translate(-10px, 8px) rotate(-1.5deg); }
html:not(.js) .stack-card:nth-child(3) { z-index: 1; transform: translate(10px, 5px) rotate(1.5deg); }

.reviews-section { max-width: var(--frame); margin: 0 auto; }
.reviews-heading { max-width: 43rem; margin-bottom: 2.8rem; }
.reviews-heading p { max-width: 45ch; margin: 1.2rem 0 0; color: var(--muted); }
.testimonial-columns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; max-height: 32rem; overflow: hidden; mask-image: linear-gradient(to bottom, transparent, black 10%, black 90%, transparent); }
.testimonial-column { min-width: 0; }
.testimonial-column-secondary { transform: translateY(-3rem); }
.testimonial-column-tertiary { transform: translateY(-1.3rem); }
.testimonial-track { display: flex; flex-direction: column; }
.js .testimonial-track { animation: testimonial-loop var(--duration) linear infinite; will-change: transform; }
.testimonial-set { display: flex; flex-direction: column; gap: 1rem; padding-bottom: 1rem; }
.testimonial-columns:hover .testimonial-track, .testimonial-columns:focus-within .testimonial-track { animation-play-state: paused; }
.testimonial-card { margin: 0; padding: 1.2rem; border: 1px solid var(--line); background: var(--panel); }
.testimonial-card blockquote { margin: 0; font: clamp(1rem, 1.5vw, 1.25rem)/1.35 var(--display); }
.testimonial-card figcaption { display: flex; gap: .7rem; align-items: center; margin-top: 1rem; }
.testimonial-card figcaption img { width: 2.4rem; height: 2.4rem; object-fit: cover; }
.testimonial-card figcaption span { display: grid; line-height: 1.2; }
.testimonial-card strong { font-size: .72rem; font-weight: 600; }
.testimonial-card small { margin-top: .2rem; color: var(--muted); font-size: .64rem; }
@keyframes testimonial-loop { to { transform: translateY(-50%); } }

.site-footer { display: grid; grid-template-columns: 1fr auto; gap: 2.5rem; align-items: end; max-width: var(--frame); margin: 0 auto; padding: 5rem var(--gutter) 2rem; border-top: 1px solid var(--line); }
.footer-mark { grid-column: 1 / -1; font: italic clamp(4.8rem, 12vw, 9rem)/.82 var(--display); letter-spacing: -.05em; }
.footer-meta { display: flex; gap: 2rem; color: var(--muted); font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; }
.footer-meta p { margin: 0; }
.site-footer > a { font-size: .68rem; font-weight: 600; letter-spacing: .11em; text-transform: uppercase; }
.site-footer > a span { color: var(--accent); }

.reveal, .image-reveal { opacity: 1; transform: none; }
.js .reveal, .js .image-reveal { opacity: 0; transform: translateY(1rem); transition: opacity .65s var(--ease), transform .65s var(--ease); }
.js .reveal.is-visible, .js .image-reveal.is-visible { opacity: 1; transform: none; }

@media (max-width: 900px) {
  .desktop-nav, .header-cta { display: none; }
  .site-header { grid-template-columns: 1fr auto; height: 62px; }
  .menu-toggle { display: flex; gap: .7rem; align-items: center; padding: .4rem 0; border: 0; background: transparent; font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; }
  .menu-toggle i, .menu-toggle i::after { display: block; width: 1.15rem; height: 1px; background: currentColor; transition: transform .25s; }
  .menu-toggle i { position: relative; }
  .menu-toggle i::after { content: ""; position: absolute; top: .33rem; }
  .menu-toggle[aria-expanded="true"] i { transform: rotate(45deg); }
  .menu-toggle[aria-expanded="true"] i::after { top: 0; transform: rotate(90deg); }
  .mobile-menu { position: fixed; z-index: 90; inset: 0; display: flex; flex-direction: column; justify-content: center; gap: .6rem; padding: 5rem var(--gutter) 2rem; background: var(--ink); }
  .mobile-menu[hidden] { display: none; }
  .mobile-menu a { font: clamp(2.8rem, 12vw, 4.8rem)/1 var(--display); }
  .manifesto { grid-template-columns: 1.25fr .75fr; }
  .craft, .project-section { margin-right: var(--gutter); margin-left: var(--gutter); }
  .dish-grid { grid-template-columns: repeat(2, 1fr); }
  .gallery-layout { grid-template-columns: .75fr 1.25fr; gap: 2rem; }
  .testimonial-columns { grid-template-columns: repeat(2, 1fr); }
  .testimonial-column-tertiary { display: none; }
}

@media (max-width: 640px) {
  :root { --section: 3.5rem; }
  .hero-copy { top: 28%; left: var(--gutter); }
  .hero h1 { font-size: clamp(4.6rem, 21vw, 6.6rem); }
  .hero-line { margin-left: 0; font-size: 1.22rem; }
  .hero-action { right: auto; bottom: 1.7rem; left: var(--gutter); }
  .manifesto, .craft, .project-section, .gallery-layout { grid-template-columns: 1fr; }
  .manifesto { gap: 2rem; }
  .manifesto h2, .section-heading h2, .craft h2, .project-copy h2, .gallery-copy h2, .reviews-heading h2 { font-size: clamp(2.25rem, 9.8vw, 3rem); }
  .manifesto-image { justify-self: end; width: 46%; }
  .craft, .project-section { gap: 2rem; padding: 2.8rem var(--gutter); }
  .craft-image, .project-image { width: min(74vw, 18rem); }
  .craft-image img { aspect-ratio: 4 / 3; }
  .project-image { order: 1; justify-self: end; }
  .project-copy { order: 2; }
  .dish-grid { grid-template-columns: 1fr 1fr; gap: 1.5rem .85rem; }
  .dish img { aspect-ratio: 1; }
  .dish h3 { font-size: .98rem; }
  .ingredient-break { min-height: 17rem; margin: 1rem var(--gutter); }
  .ingredient-break img { height: 17rem; }
  .ingredient-break p { bottom: 1.4rem; font-size: clamp(2rem, 9.5vw, 3rem); }
  .gallery-layout { gap: 2.2rem; }
  .gallery-copy p { font-size: .9rem; }
  .gallery-stage { min-height: 22rem; }
  .gallery-stack { width: 14.5rem; height: 18rem; }
  .stack-card img { height: 12.7rem; }
  .gallery-stack:hover .stack-card.is-left, .gallery-stack:focus-within .stack-card.is-left { transform: translate(-22px, 3px) rotate(-3deg); }
  .gallery-stack:hover .stack-card.is-right, .gallery-stack:focus-within .stack-card.is-right { transform: translate(22px, 1px) rotate(3deg); }
  .testimonial-columns { grid-template-columns: 1fr; max-width: 19rem; max-height: 27rem; margin: 0 auto; }
  .testimonial-column-secondary, .testimonial-column-tertiary { display: none; }
  .testimonial-card blockquote { font-size: 1.08rem; }
  .site-footer { display: block; padding-top: 4rem; }
  .footer-mark { margin-bottom: 3rem; font-size: 22vw; }
  .footer-meta { display: block; margin-bottom: 1.6rem; }
  .footer-meta p + p { margin-top: .4rem; }
}

@media (max-width: 430px) {
  .dish-grid { grid-template-columns: 1fr; }
  .dish { display: grid; grid-template-columns: 7rem 1fr; gap: .9rem; align-items: center; }
  .dish img { width: 7rem; height: 7rem; }
  .dish div { padding-top: 0; border-top: 0; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .testimonial-columns { max-height: none; mask-image: none; }
  .testimonial-track { transform: none !important; }
  .testimonial-set[data-clone="true"] { display: none; }
}

@media (prefers-contrast: more) {
  :root { --muted: #d0cdc6; --line: rgba(255,255,255,.42); }
}