/* Reset + tokens */
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html, body { height: 100%; }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
img, picture, svg, video { display: block; max-width: 100%; }
input, button, textarea, select { font: inherit; color: inherit; }
button { cursor: pointer; background: none; border: 0; padding: 0; }
a { color: inherit; text-decoration: none; }

:root {
  /* Palette — warm noir */
  --color-bg: #0b0906;
  --color-bg-2: #14100a;
  --color-surface: #1a1510;
  --color-line: rgba(232, 178, 90, 0.14);
  --color-line-strong: rgba(232, 178, 90, 0.28);
  --color-text: #f4ece0;
  --color-muted: #b7a998;
  --color-dim: #7d7266;
  --color-accent: #e8b25a;         /* warm amber gold */
  --color-accent-2: #c96f3c;       /* burnt sienna */
  --color-accent-glow: rgba(232, 178, 90, 0.35);
  --color-burgundy: #4b1c22;

  /* Type scale (clamped) */
  --text-xs: clamp(0.75rem, 0.72rem + 0.15vw, 0.8125rem);
  --text-sm: clamp(0.875rem, 0.85rem + 0.15vw, 0.9375rem);
  --text-base: clamp(1rem, 0.97rem + 0.15vw, 1.0625rem);
  --text-lg: clamp(1.125rem, 1.08rem + 0.25vw, 1.25rem);
  --text-xl: clamp(1.5rem, 1.35rem + 0.75vw, 2rem);
  --text-2xl: clamp(2rem, 1.75rem + 1.5vw, 3rem);
  --text-hero: clamp(3rem, 2.25rem + 4.5vw, 6.5rem);

  /* Spacing */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-24: 6rem;
  --space-32: 8rem;

  --radius-sm: 6px;
  --radius: 12px;
  --radius-lg: 20px;

  --shadow-sm: 0 1px 2px rgba(0,0,0,0.4);
  --shadow: 0 20px 60px -20px rgba(0,0,0,0.6);
}

body {
  font-family: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  font-size: var(--text-base);
  line-height: 1.6;
  color: var(--color-text);
  background: var(--color-bg);
}

.serif { font-family: "Fraunces", "Playfair Display", Georgia, serif; }

.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;
}
.skip-link {
  position: absolute; left: -9999px;
}
.skip-link:focus {
  left: var(--space-4); top: var(--space-4);
  background: var(--color-accent); color: #000; padding: var(--space-2) var(--space-4);
  border-radius: var(--radius-sm); z-index: 100;
}

::selection { background: var(--color-accent); color: #000; }
:focus-visible { outline: 2px solid var(--color-accent); outline-offset: 2px; border-radius: 4px; }