/* ─── Reset & base typography ─────────────── */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; min-height: 100%; max-width: 100%; }
html, body { overflow-x: clip; }
img, svg, video, canvas { display: block; max-width: 100%; height: auto; }
button, input, select, textarea { font: inherit; color: inherit; }
a { color: inherit; text-decoration: none; }
ul, ol { list-style: none; margin: 0; padding: 0; }
h1, h2, h3, h4 { margin: 0; }

/* Avoid iOS auto-zoom on focused form fields */
input, select, textarea { font-size: 16px; }
@media (min-width: 600px) { input, select, textarea { font-size: 17px; } }

/* fluid display headings */
.display {
  font-family: var(--font-sans);
  font-weight: 800;
  font-size: clamp(48px, 9vw, 112px);
  line-height: 0.95;
  letter-spacing: -0.02em;
  margin: 0 0 var(--s-7);
  color: var(--fg);
  text-wrap: balance;
  background: linear-gradient(180deg, #FFFFFF 0%, #FFFFFF 60%, #A8A6FF 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}
.h2 .accent-word { color: var(--indigo); }
.h2  { font-size: clamp(28px, 4vw, 48px); margin-bottom: var(--s-6); }
.h3  { font-size: clamp(22px, 2.4vw, 28px); margin-bottom: var(--s-4); }
.lead { font-size: clamp(18px, 2vw, 24px); font-weight: 500; line-height: 1.35; margin: 0 0 var(--s-6); }
.eyebrow { text-transform: uppercase; letter-spacing: 0.08em; font-size: 13px; font-weight: 600; margin-bottom: var(--s-5); }

.muted    { color: var(--fg-2); }
.muted-2  { color: var(--fg-3); }
.muted-3  { color: var(--fg-4); }
.accent   { color: var(--indigo); }

.mt   { margin-top: var(--s-7); }
.mt-sm{ margin-top: var(--s-4); }
.mt-lg{ margin-top: var(--s-8); }

.container {
  width: 100%;
  max-width: 1280px;
  margin-inline: auto;
  padding-inline: clamp(20px, 5vw, 120px);
}
.section { padding-block: clamp(56px, 8vw, 120px); }

/* Selection */
::selection { background: var(--indigo); color: #fff; }