*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--surface-page); }
body {
  margin: 0;
  color: var(--text-primary);
  background:
    linear-gradient(to right, color-mix(in srgb, var(--ink-950) 4%, transparent) 1px, transparent 1px) 0 0 / clamp(52px, 7vw, 92px) 100%,
    var(--surface-page);
  font-family: var(--font-body);
  font-size: var(--text-md);
  line-height: var(--leading-body);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
img, svg { max-width: 100%; display: block; }
::selection { background: color-mix(in srgb, var(--accent-500) 24%, white); }
:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 3px; }
.skip-link { position: fixed; left: 1rem; top: 1rem; z-index: 999; padding: .7rem 1rem; background: var(--surface-dark); color: white; transform: translateY(-160%); }
.skip-link:focus { transform: translateY(0); }

.container { width: min(calc(100% - (var(--gutter) * 2)), var(--container-max)); margin-inline: auto; }
.section { padding-block: var(--section-block); }
.section--tight { padding-block: clamp(2.6rem, 1.7rem + 3vw, 4.5rem); }
.grid { display: grid; gap: var(--grid-gap); }
.grid-12 { grid-template-columns: repeat(12, minmax(0,1fr)); }
.stack { display: flex; flex-direction: column; gap: var(--space-4); }
.cluster { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); }
.eyebrow { color: var(--accent-500); font-size: var(--text-xs); font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.h1, .h2, .h3 { margin: 0; font-family: var(--font-display); letter-spacing: -0.045em; }
.h1 { font-size: var(--text-3xl); line-height: var(--leading-tight); font-weight: 500; }
.h2 { font-size: var(--text-2xl); line-height: var(--leading-title); font-weight: 500; }
.h3 { font-size: var(--text-xl); line-height: 1.06; font-weight: 500; }
.copy { color: var(--text-secondary); max-width: 46ch; margin: 0; }
.muted { color: var(--text-secondary); }
.rule { border: 0; border-top: 1px solid var(--border-subtle); margin: 0; }

@media (max-width: 699px) {
  body { background-size: 52px 100%; }
  .container { width: min(calc(100% - 2rem), var(--container-max)); }
}

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