/* ============================================================
   Typography — Space Grotesk (display) + Space Mono (mono)
   ============================================================ */

body {
  font-family: var(--font-body);
  font-size: var(--fs-body);
  color: var(--ink);
  letter-spacing: -0.005em;
}

/* Заголовки — конденс Oswald */
.mega, .h1, .h2, .h3,
.nav__brand, .footer__brand,
.count__num, .bigmarquee__track,
.manifesto__text {
  font-family: var(--font-display);
}

/* ---- Моноширинная мета: метки, координаты, индексы ---- */
.mono {
  font-family: var(--font-mono);
  font-size: var(--fs-mono);
  letter-spacing: var(--tracking-mono);
  text-transform: uppercase;
  color: var(--ink-dim);
}

.mono--acid { color: var(--acid); }
.mono--cyan { color: var(--cyan); }
.mono--warn { color: var(--warn); }

/* ---- Заголовки ---- */
.mega {
  font-size: var(--fs-mega);
  font-weight: 700;
  line-height: 0.86;
  letter-spacing: -0.005em;
  text-transform: uppercase;
}

.h1 {
  font-size: var(--fs-h1);
  font-weight: 700;
  line-height: 0.9;
  letter-spacing: -0.03em;
  text-transform: uppercase;
}

.h2 {
  font-size: var(--fs-h2);
  font-weight: 600;
  line-height: 0.95;
  letter-spacing: -0.025em;
  text-transform: uppercase;
}

.h3 {
  font-size: var(--fs-h3);
  font-weight: 600;
  letter-spacing: -0.01em;
}

.lead {
  font-size: clamp(1.05rem, 1.6vw, 1.45rem);
  line-height: 1.45;
  color: var(--ink);
  letter-spacing: -0.015em;
}

.dim   { color: var(--ink-dim); }
.faint { color: var(--ink-faint); }
.italic { font-style: italic; }

.outline-text {
  -webkit-text-stroke: 1.4px var(--ink);
  color: transparent;
}

/* ---- Ссылки-подчёркивания с анимацией ---- */
.link {
  position: relative;
  display: inline-block;
  color: var(--ink);
}
.link::after {
  content: "";
  position: absolute;
  left: 0; bottom: -2px;
  width: 100%; height: 1px;
  background: var(--acid);
  transform: scaleX(0);
  transform-origin: right;
  transition: transform var(--dur-fast) var(--ease);
}
.link:hover::after { transform: scaleX(1); transform-origin: left; }
.link:hover { color: var(--acid); }
