@import url("https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,400;1,500;1,600;1,700&family=Plus+Jakarta+Sans:wght@200;300;400;500;600;700&display=swap");

/* =========================================================
   COLORS used across the site (header menu, mobile menu)
   ========================================================= */
:root {
    --bm-page: #fcfaf6;
    --bm-page-rgb: 252 250 246;
    --bm-band: #f4efe6;
    --bm-band-rgb: 244 239 230;
    --bm-band2: #ede8de;
    --bm-band2-rgb: 237 232 222;
    --bm-card: #ffffff;
    --bm-card-rgb: 255 255 255;
    --bm-rule: #d6cfc1;
    --bm-rule-rgb: 214 207 193;
    --bm-ink: #1b2a4a;
    --bm-ink-rgb: 27 42 74;
    --bm-body: #545049;
    --bm-body-rgb: 84 80 73;
    --bm-muted: #746d62;
    --bm-muted-rgb: 116 109 98;
    --bm-accent: #7e6028;
    --bm-accent-rgb: 126 96 40;
    --bm-btn: #0bcbfb;
    --bm-btn-rgb: 0 184 230;
    --bm-btnInk: #fffdf8;
    --bm-btnInk-rgb: 255 253 248;
    --bm-chip: #ecdfc3;
    --bm-chip-rgb: 236 223 195;
    --bm-chipInk: #43340f;
    --bm-chipInk-rgb: 67 52 15;
    --bm-tint: #8b3947;
    --bm-tint-rgb: 139 57 71;
    --bm-tagline: #000000;
    --bm-tagline-rgb: 0 0 0;
}

/* =========================================================
   BASE (browser reset, mobile menu, small helpers)
   You normally will not need to touch anything in this part.
   ========================================================= */
html,
body {
    min-height: 100%;
    height: auto !important;
    overflow-x: hidden;
    overflow-y: auto !important;
    margin: 0;
    padding: 0;
    background: var(--bm-page);
    color: var(--bm-body);
    scroll-behavior: smooth;
}

*,
::before,
::after {
    --tw-border-spacing-x: 0;
    --tw-border-spacing-y: 0;
    --tw-translate-x: 0;
    --tw-translate-y: 0;
    --tw-rotate: 0;
    --tw-skew-x: 0;
    --tw-skew-y: 0;
    --tw-scale-x: 1;
    --tw-scale-y: 1;
    --tw-pan-x: ;
    --tw-pan-y: ;
    --tw-pinch-zoom: ;
    --tw-scroll-snap-strictness: proximity;
    --tw-gradient-from-position: ;
    --tw-gradient-via-position: ;
    --tw-gradient-to-position: ;
    --tw-ordinal: ;
    --tw-slashed-zero: ;
    --tw-numeric-figure: ;
    --tw-numeric-spacing: ;
    --tw-numeric-fraction: ;
    --tw-ring-inset: ;
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: rgb(59 130 246 / 0.5);
    --tw-ring-offset-shadow: 0 0 #0000;
    --tw-ring-shadow: 0 0 #0000;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    --tw-blur: ;
    --tw-brightness: ;
    --tw-contrast: ;
    --tw-grayscale: ;
    --tw-hue-rotate: ;
    --tw-invert: ;
    --tw-saturate: ;
    --tw-sepia: ;
    --tw-drop-shadow: ;
    --tw-backdrop-blur: ;
    --tw-backdrop-brightness: ;
    --tw-backdrop-contrast: ;
    --tw-backdrop-grayscale: ;
    --tw-backdrop-hue-rotate: ;
    --tw-backdrop-invert: ;
    --tw-backdrop-opacity: ;
    --tw-backdrop-saturate: ;
    --tw-backdrop-sepia: ;
    --tw-contain-size: ;
    --tw-contain-layout: ;
    --tw-contain-paint: ;
    --tw-contain-style: ;
}

::backdrop {
    --tw-border-spacing-x: 0;
    --tw-border-spacing-y: 0;
    --tw-translate-x: 0;
    --tw-translate-y: 0;
    --tw-rotate: 0;
    --tw-skew-x: 0;
    --tw-skew-y: 0;
    --tw-scale-x: 1;
    --tw-scale-y: 1;
    --tw-pan-x: ;
    --tw-pan-y: ;
    --tw-pinch-zoom: ;
    --tw-scroll-snap-strictness: proximity;
    --tw-gradient-from-position: ;
    --tw-gradient-via-position: ;
    --tw-gradient-to-position: ;
    --tw-ordinal: ;
    --tw-slashed-zero: ;
    --tw-numeric-figure: ;
    --tw-numeric-spacing: ;
    --tw-numeric-fraction: ;
    --tw-ring-inset: ;
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: rgb(59 130 246 / 0.5);
    --tw-ring-offset-shadow: 0 0 #0000;
    --tw-ring-shadow: 0 0 #0000;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    --tw-blur: ;
    --tw-brightness: ;
    --tw-contrast: ;
    --tw-grayscale: ;
    --tw-hue-rotate: ;
    --tw-invert: ;
    --tw-saturate: ;
    --tw-sepia: ;
    --tw-drop-shadow: ;
    --tw-backdrop-blur: ;
    --tw-backdrop-brightness: ;
    --tw-backdrop-contrast: ;
    --tw-backdrop-grayscale: ;
    --tw-backdrop-hue-rotate: ;
    --tw-backdrop-invert: ;
    --tw-backdrop-opacity: ;
    --tw-backdrop-saturate: ;
    --tw-backdrop-sepia: ;
    --tw-contain-size: ;
    --tw-contain-layout: ;
    --tw-contain-paint: ;
    --tw-contain-style: ;
}

*,
::after,
::before {
    box-sizing: border-box;
    border-width: 0;
    border-style: solid;
    border-color: #e5e7eb;
}

::after,
::before {
    --tw-content: "";
}

:host,
html {
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    -moz-tab-size: 4;
    tab-size: 4;
    font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    font-feature-settings: normal;
    font-variation-settings: normal;
    -webkit-tap-highlight-color: transparent;
}

body {
    margin: 0;
    line-height: inherit;
}

hr {
    height: 0;
    color: inherit;
    border-top-width: 1px;
}

abbr:where([title]) {
    -webkit-text-decoration: underline dotted;
    text-decoration: underline dotted;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-size: inherit;
    font-weight: inherit;
}

a {
    color: inherit;
    text-decoration: inherit;
}

b,
strong {
    font-weight: bolder;
}

code,
kbd,
pre,
samp {
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
    font-feature-settings: normal;
    font-variation-settings: normal;
    font-size: 1em;
}

small {
    font-size: 80%;
}

sub,
sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}

sub {
    bottom: -.25em;
}

sup {
    top: -.5em;
}

table {
    text-indent: 0;
    border-color: inherit;
    border-collapse: collapse;
}

button,
input,
optgroup,
select,
textarea {
    font-family: inherit;
    font-feature-settings: inherit;
    font-variation-settings: inherit;
    font-size: 100%;
    font-weight: inherit;
    line-height: inherit;
    letter-spacing: inherit;
    color: inherit;
    margin: 0;
    padding: 0;
}

button,
select {
    text-transform: none;
}

button,
input:where([type=button]),
input:where([type=reset]),
input:where([type=submit]) {
    -webkit-appearance: button;
    background-color: transparent;
    background-image: none;
}

:-moz-focusring {
    outline: auto;
}

:-moz-ui-invalid {
    box-shadow: none;
}

progress {
    vertical-align: baseline;
}

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
    height: auto;
}

[type=search] {
    -webkit-appearance: textfield;
    outline-offset: -2px;
}

::-webkit-search-decoration {
    -webkit-appearance: none;
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit;
}

summary {
    display: list-item;
}

blockquote,
dd,
dl,
figure,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
p,
pre {
    margin: 0;
}

fieldset {
    margin: 0;
    padding: 0;
}

legend {
    padding: 0;
}

menu,
ol,
ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

dialog {
    padding: 0;
}

textarea {
    resize: vertical;
}

input::placeholder,
textarea::placeholder {
    opacity: 1;
    color: #9ca3af;
}

[role=button],
button {
    cursor: pointer;
}

:disabled {
    cursor: default;
}

audio,
canvas,
embed,
iframe,
img,
object,
svg,
video {
    display: block;
    vertical-align: middle;
}

img,
video {
    max-width: 100%;
    height: auto;
}

[hidden]:where(:not([hidden=until-found])) {
    display: none;
}

[type="text"],
input:where(:not([type])),
[type="email"],
[type="url"],
[type="password"],
[type="number"],
[type="date"],
[type="datetime-local"],
[type="month"],
[type="search"],
[type="tel"],
[type="time"],
[type="week"],
[multiple],
textarea,
select {
    -webkit-appearance: none;
    appearance: none;
    background-color: #fff;
    border-color: #6b7280;
    border-width: 1px;
    border-radius: 0px;
    padding-top: 0.5rem;
    padding-right: 0.75rem;
    padding-bottom: 0.5rem;
    padding-left: 0.75rem;
    font-size: 1rem;
    line-height: 1.5rem;
    --tw-shadow: 0 0 #0000;
}

[type="text"]:focus,
input:where(:not([type])):focus,
[type="email"]:focus,
[type="url"]:focus,
[type="password"]:focus,
[type="number"]:focus,
[type="date"]:focus,
[type="datetime-local"]:focus,
[type="month"]:focus,
[type="search"]:focus,
[type="tel"]:focus,
[type="time"]:focus,
[type="week"]:focus,
[multiple]:focus,
textarea:focus,
select:focus {
    outline: 2px solid transparent;
    outline-offset: 2px;
    --tw-ring-inset: var(--tw-empty, );
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: #2563eb;
    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
    border-color: #2563eb;
}

input::placeholder,
textarea::placeholder {
    color: #6b7280;
    opacity: 1;
}

::-webkit-datetime-edit-fields-wrapper {
    padding: 0;
}

::-webkit-date-and-time-value {
    min-height: 1.5em;
    text-align: inherit;
}

::-webkit-datetime-edit {
    display: inline-flex;
}

::-webkit-datetime-edit,
::-webkit-datetime-edit-year-field,
::-webkit-datetime-edit-month-field,
::-webkit-datetime-edit-day-field,
::-webkit-datetime-edit-hour-field,
::-webkit-datetime-edit-minute-field,
::-webkit-datetime-edit-second-field,
::-webkit-datetime-edit-millisecond-field,
::-webkit-datetime-edit-meridiem-field {
    padding-top: 0;
    padding-bottom: 0;
}

select {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='%236b7280' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");
    background-position: right 0.5rem center;
    background-repeat: no-repeat;
    background-size: 1.5em 1.5em;
    padding-right: 2.5rem;
    print-color-adjust: exact;
}

[multiple],
[size]:where(select:not([size="1"])) {
    background-image: initial;
    background-position: initial;
    background-repeat: unset;
    background-size: initial;
    padding-right: 0.75rem;
    print-color-adjust: unset;
}

[type="checkbox"],
[type="radio"] {
    -webkit-appearance: none;
    appearance: none;
    padding: 0;
    print-color-adjust: exact;
    display: inline-block;
    vertical-align: middle;
    background-origin: border-box;
    -webkit-user-select: none;
    user-select: none;
    flex-shrink: 0;
    height: 1rem;
    width: 1rem;
    color: #2563eb;
    background-color: #fff;
    border-color: #6b7280;
    border-width: 1px;
    --tw-shadow: 0 0 #0000;
}

[type="checkbox"] {
    border-radius: 0px;
}

[type="radio"] {
    border-radius: 100%;
}

[type="checkbox"]:focus,
[type="radio"]:focus {
    outline: 2px solid transparent;
    outline-offset: 2px;
    --tw-ring-inset: var(--tw-empty, );
    --tw-ring-offset-width: 2px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: #2563eb;
    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
}

[type="checkbox"]:checked,
[type="radio"]:checked {
    border-color: transparent;
    background-color: currentColor;
    background-size: 100% 100%;
    background-position: center;
    background-repeat: no-repeat;
}

[type="checkbox"]:checked {
    background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3cpath d='M12.207 4.793a1 1 0 010 1.414l-5 5a1 1 0 01-1.414 0l-2-2a1 1 0 011.414-1.414L6.5 9.086l4.293-4.293a1 1 0 011.414 0z'/%3e%3c/svg%3e");
}

@media (forced-colors: active) {
    [type="checkbox"]:checked {
        -webkit-appearance: auto;
        appearance: auto;
    }
}

[type="radio"]:checked {
    background-image: url("data:image/svg+xml,%3csvg viewBox='0 0 16 16' fill='white' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='8' cy='8' r='3'/%3e%3c/svg%3e");
}

@media (forced-colors: active) {
    [type="radio"]:checked {
        -webkit-appearance: auto;
        appearance: auto;
    }
}

[type="checkbox"]:checked:hover,
[type="checkbox"]:checked:focus,
[type="radio"]:checked:hover,
[type="radio"]:checked:focus {
    border-color: transparent;
    background-color: currentColor;
}

[type="checkbox"]:indeterminate {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 16 16'%3e%3cpath stroke='white' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M4 8h8'/%3e%3c/svg%3e");
    border-color: transparent;
    background-color: currentColor;
    background-size: 100% 100%;
    background-position: center;
    background-repeat: no-repeat;
}

@media (forced-colors: active) {
    [type="checkbox"]:indeterminate {
        -webkit-appearance: auto;
        appearance: auto;
    }
}

[type="checkbox"]:indeterminate:hover,
[type="checkbox"]:indeterminate:focus {
    border-color: transparent;
    background-color: currentColor;
}

[type="file"] {
    background: unset;
    border-color: inherit;
    border-width: 0;
    border-radius: 0;
    padding: 0;
    font-size: unset;
    line-height: inherit;
}

[type="file"]:focus {
    outline: 1px solid ButtonText;
    outline: 1px auto -webkit-focus-ring-color;
}

@keyframes pulse{
    50% {
        opacity: .5;
    }
}

.space-y-3 > :not([hidden]) ~ :not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));
    margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));
}

.space-y-4 > :not([hidden]) ~ :not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-top: calc(1rem * calc(1 - var(--tw-space-y-reverse)));
    margin-bottom: calc(1rem * var(--tw-space-y-reverse));
}

.space-y-5 > :not([hidden]) ~ :not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-top: calc(1.25rem * calc(1 - var(--tw-space-y-reverse)));
    margin-bottom: calc(1.25rem * var(--tw-space-y-reverse));
}

.space-y-6 > :not([hidden]) ~ :not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));
    margin-bottom: calc(1.5rem * var(--tw-space-y-reverse));
}

.space-y-8 > :not([hidden]) ~ :not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse)));
    margin-bottom: calc(2rem * var(--tw-space-y-reverse));
}

.selection\:bg-\[\#dec489\] *::selection {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--bm-btn-rgb) / var(--tw-bg-opacity, 1));
}

.selection\:text-\[\#3e2e02\] *::selection {
    --tw-text-opacity: 1;
    color: rgb(var(--bm-chipInk-rgb) / var(--tw-text-opacity, 1));
}

.selection\:bg-\[\#dec489\]::selection {
    --tw-bg-opacity: 1;
    background-color: rgb(var(--bm-btn-rgb) / var(--tw-bg-opacity, 1));
}

.selection\:text-\[\#3e2e02\]::selection {
    --tw-text-opacity: 1;
    color: rgb(var(--bm-chipInk-rgb) / var(--tw-text-opacity, 1));
}

.group:hover .group-hover\:translate-x-1\.5 {
    --tw-translate-x: 0.375rem;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.group:hover .group-hover\:scale-105 {
    --tw-scale-x: 1.05;
    --tw-scale-y: 1.05;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.group:hover .group-hover\:text-primary {
    --tw-text-opacity: 1;
    color: rgb(var(--bm-accent-rgb) / var(--tw-text-opacity, 1));
}

.bm-logo-light {
    display: none;
}

.bm-navt {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

.bm-burger {
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;
    width: 44px;
    height: 44px;
    flex: none;
    cursor: pointer;
    border: 1px solid rgb(var(--bm-band2-rgb) / .55);
    border-radius: 6px;
}

.bm-burger span {
    display: block;
    width: 20px;
    height: 1.5px;
    background: var(--bm-btn);
    transition: transform .2s ease,opacity .2s ease;
}

#bm-nav {
    display: none;
    background: var(--bm-page);
    border-top: 1px solid rgb(var(--bm-band2-rgb) / .3);
    padding: 8px 24px 24px;
    max-height: calc(100vh - 80px);
    overflow: auto;
}

#bm-nav a {
    display: block;
    padding: 14px 0;
    text-decoration: none;
    text-transform: uppercase;
    font-family: "Plus Jakarta Sans",sans-serif;
    font-size: 13px;
    font-weight: 400;
    letter-spacing: .2em;
    color: var(--bm-body);
    border-bottom: 1px solid rgb(var(--bm-band2-rgb) / .22);
}

#bm-nav a.cta {
    margin-top: 18px;
    border-bottom: 0;
    text-align: center;
    background: var(--bm-btn);
    color: var(--bm-chipInk);
    font-weight: 600;
    letter-spacing: .16em;
    border-radius: 4px;
    padding: 15px 0;
}

#bm-nav a.tel {
    border-bottom: 0;
    text-align: center;
    font-size: 12px;
    letter-spacing: .1em;
    color: var(--bm-muted);
    text-transform: none;
    padding-bottom: 0;
}

.bm-navt:checked ~ #bm-nav {
    display: block;
}

.bm-navt:checked ~ div .bm-burger span:nth-child(1) {
    transform: translateY(6.5px) rotate(45deg);
}

.bm-navt:checked ~ div .bm-burger span:nth-child(2) {
    opacity: 0;
}

.bm-navt:checked ~ div .bm-burger span:nth-child(3) {
    transform: translateY(-6.5px) rotate(-45deg);
}

section[id],
div[id] {
    scroll-margin-top: 92px;
}

@media (max-width:767px) {
    .bm-burger {
        display: flex;
    }
}

@media (min-width:768px) {
    .bm-navt:checked ~ #bm-nav {
        display: none;
    }
}

@media (max-width:767px) {
    #wine-and-evening .bm-veil-el {
        background-image: linear-gradient(to bottom,rgba(21,19,17,.88) 0%,rgba(21,19,17,.84) 50%,rgba(21,19,17,.80) 100%) !important;
    }
}

@media (max-width:767px) {
    #wine-and-evening img {
        filter: brightness(.5) contrast(.9) saturate(.85) !important;
    }
}

#bm-nav {
    background: var(--bm-page) !important;
    border-top-color: rgb(var(--bm-ink-rgb) / .12) !important;
}

#bm-nav a {
    color: var(--bm-body) !important;
    border-bottom-color: rgb(var(--bm-ink-rgb) / .10) !important;
}

#bm-nav a.cta {
    background: var(--bm-btn) !important;
    color: var(--bm-btnInk) !important;
}

#bm-nav a.tel {
    color: var(--bm-muted) !important;
}

.bm-burger {
    border-color: rgb(var(--bm-ink-rgb) / .25) !important;
}

.bm-burger span {
    background: var(--bm-btn) !important;
}

[data-bm-sec="footer"] .bm-logo-dark,
footer[class] .bm-logo-dark {
    display: none !important;
}

[data-bm-sec="footer"] .bm-logo-light,
footer[class] .bm-logo-light {
    display: block !important;
    filter: none !important;
}

a:is(.btn-header-reserve, .btn-hero-reserve, .dish-tag-main, .btn-reserve-wide) *,
button:is(.btn-header-reserve, .btn-hero-reserve, .dish-tag-main, .btn-reserve-wide) * {
    color: var(--bm-btnInk) !important;
}

#wine-and-evening .bm-veil-el {
    background-image: linear-gradient(to right,
  rgb(var(--bm-page-rgb) / .94) 0%, rgb(var(--bm-page-rgb) / .88) 38%,
  rgb(var(--bm-page-rgb) / .66) 74%, rgb(var(--bm-page-rgb) / .48) 100%) !important;
}

#wine-and-evening img {
    filter: brightness(1.05) contrast(.95) saturate(.9) !important;
}

@media (max-width:767px) {
    #wine-and-evening .bm-veil-el {
        background-image: linear-gradient(to bottom,
        rgb(var(--bm-page-rgb) / .95) 0%, rgb(var(--bm-page-rgb) / .92) 50%,
        rgb(var(--bm-page-rgb) / .88) 100%) !important;
    }
}

@media (max-width:767px) {
    #wine-and-evening img {
        filter: brightness(1.08) contrast(.94) saturate(.88) !important;
    }
}

.material-symbols-outlined {
    display: inline-block;
    line-height: 1;
    vertical-align: middle;
}

.material-symbols-outlined svg {
    display: block;
    width: 1em;
    height: 1em;
}

/* =========================================================
   PAGE STYLES
   One named style per kind of element, in page order.
   Change a style here and every element with that name updates.
   The (max-width) blocks are the tablet and phone adjustments.
   ========================================================= */
/* page — "BISTRO MOULIN" */
.page {
    background-color: rgba(252, 250, 246, 0.92);
    font-family: Plus Jakarta Sans, sans-serif;
    color: #1b2a4a;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    border-color: rgba(27, 42, 74, 0.14);
}

/* site-header — "BISTRO MOULIN" */
.site-header {
    position: fixed;
    left: 0px;
    right: 0px;
    top: 0px;
    z-index: 50;
    border-bottom-width: 1px;
    border-color: rgba(27, 42, 74, 0.14);
    background-color: rgba(252, 250, 246, 0.93);
    box-shadow: 0 1px 0 rgba(27, 42, 74, 0.06), 0 8px 24px rgba(27, 42, 74, 0.05);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    border-bottom-color: rgba(27, 42, 74, 0.12);
}

/* header-inner — "BISTRO MOULIN" */
.header-inner {
    margin-left: auto;
    margin-right: auto;
    display: flex;
    height: 5rem;
    max-width: 1280px;
    align-items: center;
    justify-content: space-between;
    padding-left: 3rem;
    padding-right: 3rem;
}

@media (max-width: 1023px) {
    .header-inner {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
}

/* logo-link — "BISTRO MOULIN" */
.logo-link {
    display: flex;
    flex-direction: column;
}

/* logo-name — "BISTRO MOULIN" */
.logo-name {
    font-family: "Fraunces", serif;
    font-size: 1.25rem;
    line-height: 1.75rem;
    text-transform: uppercase;
    letter-spacing: 0.22em;
    color: #1b2a4a;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

@media (max-width: 767px) {
    .logo-name {
        font-size: 15px;
        letter-spacing: .16em;
    }
}

/* logo-tagline — "CANNERY ROW • MONTEREY" */
.logo-tagline {
    margin-top: -0.125rem;
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.28em;
    color: #7e6028;
    opacity: 0.9;
    line-height: 1rem;
    font-weight: 500;
}

@media (max-width: 767px) {
    .logo-tagline {
        font-size: 9px;
        letter-spacing: .18em;
        line-height: unset;
    }
}

/* main-nav — "MENUS" */
.main-nav {
    display: flex;
    align-items: center;
    row-gap: 2rem;
    column-gap: 2rem;
}

@media (max-width: 767px) {
    .main-nav {
        display: none;
    }
}

/* nav-link — "MENUS" (used 4x) */
.nav-link {
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    color: #545049;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

.nav-link:hover {
    color: #7e6028;
}

/* header-actions — "RESERVE A TABLE" */
.header-actions {
    display: flex;
    align-items: center;
    row-gap: 1rem;
    column-gap: 1rem;
}

@media (max-width: 767px) {
    .header-actions {
        display: none;
    }
}

/* btn-header-reserve — "RESERVE A TABLE" */
.btn-header-reserve {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    background-color: #0bcbfb;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    padding-top: 0.625rem;
    padding-bottom: 0.625rem;
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: #fffdf8;
    box-shadow: 0 1px 2px rgba(27, 42, 74, 0.04), 0 12px 32px rgba(27, 42, 74, 0.08);
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 300ms;
}

/* icon-circle-link */
.icon-circle-link {
    display: flex;
    height: 2.25rem;
    width: 2.25rem;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    border-width: 1px;
    border-color: rgba(214, 207, 193, 0.4);
    background-color: #ede8de;
    color: #7e6028;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

.icon-circle-link:hover {
    border-color: #7e6028;
}

/* icon-small (used 3x) */
.icon-small {
    font-size: 18px;
}

/* page-main — "BISTRO TRADITIONNEL • MONTEREY BAY" */
.page-main {
    width: 100%;
    background-color: rgba(252, 250, 246, 0.92);
    padding-top: 5rem;
    border-color: rgba(27, 42, 74, 0.14);
}

/* hero — "BISTRO TRADITIONNEL • MONTEREY BAY" */
.hero {
    position: relative;
    display: flex;
    width: 100%;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    overflow: hidden;
    padding-bottom: 80px;
    padding-top: 56px;
    text-align: center;
}

@media (max-width: 767px) {
    .hero {
        padding-bottom: 44px;
        padding-top: 18px;
    }
}

/* hero-glow-wrap */
.hero-glow-wrap {
    pointer-events: none;
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* hero-glow-1 */
.hero-glow-1 {
    height: 640px;
    width: 640px;
    border-radius: 9999px;
    background-color: rgba(0, 184, 230, 0.05);
    filter: blur(140px);
}

/* hero-glow-2 */
.hero-glow-2 {
    margin-top: -9rem;
    height: 420px;
    width: 420px;
    border-radius: 9999px;
    background-color: rgba(139, 57, 71, 0.2);
    filter: blur(110px);
}

/* hero-content — "BISTRO TRADITIONNEL • MONTEREY BAY" */
.hero-content {
    position: relative;
    z-index: 10;
    margin-left: auto;
    margin-right: auto;
    display: flex;
    max-width: 56rem;
    flex-direction: column;
    align-items: center;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

/* hero-eyebrow — "BISTRO TRADITIONNEL • MONTEREY BAY" */
.hero-eyebrow {
    margin-bottom: 1rem;
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.3em;
    color: #7e6028;
    opacity: 0.9;
    font-weight: 600;
}

@media (max-width: 767px) {
    .hero-eyebrow {
        display: none;
    }
}

/* hero-title — "A French evening on Cannery Row." */
.hero-title {
    margin-bottom: 1.5rem;
    max-width: 48rem;
    font-family: "Fraunces", serif;
    font-size: 62px;
    line-height: 1;
    font-weight: 400;
    letter-spacing: -0.025em;
    color: #1b2a4a;
}

@media (max-width: 1023px) {
    .hero-title {
        font-size: 3rem;
    }
}

@media (max-width: 767px) {
    .hero-title {
        margin-bottom: 14px;
        font-size: 32px;
        line-height: 1.1;
    }
}

/* hero-subtitle — "Come for dinner. Settle in over a glass " */
.hero-subtitle {
    margin-bottom: 2.5rem;
    max-width: none;
    text-align: center;
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 1.125rem;
    line-height: 1.95rem;
    font-weight: 400;
    color: #545049;
}

@media (max-width: 767px) {
    .hero-subtitle {
        margin-bottom: 22px;
        font-size: 15px;
    }
}

@media (max-width: 639px) {
    .hero-subtitle {
        line-height: 1.625;
    }
}

/* hero-buttons — "RESERVE A TABLE" */
.hero-buttons {
    margin-bottom: 3rem;
    display: flex;
    flex-direction: row;
    align-items: center;
    row-gap: 1.5rem;
    column-gap: 1.5rem;
}

@media (max-width: 767px) {
    .hero-buttons {
        margin-bottom: 24px;
        row-gap: 14px;
        column-gap: 14px;
    }
}

@media (max-width: 639px) {
    .hero-buttons {
        flex-direction: column;
    }
}

/* btn-hero-reserve — "RESERVE A TABLE" */
.btn-hero-reserve {
    border-radius: 8px;
    background-color: #0bcbfb;
    padding-left: 2rem;
    padding-right: 2rem;
    padding-top: 0.875rem;
    padding-bottom: 0.875rem;
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: #fffdf8;
    box-shadow: 0 1px 2px rgba(27, 42, 74, 0.04), 0 12px 32px rgba(27, 42, 74, 0.08);
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 300ms;
    border-color: rgba(27, 42, 74, 0.14);
}

/* link-explore-menu — "EXPLORE THE MENU" */
.link-explore-menu {
    display: inline-flex;
    align-items: center;
    row-gap: 0.5rem;
    column-gap: 0.5rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: #1b2a4a;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

.link-explore-menu:hover {
    color: #7e6028;
}

/* link-explore-label — "EXPLORE THE MENU" (used 2x) */
.link-explore-label {
    font-weight: 500;
}

/* arrow-icon */
.arrow-icon {
    font-size: 18px;
    transition-property: transform;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

/* hero-photo-wrap — "PLAT SIGNATURE" */
.hero-photo-wrap {
    position: relative;
    z-index: 10;
    margin-left: auto;
    margin-right: auto;
    margin-top: 0.5rem;
    width: 100%;
    max-width: 64rem;
    padding-left: 2rem;
    padding-right: 2rem;
}

@media (max-width: 639px) {
    .hero-photo-wrap {
        padding-left: 1rem;
        padding-right: 1rem;
    }
}

/* hero-photo-frame — "PLAT SIGNATURE" */
.hero-photo-frame {
    position: relative;
    width: 100%;
    overflow: hidden;
    border-radius: 1rem;
    border-width: 1px;
    border-color: rgba(214, 207, 193, 0.3);
    background-color: #ffffff;
    box-shadow: 0 1px 2px rgba(27, 42, 74, 0.04), 0 12px 32px rgba(27, 42, 74, 0.08);
}

/* hero-photo-shade */
.hero-photo-shade {
    pointer-events: none;
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    z-index: 10;
    background-image: linear-gradient(to top, rgba(21, 19, 17, 0.7) , transparent , transparent );
}

/* hero-photo */
.hero-photo {
    height: 580px;
    width: 100%;
    transform: translate(0, 0) rotate(0) skewX(0) skewY(0) scaleX(1) scaleY(1);
    object-fit: cover;
    object-position: center;
    transition-property: transform;
    transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
    transition-duration: 700ms;
}

.hero-photo:hover {
    transform: translate(0, 0) rotate(0) skewX(0) skewY(0) scaleX(1.01) scaleY(1.01);
}

@media (max-width: 767px) {
    .hero-photo {
        height: 420px;
    }
}

/* hero-caption — "PLAT SIGNATURE" */
.hero-caption {
    position: absolute;
    bottom: 1.5rem;
    left: 50%;
    z-index: 20;
    display: flex;
    transform: translate(-50%, 0) rotate(0) skewX(0) skewY(0) scaleX(1) scaleY(1);
    align-items: center;
    row-gap: 0.75rem;
    column-gap: 0.75rem;
    border-radius: 9999px;
    border-width: 1px;
    border-color: rgba(27, 42, 74, 0.14);
    background-color: rgba(252, 250, 246, 0.92);
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    padding-top: 0.625rem;
    padding-bottom: 0.625rem;
    color: #1b2a4a;
    box-shadow: 0 2px 10px rgba(27, 42, 74, 0.14);
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
}

@media (max-width: 767px) {
    .hero-caption {
        bottom: 12px;
        left: 12px;
        display: block;
        transform: none;
        border-radius: 8px;
        padding-left: 13px;
        padding-right: 13px;
        padding-top: 9px;
        padding-bottom: 9px;
        right: 12px;
        text-align: left;
    }
}

/* hero-caption-dot */
.hero-caption-dot {
    height: 0.375rem;
    width: 0.375rem;
    animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
    border-radius: 9999px;
    background-color: #00b8e6;
}

@media (max-width: 767px) {
    .hero-caption-dot {
        display: none;
    }
}

/* hero-caption-label — "PLAT SIGNATURE" */
.hero-caption-label {
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    color: #7e6028;
}

@media (max-width: 767px) {
    .hero-caption-label {
        font-size: 9px;
        letter-spacing: .18em;
        display: block;
    }
}

/* hero-caption-divider — "|" */
.hero-caption-divider {
    color: rgba(27, 42, 74, 0.25);
}

@media (max-width: 767px) {
    .hero-caption-divider {
        display: none;
    }
}

/* hero-caption-dish — "Poisson du Jour, Haricots Blancs" */
.hero-caption-dish {
    font-family: Playfair Display, serif;
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-style: italic;
    color: #1b2a4a;
}

@media (max-width: 767px) {
    .hero-caption-dish {
        font-size: 13px;
        display: block;
        margin-top: 1px;
    }
}

/* esprit-section — "L’ESPRIT DU BISTRO" */
.esprit-section {
    width: 100%;
    border-top-width: 1px;
    border-bottom-width: 1px;
    border-color: rgba(27, 42, 74, 0.1);
    background-color: #f4efe6;
    padding-top: 96px;
    padding-bottom: 96px;
}

/* container — "L’ESPRIT DU BISTRO" (used 5x) */
.container {
    margin-left: auto;
    margin-right: auto;
    max-width: 1152px;
    padding-left: 3rem;
    padding-right: 3rem;
}

@media (max-width: 1023px) {
    .container {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
}

/* two-col-grid — "L’ESPRIT DU BISTRO" (used 2x) */
.two-col-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    align-items: center;
    row-gap: 4rem;
    column-gap: 4rem;
}

@media (max-width: 1023px) {
    .two-col-grid {
        grid-template-columns: repeat(1, minmax(0, 1fr));
        row-gap: 3rem;
        column-gap: 3rem;
    }
}

/* esprit-text-col — "L’ESPRIT DU BISTRO" */
.esprit-text-col {
    display: flex;
    flex-direction: column;
    justify-content: center;
    grid-column: span 5 / span 5;
}

@media (max-width: 1023px) {
    .esprit-text-col {
        grid-column: unset;
    }
}

/* eyebrow-row — "L’ESPRIT DU BISTRO" (used 3x) */
.eyebrow-row {
    display: inline-flex;
    align-items: center;
    row-gap: 0.5rem;
    column-gap: 0.5rem;
}

/* eyebrow-line */
.eyebrow-line {
    height: 1px;
    width: 2rem;
    background-color: rgba(0, 184, 230, 0.6);
}

/* eyebrow-esprit — "L’ESPRIT DU BISTRO" */
.eyebrow-esprit {
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.24em;
    color: #7e6028;
}

/* heading-esprit — "A little France." */
.heading-esprit {
    font-family: "Fraunces", serif;
    font-size: 2.25rem;
    line-height: 2.5rem;
    font-weight: 500;
    color: #1b2a4a;
}

@media (max-width: 639px) {
    .heading-esprit {
        font-size: 1.875rem;
        line-height: 1.25;
    }
}

/* esprit-paragraphs — "Tucked against the historic tide line of" */
.esprit-paragraphs {
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 1rem;
    line-height: 1.5rem;
    font-weight: 300;
    color: #545049;
}

@media (max-width: 639px) {
    .esprit-paragraphs {
        font-size: 0.875rem;
        line-height: 1.625;
    }
}

/* esprit-paragraph — "Tucked against the historic tide line of" (used 2x) */
.esprit-paragraph {
    font-weight: 400;
    font-size: 17px;
    line-height: 1.53;
}

/* stats-row — "65" */
.stats-row {
    display: flex;
    align-items: center;
    row-gap: 2rem;
    column-gap: 2rem;
    border-top-width: 1px;
    border-color: rgba(27, 42, 74, 0.1);
    padding-top: 1rem;
}

/* stat-number — "65" (used 2x) */
.stat-number {
    font-family: Playfair Display, serif;
    font-size: 1.875rem;
    line-height: 2.25rem;
    font-weight: 500;
    color: #7e6028;
}

/* stat-label — "SEATS IN THE SALON" (used 2x) */
.stat-label {
    margin-top: 0.25rem;
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #545049;
}

/* stat-divider */
.stat-divider {
    height: 2.5rem;
    width: 1px;
    background-color: rgba(237, 232, 222, 0.3);
}

/* esprit-photo-col — "CANNERY ROW SALON" */
.esprit-photo-col {
    position: relative;
    grid-column: span 7 / span 7;
}

@media (max-width: 1023px) {
    .esprit-photo-col {
        grid-column: unset;
    }
}

/* esprit-photo-frame — "CANNERY ROW SALON" */
.esprit-photo-frame {
    position: relative;
    overflow: hidden;
    border-radius: 8px;
    border-width: 1px;
    border-color: rgba(214, 207, 193, 0.3);
    background-color: #ffffff;
    box-shadow: 0 1px 2px rgba(27, 42, 74, 0.04), 0 12px 32px rgba(27, 42, 74, 0.08);
}

/* esprit-photo */
.esprit-photo {
    height: 500px;
    width: 100%;
    object-fit: cover;
    object-position: center;
}

/* esprit-photo-shade */
.esprit-photo-shade {
    pointer-events: none;
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    background-image: linear-gradient(to top, rgba(21, 19, 17, 0.8) , transparent , transparent );
}

/* esprit-photo-caption — "CANNERY ROW SALON" */
.esprit-photo-caption {
    position: absolute;
    bottom: 1.5rem;
    left: 1.5rem;
    right: 1.5rem;
    max-width: 28rem;
    border-radius: 8px;
    border-width: 1px;
    border-color: rgba(27, 42, 74, 0.14);
    background-color: rgba(252, 250, 246, 0.92);
    padding-top: 1.25rem;
    padding-right: 1.25rem;
    padding-bottom: 1.25rem;
    padding-left: 1.25rem;
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
}

/* caption-label — "CANNERY ROW SALON" */
.caption-label {
    margin-bottom: 0.25rem;
    display: block;
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.24em;
    color: #7e6028;
}

/* caption-quote — "“Where the Pacific twilight melts quietl" */
.caption-quote {
    font-family: Playfair Display, serif;
    font-size: 0.875rem;
    line-height: 1.625;
    font-style: italic;
    color: #1b2a4a;
    letter-spacing: 0.02em;
}

/* menu-section — "LA CARTE SAISONNIÈRE" */
.menu-section {
    width: 100%;
    background-color: #ffffff;
    padding-top: 112px;
    padding-bottom: 112px;
}

/* menu-header — "LA CARTE SAISONNIÈRE" */
.menu-header {
    margin-bottom: 4rem;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    row-gap: 1.5rem;
    column-gap: 1.5rem;
    border-bottom-width: 1px;
    border-color: rgba(27, 42, 74, 0.1);
    padding-bottom: 2rem;
    align-items: flex-end;
}

@media (max-width: 767px) {
    .menu-header {
        flex-direction: column;
        align-items: unset;
    }
}

/* eyebrow-menu — "LA CARTE SAISONNIÈRE" */
.eyebrow-menu {
    margin-bottom: 0.5rem;
    display: block;
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.26em;
    color: #7e6028;
}

/* heading-menu — "A Taste of the Season" */
.heading-menu {
    font-family: "Fraunces", serif;
    font-size: 2.25rem;
    line-height: 2.5rem;
    font-weight: 500;
    color: #1b2a4a;
}

@media (max-width: 639px) {
    .heading-menu {
        font-size: 1.875rem;
        line-height: 2.25rem;
    }
}

/* menu-intro — "Rooted in the French canon, shaped daily" */
.menu-intro {
    max-width: 28rem;
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 1rem;
    line-height: 1.5rem;
    font-weight: 400;
    color: #545049;
}

@media (max-width: 639px) {
    .menu-intro {
        font-size: 0.875rem;
        line-height: 1.625;
    }
}

/* dish-grid — "ENTRÉE" */
.dish-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    row-gap: 2rem;
    column-gap: 2rem;
}

@media (max-width: 767px) {
    .dish-grid {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }
}

/* dish-card — "ENTRÉE" (used 3x) */
.dish-card {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border-radius: 8px;
    border-width: 1px;
    border-color: rgba(214, 207, 193, 0.25);
    background-color: #f4efe6;
    box-shadow: 0 1px 2px rgba(27, 42, 74, 0.04), 0 12px 32px rgba(27, 42, 74, 0.08);
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 300ms;
}

.dish-card:hover {
    border-color: rgba(126, 96, 40, 0.4);
}

/* dish-photo-wrap — "ENTRÉE" (used 3x) */
.dish-photo-wrap {
    position: relative;
    height: 16rem;
    width: 100%;
    overflow: hidden;
    background-color: #ede8de;
}

/* dish-photo (used 3x) */
.dish-photo {
    height: 100%;
    width: 100%;
    object-fit: cover;
    transition-property: transform;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 500ms;
}

/* dish-tag — "ENTRÉE" (used 2x) */
.dish-tag {
    position: absolute;
    left: 1rem;
    top: 1rem;
    border-radius: 8px;
    border-width: 1px;
    border-color: rgba(27, 42, 74, 0.14);
    background-color: rgba(252, 250, 246, 0.92);
    padding-left: 0.75rem;
    padding-right: 0.75rem;
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    color: #7e6028;
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
}

/* dish-body — "Risotto aux Fruits de Mer" (used 3x) */
.dish-body {
    display: flex;
    flex: 1 1 0%;
    flex-direction: column;
    justify-content: space-between;
    padding-top: 1.5rem;
    padding-right: 1.5rem;
    padding-bottom: 1.5rem;
    padding-left: 1.5rem;
}

/* dish-name — "Risotto aux Fruits de Mer" (used 3x) */
.dish-name {
    margin-bottom: 0.25rem;
    font-family: "Fraunces", serif;
    font-size: 1.25rem;
    line-height: 1.75rem;
    color: #1b2a4a;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
    font-weight: 500;
}

/* dish-subtitle — "MONTEREY BAY SHELLFISH" (used 3x) */
.dish-subtitle {
    margin-bottom: 0.75rem;
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: #7e6028;
    font-weight: 500;
}

/* dish-description — "Lobster tail, Manila clams, black mussel" (used 3x) */
.dish-description {
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 400;
    color: #545049;
}

@media (max-width: 639px) {
    .dish-description {
        font-size: 0.75rem;
        line-height: 1.625;
    }
}

/* dish-footer — "Pair with Chablis" (used 3x) */
.dish-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top-width: 1px;
    border-color: rgba(27, 42, 74, 0.1);
    padding-top: 1rem;
}

/* dish-pairing — "Pair with Chablis" (used 3x) */
.dish-pairing {
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    font-style: italic;
    color: #746d62;
}

/* dish-price — "$32" (used 3x) */
.dish-price {
    font-family: Playfair Display, serif;
    font-size: 1.125rem;
    line-height: 1.75rem;
    font-weight: 600;
    color: #7e6028;
}

/* dish-tag-main — "PLAT PRINCIPAL" */
.dish-tag-main {
    position: absolute;
    left: 1rem;
    top: 1rem;
    border-radius: 8px;
    background-color: #ecdfc3;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
    color: #43340f;
}

/* menu-button-row — "VIEW THE COMPLETE MENUS" */
.menu-button-row {
    margin-top: 4rem;
    text-align: center;
}

/* btn-menus — "VIEW THE COMPLETE MENUS" */
.btn-menus {
    display: inline-flex;
    align-items: center;
    row-gap: 0.75rem;
    column-gap: 0.75rem;
    border-radius: 8px;
    border-width: 1px;
    border-color: rgba(214, 207, 193, 0.4);
    background-color: #ede8de;
    padding-left: 2rem;
    padding-right: 2rem;
    padding-top: 0.875rem;
    padding-bottom: 0.875rem;
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: #1b2a4a;
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

.btn-menus:hover {
    border-color: rgba(126, 96, 40, 0.6);
    color: #7e6028;
}

/* cellar-section — "LA CAVE • OUR CELLAR" */
.cellar-section {
    position: relative;
    display: flex;
    min-height: 580px;
    width: 100%;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-top-width: 1px;
    border-bottom-width: 1px;
    border-color: rgba(27, 42, 74, 0.1);
    padding-top: 96px;
    padding-bottom: 96px;
}

/* cellar-photo-wrap */
.cellar-photo-wrap {
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    z-index: 0;
}

/* cellar-photo */
.cellar-photo {
    height: 100%;
    width: 100%;
    object-fit: cover;
    object-position: center;
    filter: brightness(0.68) contrast(0.92) saturate(0.88);
}

/* cellar-veil */
.cellar-veil {
    pointer-events: none;
    position: absolute;
    top: 0px;
    right: 0px;
    bottom: 0px;
    left: 0px;
    background-image: linear-gradient(to right, rgba(21, 19, 17, 0.68) 0%, rgba(21, 19, 17, 0.466) 36%, rgba(21, 19, 17, 0.19) 70%, rgba(21, 19, 17, 0.09) 100%);
}

/* cellar-content — "LA CAVE • OUR CELLAR" */
.cellar-content {
    position: relative;
    z-index: 10;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
    max-width: 64rem;
    padding-left: 3rem;
    padding-right: 3rem;
}

@media (max-width: 1023px) {
    .cellar-content {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
}

/* cellar-text — "LA CAVE • OUR CELLAR" */
.cellar-text {
    max-width: 42rem;
}

/* cellar-eyebrow-row — "LA CAVE • OUR CELLAR" */
.cellar-eyebrow-row {
    display: inline-flex;
    align-items: center;
    row-gap: 0.75rem;
    column-gap: 0.75rem;
}

/* cellar-icon */
.cellar-icon {
    font-size: 22px;
    color: #7e6028;
}

/* eyebrow-cellar — "LA CAVE • OUR CELLAR" */
.eyebrow-cellar {
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.26em;
    color: #7e6028;
}

/* heading-cellar — "Stay for another glass." */
.heading-cellar {
    font-family: "Fraunces", serif;
    font-size: 3rem;
    line-height: 1;
    font-weight: 500;
    color: #1b2a4a;
}

@media (max-width: 639px) {
    .heading-cellar {
        font-size: 1.875rem;
        line-height: 1.25;
    }
}

/* cellar-paragraph — "An evening at Bistro Moulin is measured " (used 2x) */
.cellar-paragraph {
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 17px;
    line-height: 1.53;
    font-weight: 500;
    color: #545049;
}

@media (max-width: 639px) {
    .cellar-paragraph {
        font-size: 17px;
        line-height: 1.53;
    }
}

/* cellar-badges — "Curated by Estate Sommelier" */
.cellar-badges {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    row-gap: 1rem;
    column-gap: 1rem;
    padding-top: 1rem;
}

/* cellar-badge — "Curated by Estate Sommelier" (used 2x) */
.cellar-badge {
    display: flex;
    align-items: center;
    row-gap: 0.75rem;
    column-gap: 0.75rem;
    border-radius: 8px;
    border-width: 1px;
    border-color: rgba(27, 42, 74, 0.14);
    background-color: rgba(252, 250, 246, 0.92);
    padding-left: 1.25rem;
    padding-right: 1.25rem;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
}

/* badge-icon (used 2x) */
.badge-icon {
    font-size: 18px;
    color: #7e6028;
}

/* badge-text — "Curated by Estate Sommelier" (used 2x) */
.badge-text {
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.875rem;
    line-height: 1.25rem;
    color: #1b2a4a;
}

@media (max-width: 639px) {
    .badge-text {
        font-size: 0.75rem;
        line-height: 1rem;
    }
}

/* story-section — "CHEF FEDERICO RUSCIANO" (used 2x) */
.story-section {
    width: 100%;
    background-color: #f4efe6;
    padding-top: 112px;
    padding-bottom: 112px;
    color: #1b2a4a;
}

/* story-pattern — leafy pattern along the bottom of the Federico & Sabrina section */
.story-pattern {
    background-image: url('images/pattern-light-1600.jpg');
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: center bottom;
}

/* story-photo-col — "CHEF FEDERICO RUSCIANO" */
.story-photo-col {
    position: relative;
    order: 1;
    grid-column: span 5 / span 5;
}

@media (max-width: 1023px) {
    .story-photo-col {
        order: 2;
        grid-column: unset;
    }
}

/* story-photo-frame */
.story-photo-frame {
    position: relative;
    overflow: hidden;
    border-radius: 8px;
    border-width: 1px;
    border-color: #d6cfc1;
    background-color: #ede8de;
    box-shadow: 0 1px 2px rgba(27, 42, 74, 0.04), 0 12px 32px rgba(27, 42, 74, 0.08);
}

/* story-photo */
.story-photo {
    height: 520px;
    width: 100%;
    object-fit: cover;
    object-position: center;
}

/* story-caption — "CHEF FEDERICO RUSCIANO" */
.story-caption {
    margin-top: 1rem;
    padding-left: 0.5rem;
    padding-right: 0.5rem;
    color: #7e6028;
}

/* story-caption-text — "CHEF FEDERICO RUSCIANO" (used 2x) */
.story-caption-text {
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* story-text-col — "NOTRE HISTOIRE" */
.story-text-col {
    order: 2;
    grid-column: span 7 / span 7;
}

@media (max-width: 1023px) {
    .story-text-col {
        order: 1;
        grid-column: unset;
    }
}

/* eyebrow-line-red (used 2x) */
.eyebrow-line-red {
    height: 1px;
    width: 2rem;
    background-color: #8b3947;
}

/* eyebrow-story — "NOTRE HISTOIRE" (used 2x) */
.eyebrow-story {
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.26em;
    color: #8b3947;
}

/* heading-story — "Honest French cooking," (used 2x) */
.heading-story {
    font-family: "Fraunces", serif;
    font-size: 3rem;
    line-height: 1;
    font-weight: 500;
    color: #1b2a4a;
}

@media (max-width: 639px) {
    .heading-story {
        font-size: 1.875rem;
        line-height: 1.25;
    }
}

/* story-paragraphs — "Bistro Moulin was founded with a single " (used 2x) */
.story-paragraphs {
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 1rem;
    line-height: 1.5rem;
    font-weight: 300;
    color: #545049;
}

@media (max-width: 639px) {
    .story-paragraphs {
        font-size: 0.875rem;
        line-height: 1.625;
    }
}

/* story-paragraph — "Bistro Moulin was founded with a single " (used 4x) */
.story-paragraph {
    font-weight: 400;
    font-size: 17px;
    line-height: 1.53;
}

/* story-quote — "“We cook for the pleasure of feeding peo" (used 2x) */
.story-quote {
    padding-top: 0.5rem;
    font-family: Playfair Display, serif;
    font-size: 1.25rem;
    line-height: 1.75rem;
    font-weight: 500;
    font-style: italic;
    color: #8b3947;
}

@media (max-width: 639px) {
    .story-quote {
        font-size: 1.125rem;
    }
}

/* story-button-row — "READ OUR FULL STORY" (used 2x) */
.story-button-row {
    display: flex;
    align-items: center;
    row-gap: 1.5rem;
    column-gap: 1.5rem;
    padding-top: 1rem;
}

/* btn-story — "READ OUR FULL STORY" (used 2x) */
.btn-story {
    border-radius: 8px;
    background-color: #ffffff;
    padding-left: 2rem;
    padding-right: 2rem;
    padding-top: 0.875rem;
    padding-bottom: 0.875rem;
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: #746d62;
    box-shadow: 0 1px 2px rgba(27, 42, 74, 0.04), 0 12px 32px rgba(27, 42, 74, 0.08);
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

.btn-story:hover {
    background-color: #0bcbfb;
    color: #ffffff;
}

/* story-layout — "NOTRE HISTOIRE" */
.story-layout {
    display: block;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    align-items: center;
    row-gap: 4rem;
    column-gap: 4rem;
}

@media (max-width: 1023px) {
    .story-layout {
        grid-template-columns: repeat(1, minmax(0, 1fr));
        row-gap: 3rem;
        column-gap: 3rem;
    }
}

/* story-column — "NOTRE HISTOIRE" */
.story-column {
    order: 2;
    grid-column: span 7 / span 7;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

@media (max-width: 1023px) {
    .story-column {
        order: 1;
        grid-column: unset;
    }
}

/* story-photo-centered */
.story-photo-centered {
    padding-top: 16px;
}

/* visit-section — "NOUS TROUVER" */
.visit-section {
    width: 100%;
    background-color: #ffffff;
    padding-top: 112px;
    padding-bottom: 112px;
}

/* visit-header — "NOUS TROUVER" */
.visit-header {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 4rem;
    max-width: 42rem;
    text-align: center;
}

/* eyebrow-visit — "NOUS TROUVER" */
.eyebrow-visit {
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    text-transform: uppercase;
    letter-spacing: 0.28em;
    color: #7e6028;
}

/* heading-visit — "Your evening starts here." */
.heading-visit {
    font-family: "Fraunces", serif;
    font-size: 3rem;
    line-height: 1;
    font-weight: 500;
    color: #1b2a4a;
}

@media (max-width: 639px) {
    .heading-visit {
        font-size: 1.875rem;
        line-height: 2.25rem;
    }
}

/* visit-intro — "A short walk up the hill from the Monter" */
.visit-intro {
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 1rem;
    line-height: 1.5rem;
    font-weight: 400;
    color: #545049;
}

@media (max-width: 639px) {
    .visit-intro {
        font-size: 0.875rem;
        line-height: 1.25rem;
    }
}

/* visit-grid — "867 Wave Street" */
.visit-grid {
    display: grid;
    grid-template-columns: repeat(12, minmax(0, 1fr));
    align-items: flex-start;
    row-gap: 2rem;
    column-gap: 2rem;
}

@media (max-width: 1023px) {
    .visit-grid {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }
}

/* visit-info-card — "867 Wave Street" */
.visit-info-card {
    order: 2;
    border-radius: 8px;
    border-width: 1px;
    border-color: rgba(214, 207, 193, 0.3);
    background-color: #ffffff;
    padding-top: 2rem;
    padding-right: 2rem;
    padding-bottom: 2rem;
    padding-left: 2rem;
    box-shadow: 0 1px 2px rgba(27, 42, 74, 0.04), 0 12px 32px rgba(27, 42, 74, 0.08);
    grid-column: span 5 / span 5;
}

@media (max-width: 1023px) {
    .visit-info-card {
        grid-column: unset;
    }
}

/* visit-logo */
.visit-logo {
    display: block;
    width: 230px;
    max-width: 100%;
    margin-bottom: 28px;
}

/* visit-address — "867 Wave Street" */
.visit-address {
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.875rem;
    line-height: 1.625;
    font-weight: normal;
    color: #545049;
    margin-bottom: 28px;
}

/* info-block — "Reservations & Private Dining" */
.info-block {
    border-top-width: 1px;
    border-color: rgba(27, 42, 74, 0.1);
    padding-top: 24px;
}

/* info-heading — "Reservations & Private Dining" */
.info-heading {
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 600;
    color: #1b2a4a;
    margin-bottom: 4px;
}

/* info-phone — "(831) 333-1200" */
.info-phone {
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 400;
    color: #545049;
}

/* info-email — "bistromoulinmonterey@gmail.com" */
.info-email {
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.875rem;
    line-height: 1.25rem;
    color: #7e6028;
    font-weight: 500;
}

/* award-block — "VOTED BEST FRENCH RESTAURANT IN MONTEREY" */
.award-block {
    border-top-width: 1px;
    border-color: rgba(27, 42, 74, 0.1);
    padding-top: 24px;
    margin-top: 28px;
}

/* award-title — "VOTED BEST FRENCH RESTAURANT IN MONTEREY" */
.award-title {
    font-family: Plus Jakarta Sans, sans-serif;
    text-transform: uppercase;
    color: #7e6028;
    letter-spacing: 0.2em;
    font-size: 11px;
    margin-bottom: 5px;
    line-height: 1.5;
    font-weight: 500;
}

/* award-source — "Monterey County Weekly Readers’ Poll, 20" */
.award-source {
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    font-weight: 400;
    font-style: italic;
    color: #545049;
    margin-bottom: 11px;
}

/* awards-link — "AWARDS & PRESS →" */
.awards-link {
    font-family: Plus Jakarta Sans, sans-serif;
    text-transform: uppercase;
    color: #1b2a4a;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
    letter-spacing: 0.16em;
    font-size: 11px;
    font-weight: 500;
}

.awards-link:hover {
    color: #7e6028;
}

/* social-links — "INSTAGRAM" */
.social-links {
    margin-top: 22px;
    display: flex;
    flex-wrap: wrap;
    row-gap: 8px;
    column-gap: 8px;
}

/* social-link — "INSTAGRAM" (used 2x) */
.social-link {
    border-width: 1px;
    border-color: rgba(214, 207, 193, 0.4);
    font-family: Plus Jakarta Sans, sans-serif;
    text-transform: uppercase;
    color: #545049;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
    letter-spacing: 0.16em;
    font-size: 10px;
    padding-top: 7px;
    padding-right: 14px;
    padding-bottom: 7px;
    padding-left: 14px;
    border-radius: 999px;
    margin-right: 8px;
}

.social-link:hover {
    border-color: #7e6028;
    color: #7e6028;
}

/* directions-card — "Getting Here" */
.directions-card {
    order: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    border-radius: 8px;
    border-width: 1px;
    border-color: rgba(214, 207, 193, 0.3);
    background-color: #f4efe6;
    padding-top: 2.5rem;
    padding-right: 2.5rem;
    padding-bottom: 2.5rem;
    padding-left: 2.5rem;
    box-shadow: 0 1px 2px rgba(27, 42, 74, 0.04), 0 12px 32px rgba(27, 42, 74, 0.08);
    grid-column: span 7 / span 7;
}

@media (max-width: 1023px) {
    .directions-card {
        grid-column: unset;
    }
}

@media (max-width: 639px) {
    .directions-card {
        padding-top: 2rem;
        padding-right: 2rem;
        padding-bottom: 2rem;
        padding-left: 2rem;
    }
}

/* directions-header — "Getting Here" */
.directions-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom-width: 1px;
    border-color: rgba(27, 42, 74, 0.1);
    padding-bottom: 1rem;
}

/* heading-directions — "Getting Here" */
.heading-directions {
    font-family: Playfair Display, serif;
    font-size: 1.5rem;
    line-height: 2rem;
    font-weight: 500;
    color: #1b2a4a;
}

/* directions-subtitle — "New Monterey • One block above Cannery R" */
.directions-subtitle {
    margin-top: 0.125rem;
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    font-weight: 400;
    color: #545049;
}

/* map-icon-circle */
.map-icon-circle {
    display: flex;
    height: 2.5rem;
    width: 2.5rem;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    border-width: 1px;
    border-color: rgba(126, 96, 40, 0.2);
    background-color: rgba(0, 184, 230, 0.1);
    color: #7e6028;
}

/* map-icon */
.map-icon {
    font-size: 20px;
}

/* map-frame */
.map-frame {
    height: 16rem;
    width: 100%;
    overflow: hidden;
    border-radius: 8px;
    border-width: 1px;
    border-color: rgba(214, 207, 193, 0.3);
}

/* map */
.map {
    height: 100%;
    width: 100%;
    border: 0;
    filter: grayscale(0.4) contrast(1.05) brightness(0.85);
}

/* directions-grid — "From the Aquarium" */
.directions-grid {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    padding-top: 0.5rem;
}

/* direction-item — "From the Aquarium" (used 4x) */
.direction-item {
    display: flex;
    align-items: flex-start;
    row-gap: 0.75rem;
    column-gap: 0.75rem;
}

/* direction-icon (used 4x) */
.direction-icon {
    margin-top: 0.125rem;
    font-size: 20px;
    color: #7e6028;
}

/* direction-heading — "From the Aquarium" (used 4x) */
.direction-heading {
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 600;
    color: #1b2a4a;
}

/* direction-text — "A few minutes on foot up the hill from t" (used 4x) */
.direction-text {
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.75rem;
    line-height: 1.625;
    font-weight: 400;
    color: #545049;
}

/* reserve-box — "RESERVE A TABLE" */
.reserve-box {
    margin-top: 2rem;
    border-top-width: 1px;
    border-color: rgba(27, 42, 74, 0.1);
    padding-top: 1.5rem;
}

/* btn-reserve-wide — "RESERVE A TABLE" */
.btn-reserve-wide {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    row-gap: 0.75rem;
    column-gap: 0.75rem;
    border-radius: 8px;
    background-color: #0bcbfb;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    padding-top: 1rem;
    padding-bottom: 1rem;
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.18em;
    color: #fffdf8;
    box-shadow: 0 1px 2px rgba(27, 42, 74, 0.04), 0 12px 32px rgba(27, 42, 74, 0.08);
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 300ms;
}

/* reserve-note — "Booking opens in our reservation system." */
.reserve-note {
    margin-top: 0.75rem;
    text-align: center;
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    font-weight: 400;
    color: #746d62;
}

/* site-footer — "SINCE 2007 · A SMALL FRENCH BISTRO ON TH" */
.site-footer {
    width: 100%;
    border-top-width: 1px;
    border-color: rgba(27, 42, 74, 0.1);
    background-color: #5d6573;
    background-image: url('images/footer-pattern.jpg');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center bottom;
    padding-top: 0px;
    padding-bottom: 0px;
}

/* footer-inner — "SINCE 2007 · A SMALL FRENCH BISTRO ON TH" */
.footer-inner {
    margin-left: auto;
    margin-right: auto;
    max-width: 1280px;
    padding-left: 3rem;
    padding-right: 3rem;
    padding-top: 4rem;
    padding-bottom: 4rem;
}

@media (max-width: 1023px) {
    .footer-inner {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }
}

/* footer-brand — "SINCE 2007 · A SMALL FRENCH BISTRO ON TH" */
.footer-brand {
    text-align: center;
    margin-bottom: 54px;
}

/* footer-logo */
.footer-logo {
    display: block;
    filter: invert(1);
    width: 265px;
    max-width: 100%;
    height: auto;
    margin-top: 0;
    margin-right: auto;
    margin-bottom: 28px;
    margin-left: auto;
}

/* footer-logo-alt */
.footer-logo-alt {
    display: block;
    width: 265px;
    max-width: 100%;
    height: auto;
    margin-top: 0;
    margin-right: auto;
    margin-bottom: 28px;
    margin-left: auto;
}

/* footer-tagline-wrap — "SINCE 2007 · A SMALL FRENCH BISTRO ON TH" */
.footer-tagline-wrap {
    max-width: 880px;
    margin-top: 0;
    margin-right: auto;
    margin-bottom: 0;
    margin-left: auto;
}

/* footer-tagline — "SINCE 2007 · A SMALL FRENCH BISTRO ON TH" */
.footer-tagline {
    font-family: Plus Jakarta Sans, sans-serif;
    text-transform: uppercase;
    color: #f4efe6;
    letter-spacing: 0.2em;
    font-size: 13px;
    line-height: 1.4;
    font-weight: 400;
    margin-bottom: 5px;
}

/* footer-motto — "WHERE DINNER IS STILL AN EVENING" */
.footer-motto {
    font-family: Plus Jakarta Sans, sans-serif;
    text-transform: uppercase;
    color: #f4efe6;
    letter-spacing: 0.2em;
    font-size: 13px;
    line-height: 1.6;
    font-weight: 400;
}

/* footer-bottom — "© 2026 Bistro Moulin. All rights reserve" */
.footer-bottom {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    row-gap: 1rem;
    column-gap: 1rem;
    border-top-width: 1px;
    border-color: rgba(27, 42, 74, 0.1);
    padding-top: 2rem;
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    font-weight: 300;
    color: rgba(84, 80, 73, 0.8);
}

@media (max-width: 639px) {
    .footer-bottom {
        flex-direction: column;
    }
}

/* footer-copyright — "© 2026 Bistro Moulin. All rights reserved." */
.footer-copyright {
    color: #f4efe6;
}

/* footer-links — "Private Events" */
.footer-links {
    display: flex;
    align-items: center;
    row-gap: 1.5rem;
    column-gap: 1.5rem;
    color: #f4efe6;
}

/* footer-link — "Private Events" (used 3x) */
.footer-link {
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

.footer-link:hover {
    color: #7e6028;
}

/* =========================================================
   OUR STORY PAGE (our-story.html)
   Uses the same colors and fonts as the home page.
   ========================================================= */
/* page-intro — the title band at the top */
.page-intro {
    background-color: #f4efe6;
    padding-top: 96px;
    padding-bottom: 88px;
    text-align: center;
}

.intro-inner {
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

.intro-eyebrow-row {
    display: flex;
    align-items: center;
    justify-content: center;
    column-gap: 0.75rem;
    margin-bottom: 1.5rem;
}

.intro-title {
    font-family: "Fraunces", serif;
    font-size: 64px;
    line-height: 1.05;
    font-weight: 500;
    color: #1b2a4a;
    margin-bottom: 1.5rem;
}

.intro-lead {
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 19px;
    line-height: 1.6;
    font-weight: 300;
    color: #545049;
}

/* portrait-section — Federico and Sabrina */
.portrait-section {
    background-color: #fcfaf6;
    padding-top: 112px;
    padding-bottom: 112px;
}

.portrait-section-alt {
    background-color: #ffffff;
}

.portrait-row {
    display: grid;
    grid-template-columns: 5fr 6fr;
    align-items: center;
    column-gap: 80px;
}

.portrait-row-flip {
    grid-template-columns: 6fr 5fr;
}

.portrait-row-flip .portrait-photo-frame {
    order: 2;
}

.portrait-photo-frame {
    overflow: hidden;
    border-radius: 8px;
    box-shadow: 0 1px 2px rgba(27, 42, 74, 0.04), 0 12px 32px rgba(27, 42, 74, 0.08);
}

.portrait-photo {
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
}

.portrait-text > * + * {
    margin-top: 1rem;
}

.person-name {
    font-family: "Fraunces", serif;
    font-size: 44px;
    line-height: 1.1;
    font-weight: 500;
    color: #1b2a4a;
    margin-top: 1.25rem;
}

.person-role {
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    color: #7e6028;
    margin-bottom: 0.75rem;
}

.portrait-text .story-paragraph {
    color: #545049;
}

.person-quote {
    padding-top: 0.75rem;
    font-family: Playfair Display, serif;
    font-size: 1.25rem;
    line-height: 1.6;
    font-style: italic;
    color: #8b3947;
}

/* quote-band — dark band with the big quote */
.quote-band {
    background-color: #5d6573;
    background-image: url('images/footer-pattern.jpg');
    background-size: cover;
    background-position: center bottom;
    padding-top: 120px;
    padding-bottom: 120px;
    text-align: center;
}

.quote-band-inner {
    max-width: 860px;
    margin-left: auto;
    margin-right: auto;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

.quote-band-text {
    font-family: Playfair Display, serif;
    font-size: 34px;
    line-height: 1.4;
    font-style: italic;
    color: #f4efe6;
}

.quote-band-credit {
    margin-top: 1.75rem;
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.26em;
    color: #f4efe6;
    opacity: 0.8;
}

/* together-section — the two of them, closing the page */
.together-section {
    background-color: #fcfaf6;
    padding-top: 112px;
    padding-bottom: 88px;
}

.together-header {
    max-width: 680px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    margin-bottom: 56px;
}

.together-title {
    font-family: "Fraunces", serif;
    font-size: 48px;
    line-height: 1.1;
    font-weight: 500;
    color: #1b2a4a;
    margin-bottom: 1.25rem;
}

.together-text {
    font-size: 17px;
    line-height: 1.6;
    color: #545049;
}

.together-photo-frame {
    max-width: 560px;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
    border-radius: 8px;
    box-shadow: 0 1px 2px rgba(27, 42, 74, 0.04), 0 12px 32px rgba(27, 42, 74, 0.08);
}

.together-photo {
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
}

.together-caption {
    max-width: 960px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 14px;
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #50462e;
}

.together-buttons {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 20px;
    margin-top: 80px;
}

/* Our Story page — tablet */
@media (max-width: 1023px) {
    .portrait-row {
        column-gap: 48px;
    }

    .person-name {
        font-size: 36px;
    }

    .intro-title {
        font-size: 52px;
    }
}

/* Our Story page — phone */
@media (max-width: 767px) {
    .page-intro {
        padding-top: 64px;
        padding-bottom: 56px;
    }

    .intro-title {
        font-size: 40px;
    }

    .intro-lead {
        font-size: 17px;
    }

    .portrait-section {
        padding-top: 72px;
        padding-bottom: 72px;
    }

    .portrait-row,
    .portrait-row-flip {
        grid-template-columns: 1fr;
        row-gap: 36px;
    }

    .portrait-row-flip .portrait-photo-frame {
        order: 0;
    }

    .person-name {
        font-size: 32px;
    }

    .quote-band {
        padding-top: 80px;
        padding-bottom: 80px;
    }

    .quote-band-text {
        font-size: 24px;
    }

    .together-section {
        padding-top: 72px;
        padding-bottom: 112px;
    }

    .together-title {
        font-size: 34px;
    }
}

/* =========================================================
   INVITE BAND — the "join us" close above the footer.
   Used on every secondary page. It carries the light leaf
   pattern so the page flows into the dark footer pattern.
   ========================================================= */
.invite-band {
    background-color: #f4efe6;
    background-image: url('images/pattern-light-1600.jpg');
    background-size: 100% auto;
    background-repeat: no-repeat;
    background-position: center bottom;
    padding-top: 0;
    padding-bottom: 120px;
}

.invite-row {
    display: grid;
    grid-template-columns: 0.9fr 270px 1.5fr;
    column-gap: 48px;
    align-items: center;
    padding-top: 88px;
}

.invite-title {
    font-family: "Fraunces", serif;
    font-size: 40px;
    line-height: 1.15;
    font-weight: 500;
    color: #1b2a4a;
    margin-top: 1.25rem;
}

.invite-text {
    font-size: 17px;
    line-height: 1.6;
    color: #545049;
}

.invite-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 24px;
}

.invite-details {
    margin-top: 24px;
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.75rem;
    letter-spacing: 0.08em;
    color: #746d62;
}

@media (max-width: 767px) {
    .invite-band {
        padding-bottom: 160px;
    }

    .invite-row {
        grid-template-columns: 1fr;
        row-gap: 24px;
        padding-top: 48px;
    }

    .invite-title {
        font-size: 30px;
    }
}

/* =========================================================
   GALLERY PAGE (gallery.html)
   ========================================================= */
.page-hero {
    position: relative;
    height: 520px;
    overflow: hidden;
    background-color: #1b2a4a;
}

.page-hero-photo {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.page-hero-shade {
    pointer-events: none;
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(21, 19, 17, 0.25) 0%, rgba(21, 19, 17, 0.45) 100%);
}

.page-hero-content {
    pointer-events: none;
    position: relative;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

.page-hero-eyebrow {
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.3em;
    color: #f4efe6;
    margin-bottom: 1rem;
}

.page-hero-title {
    font-family: "Fraunces", serif;
    font-size: 60px;
    line-height: 1;
    font-weight: 500;
    color: #ffffff;
}

.gallery-section {
    background-color: #fcfaf6;
    padding-top: 96px;
    padding-bottom: 112px;
}

.gallery-intro {
    max-width: 640px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 56px;
    text-align: center;
    font-size: 18px;
    line-height: 1.6;
    font-weight: 300;
    color: #545049;
}

.gallery-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 16px;
}

.gallery-item {
    overflow: hidden;
    border-radius: 6px;
    background-color: #ede8de;
}

.gallery-item {
    cursor: zoom-in;
}

.gallery-photo {
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    transition: transform 0.6s ease, filter 0.4s ease;
}

.gallery-item:hover .gallery-photo {
    transform: scale(1.04);
    filter: brightness(1.12);
}

/* lightbox — the enlarged photo view (opened by gallery.js) */
.lightbox {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: none;
    align-items: center;
    justify-content: center;
    background-color: rgba(17, 22, 32, 0.92);
}

.lightbox.is-open {
    display: flex;
}

.lightbox-photo {
    max-width: calc(100vw - 160px);
    max-height: calc(100vh - 80px);
    object-fit: contain;
    border-radius: 4px;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.5);
}

.lightbox-btn {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border: 0;
    border-radius: 50%;
    background-color: transparent;
    color: #f4efe6;
    font-size: 36px;
    line-height: 1;
    cursor: pointer;
    opacity: 0.8;
    transition: opacity 0.2s ease, background-color 0.2s ease;
}

.lightbox-btn:hover {
    opacity: 1;
    background-color: rgba(255, 255, 255, 0.1);
}

.lightbox-prev {
    left: 24px;
    top: 50%;
    transform: translateY(-50%);
}

.lightbox-next {
    right: 24px;
    top: 50%;
    transform: translateY(-50%);
}

.lightbox-close {
    top: 20px;
    right: 24px;
    font-size: 32px;
}

.lightbox-count {
    position: absolute;
    bottom: 20px;
    left: 0;
    right: 0;
    text-align: center;
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.75rem;
    letter-spacing: 0.2em;
    color: #f4efe6;
    opacity: 0.7;
}

@media (max-width: 767px) {
    .lightbox-photo {
        max-width: calc(100vw - 24px);
        max-height: calc(100vh - 140px);
    }

    .lightbox-prev,
    .lightbox-next {
        top: auto;
        bottom: 12px;
        transform: none;
    }

    .lightbox-close {
        top: 12px;
        right: 12px;
    }
}

@media (max-width: 767px) {
    .page-hero {
        height: 360px;
    }

    .page-hero-title {
        font-size: 40px;
    }

    .gallery-section {
        padding-top: 64px;
        padding-bottom: 72px;
    }

    .gallery-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 10px;
    }
}

/* =========================================================
   ALTERNATE HOME PAGE (index-alt.html) — full photo hero
   ========================================================= */
.home-hero {
    position: relative;
    height: 520px;
    overflow: hidden;
    background-color: #1b2a4a;
}

.home-hero-photo {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.home-hero-shade {
    pointer-events: none;
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(21, 19, 17, 0.35) 0%, rgba(21, 19, 17, 0.55) 100%);
    background-color: rgba(0, 0, 0, 0.15);
}

.home-hero-content {
    pointer-events: none;
    position: relative;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

.home-hero-eyebrow {
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.3em;
    color: #f4efe6;
    margin-bottom: 1.25rem;
}

.home-hero-title {
    max-width: 1240px;
    font-family: "Fraunces", serif;
    font-size: 60px;
    line-height: 1.05;
    font-weight: 500;
    color: #ffffff;
    text-shadow: 0 2px 24px rgba(0, 0, 0, 0.35);
}

.hero-after-photo {
    padding-top: 56px;
    padding-bottom: 64px;
}

.hero-after-photo .hero-buttons {
    margin-bottom: 0;
}

@media (max-width: 767px) {
    .home-hero {
        height: 460px;
    }

    .home-hero-title {
        font-size: 40px;
    }

    .hero-after-photo {
        padding-top: 40px;
    }
}

/* hero text stays clickable; the rest of the hero clicks through to the photo */
.home-hero-content > *,
.page-hero-content > * {
    pointer-events: auto;
}

/* home-hero-subtitle — the line under the big headline on the photo */
.home-hero-subtitle {
    margin-top: 1.5rem;
    margin-bottom: 80px;
    max-width: 1300px;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 16px;
    letter-spacing: 4px;
    text-transform: uppercase;
    line-height: 1.35;
    font-weight: 400;
    color: #ffffff;
    text-shadow: 0 2px 16px rgba(0, 0, 0, 0.4);
}

@media (max-width: 767px) {
    .home-hero-subtitle {
        font-size: 12px;
        letter-spacing: 2.5px;
        line-height: 1.6;
        margin-bottom: 40px;
    }
}

/* clicks on empty parts of the cellar band reach the photo behind it */
.cellar-content {
    pointer-events: none;
}

.cellar-content > * {
    pointer-events: auto;
}

/* =========================================================
   LINE BREAKS — no widows
   Headlines and short lines are balanced into even lines;
   paragraphs avoid leaving one word alone on the last line.
   Works on every screen size automatically.
   ========================================================= */
h1,
h2,
h3,
h4,
.home-hero-subtitle,
.hero-subtitle,
.gallery-intro,
.intro-lead,
.invite-title,
.quote-band-text,
.person-quote,
.caption-quote,
.dish-name {
    text-wrap: balance;
}

/* Quotes run the full width of their column (matches the photo below) */
.story-quote {
    text-wrap: pretty;
}

p {
    text-wrap: pretty;
}

/* =========================================================
   HOME — logo, Reserve button and menu link in one row
   The Reserve button sits in the exact center of the page;
   the logo fills the left side, the menu link the right.
   ========================================================= */
.hero-after-photo .hero-content {
    width: 100%;
    max-width: 1152px;
}

.hero-after-photo .hero-buttons {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    column-gap: 40px;
}

.hero-logo {
    justify-self: end;
    display: block;
    height: 130px;
    width: auto;
}

.hero-after-photo .link-explore-menu {
    justify-self: start;
}

@media (max-width: 767px) {
    .hero-after-photo .hero-buttons {
        grid-template-columns: 1fr;
        justify-items: center;
        row-gap: 24px;
    }

    .hero-logo {
        justify-self: center;
        height: 72px;
    }

    .hero-after-photo .link-explore-menu {
        justify-self: center;
    }
}

/* =========================================================
   BLUE BUTTONS — hover color
   One rule for every blue "Reserve a Table" button.
   Change the color here and all of them follow.
   ========================================================= */
.btn-header-reserve,
.btn-hero-reserve,
.btn-reserve-wide {
    transition: background-color 0.2s ease;
}

.btn-header-reserve:hover,
.btn-hero-reserve:hover,
.btn-reserve-wide:hover {
    background-color: #78e4ff;
}

#bm-nav a.cta:hover {
    background: #78e4ff !important;
}

/* page-hero-subtitle — the short line under the title on photo heroes (Our Story) */
.page-hero-subtitle {
    margin-top: 1.25rem;
    max-width: 640px;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 18px;
    line-height: 1.6;
    font-weight: 400;
    color: #ffffff;
    text-shadow: 0 2px 16px rgba(0, 0, 0, 0.45);
    text-wrap: balance;
}

@media (max-width: 767px) {
    .page-hero-subtitle {
        font-size: 15px;
    }
}

/* =========================================================
   OUR STORY — staff section and together section order
   ========================================================= */
.staff-section {
    background-color: #fcfaf6;
    padding-top: 112px;
    padding-bottom: 112px;
}

.staff-photo-frame {
    width: 65%;
    margin-left: auto;
    margin-right: auto;
    overflow: hidden;
    border-radius: 8px;
    box-shadow: 0 1px 2px rgba(27, 42, 74, 0.04), 0 12px 32px rgba(27, 42, 74, 0.08);
}

.staff-photo {
    display: block;
    width: 100%;
    aspect-ratio: 3816 / 1740;
    object-fit: cover;
}

.staff-text {
    max-width: 680px;
    margin-top: 56px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.staff-title {
    font-family: "Fraunces", serif;
    font-size: 44px;
    line-height: 1.1;
    font-weight: 500;
    color: #1b2a4a;
    margin-bottom: 1.25rem;
}

.staff-text .story-paragraph {
    color: #545049;
}

.together-section {
    background-color: #ffffff;
}

.together-section .together-header {
    margin-top: 56px;
    margin-bottom: 0;
}

@media (max-width: 767px) {
    .staff-section {
        padding-top: 72px;
        padding-bottom: 72px;
    }

    .staff-text {
        margin-top: 36px;
    }

    .staff-photo-frame {
        width: 100%;
    }

    .staff-title {
        font-size: 32px;
    }
}

/* invite — three columns: heading | photo | text and buttons */
.invite-buttons {
    flex-wrap: nowrap;
}

.invite-left {
    text-align: right;
}

.invite-left .eyebrow-row {
    justify-content: flex-end;
}

.invite-photo-frame {
    overflow: hidden;
    border-radius: 8px;
    box-shadow: 0 1px 2px rgba(27, 42, 74, 0.04), 0 12px 32px rgba(27, 42, 74, 0.1);
}

.invite-photo {
    display: block;
    width: 100%;
    aspect-ratio: 3 / 4;
    object-fit: cover;
}

@media (max-width: 1023px) {
    .invite-row {
        grid-template-columns: 1fr 240px 1.2fr;
        column-gap: 36px;
    }
}

@media (max-width: 767px) {
    .invite-row {
        grid-template-columns: 1fr;
        row-gap: 28px;
    }

    .invite-left {
        text-align: left;
    }

    .invite-left .eyebrow-row {
        justify-content: flex-start;
    }

    .invite-photo-frame {
        max-width: 320px;
    }

    .invite-buttons {
        flex-wrap: wrap;
    }
}

/* person-credential — the small credential line under Federico's bio */
.person-credential {
    display: inline-block;
    margin-top: 1.25rem;
    padding: 8px 14px;
    border: 1px solid #d6cfc1;
    border-radius: 4px;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: #8b3947;
}

/* sommelier-seal — the Court of Master Sommeliers seal on Federico's photo.
   It sits over the lower right corner and doesn't change any spacing. */
.portrait-photo-wrap {
    position: relative;
}

.sommelier-seal {
    position: absolute;
    right: -6%;
    bottom: -5%;
    width: 28%;
    height: auto;
    filter: drop-shadow(0 4px 10px rgba(27, 42, 74, 0.25));
}

@media (max-width: 767px) {
    .sommelier-seal {
        right: -2%;
        width: 30%;
    }
}

/* together-signature — the handwritten-style sign-off at the end of Our Story */
.together-signature {
    margin-top: 2rem;
    font-family: "Playfair Display", serif;
    font-style: italic;
    font-size: 28px;
    line-height: 1.3;
    color: #8b3947;
}

@media (max-width: 767px) {
    .together-signature {
        font-size: 24px;
    }
}

/* Our Story — keep the kitchen and closing headings on one line on desktop */
.staff-text,
.together-section .together-header {
    max-width: 960px;
}

.staff-text .story-paragraph,
.together-text {
    max-width: 680px;
    margin-left: auto;
    margin-right: auto;
}

@media (min-width: 900px) {
    .staff-title,
    .together-title {
        white-space: nowrap;
    }
}

/* =========================================================
   FOOTER INFO — address, hours and contact, three columns
   ========================================================= */
.footer-info {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    max-width: 900px;
    margin: 0 auto 56px;
    text-align: center;
}

.footer-info-col {
    padding: 4px 24px;
}

.footer-info-col + .footer-info-col {
    border-left: 1px solid rgba(244, 239, 230, 0.25);
}

.footer-info-label {
    margin-bottom: 12px;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.24em;
    color: #f4efe6;
    opacity: 0.7;
}

.footer-info-text {
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 15px;
    line-height: 1.7;
    color: #ffffff;
}

.footer-info-text + .footer-info-text {
    margin-top: 8px;
}

.footer-info-link {
    color: inherit;
    text-decoration: none;
    transition: color 0.2s ease;
}

.footer-info-link:hover {
    color: #78e4ff;
}

.footer-thanks {
    margin-top: 14px;
    font-family: "Playfair Display", serif;
    font-style: italic;
    font-size: 18px;
    color: #f4efe6;
}

@media (max-width: 767px) {
    .footer-info {
        grid-template-columns: 1fr;
        row-gap: 28px;
    }

    .footer-info-col + .footer-info-col {
        border-left: 0;
        border-top: 1px solid rgba(244, 239, 230, 0.25);
        padding-top: 28px;
    }
}

/* ============ EVENTS PAGE ============ */
.events-heading {
    font-family: "Fraunces", serif;
    font-size: 44px;
    line-height: 1.1;
    font-weight: 500;
    color: #1b2a4a;
    margin-top: 1.25rem;
    text-wrap: balance;
}

.events-intro-btn {
    display: inline-block;
    margin-top: 2rem;
}

.portrait-text > .events-intro-btn {
    margin-top: 2rem;
}

/* Occasions: four cards */
.occasions-section {
    background-color: #ffffff;
    padding-top: 104px;
    padding-bottom: 112px;
}

.occasions-header {
    text-align: center;
    margin-bottom: 56px;
}

.occasions-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 24px;
}

.occasion-card {
    background-color: #fcfaf6;
    border: 1px solid #ebe4d6;
    border-top: 3px solid #8b3947;
    border-radius: 8px;
    padding: 32px 28px 36px;
}

.occasion-title {
    font-family: "Fraunces", serif;
    font-size: 24px;
    line-height: 1.2;
    font-weight: 500;
    color: #1b2a4a;
    margin-bottom: 12px;
}

.occasion-text {
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 16px;
    line-height: 1.55;
    color: #545049;
    text-wrap: pretty;
}

/* Request form */
.event-form-section {
    background-color: #f4efe6;
    padding-top: 112px;
    padding-bottom: 120px;
    scroll-margin-top: 80px;
}

.event-form-row {
    display: grid;
    grid-template-columns: 5fr 7fr;
    column-gap: 72px;
    align-items: start;
}

.event-form-intro > * + * {
    margin-top: 1rem;
}

.event-steps {
    list-style: none;
    padding: 0;
    margin-top: 2rem;
    display: grid;
    gap: 20px;
}

.event-step {
    display: flex;
    gap: 16px;
    align-items: flex-start;
}

.event-step-number {
    flex: none;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1px solid #8b3947;
    color: #8b3947;
    font-family: "Fraunces", serif;
    font-size: 18px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.event-step-title {
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 15px;
    font-weight: 700;
    color: #1b2a4a;
    margin-top: 6px;
}

.event-step-text {
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 15px;
    line-height: 1.5;
    color: #545049;
    margin-top: 2px;
}

.event-contact {
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 15px;
    line-height: 1.6;
    color: #545049;
    border-top: 1px solid #ddd4c4;
    padding-top: 24px;
    margin-top: 2.5rem;
}

.event-contact-link {
    color: #1b2a4a;
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.event-contact-link:hover {
    color: #8b3947;
}

.event-form-card {
    background-color: #ffffff;
    border-radius: 10px;
    padding: 40px;
    box-shadow: 0 1px 2px rgba(27, 42, 74, 0.04), 0 16px 40px rgba(27, 42, 74, 0.10);
}

.form-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 20px 20px;
}

.form-field-full {
    grid-column: 1 / -1;
}

.form-field-pair {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 12px;
}

.form-label {
    display: block;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: #1b2a4a;
    margin-bottom: 8px;
}

.form-input {
    display: block;
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
    height: 48px;
    padding: 0 14px;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 15px;
    color: #1b2a4a;
    background-color: #fcfaf6;
    border: 1px solid #d6cfc1;
    border-radius: 6px;
}

.form-input:focus {
    outline: none;
    border-color: #1b2a4a;
    background-color: #ffffff;
    box-shadow: 0 0 0 3px rgba(11, 203, 251, 0.25);
}

.form-textarea {
    height: auto;
    min-height: 132px;
    padding: 12px 14px;
    resize: vertical;
}

.form-submit-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-top: 28px;
}

.form-submit {
    border: 0;
    cursor: pointer;
}

.form-note {
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 13px;
    color: #7a7366;
}

@media (max-width: 1023px) {
    .occasions-grid {
        grid-template-columns: 1fr 1fr;
    }

    .event-form-row {
        grid-template-columns: 1fr;
        row-gap: 48px;
    }
}

@media (max-width: 767px) {
    .events-heading {
        font-size: 32px;
    }

    .occasions-section,
    .event-form-section {
        padding-top: 72px;
        padding-bottom: 80px;
    }

    .occasions-grid,
    .form-grid {
        grid-template-columns: 1fr;
    }

    .event-form-card {
        padding: 28px 20px;
    }
}

/* ============ MENU PAGE ============ */
.menus-section {
    background-color: #fcfaf6;
    padding-top: 104px;
    padding-bottom: 104px;
}

.menus-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 48px;
}

.menu-card {
    background-color: #ffffff;
    border: 1px solid #ebe4d6;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0 1px 2px rgba(27, 42, 74, 0.04), 0 12px 32px rgba(27, 42, 74, 0.08);
    display: flex;
    flex-direction: column;
}

.menu-card-photo-frame {
    display: block;
    background-color: #f4efe6;
    padding: 32px 48px 0;
    border-bottom: 1px solid #ebe4d6;
    overflow: hidden;
}

.menu-card-photo {
    display: block;
    width: 100%;
    aspect-ratio: 10 / 7;
    object-fit: cover;
    object-position: top;
    box-shadow: 0 8px 24px rgba(27, 42, 74, 0.12);
    transition: transform 0.4s ease;
}

.menu-card-photo-frame:hover .menu-card-photo {
    transform: translateY(-6px);
}

.menu-card-text {
    padding: 40px 44px 44px;
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.menu-card-text > * + * {
    margin-top: 1rem;
}

.menu-card-title {
    font-family: "Fraunces", serif;
    font-size: 40px;
    line-height: 1.1;
    font-weight: 500;
    color: #1b2a4a;
}

.menu-card-btn {
    display: inline-block;
    margin-top: auto !important;
}

.menu-card-text .story-paragraph {
    margin-bottom: 1.75rem;
}

.menus-note {
    text-align: center;
    margin-top: 56px;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 15px;
    line-height: 1.6;
    color: #545049;
    text-wrap: balance;
}

@media (max-width: 767px) {
    .menus-section {
        padding-top: 64px;
        padding-bottom: 72px;
    }

    .menus-grid {
        grid-template-columns: 1fr;
        gap: 32px;
    }

    .menu-card-photo-frame {
        padding: 24px 28px 0;
    }

    .menu-card-text {
        padding: 28px 24px 32px;
    }

    .menu-card-title {
        font-size: 32px;
    }
}

/* ============ PRIVACY POLICY & 404 ============ */
.legal-section {
    background-color: #fcfaf6;
    padding: 96px 24px 112px;
}

.legal-content {
    max-width: 720px;
    margin-left: auto;
    margin-right: auto;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 17px;
    line-height: 1.65;
    color: #545049;
}

.legal-title {
    font-family: "Fraunces", serif;
    font-size: 60px;
    line-height: 1.05;
    font-weight: 500;
    color: #1b2a4a;
    margin-top: 1.25rem;
    text-wrap: balance;
}

.legal-updated {
    font-size: 13px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #7a7366;
    margin-top: 0.75rem;
    margin-bottom: 2.5rem;
}

.legal-content h2 {
    font-family: "Fraunces", serif;
    font-size: 26px;
    line-height: 1.2;
    font-weight: 500;
    color: #1b2a4a;
    margin-top: 2.75rem;
    margin-bottom: 0.75rem;
}

.legal-content p + p {
    margin-top: 1rem;
}

.legal-content ul {
    list-style: disc;
    padding-left: 1.25rem;
    margin-top: 0.5rem;
    margin-bottom: 1rem;
}

.legal-content li + li {
    margin-top: 0.6rem;
}

.legal-content strong {
    color: #1b2a4a;
    font-weight: 600;
}

.legal-content a {
    color: #1b2a4a;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.legal-content a:hover {
    color: #8b3947;
}

.notfound-section {
    background-color: #fcfaf6;
    padding: 120px 24px 136px;
}

.notfound-content {
    max-width: 640px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

.notfound-number {
    font-family: "Fraunces", serif;
    font-size: 120px;
    line-height: 1;
    font-weight: 400;
    color: #e6dccb;
    margin-bottom: 1.5rem;
}

.notfound-text {
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 17px;
    line-height: 1.6;
    color: #545049;
    margin-top: 1.25rem;
    text-wrap: balance;
}

.notfound-buttons {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 16px;
    margin-top: 2.25rem;
}

.notfound-small {
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 15px;
    color: #545049;
    margin-top: 2rem;
}

@media (max-width: 767px) {
    .legal-section,
    .notfound-section {
        padding-top: 64px;
        padding-bottom: 80px;
    }

    .legal-title {
        font-size: 40px;
    }

    .notfound-number {
        font-size: 88px;
    }
}

/* ============ HOME dropdown in the header (temporary: Homepage 1 / 2) ============ */
.nav-dropdown {
    position: relative;
}

.nav-dropdown-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: -16px;
    min-width: 180px;
    padding: 10px 0;
    background-color: #fcfaf6;
    border: 1px solid rgba(27, 42, 74, 0.12);
    border-radius: 8px;
    box-shadow: 0 12px 32px rgba(27, 42, 74, 0.12);
}

.nav-dropdown:hover .nav-dropdown-menu,
.nav-dropdown:focus-within .nav-dropdown-menu {
    display: block;
}

.nav-dropdown-link {
    display: block;
    padding: 10px 16px;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: #545049;
    white-space: nowrap;
}

.nav-dropdown-link:hover {
    color: #7e6028;
    background-color: #f4efe6;
}

/* ============ HOMEPAGE 2: awards, 2 x 2, click to enlarge ============ */
.award-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
    margin-top: 1.25rem;
}

.award-tile {
    margin: 0;
    aspect-ratio: 1 / 1;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
    background-color: #f4efe6;
    border: 1px solid rgba(27, 42, 74, 0.10);
    border-radius: 6px;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.award-tile:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 24px rgba(27, 42, 74, 0.14);
}

.award-photo {
    display: block;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
    box-shadow: 0 2px 8px rgba(27, 42, 74, 0.12);
}

.award-grid-hint {
    margin-top: 0.75rem;
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 12px;
    color: #000000;
    font-style: italic;
}

/* ============ HOMEPAGE 2: "Getting Here" column, taller to sit beside the awards ============ */
.visit-home2 .map-frame {
    height: 400px;
}

.visit-home2 .map {
    height: 100%;
}

.visit-home2 .directions-grid {
    display: grid;
    row-gap: 20px;
}

.visit-home2 .direction-heading {
    font-size: 14px;
    line-height: 20px;
}

.visit-home2 .direction-text {
    font-size: 14px;
    line-height: 22.75px;
    margin-top: 2px;
}

/* Tock booking widget in "Your evening starts here".
   Tock's own styles are wider than our column, so these rules let it fit
   and give the Book Now button the site's blue. (!important is needed to
   override Tock's built-in styles.) */
#Tock_widget_container {
    min-height: 56px;
}

#Tock_widget_container .TockSearchBar-container {
    flex-wrap: wrap !important;
    row-gap: 12px;
    width: 100% !important;
}

#Tock_widget_container .TockSearchBar-container > div:not(.TockInlineButton) {
    flex: 1 1 0 !important;
    min-width: 0 !important;
    width: auto !important;
    max-width: none !important;
}

/* the time list must be allowed to drop down outside its box, so no overflow: hidden here */
#Tock_widget_container .TockSearchBar-container > .InlineWidget-dropdownContainer > .InlineWidgetDropDown-section {
    width: 100% !important;
    min-width: 0 !important;
    border-radius: 0 8px 8px 0;
}

#Tock_widget_container .InlineWidgetDropDown-LeftRounded {
    border-radius: 8px 0 0 8px !important;
}

#Tock_widget_container .TockSearchBar-container > .TockInlineButton {
    flex: 1 0 100% !important;
    width: 100% !important;
    max-width: none !important;
}

#Tock_widget_container .TockInlineButton-container {
    width: 100% !important;
    height: 52px !important;
    border-radius: 8px !important;
    background: #0bcbfb !important;
    box-shadow: 0 12px 32px rgba(27, 42, 74, 0.08);
}

#Tock_widget_container .TockInlineButton * {
    color: #fffdf8 !important;
}

#Tock_widget_container .TockInlineButton-container .MainLabelSpan {
    font-family: "Plus Jakarta Sans", sans-serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    letter-spacing: 0.18em !important;
    text-transform: uppercase;
}

#Tock_widget_container .TockSearchBar-tockIcon,
#Tock_widget_container .TockSearchBar-tockIcon * {
    color: #7a7366 !important;
    fill: #7a7366 !important;
}

/* phones: stack party size, date and time */
@media (max-width: 639px) {
    #Tock_widget_container .TockSearchBar-container > div:not(.TockInlineButton) {
        flex: 1 0 100% !important;
        border-radius: 8px !important;
    }
}

/* =========================================================
   GALLERY FILTER BUTTONS (gallery page) — All, Mains, Seafood...
   ========================================================= */
.gallery-filters {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin-bottom: 40px;
}

.gallery-filter-btn {
    border: 1px solid #d6cfc1;
    border-radius: 999px;
    background-color: #ffffff;
    padding: 10px 20px;
    font-family: Plus Jakarta Sans, sans-serif;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: #746d62;
    cursor: pointer;
    transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.gallery-filter-btn:hover {
    border-color: #7e6028;
    color: #7e6028;
}

.gallery-filter-btn.is-active {
    background-color: #1b2a4a;
    border-color: #1b2a4a;
    color: #ffffff;
}

.gallery-item[hidden] {
    display: none;
}

@media (max-width: 639px) {
    .gallery-filters {
        gap: 8px;
        margin-bottom: 28px;
    }

    .gallery-filter-btn {
        padding: 8px 14px;
        font-size: 11px;
        letter-spacing: 0.1em;
    }
}


/* ===== What Our Guests Say (home) and guest story (events) ===== */
.guests-section {
    background-color: #fcfaf6;
    padding-top: 96px;
    padding-bottom: 104px;
}

.guests-header {
    text-align: center;
    margin-bottom: 48px;
}

.guests-heading {
    font-family: "Fraunces", serif;
    font-size: 2.25rem;
    line-height: 1.15;
    font-weight: 500;
    color: #1b2a4a;
    margin-top: 12px;
}

.guests-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.guest-card {
    margin: 0;
    background-color: #ffffff;
    border: 1px solid #ebe4d6;
    border-radius: 8px;
    padding: 32px 28px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.guest-stars {
    display: flex;
    gap: 3px;
    color: #c99a3b;
}

.guest-quote {
    margin: 0;
    flex: 1;
    font-family: "Fraunces", serif;
    font-style: italic;
    font-size: 20px;
    line-height: 1.5;
    color: #1b2a4a;
}

.guest-name {
    font-family: "Plus Jakarta Sans", sans-serif;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #8b3947;
}

.guest-story-section {
    background-color: #fcfaf6;
    padding-top: 88px;
    padding-bottom: 96px;
}

.guest-story {
    margin: 0 auto;
    max-width: 760px;
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}

.guest-story-quote {
    margin: 0;
    font-family: "Fraunces", serif;
    font-style: italic;
    font-size: 26px;
    line-height: 1.5;
    color: #1b2a4a;
}

@media (max-width: 1023px) {
    .guests-grid {
        grid-template-columns: 1fr;
        max-width: 560px;
        margin: 0 auto;
    }
}

@media (max-width: 639px) {
    .guests-section,
    .guest-story-section {
        padding-top: 64px;
        padding-bottom: 72px;
    }
    .guests-heading {
        font-size: 1.875rem;
    }
    .guest-story-quote {
        font-size: 21px;
    }
}


/* ===== Footer: centered navigation + copyright line ===== */
.footer-bottom {
    flex-direction: column;
    justify-content: center;
    text-align: center;
    row-gap: 0.875rem;
}

.footer-nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    column-gap: 0.75rem;
    row-gap: 0.5rem;
    font-size: 0.8125rem;
    font-weight: 500;
    letter-spacing: 0.04em;
    color: #f4efe6;
}

.footer-nav-sep {
    color: rgba(244, 239, 230, 0.35);
}

.footer-copyright .footer-link {
    text-decoration: underline;
    text-underline-offset: 2px;
}

/* ===== Scroll to top button ===== */
.to-top {
    position: fixed;
    right: max(20px, env(safe-area-inset-right, 0px));
    bottom: max(20px, env(safe-area-inset-bottom, 0px));
    z-index: 60;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 1px solid rgba(244, 239, 230, 0.35);
    background-color: #1b2a4a;
    color: #f4efe6;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 6px 18px rgba(27, 42, 74, 0.25);
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    transition: opacity 200ms ease, transform 200ms ease, visibility 200ms, background-color 150ms ease;
}

.to-top.is-visible {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.to-top:hover {
    background-color: #8b3947;
}

.to-top:focus-visible {
    outline: 2px solid #0bcbfb;
    outline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
    .to-top { transition: none; }
}

@media (max-width: 639px) {
    .footer-nav { column-gap: 1.25rem; }
    .footer-nav-sep { display: none; }
}

/* Placeholder for dish photos still to come (Oct 2026) */
.dish-photo-placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    width: 100%;
    background-color: #c9c6c0;
    color: #4a4740;
    font-size: 1rem;
    letter-spacing: 0.05em;
    text-align: center;
    line-height: 1.5;
}