/* Google Fonts */
@import url('https://fonts.googleapis.com/css2?family=Uncial+Antiqua&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');

:root {
  /* Core brand */
  --brand-black: #0b0b0f;  /* near-black for deep contrast */
  --brand-yellow: #ffd400; /* wizard spark */
  --brand-yellow-600: #ffbf00; 
  --brand-yellow-700: #ffa800; 
  --brand-gray-50: #fafafa;
  --brand-gray-100: #f2f2f2;
  --brand-gray-200: #e6e6e6;
  --brand-gray-300: #d4d4d4;
  --brand-gray-500: #9ca3af;
  --brand-gray-700: #3f3f46;

  /* Surface + text */
  --bg: var(--brand-gray-50);
  --surface: #ffffff;
  --text: #0b0b0f;
  --muted: #52525b;
  --link: #0ea5e9;
  --link-hover: #0284c7;

  /* Accents */
  --accent: var(--brand-yellow);
  --accent-contrast: #0b0b0f;
  --accent-soft: linear-gradient(135deg, #ffdb55 0%, #ffc400 40%, #ffa800 100%);

  /* Borders & shadows */
  --border: var(--brand-gray-200);
  --ring: rgba(255, 212, 0, 0.45);
  --shadow-sm: 0 1px 2px rgba(0,0,0,.06);
  --shadow-md: 0 6px 20px rgba(11,11,15,.12);
  --radius: 16px;

  /* Sizing */
  --container-w: 1100px;
  --header-h: 72px;
}

/* Dark mode */
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0b0b0f; 
    --surface: #121218;
    --text: #f5f5f5;
    --muted: #c2c2c2;
    --border: #242436;
    --shadow-md: 0 8px 24px rgba(0,0,0,.6);
    --link: #38bdf8;
    --link-hover: #0ea5e9;
  }
}