:root {
  /* ==========================================================================
     OCT6 Tecnologia — Design Tokens & CSS Variables
     ========================================================================== */

  /* Cores Principais da Marca */
  --color-primary: #c62828;
  --color-primary-dark: #991b1b;
  --color-primary-light: #fef2f2;
  --color-primary-border: #fecaca;
  --color-primary-glow: rgba(198, 40, 40, 0.22);
  --color-primary-glow-hover: rgba(198, 40, 40, 0.35);

  /* Tons Escuros Tecnológicos */
  --color-dark-900: #0b0d10;
  --color-dark-850: #0f1217;
  --color-dark-800: #141820;
  --color-dark-750: #1a202a;
  --color-dark-700: #232b38;
  --color-dark-border: rgba(255, 255, 255, 0.08);
  --color-dark-border-hover: rgba(255, 255, 255, 0.18);

  /* Superfícies Claras e Neutras */
  --color-white: #ffffff;
  --color-surface-50: #f8fafc;
  --color-surface-100: #f1f5f9;
  --color-surface-200: #e2e8f0;
  --color-border: #e2e8f0;
  --color-border-hover: #cbd5e1;

  /* Tipografia & Cores de Texto */
  --color-text-main: #0f172a;
  --color-text-muted: #64748b;
  --color-text-light: #94a3b8;
  --color-text-white: #ffffff;
  --color-text-white-muted: #94a3b8;
  --color-text-white-subtle: #cbd5e1;

  /* Status e Acentos */
  --color-accent-blue: #0284c7;
  --color-accent-teal: #0d9488;
  --color-accent-emerald: #059669;
  --color-accent-amber: #d97706;

  /* Tipografia */
  --font-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  --font-mono: 'JetBrains Mono', monospace;

  /* Espaçamento e Layout */
  --container-max-width: 1200px;
  --container-gutter: 24px;
  --header-height: 78px;

  /* Raios de Borda */
  --radius-xs: 6px;
  --radius-sm: 10px;
  --radius-md: 16px;
  --radius-lg: 24px;
  --radius-full: 9999px;

  /* Sombras */
  --shadow-subtle: 0 2px 10px rgba(0, 0, 0, 0.04);
  --shadow-card: 0 12px 32px rgba(15, 23, 42, 0.06);
  --shadow-card-hover: 0 20px 40px rgba(15, 23, 42, 0.12);
  --shadow-dark-card: 0 16px 36px rgba(0, 0, 0, 0.4);
  --shadow-dark-card-hover: 0 22px 50px rgba(0, 0, 0, 0.55);

  /* Transições */
  --transition-fast: 0.15s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-normal: 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  --transition-smooth: 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}