:root {
  /* ===== Cores ===== */
  --color-bg-header: #0d1b2e;      /* fundo do header (topo + nav) */
  --color-bg-nav-border: rgba(255, 255, 255, 0.08);
  --color-bg-body: #f5f7fa;        /* fundo geral do site */
  --color-bg-card: #ffffff;

  --color-accent: #2f80ed;         /* azul de destaque (logo, links, badges) */
  --color-accent-hover: #1c64d1;
  --color-accent-soft: rgba(47, 128, 237, 0.12);

  --color-text-light: #ffffff;
  --color-text-muted: #9aa7b8;     /* tagline, placeholder, textos secundários no header */
  --color-text-body: #1c2733;      /* texto principal fora do header */
  --color-text-secondary: #5b6b7c;

  --color-border: #e3e8ee;

  /* ===== Tipografia ===== */
  --font-base: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-heading: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  --fs-xs: 0.75rem;
  --fs-sm: 0.875rem;
  --fs-base: 1rem;
  --fs-lg: 1.125rem;
  --fs-xl: 1.5rem;
  --fs-2xl: 2rem;

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

  /* ===== Layout ===== */
  --container-max-width: 1280px;
  --container-padding: 24px;

  --header-height-top: 72px;
  --header-height-nav: 48px;

  /* ===== Espaçamento ===== */
  --space-xs: 4px;
  --space-sm: 8px;
  --space-md: 16px;
  --space-lg: 24px;
  --space-xl: 40px;

  /* Altura fixa dos 3 cards laterais da seção "Destaques" — o card grande calcula
     a própria altura a partir desse valor (3 cards + 2 espaçamentos), então
     mudar só esse número aqui já ajusta os dois lados igual. */
  --destaque-card-height: 130px;

  /* ===== Outros ===== */
  --radius-sm: 4px;
  --radius-md: 8px;
  --transition-fast: 0.15s ease;
}