/* Boutique palette: colors only; existing layout and interactions are preserved. */
:root {
  --brown-darkest: #2D211C;
  --brown-primary: #3E2C25;
  --brown-medium: #6B4D3F;
  --brown-accent: #9B7961;
  --brown-light: #D7C5B5;
  --cream: #F3EEE7;
  --ivory: #FAF7F2;
  --text-dark: #29211D;
  --paper: var(--ivory);
  --ink: var(--text-dark);
  --muted: var(--brown-medium);
  --gold: var(--brown-light);
}
html, body { background: var(--brown-darkest); }
body { color: var(--text-dark); }
main, .page-content { background: var(--ivory); }
.page-content { box-shadow: 0 -16px 45px rgb(45 33 28 / 6%); }
a { color: var(--brown-medium); }
a:hover { color: var(--brown-primary); }
.site-header { color: var(--ivory); }
.site-header a { color: var(--ivory); }
.header-inner { border-bottom-color: var(--brown-light); }
.header-inner::after, .site-nav [aria-current="page"]::after { background: var(--brown-light); }
.site-header :focus-visible { outline-color: var(--cream); }
.header-brand:hover, .site-nav a:hover { color: var(--brown-light); }
.start-screen { background: var(--brown-darkest); }
.start-screen > img { filter: brightness(.4); }
.start-screen > .hero-sketch { filter: sepia(1); }
.start-screen::after { content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(180deg, rgb(30 21 17 / 48%), rgb(30 21 17 / 35%) 45%, rgb(30 21 17 / 58%)); }
.start-screen > .hero-sketch { z-index: 0; }
.start-screen > .hero-photo { z-index: 2; }
.start-screen > .hero-content { z-index: 3; mix-blend-mode: screen; }
.main-heading::after { background: var(--brown-light); }
.hero-description { color: var(--ivory); }
.welcome-strip { background: var(--cream); color: var(--brown-primary); }
.welcome-strip span { color: var(--brown-accent); }
h2, h3 { color: var(--text-dark); }
.eyebrow, h2 em, .timeline-date, .timeline-label { color: var(--brown-medium); }
.ornament { color: var(--brown-accent); }
.section-copy > p:not(.eyebrow), .section-heading > p:last-child, .timeline-stop > p:last-child, .image-note { color: var(--brown-medium); }
.polaroid, .photo-lightbox { background: var(--ivory); }
.polaroid { box-shadow: 0 14px 24px rgb(45 33 28 / 7%), 0 2px 5px rgb(45 33 28 / 4%); }
.polaroid figcaption { color: var(--brown-medium); }
.lightbox-close { background: var(--ivory); color: var(--text-dark); border-color: var(--brown-light); }
.photo-lightbox::backdrop { background: rgb(45 33 28 / 90%); }
.gallery-toggle { color: var(--brown-primary); border-color: var(--brown-primary); }
.gallery-toggle:hover { background: var(--cream); }
.history-timeline::before { background: var(--brown-light); }
.timeline-stop::before { border-color: var(--brown-accent); }
.timeline-stop:last-child::before { background: var(--brown-accent); }
.timeline-photo { background: var(--cream); color: var(--brown-medium); border-color: var(--brown-light); }
.timeline-photo > span { border-color: var(--brown-accent); }
.pause-banner { background: linear-gradient(rgb(0 0 0 / 55%), rgb(0 0 0 / 55%)), url('images/vintage-pause-enhanced.optimized.jpg') center 60% / cover; color: var(--ivory); }
.pause-banner .eyebrow, .quote em { color: var(--cream); }
.button { background: var(--brown-primary); border-color: var(--brown-primary); color: var(--ivory); }
.button:hover { background: var(--brown-medium); color: var(--ivory); }
.button-light { background: transparent; border-color: var(--brown-primary); color: var(--brown-primary); }
.button-light:hover { background: var(--cream); color: var(--brown-primary); }
.pause-banner .button-light { border-color: var(--cream); color: var(--ivory); }
.pause-banner .button-light:hover { background: var(--cream); color: var(--brown-primary); }
.text-link { color: var(--brown-medium); border-color: var(--brown-accent); }
.text-link:hover { color: var(--brown-primary); }
a:focus-visible, button:focus-visible { outline-color: var(--brown-primary); }
.pause-banner a:focus-visible, .site-footer a:focus-visible { outline-color: var(--cream); }
.decor-feature { background: var(--cream); border-color: var(--brown-light); color: var(--brown-medium); }
.decor-feature h3 { color: var(--text-dark); }
.decor-feature h3 em { color: var(--brown-medium); }
.visit-section { background: var(--cream); border-top-color: var(--brown-light); }
.opening-hours { border-color: var(--brown-light); }
.location-card { background: var(--ivory); border-color: var(--brown-light); outline-color: var(--brown-light); }
.location-art { background: transparent; }
.location-pin { color: var(--brown-accent); }
.site-footer { background: var(--brown-darkest); color: var(--cream); }
.site-footer a { color: var(--cream); }
.site-footer > p { color: var(--brown-light); }
.site-footer a:hover { color: var(--brown-light); }
/* Continuous vintage-brown background with readable light text. */
:root { --paper: var(--brown-primary); --ink: var(--ivory); --muted: var(--cream); }
html, body, main, .page-content, .welcome-strip, .visit-section, .site-footer { background: var(--brown-primary); color: var(--cream); }
body, h2, h3 { color: var(--ivory); }
.eyebrow, h2 em, .timeline-date, .timeline-label,
.section-copy > p:not(.eyebrow), .section-heading > p:last-child,
.timeline-stop > p:last-child, .image-note { color: var(--cream); }
a, .text-link { color: var(--cream); }
a:hover, .text-link:hover { color: var(--brown-light); }
.gallery-toggle { color: var(--ivory); border-color: var(--brown-light); }
.gallery-toggle:hover { background: var(--brown-medium); }
.button { background: var(--cream); color: var(--brown-primary); border-color: var(--cream); }
.button:hover { background: var(--brown-light); color: var(--text-dark); }
.button-light { background: transparent; color: var(--cream); border-color: var(--cream); }
.button-light:hover { background: var(--cream); color: var(--brown-primary); }
.decor-feature, .location-card, .timeline-photo { background: var(--brown-medium); color: var(--cream); }
.decor-feature h3, .decor-feature h3 em { color: var(--ivory); }
.location-pin { color: var(--brown-light); }
.polaroid, .photo-lightbox { color: var(--text-dark); }
.timeline-stop::before { border-color: var(--brown-light); }
.timeline-stop:last-child::before { background: var(--brown-light); }
a:focus-visible, button:focus-visible { outline-color: var(--brown-light); }
.photo-lightbox button:focus-visible { outline-color: var(--brown-primary); }
