/* FOMO OLIVE — complete stylesheet. Original cascade order preserved. */

/* ===== styles.css ===== */
/* FOMO — the warm, playful alternative.
   All layout and content are real HTML. Artwork is kept in /assets.
   Change the six core tokens here to recolour the whole site. */
:root {
  --cream: #f8f1e6;
  --cream-light: #fcf7ee;
  --sand: #eddbc3;
  --copper: #ae5b32;
  --copper-light: #d89053;
  --espresso: #2b2520;
  --ink: #28241f;
  --muted: #635a51;
  --border: rgba(64, 43, 27, .15);
  --sans: 'DM Sans', 'Inter', Arial, sans-serif;
  --script: 'Caveat', 'Segoe Print', 'Z003', 'URW Chancery L', cursive;
  --ease: cubic-bezier(.22,.8,.25,1);
  --header-height: 102px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 105px; }
body { margin: 0; color: var(--ink); background: var(--cream); font: 400 16px/1.6 var(--sans); -webkit-font-smoothing: antialiased; }
body.modal-open { overflow: hidden; }
body.nav-open { overflow: hidden; }
button, input, select { font: inherit; }
button, a, input, select { -webkit-tap-highlight-color: transparent; }
button, a { touch-action: manipulation; }
button { color: inherit; }
a { color: inherit; text-decoration: none; }
button { cursor: pointer; }
button:disabled { cursor: not-allowed; }
button, input, select { border-radius: 0; }
img, svg { display: block; }
img { max-width: 100%; height: auto; }
p, h1, h2, h3 { margin: 0; }
button { border: 0; }
::selection { color: var(--cream-light); background: var(--copper); }
:focus-visible { outline: 3px solid var(--copper-light); outline-offset: 5px; }
[hidden] { display: none !important; }
.container { width: min(1280px, calc(100% - 112px)); margin-inline: auto; }
.icon-library { position: absolute; width: 0; height: 0; overflow: hidden; }
.icon { width: 22px; height: 22px; flex-shrink: 0; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.script { font-family: var(--script); font-weight: 500; line-height: 1.05; }
.text-copper { color: var(--copper); }
.eyebrow { margin-bottom: 12px; font-size: 12px; font-weight: 750; line-height: 1.4; letter-spacing: .17em; color: var(--copper); }
h2 { font-size: clamp(38px, 3.8vw, 56px); font-weight: 800; line-height: 1.04; letter-spacing: -.052em; }
.skip-link { position: fixed; z-index: 500; top: 12px; left: 12px; padding: 12px 18px; background: var(--espresso); color: white; transform: translateY(-160%); border-radius: 8px; }
.skip-link:focus { transform: translateY(0); }
.button { display: inline-flex; min-height: 53px; justify-content: center; align-items: center; gap: 17px; padding: 14px 25px; border-radius: 999px; border: 1.5px solid transparent; font-size: 14px; line-height: 1.2; font-weight: 650; white-space: nowrap; transition: background .25s, color .25s, transform .3s var(--ease), box-shadow .3s; }
.button .icon { width: 19px; height: 19px; transition: transform .3s var(--ease); }
.button:hover { transform: translateY(-2px); }
.button:hover .icon { transform: translateX(4px); }
.button:active { transform: translateY(0); }
.button-primary { background: var(--copper); color: #fff8ef; box-shadow: inset 0 0 0 1px rgba(255,255,255,.15); }
.button-primary:hover { background: #944922; box-shadow: 0 7px 20px #75331124; }
.button-outline { border-color: var(--copper); color: var(--copper); background: transparent; }
.button-outline:hover { background: var(--copper); color: var(--cream-light); }
.text-link { display: inline-flex; align-items: center; gap: 12px; padding: 0 0 4px; background: none; color: var(--copper); font-size: 14px; font-weight: 700; border-bottom: 1px solid currentColor; transition: gap .3s; }
.text-link .icon { width: 21px; height: 21px; }
.text-link:hover { gap: 20px; }
.page-top { position: absolute; top: 0; }
.announcement { background: var(--espresso); color: var(--cream-light); }
.announcement-inner { position: relative; min-height: 36px; display: flex; justify-content: center; align-items: center; }
.announcement p { font-size: 10px; font-weight: 700; letter-spacing: .2em; }
.announcement p span { margin-inline: 7px; color: var(--copper-light); }
.announcement-mark { position: absolute; left: 1px; color: var(--copper-light); font-size: 19px; }
.announcement-note { position: absolute; right: 0; font-size: 20px; opacity: .9; }
.site-header { position: sticky; top: 0; z-index: 100; background: rgba(248,241,230,.96); transition: box-shadow .35s, background .35s; }
.site-header.is-scrolled { background: rgba(248,241,230,.97); box-shadow: 0 5px 30px rgba(56,40,26,.07); }
.header-inner { height: var(--header-height); display: flex; align-items: center; justify-content: space-between; gap: 34px; transition: height .3s; }
.site-header.is-scrolled .header-inner { height: 80px; }
.brand { display: flex; align-items: center; gap: 13px; flex-shrink: 0; color: var(--espresso); }
.brand-mark { display: block; width: 57px; }
.brand-mark svg { width: 100% !important; height: auto !important; }
.brand-type { display: flex; flex-direction: column; }
.brand-name { font-size: 38px; line-height: .96; font-weight: 500; letter-spacing: -.055em; }
.brand-tagline { margin-top: 7px; font-size: 6.6px; font-weight: 700; line-height: 1.3; letter-spacing: .14em; }
.desktop-nav { display: flex; justify-content: center; align-items: center; gap: 29px; margin-left: auto; }
.nav-link { font-size: 12px; font-weight: 650; position: relative; padding-block: 10px; }
.nav-link::after { content: ''; position: absolute; bottom: 5px; left: 0; width: 100%; height: 1.5px; background: var(--copper); transform-origin: left; transform: scaleX(0); transition: transform .3s; }
.nav-link:hover::after, .nav-link.is-current::after { transform: scaleX(1); }
.nav-link.is-current { color: var(--copper); }
.header-actions { display: flex; align-items: center; gap: 17px; }
.header-book { font-size: 12px; min-height: 47px; padding: 13px 23px; }
.menu-toggle { display: none; width: 44px; height: 44px; background: transparent; position: relative; }
.menu-toggle span { position: absolute; width: 23px; height: 2px; background: var(--espresso); top: 16px; left: 11px; transition: transform .3s, top .3s; }
.menu-toggle span:last-child { top: 25px; }
.menu-toggle[aria-expanded=true] span { top: 21px; transform: rotate(45deg); }
.menu-toggle[aria-expanded=true] span:last-child { transform: rotate(-45deg); }
.mobile-nav { display: none; }
/* Hero: organic cut-out art with live, accessible text. */
.hero { position: relative; overflow: hidden; background: radial-gradient(ellipse at 45% 55%, #fff9ee99, transparent 67%), var(--cream); }
.hero-inner { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto auto; grid-template-areas: 'copy art' 'values art'; min-height: 630px; padding-top: 46px; padding-bottom: 86px; }
.hero-copy { position: relative; grid-area: copy; z-index: 5; padding-top: 18px; margin-right: -88px; pointer-events: none; }
.hero-copy a { pointer-events: auto; }
.hero-note { position: relative; width: max-content; font-size: 38px; color: var(--copper); margin-bottom: 20px; transform: rotate(-5deg); }
.hero-note svg { position: absolute; bottom: -6px; left: 5px; width: 94%; fill: none; stroke: var(--copper); stroke-width: 1.3; }
h1 { font-size: clamp(56px, 5.75vw, 83px); line-height: 1.02; letter-spacing: -.064em; font-weight: 850; margin-bottom: 25px; }
h1 span { white-space: nowrap; color: var(--copper); }
.hero-description { font-size: 18px; line-height: 1.65; max-width: 460px; }
.hero-buttons { display: flex; flex-wrap: wrap; gap: 16px; margin-top: 26px; }
.hero-values { grid-area: values; position: relative; display: flex; z-index: 5; margin-top: 38px; align-self: start; max-width: 445px; }
.hero-values>div { display: flex; flex: 1; min-width: 0; flex-direction: column; gap: 11px; align-items: center; border-right: 1px solid var(--border); padding-inline: 10px; }
.hero-values>div:first-child { padding-left: 0; }
.hero-values>div:last-child { border-right: 0; }
.hero-values .icon { width: 30px; height: 30px; stroke-width: 1.3; }
.hero-values span { font-size: 11px; font-weight: 500; white-space: nowrap; }
.hero-art { position: relative; grid-area: art; min-height: 485px; margin-right: -50px; margin-top: -28px; pointer-events: none; }
.hero-dark-shape { position: absolute; top: -29px; left: 20%; width: 102%; height: 117%; fill: var(--espresso); transform: rotate(-5deg); }
.copper-circle { width: 58%; aspect-ratio: 1; position: absolute; top: 35px; left: -5%; background: radial-gradient(circle at 30% 30%, #d89959, #c77840); border-radius: 48% 53% 51% 45%; transform: rotate(-20deg); }
.copper-circle::after { content: ''; position: absolute; inset: 7px; border-radius: inherit; border: 1px solid #ffdfa767; }
.circle-sketch { position: absolute; width: 61%; top: 17px; left: -7%; fill: none; stroke: #fff8dfbf; stroke-width: 3; stroke-linecap: round; }
.hero-food-float { position: absolute; width: 114%; max-width: 795px; top: 90px; right: -40px; z-index: 3; animation: float-food 8s ease-in-out infinite; }
.hero-food { width: 100%; max-width: none; filter: drop-shadow(0 22px 14px rgba(46,30,11,.13)); }
.hero-annotation { position: absolute; top: 38px; right: 21px; z-index: 4; transform: rotate(-9deg); color: var(--cream-light); font-size: 28px; line-height: .98; text-align: center; }
.hero-annotation span { display: block; font-size: 43px; line-height: 1.2; color: #e5a566; transform: rotate(-5deg); }
.hero-rays { position: absolute; width: 100px; left: -89px; top: 65px; fill: none; stroke: var(--copper); stroke-width: 2; stroke-linecap: round; }
.hero-arrow { position: absolute; width: 135px; left: -85px; bottom: -4px; fill: none; stroke: var(--copper); stroke-width: 2.2; stroke-linecap: round; }
.hero-bottom-wave { position: absolute; width: 100%; height: 63px; bottom: -1px; left: 0; fill: var(--cream-light); pointer-events: none; }
.hero-corner { width: 120px; height: 120px; background: var(--sand); clip-path: polygon(0 0,100% 57%,0 88%); position: absolute; left: 0; bottom: 10px; z-index: 0; }
/* Menu */
.section-space { padding: 65px 0; }
.menu-section { position: relative; background: var(--cream-light); padding-top: 31px; padding-bottom: 52px; }
.section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 45px; position: relative; margin-bottom: 31px; }
.section-intro { max-width: 415px; padding-bottom: 5px; margin-right: 55px; }
.section-intro p { font-size: 15px; line-height: 1.65; margin-bottom: 17px; }
.doodle-sprig { width: 57px; height: 94px; stroke-width: 1.4; color: var(--copper); }
.section-heading>.doodle-sprig { position: absolute; right: -5px; bottom: 4px; transform: rotate(14deg); }
.menu-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 23px; }
.menu-card { display: block; position: relative; overflow: hidden; isolation: isolate; border-radius: 25px; aspect-ratio: 1.08; background: var(--sand); padding: 0; text-align: left; box-shadow: 0 5px 10px #3925140a; }
.menu-card::after { content: ''; position: absolute; inset: 45% 0 0; background: linear-gradient(transparent, rgba(25,17,12,.75)); z-index: 1; pointer-events: none; }
.menu-card>img { width: 100%; height: 100%; object-fit: cover; transition: transform .7s var(--ease), filter .7s; }
.menu-card:hover>img { transform: scale(1.075); filter: saturate(1.06); }
.menu-card-info { position: absolute; left: 20px; right: 15px; bottom: 16px; display: flex; justify-content: space-between; align-items: center; z-index: 2; gap: 10px; color: white; font-size: 20px; font-weight: 700; letter-spacing: -.03em; }
.circle-arrow { display: flex; align-items: center; justify-content: center; width: 43px; height: 43px; border-radius: 50%; background: var(--cream-light); color: var(--copper); flex-shrink: 0; transition: transform .35s, background .35s, color .35s; }
.circle-arrow .icon { width: 20px; height: 20px; }
.menu-card:hover .circle-arrow { background: var(--copper); color: white; transform: rotate(-35deg); }
.menu-footnote { display: flex; align-items: center; justify-content: center; gap: 10px; margin-top: 23px; color: var(--muted); font-size: 11px; letter-spacing: .045em; }
.tiny-spark { font-size: 19px; color: var(--copper); }
/* The story has its own cut-paper silhouette, instead of a rectangular panel. */
.story-section { position: relative; padding: 40px 0 47px; background: var(--cream-light); overflow: hidden; }
.story-wash { position: absolute; inset: 0; width: 100%; height: 100%; fill: #f2e8d8; }
.story-inner { position: relative; display: grid; grid-template-columns: 1fr 1fr 1.07fr; align-items: center; gap: 45px; min-height: 300px; }
.story-title-wrap { position: relative; height: 295px; display: flex; align-items: center; z-index: 2; }
.story-blob { position: absolute; width: calc(100% + 120px); height: 360px; top: -43px; right: -3px; fill: var(--espresso); }
.story-title-wrap h2 { font-size: 59px; font-weight: 400; line-height: 1.05; letter-spacing: -.025em; position: relative; color: #fff8ed; transform: rotate(-9deg); margin-top: -3px; white-space: nowrap; }
.story-title-wrap h2 span { font-size: 43px; position: absolute; right: -22px; top: -2px; color: var(--copper-light); }
.story-underline { position: absolute; width: 255px; bottom: 36px; left: 19px; fill: none; stroke: var(--copper-light); stroke-width: 2.3; transform: rotate(-7deg); }
.story-copy { position: relative; z-index: 3; padding-left: 3px; }
.story-copy p { font-size: 15px; line-height: 1.75; margin-bottom: 24px; }
.story-copy .button { min-height: 48px; padding: 13px 23px; font-size: 12px; }
.story-art { position: relative; min-height: 300px; }
.story-art img { position: absolute; width: 115%; max-width: none; right: -63px; top: -5px; filter: drop-shadow(0 15px 12px #48311c1f); transform: rotate(-3deg); }
.story-scribble { color: var(--copper); position: absolute; z-index: 2; left: -6px; top: -10px; font-size: 28px; transform: rotate(-12deg); }
.story-art .doodle-sprig { position: absolute; left: -3px; bottom: 1px; width: 55px; transform: rotate(-48deg); }
/* Atmosphere: accessible image lightbox by default, real video when configured. */
.atmosphere-section { background: var(--cream-light); padding-top: 41px; padding-bottom: 24px; }
.atmosphere-section .section-heading { margin-bottom: 30px; }
.atmosphere-section .section-intro { margin-right: 0; padding-bottom: 0; }
.atmosphere-section .section-intro p { margin-bottom: 0; }
.gallery-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 21px; }
.gallery-card { position: relative; isolation: isolate; overflow: hidden; padding: 0; border-radius: 23px; aspect-ratio: 1.82; background: var(--espresso); color: white; text-align: left; }
.gallery-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .75s var(--ease), opacity .5s; }
.gallery-card:hover img { transform: scale(1.055); opacity: .92; }
.gallery-card::after { content: ''; position: absolute; inset: 30% 0 0; background: linear-gradient(transparent,rgba(20,16,13,.76)); z-index: 1; pointer-events: none; }
.gallery-open { display: flex; position: absolute; left: 50%; top: 48%; transform: translate(-50%,-50%); align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 50%; border: 1px solid #ffffffb3; background: var(--cream-light); color: var(--copper); z-index: 2; box-shadow: 0 0 0 7px #ffffff17; transition: box-shadow .35s, background .35s, color .35s; }
.gallery-open .icon { width: 21px; height: 21px; }
.gallery-card:hover .gallery-open { background: var(--copper); color: #fff8ed; box-shadow: 0 0 0 12px #ffffff17; }
.gallery-card-caption { position: absolute; display: flex; justify-content: space-between; align-items: center; gap: 12px; left: 20px; right: 18px; bottom: 17px; z-index: 2; }
.gallery-card-caption>span:first-child { font-size: 14px; font-weight: 650; }
.gallery-card-action { display: flex; gap: 6px; align-items: center; font-size: 10px; opacity: 0; transform: translateX(-6px); transition: opacity .3s, transform .3s; }
.gallery-card-action .icon { width: 14px; height: 14px; }
.gallery-card:hover .gallery-card-action { opacity: 1; transform: none; }
.atmosphere-signoff { display: flex; align-items: center; justify-content: center; gap: 13px; color: var(--copper); font-size: 32px; margin: 30px 0 20px; transform: rotate(-3deg); }
.atmosphere-signoff svg { width: 69px; fill: none; stroke: var(--copper); stroke-width: 1.2; }
/* Transparent booking treatment, with cream controls. No solid form card. */
.booking-section { position: relative; background: var(--espresso); color: #fff9f0; overflow: hidden; padding: 56px 0 64px; }
.booking-wave { width: 100%; height: 45px; position: absolute; left: 0; pointer-events: none; z-index: 3; }
.booking-wave-top { top: -1px; transform: rotate(180deg); fill: var(--cream-light); }
.booking-wave-bottom { bottom: -1px; fill: var(--cream); }
.booking-inner { display: grid; grid-template-columns: .94fr 1.18fr; gap: 45px; align-items: center; position: relative; z-index: 4; }
.booking-copy .eyebrow { color: #daa273; font-size: 9px; margin-bottom: 11px; letter-spacing: .2em; }
.booking-copy h2 { font-size: clamp(29px, 3vw, 42px); line-height: 1.13; letter-spacing: -.045em; }
.booking-copy>.script { display: inline-block; position: relative; margin-top: 15px; color: #e1a26a; font-size: 34px; transform: rotate(-5deg); }
.booking-copy>.script svg { position: absolute; left: 4px; bottom: -10px; width: 100%; fill: none; stroke: #e1a26a; stroke-width: 1.4; }
.booking-form { display: grid; grid-template-columns: 1fr auto; gap: 9px 12px; padding: 9px 0 0; position: relative; }
.booking-fields { display: grid; grid-template-columns: 1.25fr .88fr .96fr; gap: 10px; }
.field { min-width: 0; }
.field label { display: block; font-size: 10px; line-height: 1.4; margin: 0 0 7px 2px; color: #f3e5d4; }
.field-control { position: relative; }
.field-control>.icon { pointer-events: none; position: absolute; top: 18px; left: 12px; width: 16px; height: 16px; z-index: 2; color: #665744; }
.field input, .field select { border: 1px solid #fff9ed; border-radius: 10px; background: var(--cream-light); color: var(--ink); min-height: 53px; width: 100%; min-width: 0; font-size: 11px; padding: 14px 9px 14px 36px; appearance: none; outline-offset: 3px; }
.field select { padding-right: 22px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='m2 2 4 4 4-4' stroke='%23665744' fill='none'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 7px center; }
.field input[type=date]::-webkit-calendar-picker-indicator { position: absolute; opacity: 0; width: 100%; height: 100%; left: 0; top: 0; cursor: pointer; }
.booking-submit { align-self: end; border-radius: 10px; padding-inline: 18px; font-size: 11px; gap: 12px; }
.booking-submit .icon { width: 16px; height: 16px; }
.booking-note { grid-column: 1/-1; padding-left: 2px; color: #e0c8b4; font-size: 9px; line-height: 1.6; margin-top: 3px; }
.booking-note a { text-decoration: underline; }
.booking-decor { position: absolute; right: -25px; top: 0; height: 100%; width: 25%; z-index: 1; opacity: .48; mask-image: linear-gradient(to right, transparent, #000 50%); }
.booking-decor img { width: 100%; height: 130%; object-fit: cover; object-position: 50% 65%; mix-blend-mode: luminosity; transform: rotate(-12deg); }
.booking-section::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg,transparent 20%,#2b2520b3 72%,transparent); z-index: 2; pointer-events: none; }
/* Footer */
.site-footer { padding: 28px 0 17px; }
.footer-inner { display: flex; align-items: center; justify-content: space-between; gap: 28px; padding-bottom: 27px; }
.brand-footer .brand-mark { width: 38px; }
.brand-footer .brand-name { font-size: 27px; }
.brand-footer .brand-tagline { display: none; }
.footer-brand>p { font-size: 11px; color: var(--muted); margin-top: 9px; }
.footer-nav { display: flex; gap: 24px; font-size: 11px; font-weight: 600; }
.footer-nav a, .footer-social a { transition: color .25s; }
.footer-nav a:hover, .footer-social a:hover { color: var(--copper); }
.footer-social { display: flex; gap: 19px; padding-left: 34px; border-left: 1px solid var(--border); }
.footer-social>a { display: flex; align-items: center; justify-content: center; width: 30px; height: 36px; }
.footer-social .icon { width: 19px; height: 19px; }
.back-top .icon { transform: rotate(-90deg); }
.footer-bottom { border-top: 1px solid var(--border); padding-top: 15px; display: flex; justify-content: space-between; gap: 15px; font-size: 9px; color: var(--muted); letter-spacing: .025em; }
/* Dialogs: keyboard accessible, with native focus management and escape close. */
.modal { width: min(900px, calc(100% - 40px)); max-height: min(90dvh, 950px); margin: auto; border: 1px solid #e8d8c3; border-radius: 27px; background: var(--cream-light); color: var(--ink); box-shadow: 0 35px 100px #160b0766; padding: 40px; overflow-y: auto; overscroll-behavior: contain; }
.modal::backdrop { background: #20160f9c; backdrop-filter: blur(7px); }
.modal[open] { animation: modal-in .3s var(--ease); }
.modal h2 { font-size: 43px; }
.modal-close { position: absolute; right: 18px; top: 18px; width: 38px; height: 38px; display: flex; align-items: center; justify-content: center; border: 1px solid var(--border); border-radius: 50%; background: var(--cream-light); z-index: 4; transition: transform .25s, background .25s; }
.modal-close:hover { transform: rotate(90deg); background: var(--sand); }
.modal-heading>p:last-child { color: var(--muted); margin-top: 9px; font-size: 14px; }
.menu-tabs { display: flex; gap: 7px; flex-wrap: wrap; margin: 26px 0; }
.menu-tabs button { padding: 10px 19px; border-radius: 30px; font-size: 12px; font-weight: 650; background: transparent; border: 1px solid var(--border); transition: color .25s, background .25s; }
.menu-tabs button[aria-selected=true] { background: var(--copper); border-color: var(--copper); color: white; }
.menu-panel { display: grid; grid-template-columns: .9fr 1fr; gap: 28px; align-items: stretch; }
.menu-panel>img { width: 100%; height: 100%; min-height: 285px; max-height: 390px; object-fit: cover; border-radius: 18px; }
.menu-panel.is-changing { animation: menu-change .3s var(--ease); }
.menu-panel h3 { font-size: 27px; line-height: 1.15; letter-spacing: -.04em; margin-bottom: 9px; }
.menu-item { padding: 12px 0; border-bottom: 1px solid var(--border); }
.menu-item:last-child { border-bottom: 0; }
.menu-item h4 { font-size: 14px; line-height: 1.4; margin: 0 0 4px; }
.menu-item p { font-size: 12px; line-height: 1.6; color: var(--muted); }
.menu-dialog-footer { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-top: 28px; padding-top: 23px; border-top: 1px solid var(--border); }
.menu-dialog-footer p { color: var(--muted); font-size: 11px; max-width: 350px; }
.menu-dialog-footer .button { font-size: 12px; min-height: 47px; }
.story-modal { width: min(760px, calc(100% - 40px)); padding: 0; }
.story-dialog-image { width: 100%; max-height: 250px; object-fit: cover; }
.story-dialog-copy { padding: 30px 40px 37px; }
.story-dialog-copy>p:not(.eyebrow):not(.script) { font-size: 14px; margin-top: 17px; color: var(--muted); }
.story-dialog-copy>.script { font-size: 34px; color: var(--copper); margin: 22px 0; }
.gallery-modal { width: min(1050px, calc(100% - 40px)); padding: 0; }
.gallery-media { position: relative; background: var(--espresso); }
.gallery-media img, .gallery-media video { width: 100%; max-height: 64dvh; height: auto; object-fit: contain; }
.gallery-modal-footer { display: flex; align-items: center; justify-content: space-between; gap: 22px; padding: 25px 30px 30px; }
.gallery-modal-footer h2 { font-size: 30px; }
.gallery-modal-footer .eyebrow { font-size: 9px; margin-bottom: 7px; }
.gallery-modal-footer p:last-child { font-size: 12px; margin-top: 7px; color: var(--muted); }
.gallery-controls { display: flex; align-items: center; gap: 14px; }
.gallery-controls>button { display: flex; align-items: center; justify-content: center; background: transparent; border: 1px solid var(--border); border-radius: 50%; width: 40px; height: 40px; }
.gallery-controls>button:hover { background: var(--sand); }
.gallery-controls>button:first-child .icon { transform: rotate(180deg); }
.gallery-controls>span { font-size: 11px; white-space: nowrap; }
.booking-modal { max-width: 585px; text-align: center; padding: 40px 35px; }
.booking-modal-icon { display: flex; margin: 0 auto 18px; width: 52px; height: 52px; border: 1px solid var(--border); border-radius: 50%; align-items: center; justify-content: center; color: var(--copper); }
.booking-summary { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; margin: 23px 0; }
.booking-summary span { display: inline-flex; gap: 6px; align-items: center; padding: 8px 12px; border-radius: 8px; background: #eddbc366; font-size: 12px; font-weight: 600; }
.booking-preview-note { font-size: 12px; line-height: 1.8; color: var(--muted); }
.booking-preview-note strong { display: block; color: var(--ink); }
.booking-modal-actions { display: flex; flex-direction: column; gap: 11px; margin-top: 24px; }
.toast { position: fixed; bottom: 24px; left: 50%; transform: translate(-50%,25px); max-width: calc(100% - 32px); z-index: 600; border-radius: 12px; padding: 13px 22px; color: white; background: var(--espresso); box-shadow: 0 5px 30px #0003; font-size: 13px; text-align: center; opacity: 0; pointer-events: none; transition: opacity .25s, transform .25s; }
.toast.is-visible { opacity: 1; transform: translate(-50%,0); }
/* Motion is progressively enhanced; content is never hidden without JavaScript. */
@keyframes float-food { 0%,100% { transform: translateY(0) rotate(-.25deg); } 50% { transform: translateY(-9px) rotate(.35deg); } }
@keyframes rise-in { from { opacity: 0; translate: 0 18px; } to { opacity: 1; translate: 0 0; } }
@keyframes art-in { from { opacity: 0; translate: 30px 10px; } to { opacity: 1; translate: 0 0; } }
@keyframes modal-in { from { opacity: 0; transform: translateY(20px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes menu-change { from { opacity: .45; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.intro-item { animation: rise-in .8s var(--ease) both; }
.hero-copy .intro-item:nth-child(2) { animation-delay: .08s; }
.hero-copy .intro-item:nth-child(3) { animation-delay: .16s; }
.hero-copy .intro-item:nth-child(4) { animation-delay: .24s; }
.hero-values { animation-delay: .3s; }
.hero-art { animation: art-in 1s var(--ease) .12s both; }
.reveal { transition: opacity .7s var(--ease), translate .7s var(--ease); }
.reveal.will-reveal { opacity: 0; translate: 0 20px; }
.reveal.is-visible { opacity: 1; translate: 0 0; }
.menu-grid .reveal:nth-child(2), .gallery-grid .reveal:nth-child(2) { transition-delay: .08s; }
.menu-grid .reveal:nth-child(3), .gallery-grid .reveal:nth-child(3) { transition-delay: .16s; }
.menu-grid .reveal:nth-child(4) { transition-delay: .24s; }
@media (min-width: 1600px) {
 .hero-art { margin-right: -74px; }
 .hero-inner { min-height: 650px; }
 .hero-food-float { width: 121%; top: 78px; right: -54px; }
}
@media (max-width: 1200px) {
 .container { width: calc(100% - 80px); }
 .desktop-nav { gap: 22px; }
 .header-inner { gap: 25px; }
 .brand-name { font-size: 34px; }
 .brand-mark { width: 48px; }
 .hero-inner { min-height: 593px; }
 .hero-copy { margin-right: -65px; }
 h1 { font-size: 68px; }
 .hero-note { font-size: 34px; }
 .hero-art { margin-right: -24px; min-height: 452px; }
 .hero-food-float { top: 123px; width: 120%; right: -46px; }
 .hero-annotation { right: 3px; font-size: 25px; }
 .hero-arrow { left: -59px; width: 109px; }
 .hero-rays { width: 74px; left: -45px; top: 73px; }
 .hero-description { font-size: 16px; }
 .hero-values { max-width: 410px; }
 .section-intro { max-width: 350px; margin-right: 45px; }
 .section-intro p { font-size: 13px; }
 .menu-grid { gap: 18px; }
 .menu-card-info { font-size: 18px; left: 15px; right: 12px; }
 .circle-arrow { width: 37px; height: 37px; }
 .story-inner { gap: 28px; min-height: 260px; }
 .story-title-wrap h2 { font-size: 49px; }
 .story-title-wrap { height: 260px; }
 .story-blob { height: 310px; top: -25px; }
 .story-copy p { font-size: 13px; }
 .story-art { min-height: 260px; }
 .story-art img { top: 20px; right: -36px; }
 .story-underline { width: 210px; bottom: 33px; left: 2px; }
 .story-scribble { font-size: 24px; top: -3px; }
 .booking-inner { gap: 28px; grid-template-columns: .8fr 1.2fr; }
 .booking-form { grid-template-columns: 1fr; }
 .booking-submit { min-height: 45px; justify-self: end; width: 170px; }
 .booking-note { grid-row: 2; padding-right: 180px; align-self: center; font-size: 8px; }
 .booking-submit { grid-column: 1; grid-row: 2; }
 .footer-nav { gap: 19px; }
 .gallery-card-action { display: none; }
}
@media (max-width: 1020px) {
 .container { width: calc(100% - 56px); }
 .announcement-note { font-size: 16px; }
 .header-inner { gap: 18px; }
 .desktop-nav { gap: 16px; }
 .nav-link { font-size: 11px; }
 .header-book { padding-inline: 17px; gap: 10px; }
 .brand-name { font-size: 30px; }
 .brand-mark { width: 43px; }
 .brand { gap: 9px; }
 .brand-tagline { font-size: 5.4px; }
 h1 { font-size: 60px; }
 .hero-inner { min-height: 574px; }
 .hero-note { font-size: 31px; }
 .hero-buttons { gap: 10px; }
 .hero-buttons .button { font-size: 12px; padding-inline: 20px; min-height: 49px; }
 .hero-food-float { top: 145px; width: 123%; right: -47px; }
 .hero-art { margin-right: -10px; }
 .hero-annotation { top: 37px; right: 0; }
 .hero-description { max-width: 365px; }
 .hero-values { max-width: 360px; }
 .hero-values span { font-size: 10px; }
 .hero-values .icon { width: 28px; height: 28px; }
 .hero-rays { left: -30px; }
 h2 { font-size: 43px; }
 .section-intro { max-width: 310px; }
 .story-inner { grid-template-columns: .9fr 1fr 1fr; gap: 27px; }
 .story-title-wrap h2 { font-size: 42px; }
 .story-copy p { font-size: 12px; }
 .story-art img { width: 130%; top: 34px; right: -48px; }
 .story-scribble { top: 10px; left: -7px; }
 .story-underline { width: 183px; bottom: 53px; }
 .story-art .doodle-sprig { height: 60px; bottom: 13px; }
 .gallery-grid { gap: 16px; }
 .gallery-card-caption { left: 14px; bottom: 13px; }
 .gallery-card-caption>span:first-child { font-size: 12px; }
 .gallery-open { width: 42px; height: 42px; }
 .footer-social { gap: 10px; padding-left: 20px; }
 .footer-nav { gap: 14px; font-size: 10px; }
}
@media (max-width: 800px) {
 :root { --header-height: 88px; }
 .container { width: calc(100% - 44px); }
 .announcement-note { display: none; }
 .announcement-mark { display: none; }
 .announcement-inner { min-height: 32px; }
 .announcement p { font-size: 9px; }
 .desktop-nav { display: none; }
 .menu-toggle { display: block; }
 .brand-name { font-size: 34px; }
 .brand-mark { width: 45px; }
 .brand-tagline { font-size: 5.9px; }
 .header-actions { gap: 10px; }
 .site-header.is-scrolled .header-inner { height: 74px; }
 .mobile-nav { display: block; visibility: hidden; position: absolute; top: 100%; left: 0; right: 0; background: var(--cream); height: calc(100dvh - 74px); overflow-y: auto; opacity: 0; transform: translateY(-10px); transition: opacity .25s, transform .25s, visibility .25s; border-top: 1px solid var(--border); }
 .mobile-nav.is-open { visibility: visible; opacity: 1; transform: none; }
 .mobile-nav-inner { padding: 20px 0 45px; display: flex; flex-direction: column; }
 .mobile-nav a:not(.button) { display: flex; align-items: center; justify-content: space-between; font-size: 27px; font-weight: 650; letter-spacing: -.035em; padding: 13px 0; border-bottom: 1px solid var(--border); }
 .mobile-nav a>span { font-size: 10px; font-weight: 500; color: var(--copper); letter-spacing: 0; }
 .mobile-nav .button { margin-top: 25px; align-self: flex-start; }
 .mobile-nav p { margin-top: 26px; font-size: 26px; color: var(--copper); }
 .hero-inner { min-height: 0; grid-template-columns: 1fr; grid-template-areas: 'copy' 'art' 'values'; grid-template-rows: auto auto auto; padding-top: 24px; padding-bottom: 52px; }
 .hero-copy { margin-right: 0; padding-top: 7px; }
 h1 { font-size: clamp(51px, 8.7vw, 72px); line-height: 1.02; margin-bottom: 19px; }
 .hero-note { font-size: 34px; margin-bottom: 21px; }
 .hero-description { font-size: 16px; max-width: 440px; }
 .hero-buttons { gap: 12px; margin-top: 22px; }
 .hero-buttons .button { min-height: 49px; padding-inline: 24px; font-size: 13px; }
 .hero-art { margin: 19px -22px 0; min-height: 435px; }
 .hero-dark-shape { top: 0; left: 36%; width: 89%; height: 106%; transform: rotate(-2deg); }
 .copper-circle { width: 43%; left: 19%; top: 26px; }
 .circle-sketch { width: 46%; left: 17%; top: 16px; }
 .hero-food-float { top: 27px; right: -23px; width: 87%; max-width: 615px; }
 .hero-annotation { top: 15px; right: 20px; font-size: 26px; }
 .hero-rays { top: 69px; left: 10%; width: 70px; }
 .hero-arrow { left: 6%; bottom: -9px; width: 115px; }
 .hero-values { max-width: none; justify-content: center; margin-top: 26px; }
 .hero-values>div { padding: 0 13px; }
 .hero-values span { font-size: 11px; }
 .hero-values .icon { width: 28px; height: 28px; }
 .hero-bottom-wave { height: 33px; }
 .hero-corner { width: 72px; height: 65px; bottom: 13px; }
 .section-space { padding-top: 42px; padding-bottom: 37px; }
 .section-heading { gap: 20px; margin-bottom: 24px; }
 h2 { font-size: 42px; }
 .section-intro { max-width: 275px; margin-right: 0; }
 .section-intro p { font-size: 12px; }
 .section-heading>.doodle-sprig { display: none; }
 .wide-break { display: none; }
 .menu-grid { grid-template-columns: repeat(2,1fr); gap: 18px; }
 .menu-card { aspect-ratio: 1.18; border-radius: 21px; }
 .menu-card-info { font-size: 22px; left: 19px; bottom: 15px; }
 .circle-arrow { width: 40px; height: 40px; }
 .menu-footnote { margin-top: 20px; }
 .story-section { padding: 35px 0; }
 .story-inner { grid-template-columns: .85fr 1fr; grid-template-areas: 'title art' 'copy art'; gap: 10px 25px; min-height: 370px; }
 .story-title-wrap { grid-area: title; height: 190px; }
 .story-blob { width: calc(100% + 175px); height: 475px; top: -44px; right: -41px; }
 .story-title-wrap h2 { font-size: 49px; }
 .story-title-wrap h2 span { right: -8px; top: -5px; font-size: 39px; }
 .story-underline { bottom: 15px; left: -3px; width: 199px; }
 .story-copy { grid-area: copy; color: var(--cream-light); padding: 0 0 7px; }
 .story-copy p { font-size: 12px; margin-bottom: 16px; }
 .story-copy .button { min-height: 43px; font-size: 11px; }
 .story-art { grid-area: art; min-height: 345px; }
 .story-art img { width: 135%; top: 58px; right: -69px; }
 .story-scribble { top: 1px; left: 5px; font-size: 29px; }
 .story-art .doodle-sprig { height: 75px; bottom: 9px; left: 28px; }
 .atmosphere-section { padding-top: 45px; }
 .atmosphere-section .section-heading { margin-bottom: 23px; }
 .gallery-grid { gap: 13px; }
 .gallery-card { aspect-ratio: 1.14; border-radius: 18px; }
 .gallery-open { width: 39px; height: 39px; top: 40%; box-shadow: 0 0 0 4px #ffffff20; }
 .gallery-open .icon { width: 18px; height: 18px; }
 .gallery-card-caption { left: 11px; right: 8px; bottom: 12px; }
 .gallery-card-caption>span:first-child { font-size: 11px; line-height: 1.3; }
 .atmosphere-signoff { font-size: 29px; margin: 26px 0 5px; }
 .booking-inner { grid-template-columns: 1fr; gap: 32px; }
 .booking-copy h2 { font-size: 39px; }
 .booking-copy>.script { font-size: 34px; }
 .booking-section { padding: 55px 0; }
 .booking-form { width: 100%; max-width: 650px; grid-template-columns: 1fr auto; align-items: end; }
 .booking-submit { grid-column: 2; grid-row: 1; min-height: 53px; width: auto; }
 .booking-note { grid-column: 1/-1; grid-row: 2; padding-right: 0; font-size: 9px; }
 .field label { font-size: 11px; }
 .field input, .field select { font-size: 12px; }
 .booking-decor { width: 37%; right: -2%; opacity: .45; }
 .footer-inner { flex-wrap: wrap; gap: 25px; }
 .footer-brand { flex: 1; }
 .footer-nav { order: 3; width: 100%; justify-content: center; font-size: 12px; gap: 28px; }
 .footer-social { border-left: 0; padding-left: 0; gap: 15px; }
 .footer-bottom { font-size: 9px; }
}
@media (max-width: 580px) {
 .container { width: calc(100% - 40px); }
 :root { --header-height: 78px; }
 .header-book { display: none; }
 .header-inner { gap: 12px; }
 .brand-mark { width: 43px; }
 .brand-name { font-size: 31px; }
 .brand-tagline { font-size: 5.3px; }
 .hero-inner { padding-top: 13px; padding-bottom: 43px; }
 .hero-note { font-size: 28px; margin-bottom: 21px; }
 h1 { font-size: clamp(38px, 10.6vw, 61px); letter-spacing: -.06em; line-height: 1.04; margin-bottom: 18px; }
 .hero-description { font-size: 14px; line-height: 1.65; max-width: 365px; }
 .desktop-break { display: none; }
 .hero-buttons { gap: 10px; margin-top: 21px; }
 .hero-buttons .button { min-height: 47px; font-size: 11px; padding: 12px 19px; gap: 12px; }
 .hero-buttons .button .icon { width: 17px; height: 17px; }
 .hero-art { margin: 20px -20px 0; min-height: clamp(285px, 82vw, 428px); }
 .hero-dark-shape { left: 33%; top: 3%; width: 88%; height: 103%; }
 .copper-circle { width: 52%; left: 5%; top: 33px; }
 .circle-sketch { width: 56%; left: 3%; top: 19px; }
 .hero-food-float { width: 105%; top: 58px; right: -33px; }
 .hero-annotation { top: 17px; right: 28px; font-size: 22px; line-height: .98; }
 .hero-annotation span { font-size: 34px; }
 .hero-rays { width: 42px; top: 69px; left: 3%; }
 .hero-arrow { width: 72px; bottom: -2px; left: 3%; }
 .hero-values { margin-top: 25px; }
 .hero-values>div { gap: 9px; padding-inline: 6px; }
 .hero-values .icon { width: 25px; height: 25px; }
 .hero-values span { font-size: 9px; }
 .hero-corner { height: 55px; bottom: 4px; }
 .section-space { padding-top: 33px; padding-bottom: 30px; }
 .eyebrow { font-size: 10px; letter-spacing: .16em; margin-bottom: 10px; }
 h2 { font-size: 37px; }
 .section-heading { display: block; margin-bottom: 23px; }
 .section-intro { max-width: none; padding-bottom: 0; margin-top: 15px; }
 .section-intro p { font-size: 12px; line-height: 1.65; max-width: 380px; margin-bottom: 12px; }
 .menu-section .section-intro>p { display: none; }
 .text-link { font-size: 12px; gap: 9px; padding-bottom: 2px; }
 .text-link .icon { width: 17px; height: 17px; }
 .menu-grid { gap: 13px; }
 .menu-card { border-radius: 18px; aspect-ratio: .99; }
 .menu-card-info { font-size: 16px; left: 12px; right: 9px; bottom: 11px; gap: 5px; }
 .circle-arrow { width: 32px; height: 32px; }
 .circle-arrow .icon { width: 16px; height: 16px; }
 .menu-footnote { font-size: 9px; letter-spacing: .01em; margin-top: 15px; gap: 7px; }
 .tiny-spark { font-size: 16px; }
 .story-section { padding-top: 27px; padding-bottom: 25px; }
 .story-inner { min-height: 393px; grid-template-columns: 1fr .63fr; gap: 5px 0; }
 .story-title-wrap { height: 165px; }
 .story-title-wrap h2 { font-size: 41px; margin-top: 4px; }
 .story-title-wrap h2 span { font-size: 30px; right: -6px; }
 .story-blob { width: calc(100% + 220px); right: -162px; height: 463px; top: -23px; }
 .story-underline { width: 175px; bottom: 7px; left: -1px; }
 .story-copy { max-width: 225px; padding-bottom: 16px; }
 .story-copy p { font-size: 11px; line-height: 1.7; margin-bottom: 16px; }
 .story-copy .button { min-height: 41px; padding-inline: 19px; }
 .story-art { min-height: 352px; align-self: end; z-index: 3; pointer-events: none; }
 .story-art img { top: 146px; right: -150px; width: 315px; transform: rotate(-12deg); filter: drop-shadow(0 13px 8px #17100939); }
 .story-scribble { font-size: 23px; left: 12px; top: 70px; color: #e7b17c; }
 .story-art .doodle-sprig { color: #d59b60; left: auto; right: -13px; bottom: -7px; height: 50px; }
 .atmosphere-section { padding-top: 30px; padding-bottom: 21px; }
 .atmosphere-section .section-heading { margin-bottom: 22px; }
 .atmosphere-section .section-intro { margin-top: 13px; }
 .gallery-grid { gap: 10px; }
 .gallery-card { aspect-ratio: .76; border-radius: 14px; }
 .gallery-card img { object-position: center; }
 .gallery-open { width: 32px; height: 32px; top: 38%; }
 .gallery-open .icon { width: 16px; height: 16px; }
 .gallery-card-caption { left: 9px; right: 7px; bottom: 12px; }
 .gallery-card-caption>span:first-child { font-size: 10px; line-height: 1.35; }
 .atmosphere-signoff { font-size: 24px; gap: 7px; margin-top: 24px; }
 .atmosphere-signoff svg { width: 39px; }
 .booking-section { padding: 48px 0 52px; }
 .booking-inner { gap: 31px; }
 .booking-copy .eyebrow { font-size: 9px; }
 .booking-copy h2 { font-size: 33px; }
 .booking-copy>.script { font-size: 29px; margin-top: 13px; }
 .booking-form { grid-template-columns: 1fr; gap: 14px; }
 .booking-fields { gap: 8px; grid-template-columns: 1.25fr .87fr 1fr; }
 .field-control>.icon { width: 14px; height: 14px; top: 17px; left: 9px; }
 .field input, .field select { min-height: 49px; border-radius: 8px; font-size: 10px; padding-left: 29px; padding-right: 5px; }
 .field select { padding-right: 18px; background-position: right 4px center; }
 .field label { font-size: 10px; }
 .booking-submit { grid-column: 1; grid-row: 2; width: 100%; min-height: 49px; font-size: 12px; }
 .booking-note { grid-row: 3; text-align: center; font-size: 8px; margin-top: -4px; }
 .booking-decor { width: 50%; right: -15%; opacity: .25; }
 .booking-wave { height: 30px; }
 .site-footer { padding-top: 22px; }
 .footer-inner { row-gap: 24px; padding-bottom: 22px; }
 .brand-footer .brand-mark { width: 32px; }
 .brand-footer .brand-name { font-size: 25px; }
 .footer-brand>p { font-size: 9px; margin-top: 8px; }
 .footer-social { gap: 8px; }
 .footer-social>a { width: 25px; }
 .footer-social .icon { width: 17px; height: 17px; }
 .footer-nav { gap: 22px; font-size: 10px; }
 .footer-bottom { font-size: 8px; line-height: 1.6; }
 .footer-bottom>span:last-child { display: none; }
 .modal { width: calc(100% - 24px); padding: 30px 21px; border-radius: 20px; max-height: 91dvh; }
 .modal h2 { font-size: 36px; }
 .modal-close { width: 33px; height: 33px; top: 13px; right: 13px; }
 .modal-close .icon { width: 18px; height: 18px; }
 .modal-heading>.eyebrow { max-width: 230px; font-size: 9px; }
 .modal-heading>p:last-child { font-size: 12px; }
 .menu-tabs { gap: 6px; margin: 20px 0; }
 .menu-tabs button { padding: 9px 13px; font-size: 10px; }
 .menu-panel { grid-template-columns: 1fr; gap: 22px; }
 .menu-panel>img { max-height: 150px; min-height: 150px; object-position: center 44%; }
 .menu-panel h3 { font-size: 24px; }
 .menu-item { padding-block: 9px; }
 .menu-item h4 { font-size: 13px; }
 .menu-item p { font-size: 11px; }
 .menu-dialog-footer { flex-direction: column; align-items: stretch; gap: 15px; margin-top: 17px; padding-top: 16px; }
 .menu-dialog-footer p { font-size: 10px; }
 .story-modal, .gallery-modal { padding: 0; }
 .story-dialog-copy { padding: 25px 22px 30px; }
 .story-dialog-copy>p:not(.eyebrow):not(.script) { font-size: 12px; }
 .gallery-modal-footer { flex-direction: column; align-items: flex-start; padding: 22px; }
 .gallery-modal-footer h2 { font-size: 29px; }
 .gallery-controls { align-self: flex-end; }
 .gallery-controls>button { width: 35px; height: 35px; }
 .booking-modal { padding-top: 36px; }
 .booking-preview-note { font-size: 11px; }
 .booking-modal-actions .button { font-size: 12px; }
}
@media (max-width: 360px) {
 .container { width: calc(100% - 32px); }
 .hero-note { font-size: 26px; }
 h1 { font-size: 36px; }
 .hero-buttons { gap: 8px; }
 .hero-buttons .button { padding-inline: 15px; font-size: 10px; }
 .hero-description { font-size: 13px; }
 .hero-food-float { right: -30px; }
 .hero-annotation { right: 16px; font-size: 20px; }
 .hero-values span { font-size: 8px; }
 h2 { font-size: 33px; }
 .menu-card-info { font-size: 14px; left: 9px; }
 .circle-arrow { width: 28px; height: 28px; }
 .story-title-wrap h2 { font-size: 36px; }
 .story-copy p { font-size: 10px; }
 .story-art img { width: 280px; right: -149px; }
 .atmosphere-signoff { font-size: 21px; }
 .gallery-grid { gap: 8px; }
 .gallery-card-caption { left: 7px; }
 .gallery-card-caption>span:first-child { font-size: 9px; }
 .booking-copy h2 { font-size: 30px; }
 .field input, .field select { font-size: 9px; }
 .footer-nav { gap: 18px; }
}
@media (prefers-reduced-motion: reduce) {
 html { scroll-behavior: auto; }
 *, *::before, *::after { animation: none !important; transition-duration: .01ms !important; }
 .reveal.will-reveal { opacity: 1; translate: 0 0; }
}
@media print {
 .site-header { position: static; }
 .header-book, .menu-toggle, .gallery-open, .booking-form, .modal, .toast, .footer-social { display: none !important; }
 .reveal { opacity: 1 !important; translate: none !important; }
 .hero-art, .story-art { break-inside: avoid; }
 body { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* Optical alignment: preserve the complete hero plate and keep imagery off the trust icons. */
@media (min-width: 801px) {
 .hero-food-float { top: auto; bottom: -35px; }
}
@media (min-width: 1201px) {
 .hero-food-float { width: 108%; }
}
@media (min-width: 1021px) {
 .story-art img { width: 105%; top: -10px; }
}
@media (max-width: 580px) {
 .hero-food-float { width: 102%; top: 33px; }
 .story-art img { top: 96px; }
 .story-scribble { top: 24px; }
}

/* ===== extended.css ===== */
/* FOMO / Extended homepage. Existing palette, logo and first sections preserved. */
.extended-space { padding-block: 92px; }
.extended-intro { max-width: 365px; padding-bottom: 5px; }
.extended-intro > p { font-size: 16px; line-height: 1.7; color: var(--muted); }
.extended-intro > .script { margin-top: 12px; color: var(--copper); font-size: 29px; transform: rotate(-3deg); }
.signature-section { background: var(--cream-light); padding-top: 50px; padding-bottom: 85px; }
.signature-section .section-heading { margin-bottom: 32px; }
.signature-tabs { display: flex; gap: 9px; margin-bottom: 24px; flex-wrap: wrap; }
.signature-tabs button { display: inline-flex; align-items: center; gap: 10px; min-height: 49px; padding: 12px 21px; border: 1px solid var(--border); border-radius: 40px; background: transparent; font-size: 14px; font-weight: 600; transition: background .25s, color .25s, border-color .25s; }
.signature-tabs button .icon { width: 20px; height: 20px; }
.signature-tabs button:hover { background: var(--sand); }
.signature-tabs button[aria-selected=true] { background: var(--espresso); border-color: var(--espresso); color: var(--cream-light); }
.signature-panel { display: grid; grid-template-columns: 1.1fr 1fr; gap: 10px; background: #f1e4d2; border: 1px solid #e5d2ba; border-radius: 34px; min-height: 500px; overflow: hidden; position: relative; }
.signature-visual { position: relative; min-width: 0; min-height: 460px; align-self: stretch; isolation: isolate; }
.signature-orbit { position: absolute; width: 78%; aspect-ratio: 1; left: 6%; top: 11%; background: #dca574; border-radius: 48% 52% 57% 43%; transform: rotate(-14deg); }
.signature-orbit::after { content: ''; position: absolute; inset: -12px; border: 1px solid var(--copper); border-radius: 47% 53% 46% 54%; opacity: .35; }
.signature-visual > img { position: absolute; width: 112%; max-width: none; left: -3%; top: 17%; filter: drop-shadow(0 20px 13px #7e51232b); object-fit: contain; }
.signature-visual[data-cutout=false] > img { width: 71%; height: 73%; left: 14%; top: 14%; object-fit: cover; border-radius: 48% 48% 45% 47%; box-shadow: 0 20px 25px #53301818; }
.signature-handnote { position: absolute; z-index: 2; top: 27px; left: 28px; font-size: 28px; color: var(--copper); transform: rotate(-7deg); }
.signature-seal { position: absolute; right: 10px; bottom: 25px; width: 100px; height: 100px; background: var(--espresso); color: var(--cream-light); border: 5px solid #f1e4d2; border-radius: 50%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 7px; transform: rotate(10deg); z-index: 3; }
.signature-seal .icon { width: 24px; height: 24px; color: var(--copper-light); }
.signature-seal span { text-align: center; font-size: 9px; line-height: 1.35; letter-spacing: .15em; }
.signature-copy { position: relative; padding: 49px 54px 42px 40px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; }
.signature-copy h3 { font-size: clamp(40px,4.15vw,60px); line-height: 1.02; letter-spacing: -.06em; font-weight: 800; margin-bottom: 22px; }
.signature-copy > p:not(.eyebrow):not(.signature-smallprint) { font-size: 16px; line-height: 1.75; color: #5d5042; max-width: 430px; }
.signature-pairing { border-top: 1px solid #c4a98a66; padding-top: 18px; margin: 23px 0; width: 100%; }
.signature-pairing > span { display: block; font-size: 10px; font-weight: 700; letter-spacing: .15em; color: var(--copper); margin-bottom: 5px; }
.signature-pairing p { font-size: 13px; font-weight: 500; }
.signature-pairing p span { padding-inline: 7px; color: var(--copper); }
.signature-smallprint { font-size: 11px; color: var(--muted); line-height: 1.6; margin-top: 15px; }
.signature-panel.is-switching .signature-visual > img, .signature-panel.is-switching .signature-copy { animation: featured-change .42s var(--ease) both; }
@keyframes featured-change { from { opacity: .15; translate: 0 12px; } to { opacity: 1; translate: 0 0; } }
.fomo-ribbon { background: var(--copper); color: var(--cream-light); position: relative; overflow: hidden; border-top: 1px solid #94502d; border-bottom: 1px solid #94502d; padding: 21px 0; }
.ribbon-track { display: flex; gap: 40px; align-items: center; width: max-content; animation: fomo-roll 50s linear infinite; }
.ribbon-track > span { font-size: 36px; font-weight: 800; line-height: 1.15; letter-spacing: -.04em; white-space: nowrap; }
.ribbon-track > .ribbon-outline { color: transparent; -webkit-text-stroke: 1px var(--cream-light); }
.ribbon-track > .script { font-size: 44px; font-weight: 400; }
.ribbon-track > i { font-size: 28px; line-height: 1; font-style: normal; color: #edbe95; }
.fomo-ribbon.is-paused .ribbon-track, .fomo-ribbon:hover .ribbon-track, .fomo-ribbon:focus-within .ribbon-track { animation-play-state: paused; }
#ribbon-toggle { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); width: 34px; height: 34px; border-radius: 50%; background: var(--cream-light); color: var(--copper); display: flex; align-items: center; justify-content: center; box-shadow: 0 2px 20px #5b341155; }
#ribbon-toggle .icon { width: 15px; height: 15px; }
@keyframes fomo-roll { to { transform: translateX(-50%); } }
.story-section { padding-top: 72px; padding-bottom: 65px; background: var(--cream-light); }
.coffee-section { background: var(--cream-light); padding-top: 84px; padding-bottom: 96px; overflow: hidden; }
.coffee-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 85px; align-items: center; }
.coffee-collage { min-height: 520px; position: relative; }
.coffee-arch { position: absolute; inset: 0 19% 55px 3%; border-radius: 48% 48% 10px 10px; overflow: hidden; transform: rotate(-3deg); background: var(--sand); }
.coffee-arch img { width: 100%; height: 100%; object-fit: cover; object-position: 51% 50%; }
.coffee-arch::after { content: ''; position: absolute; inset: 13px; border-radius: inherit; border: 1px solid #fff9ed77; }
.coffee-polaroid { position: absolute; width: 63%; right: -6px; bottom: -5px; margin: 0; background: #fffaf0; padding: 11px 11px 9px; transform: rotate(7deg); box-shadow: 0 8px 35px #60432326; }
.coffee-polaroid img { width: 100%; aspect-ratio: 1.67; object-fit: cover; }
.coffee-polaroid figcaption { font-size: 28px; color: var(--copper); text-align: center; padding: 12px 0 5px; }
.coffee-stamp { position: absolute; right: 0; top: 45px; width: 142px; height: 142px; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 8px; border: 1px solid var(--copper); border-radius: 50%; background: var(--cream); color: var(--copper); font-size: 10px; letter-spacing: .17em; transform: rotate(12deg); box-shadow: 0 0 0 8px var(--cream-light); }
.coffee-stamp .icon { width: 37px; height: 37px; }
.coffee-stamp > span { letter-spacing: -.03em; font-family: var(--script); font-size: 26px; }
.coffee-lines { position: absolute; bottom: 25px; left: 5px; width: 76px; fill: none; stroke: var(--copper); stroke-width: 1.5; }
.coffee-copy > p:not(.eyebrow):not(.script) { font-size: 16px; line-height: 1.8; color: var(--muted); margin-top: 24px; max-width: 490px; }
.coffee-copy h2 { font-size: clamp(39px,3.8vw,55px); }
.coffee-notes { display: grid; gap: 17px; margin: 27px 0 30px; }
.coffee-notes > div { display: flex; gap: 16px; align-items: center; }
.coffee-notes .icon { width: 31px; height: 31px; color: var(--copper); }
.coffee-notes span { font-size: 13px; color: var(--muted); line-height: 1.6; }
.coffee-notes strong { display: block; font-size: 14px; color: var(--ink); font-weight: 650; }
.coffee-actions { display: flex; gap: 24px; align-items: center; flex-wrap: wrap; }
.coffee-signoff { font-size: 29px; margin-top: 30px; transform: rotate(-3deg); color: var(--copper); }
.atmosphere-section { padding-top: 65px; padding-bottom: 75px; }
.occasions-section { background: #f1e6d5; position: relative; overflow: hidden; padding-block: 86px; }
.occasions-section::before, .occasions-section::after { content: ''; position: absolute; width: 110%; left: -5%; height: 50px; border-radius: 50%; background: var(--cream-light); pointer-events: none; }
.occasions-section::before { top: -32px; transform: rotate(-1deg); }
.occasions-section::after { bottom: -36px; transform: rotate(1deg); }
.occasions-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 70px; align-items: center; }
.occasions-copy > p:not(.eyebrow) { color: var(--muted); font-size: 16px; line-height: 1.75; margin-top: 23px; max-width: 505px; }
.occasion-list { margin: 22px 0 27px; }
.occasion-item { display: flex; align-items: center; gap: 16px; padding: 19px 0; border-bottom: 1px solid #c8ad8e66; }
.occasion-item > .icon:first-child { width: 26px; height: 26px; color: var(--copper); }
.occasion-item > .icon:last-child { width: 19px; height: 19px; margin-left: auto; transition: transform .3s; }
.occasion-item:hover > .icon:last-child { transform: translateX(5px) rotate(-20deg); }
.occasion-item > span { color: var(--muted); font-size: 13px; line-height: 1.55; }
.occasion-item strong { display: block; font-size: 16px; color: var(--ink); font-weight: 650; margin-bottom: 3px; }
.occasions-art { position: relative; height: 520px; min-width: 0; }
.occasions-room { width: 88%; height: 78%; margin-left: auto; object-fit: cover; border-radius: 140px 140px 25px 25px; object-position: 40% 50%; transform: rotate(3deg); }
.occasion-food { position: absolute; right: -18px; bottom: -8px; width: 65%; filter: drop-shadow(0 14px 10px #4d321e33); transform: rotate(-8deg); }
.occasion-photo-note { position: absolute; left: -2%; bottom: 31px; padding: 20px 23px 24px; background: var(--cream-light); color: var(--copper); box-shadow: 0 6px 19px #6d4b2424; transform: rotate(-7deg); z-index: 2; max-width: 54%; }
.occasion-photo-note::before { content: ''; position: absolute; width: 75px; height: 22px; top: -9px; left: 26%; background: #cea57973; transform: rotate(5deg); }
.occasion-photo-note .script { font-size: 29px; }
.occasion-photo-note .icon { width: 27px; height: 27px; margin-top: 14px; }
.occasion-spark { position: absolute; top: 36px; left: 2px; font-size: 74px; color: var(--copper); transform: rotate(-12deg); line-height: 1; }
.visit-section { background: var(--cream-light); }
.visit-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; }
.visit-card { position: relative; display: flex; flex-direction: column; align-items: flex-start; border: 1px solid #deccb4; border-radius: 24px; padding: 29px; overflow: hidden; }
.visit-icon { width: 51px; height: 51px; display: flex; align-items: center; justify-content: center; border: 1px solid var(--border); border-radius: 50%; color: var(--copper); margin-bottom: 26px; }
.visit-icon .icon { width: 25px; height: 25px; }
.visit-card-label { font-size: 10px; font-weight: 700; letter-spacing: .14em; color: var(--copper); margin-bottom: 10px; }
.visit-card h3 { font-size: 31px; line-height: 1.1; letter-spacing: -.045em; margin-bottom: 17px; }
.visit-card > p, #visit-hours > p { font-size: 14px; line-height: 1.75; color: var(--muted); position: relative; z-index: 1; }
.visit-card > .text-link { margin-top: auto; padding-top: 26px; font-size: 13px; position: relative; z-index: 1; }
.visit-find { background: var(--espresso); color: var(--cream-light); border-color: var(--espresso); }
.visit-find .visit-icon { color: #e9b07e; border-color: #be9e7f66; }
.visit-find .visit-card-label { color: #e6ad7d; }
.visit-find > p { color: #ddd0bf; }
.visit-find > .text-link { color: #eab584; }
.visit-path { position: absolute; width: 150px; right: -45px; bottom: -5px; fill: none; stroke: #ae5b3266; stroke-width: 2; stroke-dasharray: 5 8; }
.visit-note { margin-top: 18px; color: var(--muted); font-size: 11px; text-align: center; }
.faq-section { background: var(--cream); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.faq-inner { display: grid; grid-template-columns: .85fr 1.15fr; align-items: start; gap: 85px; }
.faq-intro h2 { font-size: clamp(38px,3.5vw,51px); }
.faq-intro > p:not(.eyebrow) { margin: 24px 0; color: var(--muted); font-size: 16px; line-height: 1.7; max-width: 320px; }
.faq-doodle { display: block; color: var(--copper); margin-top: 48px; font-size: 35px; transform: rotate(-7deg); padding-left: 16px; }
.faq-doodle svg { display: inline-block; width: 111px; vertical-align: top; margin-left: 15px; fill: none; stroke: var(--copper); stroke-width: 1.5; transform: rotate(-15deg); }
.faq-list { border-top: 1px solid #d7c6b0; }
.faq-item { border-bottom: 1px solid #d7c6b0; position: relative; }
.faq-item summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 25px; font-size: 16px; line-height: 1.5; font-weight: 600; padding: 22px 0; cursor: pointer; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary:hover { color: var(--copper); }
.faq-plus { flex-shrink: 0; width: 29px; height: 29px; border: 1px solid #d7bda2; border-radius: 50%; position: relative; }
.faq-plus::before, .faq-plus::after { content: ''; position: absolute; height: 1.5px; width: 11px; background: var(--copper); top: 12px; left: 8px; transition: transform .3s; }
.faq-plus::after { transform: rotate(90deg); }
.faq-item[open] .faq-plus::after { transform: rotate(0); }
.faq-item[open] summary { color: var(--copper); }
.faq-answer { padding: 0 40px 23px 0; }
.faq-answer p { font-size: 14px; line-height: 1.8; color: var(--muted); }
.faq-answer a, .inline-button { color: var(--copper); text-decoration: underline; text-underline-offset: 3px; }
.inline-button { padding: 0; background: transparent; font: inherit; display: inline; }
.social-section { background: var(--cream-light); padding-bottom: 64px; overflow: hidden; }
.instagram-link { display: inline-flex; align-items: center; gap: 12px; border-bottom: 1px solid var(--copper); padding-bottom: 7px; color: var(--copper); font-size: 14px; font-weight: 600; }
.instagram-link .icon { width: 20px; height: 20px; }
.social-grid { display: grid; grid-template-columns: repeat(5,1fr); gap: 18px; padding: 14px 3px 24px; }
.social-tile { position: relative; background: #fffaf2; border: 1px solid #e6d7c3; padding: 8px 8px 13px; box-shadow: 0 5px 13px #63432210; transition: transform .35s var(--ease), box-shadow .35s; transform: rotate(-3deg); }
.social-tile:nth-child(even) { transform: rotate(3deg) translateY(13px); }
.social-tile:nth-child(3) { transform: rotate(-1deg) translateY(-7px); }
.social-tile > img { width: 100%; aspect-ratio: .96; object-fit: cover; }
.social-tile > span { position: absolute; right: 16px; top: 16px; width: 31px; height: 31px; background: #fff9eeec; border-radius: 50%; display: flex; justify-content: center; align-items: center; }
.social-tile > span .icon { width: 17px; height: 17px; color: var(--copper); }
.social-tile p { text-align: center; color: var(--copper); font-size: 24px; padding-top: 13px; white-space: nowrap; }
.social-tile:hover { transform: translateY(-7px) rotate(0); box-shadow: 0 13px 26px #63432222; z-index: 1; }
.social-bottom { display: flex; align-items: center; justify-content: space-between; gap: 25px; padding-top: 16px; font-size: 12px; color: var(--muted); }
.social-bottom > span:last-child { font-size: 10px; }
.booking-section { padding-top: 87px; padding-bottom: 91px; }
.booking-note { font-size: 11px; }
.field label { font-size: 12px; }
.field input, .field select { font-size: 13px; }
.booking-submit { font-size: 13px; }
.footer-expanded { position: relative; background: var(--espresso); color: var(--cream-light); margin-top: 67px; padding: 12px 0 22px; }
.footer-wave { position: absolute; left: 0; bottom: calc(100% - 1px); width: 100%; height: 69px; fill: var(--espresso); }
.footer-invitation { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 55px; padding: 30px 0 55px; border-bottom: 1px solid #ffffff26; }
.footer-invitation .eyebrow { color: #e2a372; }
.footer-invitation h2 { font-size: clamp(37px,3.5vw,51px); line-height: 1.1; }
.footer-invitation h2 .script { display: inline-block; font-size: 1.2em; line-height: 1.05; letter-spacing: -.03em; color: #e3ac7e; transform: rotate(-3deg); margin-top: 8px; font-weight: 400; }
.footer-invitation > div:last-of-type { text-align: right; z-index: 1; }
.footer-invitation .button { background: #bc693b; }
.footer-invitation .button:hover { background: #cc7849; }
.footer-invitation > div > p:last-child:not(.eyebrow) { font-size: 12px; color: #c8bba9; margin-top: 14px; }
.footer-heart { position: absolute; left: 57%; top: 36%; color: #d08c53; transform: rotate(-18deg); }
.footer-heart .icon { width: 70px; height: 70px; stroke-width: 1; }
.footer-grid { display: grid; grid-template-columns: 1.25fr .85fr 1fr 1.15fr; gap: 45px; padding-top: 49px; padding-bottom: 38px; }
.footer-expanded .brand { color: var(--cream-light); gap: 12px; }
.footer-expanded .brand-name { font-size: 40px; }
.footer-expanded .brand-mark { width: 48px; }
.footer-expanded .brand-tagline { display: block; font-size: 6.2px; }
.footer-about > p { font-size: 14px; line-height: 1.8; color: #c7bcad; margin-top: 23px; max-width: 265px; }
.footer-about > .footer-motto { font-size: 12px; margin-top: 13px; color: #e3aa7a; }
.footer-social-links { display: flex; gap: 10px; margin-top: 23px; }
.footer-social-links > a { width: 39px; height: 39px; display: flex; align-items: center; justify-content: center; border: 1px solid #c5a38370; border-radius: 50%; transition: color .25s, background .25s; }
.footer-social-links .icon { width: 19px; height: 19px; }
.footer-social-links > a:hover { color: var(--espresso); background: #e1af83; }
.footer-column { display: flex; flex-direction: column; align-items: flex-start; }
.footer-column h3 { font-size: 14px; font-weight: 600; line-height: 1.5; color: #fff6e8; margin: 0 0 22px; }
.footer-column > a { font-size: 13px; line-height: 1.6; color: #cbbbA8; margin-bottom: 12px; display: inline-flex; align-items: center; gap: 7px; transition: color .2s; }
.footer-column > a:hover { color: #eeb788; }
.footer-column > a > .icon { width: 17px; height: 17px; }
.footer-hours-heading { display: flex; align-items: center; gap: 10px; color: #e3b087; font-size: 13px; font-weight: 500; margin-bottom: 9px; }
.footer-hours-heading .icon { width: 19px; height: 19px; }
.footer-hours-heading strong { font-weight: 500; }
#footer-opening-hours p { color: #c7bcad; font-size: 13px; line-height: 1.8; }
.footer-column > .footer-hours-link { color: #eab98e; margin-top: 12px; border-bottom: 1px solid #987657; padding-bottom: 4px; font-size: 12px; }
.footer-address { display: flex; gap: 9px; color: #b9ab98; font-size: 12px; line-height: 1.65; margin-top: 8px; }
.footer-address > .icon { width: 17px; height: 17px; margin-top: 3px; }
.footer-contact-details { display: grid; gap: 7px; margin-top: 9px; font-size: 13px; overflow-wrap: anywhere; }
.footer-contact-details a { color: #e3b087; }
.hours-list { margin: 0; width: 100%; display: grid; gap: 7px; }
.hours-list > div { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 16px; font-size: 12px; }
.hours-list dt, .hours-list dd { margin: 0; }
.hours-list dd { font-weight: 600; }
.footer-wordmark { display: flex; justify-content: space-between; gap: 20px; align-items: center; font-size: clamp(25px,5.4vw,79px); letter-spacing: -.055em; font-weight: 800; line-height: 1.2; color: #e1c2a01f; border-top: 1px solid #ffffff14; padding: 18px 0 23px; user-select: none; }
.footer-wordmark i { font-size: .5em; font-style: normal; color: #b477403f; }
.footer-end { border-top: 1px solid #ffffff26; padding-top: 21px; display: flex; align-items: center; justify-content: space-between; gap: 25px; font-size: 11px; color: #b9ab99; }
.footer-end > div { display: flex; flex-wrap: wrap; align-items: center; gap: 23px; }
.footer-end button { color: inherit; font: inherit; padding: 7px 0; background: transparent; }
.footer-end button:hover, .footer-end a:hover { color: #edb886; }
.footer-back-top { display: inline-flex; gap: 10px; align-items: center; }
.footer-back-top .icon { width: 18px; height: 18px; transform: rotate(-90deg); }
.info-modal { max-width: 670px; padding: 42px; }
.site-info-copy p { font-size: 15px; line-height: 1.85; color: var(--muted); margin-top: 20px; }
.site-info-copy h3 { font-size: 20px; line-height: 1.3; margin-top: 25px; }
.site-info-copy a { text-decoration: underline; color: var(--copper); text-underline-offset: 3px; }
@media (min-width: 1021px) { .nav-link { font-size: 13px; } }
@media (max-width: 1200px) {
 .signature-copy { padding: 40px 37px 35px 26px; }
 .signature-panel { min-height: 465px; }
 .signature-visual { min-height: 420px; }
 .signature-visual > img { top: 23%; }
 .signature-seal { width: 84px; height: 84px; right: 7px; bottom: 25px; }
 .coffee-inner { gap: 50px; }
 .coffee-collage { min-height: 480px; }
 .occasions-inner { gap: 50px; }
 .occasions-art { height: 485px; }
 .visit-card { padding: 25px; }
 .visit-card h3 { font-size: 28px; }
 .faq-inner { gap: 50px; }
 .footer-grid { gap: 30px; grid-template-columns: 1.2fr .9fr 1fr 1.15fr; }
 .social-grid { gap: 15px; }
 .social-tile p { font-size: 22px; }
 .booking-note { font-size: 10px; }
}
@media (max-width: 1020px) {
 .extended-space { padding-block: 70px; }
 .signature-section { padding-top: 40px; }
 .signature-tabs { gap: 8px; }
 .signature-tabs button { padding: 11px 14px; font-size: 12px; }
 .signature-copy h3 { font-size: 45px; }
 .signature-copy > p:not(.eyebrow):not(.signature-smallprint) { font-size: 14px; }
 .signature-handnote { font-size: 25px; top: 22px; left: 25px; }
 .signature-pairing p { font-size: 12px; }
 .signature-visual > img { width: 117%; top: 26%; left: -8%; }
 .coffee-inner { gap: 37px; }
 .coffee-copy h2 { font-size: 40px; }
 .coffee-copy > p:not(.eyebrow):not(.script) { font-size: 14px; }
 .coffee-collage { min-height: 456px; }
 .coffee-stamp { width: 112px; height: 112px; right: -3px; }
 .coffee-stamp > span { font-size: 22px; }
 .coffee-stamp .icon { width: 29px; height: 29px; }
 .coffee-stamp { font-size: 8px; }
 .coffee-polaroid { width: 76%; }
 .coffee-actions { gap: 18px; }
 .coffee-actions .button { padding-inline: 20px; font-size: 12px; }
 .coffee-actions .text-link { font-size: 12px; }
 .coffee-signoff { font-size: 25px; }
 .occasions-inner { gap: 34px; }
 .occasions-copy > p:not(.eyebrow) { font-size: 14px; }
 .occasion-item strong { font-size: 14px; }
 .occasion-item > span { font-size: 12px; }
 .occasion-item { gap: 12px; }
 .occasion-photo-note .script { font-size: 26px; }
 .occasions-art { height: 455px; }
 .occasions-room { width: 94%; }
 .occasion-photo-note { max-width: 70%; bottom: 22px; }
 .occasion-food { bottom: -2px; width: 75%; }
 .occasions-copy > .text-link { font-size: 12px; }
 .occasion-spark { left: -7px; font-size: 63px; }
 .visit-grid { gap: 16px; }
 .visit-card { padding: 24px 20px; }
 .visit-card h3 { font-size: 26px; }
 .visit-card > p, #visit-hours > p { font-size: 13px; }
 .visit-card > .text-link { font-size: 12px; gap: 8px; }
 .visit-card-label { font-size: 9px; }
 .visit-icon { margin-bottom: 23px; }
 .faq-inner { gap: 40px; }
 .faq-intro h2 { font-size: 38px; }
 .faq-item summary { font-size: 14px; gap: 14px; }
 .faq-answer { padding-right: 8px; }
 .social-tile p { font-size: 20px; }
 .social-grid { gap: 12px; }
 .social-tile { padding: 6px 6px 10px; }
 .social-tile > span { right: 11px; top: 11px; width: 28px; height: 28px; }
 .footer-grid { grid-template-columns: 1.2fr 1fr 1fr; gap: 36px 28px; }
 .footer-about { grid-column: 1; grid-row: 1/3; }
 .footer-hours { grid-column: 2/4; }
 .footer-hours > div, .footer-hours > p { max-width: 100%; }
 .footer-invitation h2 { font-size: 42px; }
 .footer-invitation { gap: 30px; }
 .footer-heart { display: none; }
}
@media (max-width: 800px) {
 .extended-space { padding-block: 62px; }
 .signature-section { padding-top: 28px; }
 .extended-intro { max-width: 270px; }
 .extended-intro > p { font-size: 14px; }
 .signature-panel { border-radius: 27px; grid-template-columns: 1fr 1fr; min-height: 440px; gap: 0; }
 .signature-visual { min-height: 420px; }
 .signature-copy { padding: 30px 26px 28px 18px; }
 .signature-copy h3 { font-size: 38px; }
 .signature-copy .eyebrow { font-size: 10px; }
 .signature-copy > p:not(.eyebrow):not(.signature-smallprint) { font-size: 13px; }
 .signature-orbit { width: 85%; left: 3%; top: 27%; }
 .signature-visual > img { width: 138%; left: -19%; top: 31%; }
 .signature-handnote { font-size: 23px; left: 22px; top: 27px; }
 .signature-seal { width: 76px; height: 76px; right: 4px; bottom: 20px; }
 .signature-seal .icon { width: 20px; height: 20px; }
 .signature-seal span { font-size: 7px; }
 .signature-smallprint { font-size: 10px; }
 .signature-copy .button { font-size: 12px; padding-inline: 20px; }
 .signature-visual[data-cutout=false] > img { width: 84%; height: 61%; top: 24%; left: 7%; }
 .ribbon-track { gap: 28px; }
 .ribbon-track > span { font-size: 30px; }
 .ribbon-track > .script { font-size: 37px; }
 .fomo-ribbon { padding-block: 16px; }
 .story-section { padding-top: 48px; padding-bottom: 42px; }
 .coffee-inner, .occasions-inner { gap: 34px; }
 .coffee-collage { min-height: 405px; }
 .coffee-copy h2 { font-size: 35px; }
 .coffee-notes { gap: 13px; margin: 22px 0; }
 .coffee-notes > div { gap: 12px; }
 .coffee-notes .icon { width: 27px; height: 27px; }
 .coffee-notes span { font-size: 12px; }
 .coffee-notes strong { font-size: 13px; }
 .coffee-copy > p:not(.eyebrow):not(.script) { font-size: 13px; margin-top: 19px; }
 .coffee-copy .eyebrow { font-size: 10px; }
 .coffee-arch { right: 12%; bottom: 63px; left: 3%; }
 .coffee-stamp { width: 95px; height: 95px; right: -3px; top: 21px; font-size: 7px; }
 .coffee-stamp .icon { width: 24px; height: 24px; }
 .coffee-stamp > span { font-size: 20px; }
 .coffee-polaroid { width: 94%; bottom: 0; }
 .coffee-polaroid figcaption { font-size: 24px; padding-top: 9px; }
 .coffee-lines { display: none; }
 .coffee-actions { gap: 15px; }
 .coffee-signoff { font-size: 23px; margin-top: 20px; }
 .occasions-art { height: 400px; }
 .occasion-photo-note { max-width: 80%; left: -10px; padding: 18px; }
 .occasion-photo-note .script { font-size: 23px; }
 .occasion-item { gap: 10px; padding-block: 16px; }
 .occasion-item strong { font-size: 13px; }
 .occasion-item > span { font-size: 11px; }
 .occasions-copy .text-link { font-size: 11px; gap: 5px; }
 .occasions-copy > p:not(.eyebrow) { font-size: 13px; }
 .occasions-copy h2 { font-size: 36px; }
 .occasions-copy .eyebrow { font-size: 10px; }
 .visit-grid { grid-template-columns: 1fr 1fr; }
 .visit-card:first-child { grid-column: 1/-1; display: grid; grid-template-columns: 1fr 1fr; gap: 0 34px; }
 .visit-find .visit-icon { grid-column: 1; margin-bottom: 18px; }
 .visit-find .visit-card-label { grid-column: 1; }
 .visit-find h3 { grid-column: 1; grid-row: 3; margin-bottom: 0; }
 .visit-find > p { grid-column: 2; grid-row: 1/4; align-self: center; }
 .visit-find > .text-link { grid-column: 2; grid-row: 4; justify-self: start; padding-top: 12px; }
 .faq-inner { grid-template-columns: 1fr; gap: 30px; }
 .faq-intro { position: relative; }
 .faq-intro h2 { font-size: 42px; }
 .faq-intro > p:not(.eyebrow) { max-width: 470px; font-size: 14px; margin: 19px 0; }
 .faq-doodle { position: absolute; top: 0; right: 0; font-size: 31px; }
 .faq-doodle svg { display: block; width: 90px; margin: 12px auto 0; }
 .faq-item summary { font-size: 16px; }
 .social-section .section-heading { flex-direction: column; align-items: flex-start; gap: 24px; }
 .social-grid { grid-template-columns: repeat(5,minmax(155px,1fr)); gap: 17px; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; padding: 13px 7px 28px; scrollbar-color: #b87749 #eddfcf; scrollbar-width: thin; }
 .social-tile { scroll-snap-align: start; }
 .social-tile p { font-size: 23px; }
 .social-bottom { font-size: 11px; align-items: flex-start; }
 .booking-note { padding-right: 0; font-size: 10px; }
 .booking-section { padding-top: 65px; padding-bottom: 65px; }
 .footer-invitation { gap: 22px; }
 .footer-invitation h2 { font-size: 34px; }
 .footer-invitation .button { font-size: 12px; padding-inline: 20px; }
 .footer-invitation > div > p:last-child:not(.eyebrow) { font-size: 11px; max-width: 205px; margin-left: auto; }
 .footer-invitation .eyebrow { font-size: 10px; }
 .footer-grid { grid-template-columns: 1.1fr 1fr 1fr; gap: 30px 23px; }
 .footer-expanded .brand-name { font-size: 33px; }
 .footer-expanded .brand-mark { width: 40px; }
 .footer-expanded .brand-tagline { font-size: 5.2px; }
 .footer-about > p { font-size: 12px; }
 .footer-column h3 { font-size: 12px; }
 .footer-column > a { font-size: 12px; }
 .footer-end { flex-direction: column; align-items: flex-start; gap: 8px; }
 .footer-end > div { justify-content: space-between; width: 100%; gap: 15px; }
}
@media (max-width: 580px) {
 .extended-space { padding-block: 53px; }
 .extended-space .eyebrow { font-size: 10px; margin-bottom: 12px; }
 .extended-space h2 { font-size: clamp(33px,9.7vw,43px); }
 .extended-space .section-heading { flex-direction: column; align-items: flex-start; gap: 19px; margin-bottom: 26px; }
 .extended-intro { max-width: 100%; padding: 0; }
 .extended-intro > p { font-size: 14px; }
 .extended-intro > .script { font-size: 27px; }
 .signature-section { padding-top: 32px; }
 .signature-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-bottom: 18px; }
 .signature-tabs button { padding: 10px 11px; gap: 7px; font-size: 11px; justify-content: center; min-height: 46px; }
 .signature-tabs button .icon { width: 17px; height: 17px; }
 .signature-panel { grid-template-columns: 1fr; gap: 0; }
 .signature-visual { min-height: 310px; }
 .signature-orbit { width: 64%; left: 17%; top: 13%; }
 .signature-visual > img { width: 106%; top: 16%; left: -4%; max-height: 310px; }
 .signature-handnote { font-size: 23px; top: 18px; left: 19px; }
 .signature-seal { right: 13px; bottom: -2px; width: 76px; height: 76px; }
 .signature-copy { padding: 25px 25px 28px; }
 .signature-copy h3 { font-size: 44px; margin-bottom: 19px; }
 .signature-copy > p:not(.eyebrow):not(.signature-smallprint) { font-size: 14px; }
 .signature-pairing { margin: 19px 0 22px; }
 .signature-pairing p { font-size: 12px; }
 .signature-copy .button { font-size: 13px; }
 .signature-visual[data-cutout=false] > img { width: 65%; height: 87%; top: 8%; left: 17.5%; }
 .signature-panel[data-selected=coffee] .signature-visual > img { object-position: center; }
 .ribbon-track { gap: 24px; }
 .ribbon-track > span { font-size: 25px; }
 .ribbon-track > .script { font-size: 33px; }
 .ribbon-track > i { font-size: 22px; }
 .fomo-ribbon { padding-block: 15px; }
 .story-section { padding-top: 36px; padding-bottom: 40px; }
 .coffee-inner, .occasions-inner { grid-template-columns: 1fr; gap: 38px; }
 .coffee-collage { min-height: 422px; width: 100%; max-width: 410px; margin-inline: auto; }
 .coffee-arch { left: 2%; right: 22%; bottom: 40px; }
 .coffee-polaroid { width: 64%; bottom: 0; right: 2%; }
 .coffee-polaroid figcaption { font-size: 24px; }
 .coffee-stamp { top: 30px; right: 5%; width: 112px; height: 112px; font-size: 8px; }
 .coffee-stamp .icon { width: 30px; height: 30px; }
 .coffee-stamp > span { font-size: 23px; }
 .coffee-copy > p:not(.eyebrow):not(.script) { font-size: 15px; line-height: 1.75; }
 .coffee-notes { margin: 24px 0 27px; gap: 19px; }
 .coffee-notes span { font-size: 13px; }
 .coffee-notes strong { font-size: 14px; }
 .coffee-actions { gap: 20px; }
 .coffee-actions .button { font-size: 13px; }
 .coffee-actions .text-link { font-size: 12px; }
 .coffee-signoff { font-size: 27px; margin-top: 27px; }
 .atmosphere-section { padding-top: 40px; padding-bottom: 49px; }
 .occasions-copy > p:not(.eyebrow) { font-size: 15px; line-height: 1.75; }
 .occasion-item strong { font-size: 14px; }
 .occasion-item > span { font-size: 12px; }
 .occasion-item { gap: 13px; padding-block: 19px; }
 .occasions-copy > .text-link { font-size: 12px; gap: 9px; }
 .occasions-art { width: 100%; max-width: 420px; margin-inline: auto; height: 420px; }
 .occasions-room { width: 86%; height: 79%; }
 .occasion-photo-note { left: 1px; bottom: 10px; max-width: 61%; padding: 21px; }
 .occasion-photo-note .script { font-size: 26px; }
 .occasion-food { width: 66%; bottom: 3px; right: -13px; }
 .occasion-spark { top: 32px; left: 3px; font-size: 64px; }
 .visit-grid { grid-template-columns: 1fr; gap: 17px; }
 .visit-card { padding: 26px; }
 .visit-card:first-child { display: flex; gap: 0; grid-column: auto; }
 .visit-card h3 { font-size: 31px; }
 .visit-icon { margin-bottom: 21px; }
 .visit-card > p, #visit-hours > p { font-size: 14px; }
 .visit-card > .text-link { font-size: 13px; padding-top: 22px; }
 .visit-find h3 { margin-bottom: 17px; }
 .visit-find > .text-link { padding-top: 22px; }
 .visit-card-label { font-size: 10px; }
 .visit-note { line-height: 1.7; text-align: left; }
 .faq-intro > p:not(.eyebrow) { font-size: 14px; margin: 20px 0; }
 .faq-doodle { display: none; }
 .faq-inner { gap: 30px; }
 .faq-item summary { font-size: 14px; padding-block: 20px; gap: 16px; }
 .faq-plus { width: 27px; height: 27px; }
 .faq-plus::before,.faq-plus::after { top: 12px; left: 7px; }
 .faq-answer { padding: 0 8px 21px 0; }
 .faq-answer p { font-size: 13px; line-height: 1.8; }
 .instagram-link { font-size: 13px; }
 .social-grid { grid-template-columns: repeat(5,minmax(185px,1fr)); margin-right: -10px; padding-block: 13px 28px; gap: 15px; }
 .social-tile { padding: 7px 7px 13px; }
 .social-tile p { font-size: 26px; }
 .social-bottom { flex-direction: column; gap: 7px; padding-top: 11px; }
 .booking-section { padding-top: 65px; padding-bottom: 69px; }
 .booking-note { font-size: 11px; max-width: 100%; }
 .field label { font-size: 12px; }
 .field input, .field select { font-size: 12px; padding-left: 31px; }
 .field-control > .icon { left: 9px; width: 15px; }
 .booking-submit { font-size: 13px; }
 .footer-expanded { margin-top: 49px; padding-top: 5px; }
 .footer-wave { height: 51px; }
 .footer-invitation { flex-direction: column; align-items: flex-start; gap: 29px; padding-top: 15px; padding-bottom: 34px; }
 .footer-invitation h2 { font-size: 37px; }
 .footer-invitation h2 .script { font-size: 1.2em; }
 .footer-invitation > div:last-of-type { text-align: left; }
 .footer-invitation > div > p:last-child:not(.eyebrow) { max-width: 100%; margin-top: 12px; font-size: 12px; }
 .footer-invitation .button { font-size: 13px; }
 .footer-grid { grid-template-columns: 1fr 1fr; gap: 35px 18px; padding-top: 34px; padding-bottom: 31px; }
 .footer-about { grid-column: 1/-1; grid-row: auto; }
 .footer-about > p { max-width: 300px; font-size: 14px; margin-top: 21px; }
 .footer-about > .footer-motto { font-size: 12px; margin-top: 10px; }
 .footer-expanded .brand-name { font-size: 40px; }
 .footer-expanded .brand-mark { width: 49px; }
 .footer-expanded .brand-tagline { font-size: 6.2px; }
 .footer-column h3 { font-size: 13px; margin-bottom: 19px; }
 .footer-column > a { font-size: 13px; margin-bottom: 12px; }
 .footer-hours { grid-column: 1/-1; border-top: 1px solid #ffffff26; padding-top: 27px; }
 .footer-hours > h3 { margin-bottom: 16px; }
 #footer-opening-hours p { max-width: 100%; font-size: 13px; }
 .footer-wordmark { font-size: 27px; gap: 10px; padding-block: 18px; }
 .footer-wordmark i { font-size: 16px; }
 .footer-end { gap: 12px; font-size: 10px; }
 .footer-end > div { justify-content: flex-start; gap: 13px 20px; }
 .footer-back-top { margin-left: auto; }
 .footer-end > p { font-size: 11px; }
 .info-modal { padding: 37px 24px 29px; }
 .info-modal h2 { font-size: 34px; }
 .site-info-copy p { font-size: 14px; }
 .site-info-copy h3 { font-size: 18px; }
}
@media (max-width: 359px) {
 .extended-space h2 { font-size: 32px; }
 .signature-tabs button { padding-inline: 7px; font-size: 10px; gap: 5px; }
 .signature-visual { min-height: 268px; }
 .signature-handnote { font-size: 21px; }
 .signature-copy { padding-inline: 21px; }
 .signature-copy h3 { font-size: 40px; }
 .signature-seal { right: 8px; }
 .coffee-collage { min-height: 350px; }
 .coffee-polaroid { width: 73%; }
 .coffee-polaroid figcaption { font-size: 23px; }
 .coffee-stamp { width: 93px; height: 93px; right: 1%; }
 .coffee-signoff { font-size: 23px; }
 .coffee-actions { gap: 19px; }
 .occasions-art { height: 348px; }
 .occasion-photo-note { padding: 19px 17px; max-width: 68%; }
 .occasion-photo-note .script { font-size: 23px; }
 .occasion-photo-note .icon { width: 22px; height: 22px; margin-top: 11px; }
 .occasions-copy > .text-link { font-size: 11px; }
 .occasion-item > .icon:first-child { width: 22px; height: 22px; }
 .occasion-item strong { font-size: 13px; }
 .occasion-item > span { font-size: 11px; }
 .visit-card { padding: 23px; }
 .faq-item summary { font-size: 13px; }
 .field input, .field select { font-size: 10px; }
 .footer-invitation h2 { font-size: 33px; }
 .footer-column h3 { font-size: 12px; }
 .footer-column > a { font-size: 12px; }
 .footer-wordmark { font-size: 23px; gap: 7px; }
 .footer-back-top { margin-left: 0; }
}
@media (prefers-reduced-motion: reduce) {
 .ribbon-track { animation: none; }
 #ribbon-toggle { display: none; }
 .signature-panel.is-switching .signature-visual > img, .signature-panel.is-switching .signature-copy { animation: none; }
}
@media print {
 .fomo-ribbon, .footer-invitation, .footer-wordmark, .social-grid { display: none; }
 .signature-section, .coffee-section, .occasions-section, .visit-section, .faq-section { break-inside: avoid; }
 .extended-space { padding-block: 25px; }
 .footer-expanded { margin-top: 20px; }
 .footer-grid { grid-template-columns: repeat(4,1fr); }
 .footer-about, .footer-hours { grid-column: auto; grid-row: auto; }
}

.fomo-ribbon.is-offscreen .ribbon-track { animation-play-state: paused; }

/* Keep featured photography inside its half of the card at every tab and width. */
.signature-visual { overflow: hidden; }
.signature-visual[data-cutout=true] > img { width: 100%; height: 88%; max-height: none; left: 0; top: auto; bottom: 2%; object-fit: contain; }
.signature-panel[data-selected=desserts] .signature-copy h3 { font-size: clamp(30px, 3.2vw, 46px); }
@media (max-width: 580px) {
 .footer-wordmark { font-size: clamp(18px, 6.4vw, 27px); gap: 6px; }
}

/* ===== polished.css ===== */
/* FOMO / Refined original design.
   Loaded AFTER styles.css and extended.css. No structural redesign.
   Semantic theme tokens colour every surface, decoration and state. */
:root {
  color-scheme: light;
  --cream: #f8f1e6;
  --cream-light: #fcf8f0;
  --sand: #eddbc3;
  --copper: #9f4f2e;
  --copper-light: #d99560;
  --espresso: #2b2520;
  --ink: #2b2520;
  --muted: #665b4f;
  --border: rgba(79, 56, 35, .18);
  --paper-rgb: 248, 241, 230;
  --dark-rgb: 43, 37, 32;
  --feature: #f1e5d4;
  --soft-section: #f3eadc;
  --feature-border: #dfcdb5;
  --line: #dcc8b0;
  --accent-hover: #813d21;
  --accent-soft: #d9a16c;
  --hero-circle-1: #e1ab73;
  --hero-circle-2: #bf763f;
  --on-dark: #fff8ed;
  --on-dark-muted: #ded1c1;
  --on-dark-accent: #edbe92;
  --button-dark: #aa5834;
  --polaroid: #fffaf1;
  --footer-wordmark: #776550;
  --surface-shadow: 0 12px 32px rgba(61, 39, 22, .055);
  --header-height: 96px;
}
html { scroll-padding-top: 104px; }
body { line-height: 1.7; }
.container { width: min(1240px, calc(100% - 112px)); }
h1,h2,h3 { text-wrap: balance; }
h2 { font-size: clamp(38px,3.8vw,55px); line-height: 1.08; letter-spacing: -.048em; }
.eyebrow { font-size: 11px; letter-spacing: .18em; font-weight: 750; margin-bottom: 16px; }
.button { min-height: 54px; padding: 15px 25px; font-size: 15px; letter-spacing: -.015em; gap: 15px; }
.button-primary { background: var(--copper); color: var(--on-dark); box-shadow: 0 4px 10px rgba(var(--dark-rgb),.04); }
.button-primary:hover { background: var(--accent-hover); box-shadow: 0 8px 20px rgba(var(--dark-rgb),.12); }
.button-outline:hover { background: var(--copper); color: var(--on-dark); }
.text-link { font-size: 15px; line-height: 1.55; gap: 11px; }
:focus-visible { outline: 2px solid var(--copper); outline-offset: 5px; }
.booking-section :focus-visible,.footer-expanded :focus-visible { outline-color: var(--on-dark-accent); }
.announcement-inner { min-height: 34px; }
.announcement p { font-size: 10px; letter-spacing: .19em; }
.announcement-note { font-size: 21px; color: var(--on-dark-muted); }
.site-header,.site-header.is-scrolled { background: rgba(var(--paper-rgb), .95); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
.site-header.is-scrolled { box-shadow: 0 1px 0 var(--border),0 8px 28px rgba(var(--dark-rgb),.045); }
.header-inner { gap: 30px; }
.site-header.is-scrolled .header-inner { height: 78px; }
.brand { gap: 12px; }
.brand-name { font-size: 38px; }
.brand-mark { width: 56px; }
.brand-tagline { font-size: 7px; letter-spacing: .12em; margin-top: 8px; }
.desktop-nav { gap: 29px; }
.nav-link { font-size: 14px; font-weight: 600; }
.nav-link::after { bottom: 6px; }
.header-book { min-height: 49px; font-size: 14px; padding-inline: 22px; }
.hero { background: radial-gradient(ellipse at 45% 55%,rgba(255,255,255,.45),transparent 67%),var(--cream); }
.hero-inner { min-height: 662px; padding-top: 46px; padding-bottom: 88px; }
.hero-copy { padding-top: 22px; margin-right: -72px; }
h1 { font-size: clamp(58px,5.55vw,80px); line-height: 1.02; letter-spacing: -.06em; margin-bottom: 26px; }
.hero-note { font-size: 37px; margin-bottom: 24px; }
.hero-description { font-size: 18px; line-height: 1.7; max-width: 435px; }
.hero-buttons { gap: 14px; margin-top: 28px; }
.hero-values { max-width: 420px; margin-top: 34px; }
.hero-values .icon { width: 28px; height: 28px; }
.hero-values span { font-size: 12px; color: var(--muted); }
.hero-art { margin-right: -32px; min-height: 506px; }
.hero-food-float { width: 114%; max-width: 755px; top: 112px; right: -31px; animation-duration: 10s; }
.hero-annotation { right: 10px; top: 41px; font-size: 29px; color: var(--on-dark); }
.hero-annotation span { color: var(--on-dark-accent); }
.copper-circle { background: radial-gradient(circle at 30% 30%,var(--hero-circle-1),var(--hero-circle-2)); }
.hero-rays { width: 74px; left: -42px; top: 68px; }
.hero-arrow { width: 106px; left: -54px; bottom: 20px; }
.section-heading { gap: 52px; margin-bottom: 36px; }
.section-intro { max-width: 390px; margin-right: 42px; }
.section-intro p { font-size: 16px; line-height: 1.75; }
.extended-intro > p { font-size: 16px; }
.extended-intro > .script { font-size: 30px; }
.menu-section { padding-top: 42px; padding-bottom: 48px; }
.menu-grid { gap: 22px; }
.menu-card { aspect-ratio: .93; border-radius: 24px; border: 1px solid rgba(var(--dark-rgb),.08); box-shadow: var(--surface-shadow); }
.menu-card::after { inset: 40% 0 0; background: linear-gradient(transparent,rgba(17,14,10,.24) 40%,rgba(17,14,10,.83)); }
.menu-card > img { height: 100%; object-position: 50% 48%; }
.menu-card-info { left: 20px; right: 16px; bottom: 20px; align-items: center; gap: 12px; }
.menu-card-title { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.menu-card-title strong { font-size: 23px; font-weight: 700; line-height: 1.2; letter-spacing: -.03em; }
.menu-card-title small { font-size: 11px; line-height: 1.45; font-weight: 400; letter-spacing: .005em; opacity: .9; }
.circle-arrow { width: 41px; height: 41px; }
.menu-footnote { font-size: 12px; margin-top: 24px; }
.signature-section { padding-top: 52px; padding-bottom: 90px; }
.signature-tabs { gap: 11px; margin-top: 3px; margin-bottom: 24px; }
.signature-tabs button { min-height: 49px; padding-inline: 20px; font-size: 14px; }
.signature-tabs button[aria-selected=true] { box-shadow: 0 4px 11px rgba(var(--dark-rgb),.13); }
.signature-panel { background: var(--feature); border-color: var(--feature-border); border-radius: 30px; min-height: 490px; box-shadow: var(--surface-shadow); }
.signature-orbit { background: var(--accent-soft); }
.signature-visual[data-cutout=false] > img { width: 69%; height: 74%; top: 14%; left: 15%; border-radius: 49% 49% 45% 46%; }
.signature-seal { border-color: var(--feature); width: 91px; height: 91px; bottom: 30px; right: 17px; }
.signature-seal span { font-size: 10px; }
.signature-copy { padding: 44px 50px 40px 24px; }
.signature-copy h3 { font-size: clamp(44px,4.1vw,58px); letter-spacing: -.05em; line-height: 1.06; }
.signature-copy > p:not(.eyebrow):not(.signature-smallprint) { font-size: 16px; color: var(--muted); line-height: 1.8; }
.signature-pairing { border-color: var(--line); margin-block: 23px; }
.signature-pairing > span { font-size: 10px; }
.signature-pairing p { font-size: 14px; line-height: 1.65; }
.signature-smallprint { font-size: 12px; line-height: 1.65; }
.fomo-ribbon { border-color: var(--accent-hover); padding-block: 19px; }
.ribbon-track { gap: 38px; }
.ribbon-track > span { font-size: 32px; }
.ribbon-track > .script { font-size: 39px; }
.ribbon-track > i { color: var(--on-dark-accent); }
#ribbon-toggle { width: 42px; height: 42px; right: 16px; }
.story-section { padding-top: 76px; padding-bottom: 61px; }
.story-wash { fill: var(--soft-section); }
.story-inner { gap: 35px; }
.story-copy p { font-size: 16px; line-height: 1.8; }
.story-copy .button { margin-top: 22px; }
.story-title-wrap h2 { color: var(--on-dark); }
.story-title-wrap h2 span { color: var(--on-dark-accent); }
.story-underline { stroke: var(--on-dark-accent); }
.coffee-section { padding-top: 74px; padding-bottom: 84px; }
.coffee-inner { gap: 88px; }
.coffee-copy h2 { font-size: clamp(37px,3.65vw,53px); line-height: 1.08; }
.coffee-copy > p:not(.eyebrow):not(.script) { font-size: 16px; line-height: 1.8; }
.coffee-notes span { font-size: 14px; }
.coffee-notes strong { font-size: 16px; margin-bottom: 2px; }
.coffee-actions { gap: 20px; }
.coffee-signoff { margin-top: 27px; }
.coffee-polaroid { background: var(--polaroid); box-shadow: 0 10px 28px rgba(var(--dark-rgb),.12); }
.atmosphere-section { padding-top: 45px; padding-bottom: 82px; }
.gallery-grid { gap: 24px; }
.gallery-card { aspect-ratio: 1.7; border-radius: 22px; box-shadow: var(--surface-shadow); }
.gallery-card-caption { font-size: 16px; left: 18px; right: 18px; bottom: 17px; }
.gallery-card-action { display: none; }
.gallery-open { width: 45px; height: 45px; color: var(--copper); background: var(--cream-light); }
.atmosphere-signoff { margin-top: 29px; font-size: 32px; }
.occasions-section { padding-block: 88px; background: var(--soft-section); }
.occasions-copy > p:not(.eyebrow) { font-size: 16px; }
.occasion-item { border-color: var(--line); padding-block: 20px; }
.occasion-item strong { font-size: 16px; }
.occasion-item > span { font-size: 14px; }
.occasion-photo-note::before { background: var(--accent-soft); opacity: .5; }
.visit-section { padding-block: 86px; }
.visit-grid { gap: 23px; }
.visit-card { padding: 31px; border-color: var(--feature-border); border-radius: 24px; box-shadow: var(--surface-shadow); transition: transform .35s var(--ease),box-shadow .35s; }
.visit-card:hover { transform: translateY(-4px); box-shadow: 0 12px 30px rgba(var(--dark-rgb),.085); }
.visit-card-label { font-size: 10px; line-height: 1.55; letter-spacing: .15em; }
.visit-card h3 { font-size: 32px; line-height: 1.09; letter-spacing: -.045em; }
.visit-card > p,#visit-hours > p { font-size: 15px; line-height: 1.75; }
.visit-card > .text-link { font-size: 14px; }
.visit-find > p { color: var(--on-dark-muted); }
.visit-find .visit-card-label,.visit-find > .text-link { color: var(--on-dark-accent); }
.visit-find .visit-icon { color: var(--on-dark-accent); border-color: rgba(255,255,255,.25); }
.visit-note { font-size: 12px; margin-top: 21px; color: var(--muted); }
.faq-section { background: var(--soft-section); padding-block: 84px; }
.faq-inner { grid-template-columns: .9fr 1.2fr; gap: 88px; }
.faq-intro h2 { font-size: clamp(36px,3.35vw,49px); line-height: 1.1; }
.faq-intro > p:not(.eyebrow) { font-size: 16px; line-height: 1.75; }
.faq-item { border-color: var(--line); }
.faq-item summary { font-size: 16px; line-height: 1.6; gap: 25px; padding-block: 23px; }
.faq-item summary:hover { color: var(--copper); }
.faq-plus { width: 31px; height: 31px; border-color: var(--feature-border); }
.faq-plus::before,.faq-plus::after { left: 9px; top: 14px; }
.faq-answer p { font-size: 15px; line-height: 1.8; }
.social-section { padding-top: 82px; padding-bottom: 69px; }
.social-grid { gap: 19px; padding-top: 20px; padding-bottom: 31px; }
.social-tile { background: var(--polaroid); border-color: var(--feature-border); padding: 8px 8px 14px; transform: rotate(-2deg); box-shadow: 0 8px 20px rgba(var(--dark-rgb),.05); }
.social-tile:nth-child(even) { transform: rotate(2deg) translateY(9px); }
.social-tile:nth-child(3) { transform: rotate(-1deg) translateY(-3px); }
.social-tile > img { border-radius: 3px; }
.social-tile > span { background: var(--cream-light); }
.social-tile p { font-size: 26px; }
.social-bottom { font-size: 13px; }
.social-bottom > span:last-child { font-size: 11px; }
.instagram-link { font-size: 15px; }
.booking-section { padding-top: 93px; padding-bottom: 95px; background: var(--espresso); }
.booking-section::after { background: linear-gradient(90deg,transparent 12%,rgba(var(--dark-rgb),.7) 69%,transparent); }
.booking-inner { grid-template-columns: .95fr 1.05fr; gap: 66px; }
.booking-copy .eyebrow { color: var(--on-dark-accent); }
.booking-copy h2 { font-size: clamp(35px,3vw,44px); line-height: 1.13; color: var(--on-dark); }
.booking-copy > .script { color: var(--on-dark-accent); font-size: 34px; margin-top: 18px; }
.booking-copy > .script svg { stroke: var(--on-dark-accent); }
.booking-form { display: grid; grid-template-columns: 1fr; gap: 18px; padding: 25px 27px 23px; border: 1px solid rgba(255,255,255,.17); border-radius: 23px; background: rgba(var(--dark-rgb),.68); backdrop-filter: blur(12px); box-shadow: 0 10px 28px rgba(0,0,0,.08); }
.booking-form-heading { grid-column: 1; grid-row: auto; display: flex; justify-content: space-between; align-items: center; font-size: 17px; font-weight: 600; color: var(--on-dark); }
.booking-form-heading .icon { width: 22px; height: 22px; color: var(--on-dark-accent); }
.booking-fields { gap: 13px; grid-template-columns: 1.25fr 1fr 1fr; }
.field label { font-size: 12px; font-weight: 500; color: var(--on-dark-muted); margin-bottom: 8px; }
.field input,.field select { min-width: 0; height: 52px; padding-left: 34px; padding-right: 10px; border-radius: 9px; font-size: 14px; background: var(--cream-light); color: var(--ink); }
.field-control > .icon { left: 10px; width: 17px; height: 17px; }
.booking-submit { grid-row: auto; grid-column: 1; width: 100%; justify-self: stretch; min-height: 51px; font-size: 15px; background: var(--button-dark); border-radius: 10px; }
.booking-submit:hover { background: var(--accent-hover); }
.booking-note { grid-row: auto; grid-column: 1; padding: 0; font-size: 11px; line-height: 1.7; margin: -4px 0 0; text-align: left; color: var(--on-dark-muted); }
.booking-decor { opacity: .65; }
.footer-expanded { margin-top: 57px; padding: 12px 0 23px; color: var(--on-dark); }
.footer-invitation { padding: 31px 0 47px; gap: 44px; }
.footer-invitation .eyebrow { color: var(--on-dark-accent); }
.footer-invitation h2 { font-size: 44px; line-height: 1.12; }
.footer-invitation h2 .script { color: var(--on-dark-accent); }
.footer-invitation .button { background: var(--button-dark); font-size: 15px; }
.footer-invitation .button:hover { background: var(--accent-hover); }
.footer-invitation > div > p:last-child:not(.eyebrow) { color: var(--on-dark-muted); font-size: 13px; }
.footer-heart { color: var(--on-dark-accent); }
.footer-grid { grid-template-columns: 1.15fr .8fr 1fr 1.1fr; gap: 48px; padding-top: 48px; padding-bottom: 45px; }
.footer-expanded .brand { color: var(--on-dark); }
.footer-expanded .brand-name { font-size: 41px; }
.footer-expanded .brand-tagline { font-size: 7px; }
.footer-about > p { color: var(--on-dark-muted); font-size: 14px; line-height: 1.85; max-width: 260px; }
.footer-about > .footer-motto { color: var(--on-dark-accent); font-size: 12px; }
.footer-column h3 { font-size: 15px; color: var(--on-dark); font-weight: 600; margin-bottom: 20px; }
.footer-column > a { color: var(--on-dark-muted); font-size: 14px; margin-bottom: 10px; padding-block: 3px; line-height: 1.55; }
.footer-column > a:hover,.footer-end a:hover,.footer-end button:hover { color: var(--on-dark-accent); }
.footer-column > .footer-hours-link,.footer-contact-details a { color: var(--on-dark-accent); border-color: var(--on-dark-accent); font-size: 13px; }
.footer-hours-heading { color: var(--on-dark-accent); font-size: 14px; }
#footer-opening-hours p { color: var(--on-dark-muted); font-size: 14px; line-height: 1.8; }
.footer-address { color: var(--on-dark-muted); font-size: 13px; }
.footer-social-links { gap: 11px; }
.footer-social-links > a { width: 43px; height: 43px; border-color: rgba(255,255,255,.24); }
.footer-social-links > a:hover { background: var(--on-dark-accent); color: var(--espresso); }
.footer-wordmark { font-size: clamp(28px,5.2vw,77px); color: var(--footer-wordmark); padding-block: 25px; letter-spacing: -.045em; }
.footer-wordmark i { color: var(--on-dark-accent); opacity: .46; }
.footer-end { color: var(--on-dark-muted); font-size: 12px; gap: 22px; padding-top: 19px; }
.footer-end button,.footer-end a { min-height: 40px; display: inline-flex; align-items: center; }
.modal { border-color: var(--feature-border); border-radius: 24px; }
.modal-close { width: 42px; height: 42px; }
.modal-heading > p:last-child { font-size: 15px; }
.menu-tabs button { min-height: 44px; font-size: 14px; }
.menu-item h4 { font-size: 16px; }
.menu-item p { font-size: 14px; line-height: 1.7; }
.menu-dialog-footer p { font-size: 13px; }
.menu-dialog-footer .button { font-size: 14px; }
.story-dialog-copy > p:not(.eyebrow):not(.script) { font-size: 16px; }
.gallery-modal-footer p:last-child { font-size: 14px; }
.booking-preview-note { font-size: 14px; }
.booking-summary span { background: var(--feature); font-size: 14px; }
.no-js-note { padding: 12px 24px; text-align: center; background: var(--feature); font-size: 14px; }
.no-js-note a { text-decoration: underline; }
/* Intermediate layouts keep reading sizes. They do not scale the desktop down. */
@media (max-width: 1200px) {
 .container { width: calc(100% - 80px); }
 .desktop-nav { gap: 21px; }
 .header-inner { gap: 23px; }
 .nav-link { font-size: 13px; }
 .brand-name { font-size: 34px; }
 .brand-mark { width: 47px; }
 .brand-tagline { font-size: 6px; }
 .header-book { padding-inline: 19px; font-size: 13px; }
 .hero-inner { min-height: 622px; }
 h1 { font-size: clamp(56px,5.65vw,68px); }
 .hero-copy { margin-right: -48px; }
 .hero-note { font-size: 33px; }
 .hero-food-float { top: 132px; width: 118%; right: -37px; }
 .hero-art { min-height: 470px; margin-right: -18px; }
 .hero-description { font-size: 17px; }
 .hero-rays { width: 60px; left: -31px; }
 .hero-annotation { font-size: 26px; }
 .menu-card-info { left: 16px; right: 13px; bottom: 17px; }
 .menu-card-title strong { font-size: 21px; }
 .menu-card-title small { font-size: 10px; }
 .circle-arrow { width: 35px; height: 35px; }
 .signature-copy { padding: 36px 34px 34px 20px; }
 .signature-visual { min-height: 460px; }
 .story-copy p { font-size: 15px; }
 .story-inner { gap: 28px; }
 .coffee-inner { gap: 55px; }
 .coffee-actions { gap: 18px; }
 .coffee-actions .button,.coffee-actions .text-link { font-size: 14px; }
 .occasions-inner { gap: 50px; }
 .visit-card { padding: 27px; }
 .visit-card h3 { font-size: 30px; }
 .faq-inner { gap: 65px; }
 .social-tile p { font-size: 22px; }
 .booking-inner { gap: 45px; }
 .booking-form { padding: 24px 20px; }
 .field input,.field select { font-size: 13px; }
 .footer-grid { gap: 27px; }
}
@media (max-width: 1020px) {
 .container { width: calc(100% - 56px); }
 .desktop-nav { gap: 15px; }
 .nav-link { font-size: 12px; }
 .header-inner { gap: 18px; }
 .header-book { padding: 13px 17px; font-size: 12px; }
 .brand-name { font-size: 31px; }
 .brand-mark { width: 41px; }
 .brand-tagline { font-size: 5.5px; }
 .hero-inner { min-height: 581px; padding-top: 35px; }
 h1 { font-size: 56px; }
 .hero-note { font-size: 30px; }
 .hero-description { font-size: 16px; }
 .hero-food-float { top: 164px; right: -38px; }
 .hero-values span { font-size: 11px; }
 .hero-art { min-height: 425px; }
 .hero-annotation { right: 8px; top: 46px; }
 .hero-buttons .button { font-size: 13px; padding-inline: 19px; }
 .menu-grid { gap: 17px; }
 .menu-card { aspect-ratio: .85; }
 .menu-card-info { align-items: flex-end; }
 .menu-card-title strong { font-size: 19px; }
 .menu-card-title small { display: none; }
 .circle-arrow { width: 33px; height: 33px; }
 .signature-copy h3 { font-size: 44px; }
 .signature-copy > p:not(.eyebrow):not(.signature-smallprint) { font-size: 15px; }
 .signature-tabs button { font-size: 13px; padding-inline: 17px; }
 .signature-pairing p { font-size: 13px; }
 .signature-visual { min-height: 438px; }
 .story-copy p { font-size: 14px; }
 .story-copy .button { font-size: 14px; }
 .coffee-inner { gap: 39px; }
 .coffee-copy h2 { font-size: 39px; }
 .occasions-copy > p:not(.eyebrow) { font-size: 15px; }
 .occasion-item strong { font-size: 15px; }
 .occasion-item > span { font-size: 13px; }
 .occasions-copy > .text-link { font-size: 14px; }
 .visit-grid { gap: 17px; }
 .visit-card { padding: 25px 22px; }
 .visit-card-label { font-size: 9px; }
 .visit-card h3 { font-size: 28px; }
 .visit-card > p,#visit-hours > p { font-size: 14px; }
 .visit-card > .text-link { font-size: 13px; }
 .faq-inner { gap: 38px; }
 .faq-intro h2 { font-size: 38px; }
 .faq-item summary { font-size: 15px; gap: 15px; }
 .booking-inner { grid-template-columns: 1fr; gap: 34px; }
 .booking-copy h2 { font-size: 43px; }
 .booking-form { max-width: 650px; width: 100%; padding: 26px; grid-template-columns: 1fr 190px; }
 .booking-form-heading { grid-column: 1/-1; }
 .booking-fields { grid-column: 1; grid-row: 2; }
 .booking-submit { grid-column: 2; grid-row: 2; align-self: end; }
 .booking-note { grid-column: 1/-1; grid-row: 3; }
 .booking-fields input,.booking-fields select { font-size: 14px; }
 .footer-grid { grid-template-columns: 1.1fr 1fr 1fr; gap: 36px 32px; }
 .footer-about { grid-column: 1; grid-row: 1/3; }
 .footer-hours { grid-column: 2/4; }
}
@media (max-width: 800px) {
 .container { width: calc(100% - 44px); }
 .desktop-nav { display: none; }
 .header-inner { height: 80px; }
 .site-header.is-scrolled .header-inner { height: 72px; }
 .brand-name { font-size: 33px; }
 .brand-mark { width: 43px; }
 .brand-tagline { font-size: 6px; }
 .header-book { min-height: 45px; font-size: 13px; padding-inline: 18px; }
 .mobile-nav { background: var(--cream-light); }
 .mobile-nav-inner { padding-bottom: 36px; }
 .mobile-nav-inner > a:not(.button) { font-size: 27px; }
 .hero-inner { min-height: 528px; padding-top: 22px; padding-bottom: 65px; }
 h1 { font-size: 47px; }
 .hero-copy { margin-right: -48px; }
 .hero-note { font-size: 26px; }
 .hero-description { font-size: 15px; max-width: 310px; }
 .hero-art { margin-right: -16px; min-height: 365px; }
 .hero-food-float { top: 127px; width: 125%; right: -39px; }
 .hero-annotation { font-size: 23px; top: 31px; right: 4px; }
 .hero-annotation span { font-size: 32px; }
 .hero-buttons { gap: 10px; }
 .hero-buttons .button { font-size: 12px; padding-inline: 16px; min-height: 48px; }
 .hero-values { margin-top: 25px; max-width: 310px; }
 .hero-values span { font-size: 10px; }
 .hero-values .icon { width: 26px; height: 26px; }
 .hero-rays { display: none; }
 .hero-arrow { width: 68px; left: -20px; }
 .section-heading { gap: 30px; margin-bottom: 28px; }
 .section-intro p { font-size: 15px; }
 h2 { font-size: 38px; }
 .menu-grid { gap: 17px; }
 .menu-card { aspect-ratio: 1.02; }
 .menu-card-title strong { font-size: 22px; }
 .menu-card-title small { display: block; font-size: 11px; }
 .menu-card-info { align-items: center; }
 .circle-arrow { width: 39px; height: 39px; }
 .signature-section { padding-top: 36px; padding-bottom: 67px; }
 .signature-panel { grid-template-columns: 1fr 1fr; }
 .signature-copy { padding: 32px 25px 28px 8px; }
 .signature-copy h3 { font-size: 40px; }
 .signature-copy > p:not(.eyebrow):not(.signature-smallprint) { font-size: 14px; }
 .signature-smallprint { font-size: 11px; }
 .signature-tabs button { padding-inline: 13px; font-size: 12px; gap: 7px; }
 .story-section { padding-top: 43px; padding-bottom: 49px; }
 .story-copy p { font-size: 15px; }
 .story-inner { gap: 30px; }
 .coffee-section { padding-top: 61px; padding-bottom: 60px; }
 .coffee-inner { gap: 35px; }
 .coffee-copy h2 { font-size: 36px; }
 .coffee-copy > p:not(.eyebrow):not(.script) { font-size: 15px; }
 .coffee-actions .button,.coffee-actions .text-link { font-size: 13px; }
 .coffee-notes strong { font-size: 15px; }
 .coffee-notes span { font-size: 13px; }
 .atmosphere-section { padding-top: 35px; padding-bottom: 65px; }
 .gallery-grid { gap: 15px; }
 .gallery-card { aspect-ratio: 1.35; border-radius: 16px; }
 .gallery-card-caption { font-size: 13px; left: 13px; right: 11px; bottom: 12px; }
 .gallery-open { width: 36px; height: 36px; }
 .occasions-section { padding-block: 65px; }
 .visit-section { padding-block: 65px; }
 .faq-section { padding-block: 65px; }
 .faq-inner { grid-template-columns: 1fr; gap: 30px; }
 .social-section { padding-top: 66px; padding-bottom: 53px; }
 .social-grid { grid-template-columns: repeat(5,minmax(185px,1fr)); padding-inline: 7px; gap: 18px; }
 .social-tile p { font-size: 26px; }
 .social-bottom { font-size: 12px; }
 .social-bottom > span:last-child { font-size: 11px; }
 .booking-section { padding-top: 75px; padding-bottom: 77px; }
 .booking-form { grid-template-columns: 1fr; max-width: 620px; }
 .booking-form-heading { grid-column: 1; }
 .booking-fields { grid-column: 1; grid-row: auto; }
 .booking-submit { grid-column: 1; grid-row: auto; }
 .booking-note { grid-column: 1; grid-row: auto; }
 .footer-invitation h2 { font-size: 39px; }
 .footer-grid { gap: 33px 28px; }
 .footer-column h3 { font-size: 14px; }
 .footer-column > a { font-size: 13px; }
 .footer-about > p { font-size: 13px; }
 .footer-expanded .brand-name { font-size: 32px; }
 .footer-expanded .brand-mark { width: 40px; }
 .footer-expanded .brand-tagline { font-size: 5.5px; }
 .footer-end { font-size: 11px; }
}
@media (max-width: 580px) {
 .container { width: calc(100% - 40px); }
 .button { min-height: 51px; padding: 14px 21px; font-size: 14px; gap: 12px; }
 .text-link { font-size: 14px; }
 h2,.extended-space h2 { font-size: clamp(34px,9.2vw,45px); line-height: 1.08; letter-spacing: -.05em; }
 .eyebrow,.extended-space .eyebrow { font-size: 10px; margin-bottom: 13px; }
 .announcement-inner { min-height: 31px; }
 .announcement p { font-size: 9px; letter-spacing: .15em; }
 .announcement-note { display: none; }
 .header-inner { height: 78px; }
 .brand-name { font-size: 34px; }
 .brand-mark { width: 40px; }
 .brand-tagline { font-size: 5.7px; }
 .brand { gap: 9px; }
 .header-book { display: none; }
 .header-actions { gap: 0; }
 .menu-toggle { width: 44px; height: 44px; }
 .hero-inner { display: grid; grid-template-columns: 1fr; grid-template-areas: 'copy' 'art' 'values'; min-height: 0; padding-top: 30px; padding-bottom: 62px; }
 .hero-copy { padding-top: 6px; margin-right: 0; }
 h1 { font-size: clamp(42px,10.65vw,61px); line-height: 1.03; margin-bottom: 22px; letter-spacing: -.058em; }
 .hero-note { font-size: 29px; margin-bottom: 21px; }
 .hero-description { font-size: 16px; max-width: 380px; line-height: 1.75; }
 .hero-buttons { margin-top: 24px; gap: 10px; }
 .hero-buttons .button { font-size: 13px; padding-inline: 18px; min-height: 49px; }
 .hero-art { margin: 27px -8px 0; min-height: clamp(290px,80vw,425px); }
 .hero-dark-shape { top: -8px; left: 21%; width: 96%; height: 103%; }
 .copper-circle { width: 57%; top: 30px; left: 3%; }
 .circle-sketch { width: 59%; top: 11px; left: 2%; }
 .hero-food-float { width: 115%; max-width: none; top: 66px; right: -8%; }
 .hero-annotation { top: 20px; right: 2px; font-size: 25px; }
 .hero-annotation span { font-size: 32px; }
 .hero-arrow { display: none; }
 .hero-values { margin-top: 30px; max-width: none; width: 100%; gap: 0; }
 .hero-values > div { padding-inline: 8px; }
 .hero-values .icon { width: 26px; height: 26px; }
 .hero-values span { font-size: 11px; }
 .hero-bottom-wave { height: 41px; }
 .hero-corner { width: 73px; height: 85px; bottom: 9px; }
 .menu-section { padding-top: 29px; padding-bottom: 35px; }
 .section-heading,.extended-space .section-heading { flex-direction: column; align-items: flex-start; gap: 22px; margin-bottom: 28px; }
 .section-intro { margin: 0; max-width: 100%; padding: 0; }
 .section-intro p { font-size: 15px; line-height: 1.75; margin-bottom: 17px; }
 .section-heading > .doodle-sprig { display: none; }
 .extended-intro > p { font-size: 15px; }
 .menu-grid { gap: 14px; }
 .menu-card { aspect-ratio: .82; border-radius: 18px; }
 .menu-card-info { left: 12px; right: 11px; bottom: 14px; gap: 5px; }
 .menu-card-title strong { font-size: 19px; }
 .menu-card-title small { display: none; }
 .circle-arrow { width: 30px; height: 30px; }
 .circle-arrow .icon { width: 17px; height: 17px; }
 .menu-footnote { font-size: 11px; line-height: 1.5; }
 .signature-section { padding-top: 30px; padding-bottom: 57px; }
 .signature-tabs { gap: 9px; margin-bottom: 18px; }
 .signature-tabs button { min-height: 47px; padding: 11px 9px; font-size: 12px; }
 .signature-panel { grid-template-columns: 1fr; gap: 0; border-radius: 24px; }
 .signature-visual { min-height: 320px; }
 .signature-visual[data-cutout=false] > img { width: 67%; height: 81%; top: 12%; left: 16.5%; }
 .signature-orbit { width: 66%; left: 16%; top: 16%; }
 .signature-handnote { font-size: 25px; left: 20px; top: 20px; }
 .signature-seal { width: 78px; height: 78px; right: 14px; bottom: 3px; }
 .signature-seal span { font-size: 8px; }
 .signature-copy { padding: 26px 25px 30px; }
 .signature-copy h3 { font-size: 43px; margin-bottom: 20px; }
 .signature-copy > p:not(.eyebrow):not(.signature-smallprint) { font-size: 15px; line-height: 1.8; }
 .signature-pairing p { font-size: 13px; }
 .signature-smallprint { font-size: 11px; }
 .ribbon-track > span { font-size: 25px; }
 .ribbon-track > .script { font-size: 32px; }
 .ribbon-track { gap: 26px; }
 .fomo-ribbon { padding-block: 16px; }
 .story-section { padding-top: 33px; padding-bottom: 31px; }
 .story-copy p { font-size: 15px; line-height: 1.8; }
 .story-copy .button { font-size: 13px; }
 .coffee-section { padding-top: 59px; padding-bottom: 57px; }
 .coffee-inner,.occasions-inner { grid-template-columns: 1fr; gap: 38px; }
 .coffee-collage { min-height: 419px; }
 .coffee-copy h2 { font-size: clamp(34px,9.2vw,45px); }
 .coffee-notes strong { font-size: 15px; }
 .coffee-notes span { font-size: 14px; }
 .coffee-actions { gap: 20px; }
 .coffee-actions .button,.coffee-actions .text-link { font-size: 13px; }
 .coffee-signoff { font-size: 28px; }
 .atmosphere-section { padding-top: 24px; padding-bottom: 54px; }
 .gallery-grid { grid-template-columns: 1fr; gap: 17px; }
 .gallery-card { aspect-ratio: 1.8; border-radius: 19px; }
 .gallery-card-caption { font-size: 17px; left: 18px; bottom: 17px; }
 .gallery-open { width: 43px; height: 43px; }
 .atmosphere-signoff { font-size: 29px; line-height: 1.3; }
 .occasions-section { padding-block: 61px; }
 .occasions-copy > p:not(.eyebrow) { font-size: 15px; }
 .occasion-item strong { font-size: 15px; }
 .occasion-item > span { font-size: 13px; }
 .occasion-item > .icon:first-child { width: 24px; height: 24px; }
 .occasions-copy > .text-link { font-size: 13px; }
 .visit-section { padding-block: 57px; }
 .visit-card { padding: 29px; }
 .visit-card h3 { font-size: 33px; }
 .visit-card-label { font-size: 10px; }
 .visit-card > p,#visit-hours > p { font-size: 15px; }
 .visit-card > .text-link { font-size: 14px; }
 .visit-note { font-size: 11px; }
 .faq-section { padding-block: 59px; }
 .faq-intro > p:not(.eyebrow) { font-size: 15px; }
 .faq-item summary { font-size: 15px; padding-block: 22px; }
 .faq-answer p { font-size: 14px; }
 .faq-plus { width: 30px; height: 30px; }
 .faq-plus::before,.faq-plus::after { top: 13px; left: 8px; }
 .social-section { padding-top: 56px; padding-bottom: 49px; }
 .instagram-link { font-size: 14px; }
 .social-grid { grid-template-columns: repeat(5,minmax(195px,1fr)); margin-right: -7px; padding-top: 17px; padding-bottom: 30px; }
 .social-bottom { gap: 9px; }
 .social-bottom > span:last-child { font-size: 11px; }
 .booking-section { padding-top: 70px; padding-bottom: 75px; }
 .booking-inner { gap: 32px; }
 .booking-copy h2 { font-size: 35px; }
 .booking-copy > .script { font-size: 30px; }
 .booking-form { padding: 23px 19px 21px; gap: 17px; border-radius: 20px; }
 .booking-form-heading { font-size: 17px; }
 .booking-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 11px; }
 .field:first-child { grid-column: 1/-1; }
 .field label { font-size: 12px; }
 .field input,.field select,.booking-fields input,.booking-fields select { font-size: 16px; min-height: 51px; padding-left: 37px; }
 .field-control > .icon { left: 12px; width: 18px; }
 .booking-submit { font-size: 14px; border-radius: 9px; }
 .booking-note { font-size: 11px; padding: 0; line-height: 1.65; }
 .footer-expanded { margin-top: 40px; }
 .footer-invitation { gap: 27px; padding: 19px 0 35px; }
 .footer-invitation h2 { font-size: 36px; }
 .footer-invitation .button { font-size: 14px; }
 .footer-invitation > div > p:last-child:not(.eyebrow) { font-size: 12px; }
 .footer-grid { grid-template-columns: 1fr 1fr; gap: 35px 23px; padding-top: 36px; padding-bottom: 29px; }
 .footer-about { grid-column: 1/-1; grid-row: auto; }
 .footer-hours { grid-column: 1/-1; }
 .footer-expanded .brand-name { font-size: 39px; }
 .footer-expanded .brand-mark { width: 47px; }
 .footer-expanded .brand-tagline { font-size: 6.5px; }
 .footer-about > p { max-width: 300px; font-size: 14px; line-height: 1.8; }
 .footer-column h3 { font-size: 14px; line-height: 1.6; }
 .footer-column > a { font-size: 14px; margin-bottom: 10px; padding-block: 5px; }
 .footer-address,#footer-opening-hours p { font-size: 14px; }
 .footer-column > .footer-hours-link { font-size: 13px; }
 .footer-wordmark { font-size: clamp(19px,6vw,32px); gap: 8px; padding-block: 23px; }
 .footer-end { gap: 8px; font-size: 11px; }
 .footer-end > div { column-gap: 22px; row-gap: 2px; }
 .footer-back-top { margin-left: 0; }
 .modal { width: calc(100% - 26px); max-height: 91dvh; padding: 31px 22px; }
 .story-modal,.gallery-modal { padding: 0; }
 .modal h2 { font-size: 35px; }
 .menu-tabs { gap: 8px; }
 .menu-tabs button { font-size: 13px; padding-inline: 14px; }
 .menu-item h4 { font-size: 16px; }
 .menu-item p { font-size: 14px; }
 .menu-dialog-footer p { font-size: 12px; }
 .menu-dialog-footer .button { font-size: 13px; }
 .story-dialog-copy { padding: 28px 22px; }
 .gallery-modal-footer { padding: 22px; }
 .gallery-modal-footer p:last-child { font-size: 13px; }
 .gallery-modal-footer h2 { font-size: 28px; }
 .booking-modal { padding: 35px 23px; }
}
@media (max-width: 359px) {
 .container { width: calc(100% - 32px); }
 .hero-note { font-size: 26px; }
 h1 { font-size: 38px; }
 .hero-description { font-size: 15px; }
 .hero-buttons .button { font-size: 12px; padding-inline: 15px; gap: 8px; }
 .hero-art { min-height: 273px; }
 .hero-annotation { font-size: 22px; }
 .hero-values span { font-size: 10px; }
 .menu-card-title strong { font-size: 17px; }
 .menu-card-info { left: 10px; right: 9px; gap: 4px; }
 .circle-arrow { width: 27px; height: 27px; }
 .signature-tabs button { font-size: 11px; gap: 5px; }
 .signature-visual { min-height: 277px; }
 .signature-copy { padding-inline: 21px; }
 .signature-copy h3 { font-size: 38px; }
 .coffee-collage { min-height: 353px; }
 .coffee-signoff { font-size: 24px; }
 .occasion-item strong { font-size: 14px; }
 .occasion-item > span { font-size: 12px; }
 .occasions-copy > .text-link { font-size: 12px; }
 .faq-item summary { font-size: 14px; }
 .booking-copy h2 { font-size: 31px; }
 .booking-form { padding-inline: 16px; }
 .footer-invitation h2 { font-size: 33px; }
 .footer-grid { gap: 32px 18px; }
 .footer-column h3,.footer-column > a { font-size: 13px; }
 .footer-wordmark { gap: 7px; font-size: 19px; }
}
@media (prefers-reduced-motion: reduce) {
 html { scroll-behavior: auto; }
 *,*::before,*::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
 .hero-food-float { animation: none !important; }
}
@media print {
 .site-header { position: relative; }
 .booking-form { background: white; color: black; }
 .container { width: 95%; }
}
/* Final small-screen layout pass: imagery must never sit over live copy. */
.gallery-card-caption > span:first-child { font-size: 16px; line-height: 1.35; }
@media (max-width: 800px) {
 .gallery-card-caption > span:first-child { font-size: 13px; }
 .story-section { background: var(--espresso); padding-top: 60px; padding-bottom: 59px; }
 .story-section::before,.story-section::after { content: ''; position: absolute; width: 118%; left: -9%; height: 55px; border-radius: 50%; background: var(--cream-light); pointer-events: none; }
 .story-section::before { top: -35px; transform: rotate(-2deg); }
 .story-section::after { bottom: -35px; transform: rotate(2deg); }
 .story-wash,.story-blob { display: none; }
 .story-inner { grid-template-columns: 1.08fr .92fr; grid-template-areas: 'title art' 'copy art'; min-height: 0; gap: 17px 28px; }
 .story-title-wrap { height: 140px; }
 .story-title-wrap h2 { font-size: 46px; }
 .story-underline { bottom: 5px; }
 .story-copy { color: var(--on-dark-muted); max-width: none; padding: 0; }
 .story-copy p { font-size: 15px; line-height: 1.8; margin-bottom: 0; }
 .story-copy .button { background: var(--button-dark); margin-top: 22px; }
 .story-copy .button:hover { background: var(--accent-hover); }
 .story-art { min-height: 330px; }
 .story-art img { width: 125%; top: 80px; right: -47px; }
 .story-scribble { color: var(--on-dark-accent); top: 11px; left: 4px; }
 .story-art .doodle-sprig { color: var(--on-dark-accent); }
}
@media (max-width: 580px) {
 .hero-art { min-height: clamp(315px,96vw,560px); }
 .hero-food-float { width: 112%; right: -7%; }
 .hero-values { margin-top: 20px; }
 .signature-visual[data-cutout=false] > img { top: 27%; height: 68%; width: 64%; left: 18%; }
 .signature-orbit { top: 25%; width: 64%; left: 17%; }
 .signature-handnote { font-size: 24px; top: 18px; }
 .signature-seal { bottom: 2px; }
 .story-section { padding-top: 57px; padding-bottom: 44px; }
 .story-inner { grid-template-columns: 1fr; grid-template-areas: 'title' 'copy' 'art'; gap: 20px; }
 .story-title-wrap { height: auto; padding: 8px 0 24px; display: block; }
 .story-title-wrap h2 { font-size: 45px; display: inline-block; transform: rotate(-5deg); line-height: 1.06; margin-top: 0; }
 .story-title-wrap h2 span { right: -34px; top: 0; }
 .story-underline { width: 219px; bottom: 0; left: 5px; }
 .story-copy p { font-size: 15px; line-height: 1.85; max-width: none; }
 .story-copy .button { font-size: 13px; margin-top: 23px; }
 .story-art { min-height: 155px; width: 100%; margin-top: -52px; }
 .story-art img { width: 62%; top: 0; right: -30px; transform: rotate(-9deg); }
 .story-scribble { font-size: 24px; left: 5px; top: 73px; }
 .story-art .doodle-sprig { right: auto; left: 118px; bottom: -2px; height: 41px; }
 .gallery-card-caption > span:first-child { font-size: 17px; }
 .booking-decor { opacity: .27; }
}
@media (max-width: 359px) {
 .hero-art { min-height: 315px; }
 .story-title-wrap h2 { font-size: 41px; }
 .story-title-wrap h2 span { right: -28px; }
 .story-scribble { font-size: 22px; }
 .story-art img { right: -35px; }
 .story-art .doodle-sprig { left: 92px; }
}
@media (min-width: 581px) and (max-width: 800px) {
 .hero-inner { grid-template-columns: 1fr; grid-template-areas: 'copy' 'art' 'values'; min-height: 0; padding-top: 35px; padding-bottom: 65px; }
 .hero-copy { margin-right: 0; max-width: 610px; }
 h1 { font-size: clamp(54px,8.5vw,68px); }
 .hero-note { font-size: 33px; }
 .hero-description { max-width: 500px; font-size: 17px; }
 .hero-buttons .button { font-size: 14px; padding-inline: 23px; }
 .hero-art { width: min(630px,100%); min-height: 0; aspect-ratio: 1.05; margin: 35px auto 0; }
 .hero-food-float { width: 108%; top: 57px; right: -6%; }
 .hero-dark-shape { top: 0; left: 20%; height: 102%; width: 110%; }
 .copper-circle { top: 28px; left: 0; width: 58%; }
 .circle-sketch { top: 8px; left: -2%; width: 61%; }
 .hero-annotation { top: 22px; right: 22px; font-size: 31px; }
 .hero-values { width: 100%; max-width: 460px; margin: 20px auto 0; }
 .hero-values span { font-size: 12px; }
 .hero-values .icon { width: 30px; height: 30px; }
 .hero-arrow { display: none; }
}
.faq-list { border-color: var(--line); }
.visit-path { stroke: var(--copper); opacity: .35; }

/* ===== theme-olive.css ===== */
/* FOMO / Olive & Ivory. Same page, alternative complete colour direction.
   Photography and the supplied logo geometry are deliberately untouched. */
:root {
 --cream: #f7f7ef;
 --cream-light: #fbfbf4;
 --sand: #e0e4cf;
 --copper: #485c3e;
 --copper-light: #9cac77;
 --espresso: #263b2b;
 --ink: #293729;
 --muted: #5d6655;
 --border: rgba(57, 77, 47, .2);
 --paper-rgb: 247, 247, 239;
 --dark-rgb: 38, 59, 43;
 --feature: #e8ecd9;
 --soft-section: #eef0e2;
 --feature-border: #cfd7ba;
 --line: #ccd4ba;
 --accent-hover: #35462e;
 --accent-soft: #bbc697;
 --hero-circle-1: #d0d49d;
 --hero-circle-2: #a8b77b;
 --on-dark: #faf9e9;
 --on-dark-muted: #d8dfc9;
 --on-dark-accent: #d1ce9a;
 --button-dark: #586e44;
 --polaroid: #fffff7;
 --footer-wordmark: #778669;
 --surface-shadow: 0 12px 32px rgba(40, 63, 32, .055);
}

/* ===== desktop-navigation.css ===== */
/* FOMO — centred desktop navigation, shared by both colour designs.
   Keep this stylesheet last in the document's stylesheet order.
   Equal outer grid columns keep the menu at the centre of the page,
   regardless of the different widths of the logo and booking button.
   The existing mobile layout and 800px breakpoint remain unchanged. */
@media screen and (min-width: 801px) {
  .site-header > .header-inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) max-content minmax(0, 1fr);
    align-items: center;
  }

  .site-header > .header-inner > .brand {
    justify-self: start;
  }

  .site-header .desktop-nav {
    justify-self: center;
    width: max-content;
    margin: 0;
    flex-wrap: nowrap;
  }

  .site-header .desktop-nav .nav-link {
    flex: 0 0 auto;
    white-space: nowrap;
  }

  .site-header .header-actions {
    justify-self: end;
    margin: 0;
  }
}

/* Loading safeguards: content remains visible if optional effects cannot run. */
.reveal.will-reveal { opacity: 1; transform: none; }
.reveal.will-reveal.is-visible { animation: fomo-section-arrive .48s ease-out both; }
@keyframes fomo-section-arrive {
  from { transform: translateY(12px); }
  to { transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  .reveal.will-reveal.is-visible { animation: none !important; }
}
@media print {
  .reveal, .intro-item { opacity: 1 !important; transform: none !important; }
  .site-header { position: static; }
}