/* Navy, gold and plant-green palette. Loaded after the prototype styles. */
:root {
  --paper: #F2F3ED;
  --paper-deep: #E2E6DF;
  --paper-warm: #F2F3ED;
  --cream: #FAFBF7;
  --navy: #142D42;
  --navy-deep: #102638;
  --gold-antique: #BDA36B;
  --gold-text: #705923;
  --plant-green: #4C633D;
  --deep-green: #263F31;
  --ui-background: var(--navy);
  --ui-deep: var(--navy-deep);
  --ui-highlight: var(--gold-antique);
  --ink: var(--navy);
  --ink-soft: color-mix(in srgb, var(--navy) 80%, transparent);
  --ink-mute: color-mix(in srgb, var(--navy) 61%, transparent);
  --ink-faint: color-mix(in srgb, var(--navy) 38%, transparent);
  --clove: var(--navy);
  --clove-soft: var(--navy-deep);
  --saffron: var(--gold-antique);
  --saffron-deep: var(--gold-text);
  --rust: var(--plant-green);
  --ivy: var(--plant-green);
  --gold: var(--gold-antique);
  --moss: var(--plant-green);
  --moss-deep: var(--deep-green);
  --moss-soft: #78906A;
  --saffron-text: var(--gold-text);
  --saffron-lift: #E1D0A4;
  --saffron-hero: var(--gold-antique);
  --moss-text: #38522D;
  --moss-lift: #B8C99B;
  --line-dark: color-mix(in srgb, var(--navy) 18%, transparent);
  --line-light: color-mix(in srgb, var(--cream) 22%, transparent);
  --light-copy: color-mix(in srgb, var(--cream) 78%, transparent);
  --light-muted: color-mix(in srgb, var(--cream) 58%, transparent);
  --gold-wash: color-mix(in srgb, var(--gold-antique) 13%, transparent);
  --mobile-nav-line: var(--line-light);
  --mobile-nav-backdrop: color-mix(in srgb, var(--navy-deep) 62%, transparent);
  --mobile-nav-control-line: var(--line-dark);
}

body.accent-saffron {
  --accent: var(--gold-antique);
  --accent-deep: var(--navy-deep);
  --accent-hero: var(--gold-antique);
  --accent-soft: var(--gold-antique);
  --accent-text: var(--gold-text);
  --accent-on-dark: var(--saffron-lift);
}
body.accent-moss {
  --ui-background: var(--deep-green);
  --ui-deep: color-mix(in srgb, var(--deep-green) 82%, black);
  --ui-highlight: var(--moss-lift);
  --ink: var(--deep-green);
  --ink-soft: color-mix(in srgb, var(--deep-green) 80%, transparent);
  --ink-mute: color-mix(in srgb, var(--deep-green) 61%, transparent);
  --ink-faint: color-mix(in srgb, var(--deep-green) 38%, transparent);
  --line-dark: color-mix(in srgb, var(--deep-green) 18%, transparent);
  --mobile-nav-backdrop: color-mix(in srgb, var(--deep-green) 62%, transparent);
  --accent: var(--plant-green);
  --accent-deep: var(--deep-green);
  --accent-hero: var(--plant-green);
  --accent-soft: var(--moss-soft);
  --accent-text: var(--moss-text);
  --accent-on-dark: var(--moss-lift);
}

body { background-image: none; }
body::before { display: none; }
::selection { background: var(--gold-antique); color: var(--navy-deep); }

.frame-stroke::after { border-color: color-mix(in srgb, var(--gold-antique) 72%, transparent); }
.frame-stroke--cream::after { border-color: color-mix(in srgb, var(--cream) 62%, transparent); }

.btn--saffron,
.side-rail.expanded .rail-cta a { background: var(--gold-antique); border-color: var(--gold-antique); color: var(--navy-deep); }
.btn--saffron:hover,
.side-rail.expanded .rail-cta a:hover { background: var(--navy-deep); border-color: var(--navy-deep); color: var(--cream); }
body.accent-moss .btn--saffron { background: var(--deep-green); border-color: var(--deep-green); color: var(--cream); }
body.accent-moss .btn--saffron:hover { background: var(--navy-deep); border-color: var(--navy-deep); }
.btn--ghost-ink { border-color: var(--line-dark); }
.btn-link { border-bottom-color: color-mix(in srgb, var(--accent) 55%, transparent); }
.btn-link:hover, .toc-cta:hover { color: var(--accent-text); border-bottom-color: var(--accent-text); }

.hero, .hero-text { background: var(--navy); }
.hero-text h1, .hero-tagline, .hero-contents .toc-label, .toc-item.current .toc-label { color: var(--cream); }
.hero-text h1 .accent { color: var(--gold-antique); }
.hero-contents, .toc-divider { border-color: var(--line-light); }
.toc-item:hover .toc-label { color: var(--saffron-lift); }

.side-rail { background: var(--ui-background); border-color: var(--line-light); }
.rail-toggle, .rail-mark { border-color: var(--line-light); }
.rail-toggle .bars, .rail-toggle .bars::before, .rail-toggle .bars::after { background: var(--cream); }
.rail-mark .rail-mark-k, .rail-mark .rail-mark-wordmark { filter: invert(1) brightness(2) !important; }
.rail-item .rail-icon, .rail-item .name { color: var(--light-copy); }
.rail-item:hover { background: color-mix(in srgb, var(--ui-highlight) 13%, transparent); }
.rail-item:hover .rail-icon, .rail-item.current .rail-icon, .rail-item:hover .name { color: var(--ui-highlight); }
.rail-cta, body.accent-moss .rail-cta { background: var(--gold-antique); }
.rail-cta a, body.accent-moss .rail-cta a { color: var(--navy-deep); }
.rail-cta a:hover, body.accent-moss .rail-cta a:hover { background: var(--navy-deep); color: var(--cream); }
.rail-backdrop { background: color-mix(in srgb, var(--navy-deep) 58%, transparent); }

.section--clove, .page-prose.section--clove, .quote-band,
.chef-band, .reserve-page-info, .footer, .footer-info { background: var(--navy); }
.chef-band::before { background: none; }
.chef-quote, .chef-text, .quote-band q, .section--clove h2, .section--clove h3 { color: var(--cream); }
.section--clove p, .page-prose.section--clove p, .reserve-page-info p { color: var(--light-copy); }
.chef-name, .quote-band cite, .reserve-page-fineprint { color: var(--light-muted); }
.reserve-page-directions { border-bottom-color: color-mix(in srgb, var(--accent-on-dark) 52%, transparent); }
.footer p, .footer a, .footer dd, .refined-footer a { color: var(--light-copy); }
.footer .footer-ornament, .footer-col-head, .footer-hours dt { color: var(--accent-on-dark); }
body.accent-moss .footer, body.accent-moss .footer-info { background: var(--deep-green); }

.menu-howto { background: var(--deep-green); }
.menu-glossary { background: var(--deep-green); }
.menu-howto-headline em, .menu-howto-way h3, .menu-howto-note strong,
.carte-bottom h3, .carte-bottom a, .menu-glossary-grid dt { color: var(--moss-lift); }
.wine-entry.is-targeted { background: var(--gold-wash); }
.menu-section-head::after { box-shadow: 0 0 0 6px var(--paper); }

.faq-search-input:focus { box-shadow: 0 0 0 3px var(--gold-wash); }
body.accent-moss .faq-search-input:focus { box-shadow: 0 0 0 3px color-mix(in srgb, var(--plant-green) 20%, transparent); }
.reserve-party-note { border-color: color-mix(in srgb, var(--gold-antique) 65%, transparent); }
.reserve-party-note a { border-bottom-color: color-mix(in srgb, var(--gold-antique) 78%, transparent); }
.reserve-widget-eyebrow, .reserve-widget-eyebrow-rule { background: var(--line-dark); }

@media (max-width: 820px) {
  .mobile-nav { background: var(--ui-background); border-color: var(--line-light); }
  .mobile-nav__item { color: var(--light-copy); }
  .mobile-nav__item.is-current { color: var(--ui-highlight); }
  .mobile-more-sheet { color: var(--ink); background: var(--paper); }
  .mobile-more-sheet h2, .mobile-more-sheet a, .mobile-more-sheet__close { color: var(--ink); }
  .mobile-more-sheet nav, .mobile-more-sheet a { border-color: var(--line-dark); }
}

.hero-contents .toc-cta { color: var(--gold-antique); }
.hero-contents .toc-cta:hover { color: var(--cream); }
.toc-divider { background: var(--line-light); }
.home-mark img { filter: none; }
.dropcap::first-letter { color: var(--plant-green); }
.mobile-nav__item:focus-visible { outline-color: var(--ui-highlight); }

/* The shared controls inherit the page palette. */
body.accent-moss .rail-cta,
body.accent-moss .side-rail.expanded .rail-cta a {
  background: var(--moss-lift);
  border-color: var(--moss-lift);
  color: var(--deep-green);
}
body.accent-moss .rail-cta a { color: var(--deep-green); }
body.accent-moss .rail-cta a:hover,
body.accent-moss .side-rail.expanded .rail-cta a:hover,
body.accent-moss .btn--saffron:hover { background: var(--ui-deep); color: var(--cream); }
body.accent-moss .section--clove,
body.accent-moss .quote-band { background: var(--deep-green); }
body.accent-moss .frame-stroke::after { border-color: var(--moss-soft); }

/* Inner-page heroes: the text panel takes the page's own band colour (navy on
   gold pages, deep green on green pages) with white and gold type. */
.page-split-hero, .page-split-hero-text { background: var(--ui-background); }
.page-split-hero-text h1 { color: var(--cream); }
.page-split-hero-text h1 em, .page-split-hero-text p { color: var(--saffron-lift); }

/* How to order: the three sub-headings in gold. */
.section--clove .concept-strip h3 { color: var(--saffron-lift); }

/* Recognition box rule, matching the photograph strokes. */
.awards-grid { border-color: color-mix(in srgb, var(--gold-antique) 72%, transparent); }
body.accent-moss .frame-stroke--cream::after { border-color: var(--line-light); }
.refined-footer .footer-logo { width: 108px; height: auto; margin-bottom: 0 !important; }

/* Compact footer links retain their full labels and clear tap targets. */
.refined-footer a:not(.refined-footer-brand) {
  color: var(--accent-on-dark);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 4px;
}
.refined-footer a:hover { color: var(--cream); }
.refined-footer .footer-logo { width: 140px; filter: none; }
@media (max-width: 820px) {
  .refined-footer {
    justify-content: flex-start;
    gap: 0 var(--s3);
  }
  .refined-footer-brand { margin-bottom: var(--s1); }
  .refined-footer-address { flex-basis: 100%; }
  .refined-footer a:not(.refined-footer-brand) { white-space: nowrap; }
}

/* Temporary closure notice. The component predates the navy palette and hardcodes
   the old saffron in its hairlines, so they are retuned to gold here. The hero
   instance sits on the navy hero panel, where a navy card would disappear, so it
   takes the deeper navy and a gold rule to read as a panel within a panel. */
.closure-notice { background: var(--navy-deep); }
.closure-notice-label { border-bottom-color: color-mix(in srgb, var(--gold-antique) 55%, transparent); }
.closure-notice-body a { border-bottom-color: color-mix(in srgb, var(--gold-antique) 75%, transparent); }
.closure-notice-body a:hover { border-bottom-color: var(--cream); }
.closure-notice--hero { border: 1px solid color-mix(in srgb, var(--gold-antique) 45%, transparent); }

/* The footer no longer carries an hours column, so the line runs the full width
   under the footer row rather than sitting in a 22ch column beside it. */
.footer-closure {
  max-width: none;
  margin-top: var(--s3);
  padding-top: var(--s3);
  border-top-color: color-mix(in srgb, var(--gold-antique) 45%, transparent);
  color: var(--light-copy);
}