/* Global Styles */

/* ── @font-face ─────────────────────────────────────────── */
@font-face {
  font-family: 'Aktiv Grotesk';
  src: url('../assets/fonts/AktivGrotesk-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Aktiv Grotesk';
  src: url('../assets/fonts/AktivGrotesk-ExtraBold.woff2') format('woff2');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Space Mono';
  src: url('../assets/fonts/SpaceMono-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Space Mono';
  src: url('../assets/fonts/SpaceMono-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* ── Base ───────────────────────────────────────────────── */
html {
  font-size: var(--font-size-base);
  scroll-behavior: smooth;
}

body {
  font-family: var(--font-secondary);
  font-size: var(--font-size-base);
  color: var(--color-text);
  background-color: var(--color-bg);
  overflow: hidden; /* Single viewport page — no scroll */
}

/* ── Footer base ────────────────────────────────────────── */
/* Full styles in css/pages/index.css; base reset here */
#footer { display: contents; }

/* ── Utility classes ────────────────────────────────────── */
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}