:root { --rule: #3A2A20; }
html { scroll-behavior: smooth; }

body {
  background-color: #FAF6F0;
  /* faint, hand-pressed parchment grain */
  background-image:
    radial-gradient(circle at 18% 12%, rgba(120,86,60,0.035) 0, transparent 42%),
    radial-gradient(circle at 82% 78%, rgba(120,86,60,0.04) 0, transparent 46%),
    radial-gradient(circle at 50% 50%, rgba(255,255,255,0.5) 0, transparent 70%);
}

/* ---- classic dot-leader menu row ---- */
.menu-line { display: flex; align-items: baseline; width: 100%; gap: 0; }
.dots {
  flex: 1 1 auto;
  border-bottom: 2px dotted rgba(58,42,32,0.40);
  position: relative;
  top: -0.32em;
  margin: 0 0.55rem;
  min-width: 1.2rem;
}
.price { font-variant-numeric: tabular-nums; white-space: nowrap; letter-spacing: 0.02em; }

/* ---- double-line vintage frame ---- */
.frame {
  position: relative;
  border: 1.5px solid rgba(58,42,32,0.85);
  box-shadow: 0 0 0 1px #FAF6F0, 0 0 0 3px rgba(58,42,32,0.85);
}
.frame-soft {
  border: 1px solid rgba(58,42,32,0.55);
  box-shadow: 0 0 0 1px #FAF6F0, 0 0 0 2.5px rgba(58,42,32,0.30);
}

/* eyebrow "THE" stamp */
.eyebrow {
  font-family: 'Cinzel', serif;
  letter-spacing: 0.42em;
  text-indent: 0.42em;
}

/* badges */
.badge {
  display: inline-flex; align-items: center; gap: 0.22rem;
  font-family: 'Cinzel', serif;
  font-size: 0.5rem; line-height: 1;
  letter-spacing: 0.14em; text-indent: 0.14em;
  padding: 0.2rem 0.42rem 0.18rem;
  border: 1px solid currentColor; border-radius: 999px;
  vertical-align: middle; transform: translateY(-0.08em);
  white-space: nowrap; opacity: 0.92;
}
.badge svg { width: 0.62rem; height: 0.62rem; }

/* sticky nav active pill */
.nav-link {
  font-family: 'Cinzel', serif;
  letter-spacing: 0.16em; text-indent: 0.16em;
  transition: color .25s ease, background-color .25s ease, border-color .25s ease;
}
.nav-link.is-active { color: #FAF6F0; background-color: #3A2A20; border-color:#3A2A20; }

/* hide scrollbar on nav */
.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

section[id] { scroll-margin-top: 96px; }

.menu-item { break-inside: avoid; }

/* gentle entrance */
.reveal { opacity: 0; transform: translateY(14px); transition: opacity .6s ease, transform .6s ease; }
.reveal.in { opacity: 1; transform: none; }

:focus-visible { outline: 2px solid #9C4A2B; outline-offset: 3px; border-radius: 2px; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .reveal { opacity: 1; transform: none; transition: none; }
}