/* Shared design tokens — Liz & Abhay */
:root {
  --ink: #322f14;
  --ink-soft: #5b5733;
  --olive: #6e6c34;
  --olive-deep: #4b4a23;
  --sage: #8a834f;
  --sage-soft: #c9c5a2;
  --cream: #fffaf4;
  --paper: #f7f0e5;
  --paper-2: #efe5d5;
  --sand: #e9d7c2;
  --tan: #ad9475;
  --wine: #7a1f26;
  --gold: #b08a35;
  --line: rgba(50, 47, 20, 0.14);

  --script: 'Pinyon Script', 'Snell Roundhand', cursive;
  --serif: 'Cormorant Garamond', 'Cormorant', Georgia, serif;
  --sans: 'Jost', 'Avenir Next', 'Helvetica Neue', system-ui, sans-serif;

  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --shadow-1: 0 1px 2px rgba(50, 47, 20, 0.06), 0 8px 24px rgba(50, 47, 20, 0.08);
  --shadow-2: 0 2px 6px rgba(50, 47, 20, 0.08), 0 24px 60px rgba(50, 47, 20, 0.16);
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: var(--serif);
  font-size: 19px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
img { max-width: 100%; display: block; }
/* The hidden attribute must always win over component display rules. */
[hidden] { display: none !important; }
button, input, select, textarea { font: inherit; color: inherit; }
a { color: inherit; }

/* Subtle paper grain over everything */
.grain::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 100;
  opacity: 0.35;
  mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.35  0 0 0 0 0.3  0 0 0 0 0.2  0 0 0 0.09 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}

.eyebrow {
  font-family: var(--sans);
  font-size: 12px;
  letter-spacing: 0.32em;
  text-transform: uppercase;
  font-weight: 500;
  color: var(--sage);
}
.script { font-family: var(--script); font-weight: 400; line-height: 1.05; }

.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;
}

:focus-visible { outline: 2px solid var(--olive); outline-offset: 3px; border-radius: 4px; }

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