/* ===== STUDIO 64 — BROWSER RESET & GLOBAL TOKENS =====
   Normalizes browser defaults and defines all CSS custom
   properties (design tokens) used across the whole site.
   Load order: fonts.css → reset.css → style.css
   ====================================================== */

/* Box model */
*, *::before, *::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* Prevent horizontal overflow */
html, body { overflow-x: hidden; }

/* Stop iOS Safari from auto-inflating font sizes (breaks layouts on iPhone) */
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }

/* Base typography & background */
body {
  font-family: 'FiraGO', sans-serif;
  color: #0a0a0a;
  background: #f2f0eb;
  -webkit-font-smoothing: antialiased;
}

/* Global element resets */
a   { text-decoration: none; color: inherit; }
img { max-width: 100%; display: block; }
ul  { list-style: none; }

/* ===== DESIGN TOKENS =====
   All colours, fonts, shadows, and borders are defined here
   so they can be consumed anywhere via var(--name).
   ========================= */
:root {
  /* Colours */
  --ink:   #0a0a0a;
  --paper: #f2f0eb;
  --white: #ffffff;
  --acid:  #d8f000;   /* acid yellow-green accent */
  --hot:   #ff3b1f;   /* hot vermilion */
  --blue:  #0049ff;   /* Studio 64 brand blue (from logo) */

  /* Font stacks */
  --display: 'Bebas Neue', sans-serif;
  --body:    'FiraGO', sans-serif;
  --mono:    'FiraGO', sans-serif;
  --geo:     'FiraGO', sans-serif;
  --bebas:   'Bebas Neue', sans-serif;
  --wave:    '123 Wave', 'FiraGO', sans-serif; /* marquee strip font */

  /* Borders */
  --border:       3px solid var(--ink);
  --border-thick: 5px solid var(--ink);

  /* Shadows (brutalist offset) */
  --shadow:    8px  8px  0 var(--ink);
  --shadow-lg: 12px 12px 0 var(--ink);

  /* Layout */
  --max-w: 1500px;
}