/* ============================================================
   allyhwang.com — Shared Design Tokens
   Consumed by styles.css (main site) and sxsw2027/index.html.
   ============================================================ */

:root {
  --yellow: #ffce3e;
  --black: #000000;
  --white: #ffffff;
  --gray: #7c7c7c;
  --red: #db2c00;
  --blue: #0011ff;

  --font-heading: 'Clash Display', 'Arial Black', sans-serif;
  --font-body: 'Space Grotesk', Arial, sans-serif;

  --pad-x: 40px;
  --pad-y: 90px;
  --gap: 40px;
}

@media (max-width: 900px) {
  :root {
    --pad-x: 24px;
    --pad-y: 60px;
  }
}

/* ── Typography ──────────────────────────────────────────── */
.h1 {
  font-family: var(--font-heading);
  font-weight: 700;
  font-size: 7.5rem;
  line-height: 6.875rem;
  text-transform: uppercase;
  letter-spacing: -1px;
}

.h2 {
  font-family: var(--font-heading);
  font-weight: 700;
  font-size: 3.5rem;
  line-height: 1;
  text-transform: uppercase;
}

.h3 {
  font-family: var(--font-heading);
  font-weight: 700;
  font-size: 2.25rem;
  line-height: 1;
  text-transform: uppercase;
}

.label {
  font-family: var(--font-heading);
  font-weight: 700;
  font-size: 1.75rem;
  line-height: 1;
  text-transform: uppercase;
}

@media (max-width: 900px) {
  .h1 { font-size: 4.5rem; line-height: 4.5rem; }
  .h2 { font-size: 2.5rem; }
  .h3 { font-size: 1.75rem; }
}

@media (max-width: 600px) {
  .h1 { font-size: 3.25rem; line-height: 3.5rem; }
}

@media (min-width: 1400px) {
  .h1 { font-size: 12.5rem; line-height: 11.25rem; }
}