@font-face {
  font-family: "EB Garamond";
  font-style: normal;
  font-weight: 600;
  font-display: optional;
  src: url("../fonts/eb-garamond-600-latin.woff2") format("woff2");
}
@font-face {
  font-family: Inter;
  font-style: normal;
  font-weight: 400;
  font-display: optional;
  src: url("../fonts/inter-400-latin.woff2") format("woff2");
}
:root {
  --page: #fff;
  --ink: #111;
  --body: #2a2726;
  --muted: #5c5754;
  --accent: #6b4f2a;
  --line: #e6e4e1;
  --line-ink: #111;
  --soft: #f6f5f3;
  --radius: 10px;
  --header-h: 4.5rem;
  --font-serif: "EB Garamond", Palatino, Georgia, serif;
  --font-sans: Inter, "Segoe UI", system-ui, sans-serif;
  --max: 40rem;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
html, body { margin: 0; }
body {
  font-family: var(--font-sans);
  font-size: 1.05rem;
  line-height: 1.65;
  color: var(--body);
  background: var(--page);
  -webkit-font-smoothing: antialiased;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--ink); text-underline-offset: 0.14em; }
:focus { outline: none; }
:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }

.skip-link {
  position: absolute; left: 0.8rem; top: -4rem; z-index: 1000;
  background: var(--ink); color: #fff; padding: 0.5rem 0.85rem;
  font-weight: 600; text-decoration: none;
}
.skip-link:focus { top: 0; }

.wrap { width: min(var(--max), calc(100% - 2.25rem)); margin-inline: auto; }

h1, h2, h3, .brand-name {
  font-family: var(--font-serif);
  font-weight: 600;
  letter-spacing: -0.02em;
  line-height: 1.18;
  color: var(--ink);
}
h1 { font-size: clamp(1.85rem, 7.2vw, 2.65rem); margin: 0 0 0.85rem; }
h2 { font-size: clamp(1.45rem, 4vw, 1.9rem); margin: 0 0 0.7rem; }
h3 { font-size: 1.12rem; margin: 0 0 0.3rem; }
p { margin: 0 0 0.95rem; }
.lead { font-size: 1.06rem; max-width: 36rem; }
.fine { color: var(--muted); font-size: 0.92rem; margin-top: 0.85rem; }
.kicker {
  display: block;
  font-size: 0.7rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--accent);
  margin: 0 0 0.55rem;
}

.site-header {
  position: sticky; top: 0; z-index: 50;
  background: var(--page);
  border-bottom: 1px solid var(--line-ink);
}
.header-inner {
  display: flex; align-items: center; justify-content: space-between;
  min-height: var(--header-h); gap: 0.75rem;
}
.brand {
  display: flex; align-items: center; gap: 0.65rem;
  text-decoration: none; color: var(--ink); min-width: 0;
}
.brand:hover { text-decoration: none; }
.brand-mark { width: 2.6rem; height: 2.6rem; flex: 0 0 auto; }
.brand-text { display: flex; flex-direction: column; line-height: 1.08; }
.brand-kicker {
  font-size: 0.6rem; letter-spacing: 0.13em; text-transform: uppercase;
  font-weight: 600; color: var(--ink);
}
.brand-name { font-size: 1.14rem; }

.mini-nav { display: none; gap: 1rem; font-size: 0.84rem; font-weight: 600; }
.mini-nav a { color: var(--ink); text-decoration: none; }
.mini-nav a:hover { text-decoration: underline; }
@media (min-width: 720px) { .mini-nav { display: flex; } }

.btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 3rem; padding: 0.55rem 1.15rem;
  border-radius: var(--radius);
  font-family: var(--font-sans); font-weight: 600; font-size: 0.98rem;
  text-decoration: none; border: 1px solid var(--line-ink);
  color: var(--ink); background: var(--page);
}
.btn:hover { text-decoration: none; background: var(--soft); }
.btn-row { display: flex; flex-wrap: wrap; gap: 0.65rem; margin-top: 1.35rem; }

.hero { padding: 2.15rem 0 2.4rem; }
section { padding: 2.35rem 0; }
[id] { scroll-margin-top: 5.1rem; }
.section-rule { border-top: 1px solid var(--line); }

.badge {
  display: inline-flex; align-items: center; gap: 0.4rem;
  padding: 0.32rem 0.75rem; margin-bottom: 1.05rem;
  border-radius: 999px; font-size: 0.78rem; font-weight: 600;
  border: 1px solid var(--line-ink); background: var(--page);
}
.badge-dot { width: 0.42rem; height: 0.42rem; border-radius: 50%; background: var(--muted); }
.badge.is-open .badge-dot { background: #1a7f37; }
.badge.is-closed .badge-dot { background: #c42b2b; }

.grid-2 { display: grid; gap: 0.75rem; }
@media (min-width: 640px) { .grid-2 { grid-template-columns: 1fr 1fr; } }
.card {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 1.05rem 1.05rem 0.95rem;
}

.hours { list-style: none; margin: 0; padding: 0; }
.hours li {
  display: flex; justify-content: space-between; gap: 1rem;
  padding: 0.48rem 0; border-bottom: 1px solid var(--line);
  font-variant-numeric: tabular-nums;
}
.hours li:last-child { border-bottom: 0; }
.hours li.is-today { font-weight: 600; color: var(--ink); }

.faq details { border-bottom: 1px solid var(--line); }
.faq summary {
  cursor: pointer; font-weight: 600; color: var(--ink);
  padding: 0.85rem 0; list-style: none;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::before { content: "+ "; color: var(--muted); font-weight: 500; }
.faq details[open] summary::before { content: "– "; }
.faq details p { margin: 0 0 0.9rem; color: var(--body); }

.site-footer { border-top: 1px solid var(--line-ink); padding: 1.8rem 0 1.35rem; }
.footer-grid { display: flex; gap: 0.85rem; align-items: flex-start; }
.footer-grid img { width: 2.55rem; height: 2.55rem; flex: 0 0 auto; }
.footer-grid p { margin: 0; }
.icon-row { display: flex; gap: 0.5rem; margin-top: 0.75rem; }
.icon-btn {
  width: 2.4rem; height: 2.4rem;
  border: 1px solid var(--line-ink); border-radius: var(--radius);
  display: grid; place-items: center; color: var(--ink); text-decoration: none;
}
.icon-btn svg { width: 1.08rem; height: 1.08rem; fill: currentColor; }
.footer-legal {
  margin-top: 1.35rem; padding-top: 0.95rem; border-top: 1px solid var(--line);
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.4rem 1rem;
  color: var(--muted); font-size: 0.9rem;
}
.footer-legal a { color: var(--body); }

.legal-wrap { max-width: 40rem; }
.legal-wrap h2 { font-size: 1.15rem; margin-top: 1.5rem; }
.page-hero { padding: 2rem 0 1.1rem; border-bottom: 1px solid var(--line); }

.to-top {
  position: fixed; right: 0.85rem;
  bottom: calc(0.85rem + env(safe-area-inset-bottom));
  z-index: 40; width: 2.7rem; height: 2.7rem;
  border-radius: 999px; border: 1px solid var(--line-ink);
  background: var(--page); color: var(--ink);
  display: grid; place-items: center; text-decoration: none;
}
.to-top[hidden] { display: none; }
.to-top svg { width: 1.1rem; height: 1.1rem; fill: currentColor; }

.notfound { padding: 4.2rem 0 5rem; text-align: center; }

.route-overlay {
  position: fixed; inset: 0; z-index: 80;
  background: rgba(17,17,17,.46);
  display: flex; align-items: flex-end; justify-content: center;
  padding: 1rem;
}
.route-overlay[hidden] { display: none; }
.sheet {
  width: min(26rem, 100%);
  background: #fff;
  border: 1px solid var(--line-ink);
  border-radius: 14px 14px 10px 10px;
  padding: 1.15rem 1.1rem 1.05rem;
}
.sheet h2 { font-size: 1.35rem; margin-bottom: 0.25rem; }
.sheet-actions { display: grid; gap: 0.55rem; margin: 1rem 0 0.55rem; }
.sheet-actions .btn { width: 100%; }
.sheet-cancel { width: 100%; }
