:root {
  --ink: #22231f;
  --muted: #66665e;
  --paper: #f5f0e6;
  --paper-light: #fbf8f1;
  --sage: #7d826f;
  --sage-dark: #2f332f;
  --bronze: #9a7440;
  --bronze-dark: #72552e;
  --line: rgba(46, 43, 36, 0.16);
  --shadow: 0 20px 55px rgba(40, 34, 25, 0.14);
  --serif: Georgia, 'Times New Roman', Times, serif;
  --sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background:
    radial-gradient(circle at 16% 10%, rgba(154,116,64,.08), transparent 26rem),
    linear-gradient(180deg, var(--paper-light), var(--paper));
  font-family: var(--sans);
  line-height: 1.65;
  text-rendering: optimizeLegibility;
}
img { display: block; max-width: 100%; }
a { color: inherit; }
address { font-style: normal; }
button, a { -webkit-tap-highlight-color: transparent; }

.shell { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.section-pad { padding: clamp(70px, 8vw, 118px) 0; }

.skip-link {
  position: fixed; z-index: 9999; top: 12px; left: 12px;
  transform: translateY(-160%); padding: 10px 14px;
  background: var(--ink); color: white; border-radius: 4px;
}
.skip-link:focus { transform: translateY(0); }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

.site-header {
  position: sticky; top: 0; z-index: 50;
  background: color-mix(in srgb, var(--paper-light) 92%, transparent);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--line);
}
.header-inner { min-height: 86px; display:flex; align-items:center; justify-content:space-between; gap:30px; }
.brand { display:block; width: 180px; flex:0 0 auto; }
.brand img { width:100%; height:auto; mix-blend-mode:multiply; }
.site-nav { display:flex; gap: 30px; align-items:center; }
.site-nav a { text-decoration:none; font-size:.91rem; font-weight:700; letter-spacing:.055em; text-transform:uppercase; position:relative; }
.site-nav a::after { content:''; position:absolute; left:0; right:100%; bottom:-8px; height:1px; background:var(--bronze); transition:right .2s ease; }
.site-nav a:hover::after, .site-nav a:focus-visible::after { right:0; }
.nav-toggle { display:none; border:0; background:transparent; padding:10px; cursor:pointer; }
.nav-toggle span:not(.sr-only) { display:block; width:26px; height:2px; background:var(--ink); margin:5px 0; transition:.2s ease; }

.eyebrow { margin:0 0 16px; color:var(--bronze-dark); font-size:.75rem; font-weight:800; letter-spacing:.22em; text-transform:uppercase; }
h1,h2,h3 { font-family:var(--serif); font-weight:400; letter-spacing:-.035em; line-height:1.04; margin:0; }
h1 { font-size:clamp(3rem, 6.3vw, 6.25rem); }
h1 em { color:var(--bronze-dark); font-weight:400; }
.hero h1 em { letter-spacing: 0; font-variant-ligatures: none; font-feature-settings: "liga" 0, "clig" 0; }
h2 { font-size:clamp(2.35rem, 4.8vw, 4.65rem); }
h3 { font-size:clamp(1.8rem, 3vw, 2.7rem); }

.hero { overflow:hidden; padding-top:clamp(54px,6vw,92px); }
.hero-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(360px,.72fr); align-items:center; gap:clamp(44px,7vw,96px); }
.hero-copy { max-width:660px; }
.hero-intro { font-family:var(--serif); font-size:clamp(1.18rem,1.6vw,1.45rem); line-height:1.55; color:#45443d; max-width:620px; margin:28px 0 0; }
.hero-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:34px; }
.button { display:inline-flex; justify-content:center; align-items:center; min-height:50px; padding:12px 20px; border:1px solid transparent; text-decoration:none; font-weight:800; font-size:.88rem; letter-spacing:.045em; transition:transform .18s ease, background .18s ease, color .18s ease, border-color .18s ease; }
.button:hover { transform:translateY(-2px); }
.button-primary { background:var(--sage-dark); color:white; }
.button-primary:hover { background:#1f221f; }
.button-ghost { border-color:rgba(47,51,47,.34); background:rgba(255,255,255,.35); }
.button-ghost:hover { border-color:var(--bronze); color:var(--bronze-dark); }
.open-card { display:flex; gap:13px; align-items:flex-start; margin-top:28px; padding-top:24px; border-top:1px solid var(--line); width:min(520px,100%); }
.open-card strong,.open-card span { display:block; }
.open-card strong { font-size:.93rem; }
.open-card div span { color:var(--muted); font-size:.9rem; }
.status-dot { width:9px; height:9px; border-radius:50%; margin-top:7px; background:#728667; box-shadow:0 0 0 5px rgba(114,134,103,.13); flex:0 0 auto; }
.status-dot.closed { background:#9a7440; box-shadow:0 0 0 5px rgba(154,116,64,.13); }
.framed-image { margin:0; position:relative; }
.framed-image::before { content:''; position:absolute; inset:18px -18px -18px 18px; border:1px solid rgba(154,116,64,.45); z-index:-1; }
.framed-image img { width:100%; aspect-ratio:3/4; object-fit:cover; box-shadow:var(--shadow); }
.framed-image figcaption { position:absolute; left:-22px; bottom:30px; background:var(--paper-light); border-left:3px solid var(--bronze); padding:13px 18px; font-family:var(--serif); font-style:italic; box-shadow:0 10px 30px rgba(35,30,24,.12); }

.story { background:var(--sage-dark); color:#f7f2e8; position:relative; }
.story::before { content:'SV'; position:absolute; right:5vw; top:50%; transform:translateY(-50%); font-family:var(--serif); font-size:min(27vw,360px); line-height:1; color:rgba(255,255,255,.025); pointer-events:none; }
.story-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(50px,8vw,120px); align-items:start; position:relative; }
.story .eyebrow { color:#c7a978; }
.story h2 { max-width:570px; }
.story-copy { max-width:650px; font-size:1.08rem; color:rgba(255,255,255,.81); }
.story-copy p { margin:0 0 22px; }
.story-copy .accent-line { margin-top:36px; padding:20px 0 0 22px; border-left:2px solid #b78e53; color:#fff; font-family:var(--serif); font-size:1.24rem; }

.section-heading { display:grid; grid-template-columns:1.1fr .9fr; gap:50px; align-items:end; margin-bottom:42px; }
.section-heading > p { margin:0 0 5px; color:var(--muted); max-width:560px; justify-self:end; }
.gallery { display:grid; grid-template-columns:1.05fr .95fr .95fr; grid-auto-rows:320px; gap:14px; }
.gallery-item { margin:0; overflow:hidden; background:#d8d1c5; min-height:0; }
.gallery-item img { width:100%; height:100%; object-fit:cover; transition:transform .55s ease; }
.gallery-item:hover img { transform:scale(1.025); }
.gallery-tall { grid-row:span 2; }
.gallery-wide { grid-column:span 2; }

.visit { border-top:1px solid var(--line); }
.visit-grid { display:grid; grid-template-columns:1.2fr .8fr; gap:28px; align-items:stretch; }
.visit-card { background:var(--paper-light); border:1px solid var(--line); padding:clamp(30px,5vw,62px); box-shadow:0 14px 45px rgba(43,37,29,.07); }
.visit-card address { margin:32px 0; color:#4b4941; font-size:1.08rem; }
.visit-card address strong { color:var(--ink); }
.hours { border-top:1px solid var(--line); border-bottom:1px solid var(--line); margin:30px 0; }
.hours div { display:flex; justify-content:space-between; gap:24px; padding:9px 0; font-size:.92rem; }
.hours .closed strong { color:var(--bronze-dark); }
.visit-actions { display:flex; flex-wrap:wrap; align-items:center; gap:18px 24px; }
.text-link { text-decoration:none; font-weight:800; font-size:.92rem; border-bottom:1px solid rgba(154,116,64,.5); padding-bottom:2px; }
.cafe-card { background:#aa8b5d; color:#fffaf0; padding:clamp(34px,5vw,62px); display:flex; flex-direction:column; justify-content:flex-end; min-height:460px; position:relative; overflow:hidden; }
.cafe-card::before { content:'☕'; position:absolute; top:-35px; right:-25px; font-size:180px; opacity:.055; transform:rotate(12deg); }
.cafe-card .eyebrow { color:#fff4de; }
.cafe-card p:last-child { max-width:430px; color:rgba(255,255,255,.9); }

.online { padding-top:20px; }
.online-card { background:#252823; color:#f7f2e8; padding:clamp(34px,5vw,58px); display:flex; justify-content:space-between; gap:40px; align-items:center; border-top:4px solid var(--bronze); }
.online-card h2 { font-size:clamp(2rem,3.8vw,3.8rem); }
.online-card p:not(.eyebrow) { margin:14px 0 0; color:rgba(255,255,255,.74); }
.online-card .eyebrow { color:#c7a978; }
.online-actions { display:flex; gap:12px; flex-wrap:wrap; justify-content:flex-end; max-width:470px; }
.online-card .button-ghost { color:white; border-color:rgba(255,255,255,.28); background:transparent; }
.online-card .button-primary { background:#b48a4f; color:#171914; }
.ebay-pending { align-self:center; font-size:.88rem; color:rgba(255,255,255,.58); font-style:italic; }

.site-footer { margin-top:80px; border-top:1px solid var(--line); padding:38px 0 48px; background:rgba(255,255,255,.22); }
.footer-inner { display:grid; grid-template-columns:170px 1fr auto; gap:30px; align-items:center; }
.footer-inner img { width:150px; height:auto; mix-blend-mode:multiply; }
.footer-inner p { margin:4px 0 0; color:var(--muted); font-size:.88rem; }
.footer-small { text-align:right; }

:focus-visible { outline:3px solid rgba(154,116,64,.55); outline-offset:4px; }

@media (max-width: 900px) {
  .header-inner { min-height:74px; }
  .brand { width:150px; }
  .nav-toggle { display:block; }
  .site-nav { position:absolute; top:74px; left:0; right:0; display:none; flex-direction:column; align-items:stretch; gap:0; padding:12px 20px 20px; background:var(--paper-light); border-bottom:1px solid var(--line); box-shadow:0 16px 30px rgba(20,20,16,.08); }
  .site-nav.open { display:flex; }
  .site-nav a { padding:13px 0; }
  .site-nav a::after { display:none; }
  .hero-grid, .story-grid, .section-heading, .visit-grid { grid-template-columns:1fr; }
  .hero-copy { max-width:none; }
  .hero-image { max-width:640px; margin-inline:auto; }
  .story-grid { gap:36px; }
  .section-heading { gap:24px; }
  .section-heading > p { justify-self:start; }
  .gallery { grid-template-columns:1fr 1fr; grid-auto-rows:330px; }
  .gallery-wide { grid-column:span 1; }
  .gallery-tall { grid-row:span 1; }
  .cafe-card { min-height:340px; }
  .online-card { align-items:flex-start; flex-direction:column; }
  .online-actions { justify-content:flex-start; }
  .footer-inner { grid-template-columns:130px 1fr; }
  .footer-small { grid-column:2; text-align:left; }
}

@media (max-width: 620px) {
  .shell { width:min(100% - 28px, 1180px); }
  .section-pad { padding:64px 0; }
  .hero { padding-top:44px; }
  h1 { font-size:clamp(2.9rem,15vw,4.25rem); }
  .hero-actions, .visit-actions, .online-actions { flex-direction:column; align-items:stretch; }
  .button { width:100%; }
  .framed-image::before { inset:10px -8px -10px 8px; }
  .framed-image figcaption { left:12px; bottom:16px; }
  .gallery { grid-template-columns:1fr; grid-auto-rows:auto; }
  .gallery-item { aspect-ratio:4/5; }
  .gallery-wide, .gallery-tall { grid-column:auto; grid-row:auto; }
  .gallery-item:nth-child(2) { aspect-ratio:4/3; }
  .hours div { font-size:.88rem; }
  .visit-card, .cafe-card { padding:30px 24px; }
  .online-card { padding:32px 24px; }
  .footer-inner { grid-template-columns:1fr; text-align:center; }
  .footer-inner img { margin-inline:auto; }
  .footer-small { grid-column:auto; text-align:center; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { transition-duration:.01ms !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; }
}