/* Reset, base, typography */

*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; font-size: var(--base-fs); }
body {
  background: var(--bg);
  color: var(--body);
  font-family: var(--font-sans);
  font-weight: 400;
  line-height: var(--line-h);
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
img { max-width: 100%; height: auto; display: block; }
a { color: var(--accent); text-decoration: none; transition: color 0.2s; }
a:hover { color: var(--accent-hover); }

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

/* ─── Type scale ─────────────────────────────────────────── */

.section-label {
  font-family: var(--font-mono);
  font-size: 9.5px;
  font-weight: 400;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  color: var(--accent);
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 16px;
}
.section-label::after {
  content: '';
  display: block;
  width: 32px;
  height: 1px;
  background: var(--accent);
}

.eyebrow {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 300;
  letter-spacing: 3px;
  text-transform: uppercase;
  color: var(--accent);
}

.section-title {
  font-family: var(--font-serif);
  font-size: clamp(32px, 4vw, 52px);
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--heading);
  line-height: 1.15;
  margin: 0 0 20px;
}

.hero-headline {
  font-family: var(--font-serif);
  font-size: clamp(48px, 7vw, 88px);
  font-weight: 600;
  letter-spacing: -0.025em;
  color: var(--heading);
  line-height: 1.05;
  max-width: 780px;
}
.hero-headline em {
  font-style: italic;
  color: var(--emphasis);
}

.section-body {
  font-size: 1rem;
  color: var(--body);
  line-height: 1.9;
}

.mono-label {
  font-family: var(--font-mono);
  font-size: 9.5px;
  font-weight: 400;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--accent);
}

.mono-meta {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 400;
  letter-spacing: 1px;
  color: var(--muted);
}

.container {
  max-width: var(--max-w);
  margin: 0 auto;
  padding: 0 40px;
}

@media (max-width: 900px) {
  .container { padding: 0 24px; }
}