/*
  Design tokens da Azevedo Academy.
  Marca: IA, criação de conteúdo, design, edição de vídeo, marketing e tecnologia.
*/

:root {
  /* ---------- Cores ---------- */
  --color-black: #0E0E0E;
  --color-white: #FAFAFA;

  --color-orange: #FF5A1F; /* acento principal */
  --color-green: #1FAE64;  /* acento secundário — usar com moderação */

  /* Variações de apoio (derivadas, para hover/estados/superfícies) */
  --color-orange-dark: #CC4818;
  --color-orange-light: #FF7A47;
  --color-green-dark: #17864C;

  --color-gray-900: #171717;
  --color-gray-800: #262626;
  --color-gray-700: #404040;
  --color-gray-500: #737373;
  --color-gray-300: #D4D4D4;
  --color-gray-100: #F0F0F0;

  /* Papéis semânticos */
  --color-bg: var(--color-black);
  --color-bg-elevated: var(--color-gray-900);
  --color-text: var(--color-white);
  --color-text-muted: var(--color-gray-300);
  --color-accent: var(--color-orange);
  --color-accent-secondary: var(--color-green);
  --color-border: var(--color-gray-700);
  --color-focus: var(--color-orange);

  /* ---------- Fontes ---------- */
  --font-display: "League Spartan", "Arial Narrow", Arial, sans-serif; /* títulos, impacto */
  --font-body: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; /* texto corrido */

  /* ---------- Escala tipográfica ---------- */
  --text-xs: 0.75rem;    /* 12px */
  --text-sm: 0.875rem;   /* 14px */
  --text-base: 1rem;     /* 16px */
  --text-lg: 1.25rem;    /* 20px */
  --text-xl: 1.75rem;    /* 28px */
  --text-2xl: 2.5rem;    /* 40px */
  --text-3xl: 3.5rem;    /* 56px */
  --text-4xl: 4.5rem;    /* 72px */

  --leading-tight: 1.1;
  --leading-normal: 1.5;
  --leading-relaxed: 1.7;

  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;

  /* ---------- Escala de espaçamento ---------- */
  --space-1: 0.25rem;  /* 4px */
  --space-2: 0.5rem;   /* 8px */
  --space-3: 0.75rem;  /* 12px */
  --space-4: 1rem;     /* 16px */
  --space-5: 1.5rem;   /* 24px */
  --space-6: 2rem;     /* 32px */
  --space-8: 3rem;     /* 48px */
  --space-10: 4rem;    /* 64px */
  --space-12: 6rem;    /* 96px */
  --space-16: 8rem;    /* 128px */

  /* ---------- Outros ---------- */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --radius-full: 9999px;

  --container-max: 1120px;

  --transition-fast: 150ms ease;
  --transition-base: 250ms ease;
}