/* ============================================================
   DUARTE DIGITAL - VARIABLES & DESIGN TOKENS
   Paleta de cores, espaçamento, tipografia
============================================================= */

:root {
  /* Cores Principais */
  --dd-bg-dark: #000101;
  --dd-bg-brand: #020123; /* fundo da identidade visual, usado em secções-chave */
  --dd-violet: #ae46c7;
  --dd-cyan: #2ba8e2;
  --dd-blue: #314cd1;
  --dd-magenta: #c540c5;
  
  /* Tipografia */
  --dd-text-primary: #ffffff;
  --dd-text-muted: rgba(255, 255, 255, 0.68);
  --dd-text-subtle: rgba(255, 255, 255, 0.40);
  
  /* Borders e Backgrounds */
  --dd-border-light: rgba(255, 255, 255, 0.12);
  --dd-border-lighter: rgba(255, 255, 255, 0.06);
  --dd-panel-bg: rgba(255, 255, 255, 0.04);
  --dd-panel-bg-hover: rgba(255, 255, 255, 0.08);
  
  /* Gradientes */
  --dd-grad-primary: linear-gradient(90deg, var(--dd-violet), var(--dd-magenta));
  --dd-grad-secondary: linear-gradient(135deg, var(--dd-cyan), var(--dd-blue));
  
  /* Espaçamento */
  --dd-space-xs: 4px;
  --dd-space-sm: 8px;
  --dd-space-md: 16px;
  --dd-space-lg: 24px;
  --dd-space-xl: 32px;
  --dd-space-2xl: 48px;
  --dd-space-3xl: 64px;
  --dd-space-4xl: 96px;
  
  /* Tipografia */
  --dd-font-base: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
  --dd-font-mono: "SF Mono", Monaco, "Cascadia Code", "Roboto Mono", Consolas, "Courier New", monospace;
  
  /* Font Sizes (fluid between breakpoints) */
  --dd-text-xs: clamp(12px, 1vw, 14px);
  --dd-text-sm: clamp(14px, 1.2vw, 16px);
  --dd-text-base: clamp(16px, 1.4vw, 18px);
  --dd-text-lg: clamp(18px, 2vw, 24px);
  --dd-text-xl: clamp(24px, 3vw, 32px);
  --dd-text-2xl: clamp(32px, 4vw, 48px);
  --dd-text-3xl: clamp(48px, 5vw, 64px);
  
  /* Line Heights */
  --dd-leading-tight: 1.1;
  --dd-leading-normal: 1.5;
  --dd-leading-relaxed: 1.75;
  
  /* Letter Spacing */
  --dd-tracking-normal: 0;
  --dd-tracking-tight: -0.01em;
  --dd-tracking-loose: 0.05em;
  
  /* Border Radius */
  --dd-radius-sm: 8px;
  --dd-radius-md: 12px;
  --dd-radius-lg: 16px;
  --dd-radius-xl: 20px;
  --dd-radius-full: 999px;
  
  /* Z-Index */
  --dd-z-base: 0;
  --dd-z-dropdown: 10;
  --dd-z-fixed: 20;
  --dd-z-modal: 30;
  
  /* Sombras */
  --dd-shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.05);
  --dd-shadow-md: 0 4px 6px rgba(0, 0, 0, 0.1);
  --dd-shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.1);
  --dd-shadow-xl: 0 20px 25px rgba(0, 0, 0, 0.1);
  
  /* Transições */
  --dd-transition-fast: 0.15s ease;
  --dd-transition-base: 0.3s ease;
  --dd-transition-slow: 0.5s ease;
}

/* Light mode (se implementarmos no futuro) */
@media (prefers-color-scheme: light) {
  :root {
    /* Apenas redefinir se necessário; mantém tema escuro por padrão */
  }
}