/* base.css — reset, color tokens, typography */

:root {
  --bg: #FFFFFF;
  --ink: #0B0B0F;
  --ink-soft: #1A1A22;
  --paper: #F4F4F2;
  --red: #DC1F2D;
  --red-d: #B0151F;
  --red-soft: #FBE7E9;
  --mute: #6E6E78;
  --line: #E0E0E5;
  --line-dark: #2A2A33;

  --shadow-sm: 0 1px 3px rgba(11,11,15,.08);
  --shadow-md: 0 8px 24px rgba(11,11,15,.12);
  --shadow-lg: 0 24px 60px rgba(11,11,15,.18);

  --display: 'Arial Black', 'Helvetica Neue', Arial, sans-serif;
  --body: Arial, 'Helvetica Neue', sans-serif;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  font-family: var(--body);
  background: var(--bg);
  color: var(--ink);
  line-height: 1.55;
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; height: auto; display: block; }

a { color: var(--red-d); text-decoration: none; }
a:hover { text-decoration: underline; }

h1, h2, h3, h4 {
  font-family: var(--display);
  font-style: italic;
  font-weight: 900;
  line-height: 1;
  letter-spacing: -0.03em;
  margin: 0 0 .5em;
  color: var(--ink);
  text-transform: uppercase;
}

h1 { font-size: clamp(2.2rem, 5vw, 4.5rem); }
h2 { font-size: clamp(1.8rem, 3.5vw, 3rem); }
h3 { font-size: 1.5rem; }
h4 {
  font-size: .82rem;
  letter-spacing: 0.12em;
  font-style: normal;
  text-transform: uppercase;
}

p { margin: 0 0 1em; }

.eyebrow {
  display: inline-block;
  background: var(--red);
  color: #fff;
  padding: 6px 14px;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.18em;
  font-family: var(--body);
  font-style: italic;
  margin-bottom: 16px;
}

.ac { color: var(--red); }