/* ============================================================
   LAPIDARE ENGENHARIA — Design Tokens (Dark / Cinematic build)
   Derivado de /system/design-tokens.css — mesma paleta de marca,
   tipografia e escala, adaptados para fundo escuro premium.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Condensed:wght@400;600;700&family=IBM+Plex+Sans:ital,wght@0,300;0,400;0,500;0,600;1,400&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root {

  /* ----------------------------------------------------------
     CORES DE MARCA — herdadas do design-system original
     ---------------------------------------------------------- */
  --color-brand-deep:     #0a2e52;
  --color-brand-mid:      #0d3b66;
  --color-brand-core:     #1560a8;
  --color-brand-electric: #1a87e0;
  --color-brand-bright:   #3fa3f5;

  --color-metal-dark:  #2e3a47;
  --color-metal-mid:   #5a6a7a;
  --color-metal-light: #8fa3b8;
  --color-metal-pale:  #c8d6e3;

  /* ----------------------------------------------------------
     FUNDO E SUPERFÍCIES — versão escura (ressalva do cliente)
     ---------------------------------------------------------- */
  --color-bg-void:     #04060a;   /* fundo absoluto, atrás de tudo */
  --color-bg-page:     #070a10;   /* fundo geral da página */
  --color-bg-surface:  #0d121a;   /* cards, painéis */
  --color-bg-elevated: #131a24;   /* cards elevados / hover */
  --color-bg-header:   rgba(7, 10, 16, 0.72);

  --border-subtle: rgba(197, 214, 230, 0.09);
  --border-strong: rgba(143, 163, 184, 0.22);
  --border-accent: rgba(63, 163, 245, 0.35);

  /* Cores semânticas (ajustadas para contraste em fundo escuro) */
  --color-success:    #34d399;
  --color-success-bg: rgba(52, 211, 153, 0.1);
  --color-warning:    #fbbf24;
  --color-warning-bg: rgba(251, 191, 36, 0.1);
  --color-danger:     #f87171;
  --color-danger-bg:  rgba(248, 113, 113, 0.1);
  --color-info:       #60a5fa;
  --color-info-bg:    rgba(96, 165, 250, 0.1);

  /* Texto sobre fundo escuro */
  --color-text-primary:   #eef3f8;
  --color-text-secondary: #aebccb;
  --color-text-muted:     #6c7c8e;
  --color-text-inverse:   #04060a;
  --color-text-accent:    var(--color-brand-bright);

  /* ----------------------------------------------------------
     TIPOGRAFIA — mesma família e escala do sistema original
     ---------------------------------------------------------- */
  --font-display: 'IBM Plex Sans Condensed', 'Arial Narrow', sans-serif;
  --font-body:    'IBM Plex Sans', 'Segoe UI', Arial, sans-serif;
  --font-mono:    'IBM Plex Mono', 'Courier New', monospace;

  --text-xs:   0.702rem;
  --text-sm:   0.800rem;
  --text-base: 0.875rem;
  --text-md:   1.000rem;
  --text-lg:   1.143rem;
  --text-xl:   1.286rem;
  --text-2xl:  1.571rem;
  --text-3xl:  2.000rem;

  /* Escala estendida para uso cinematográfico (hero / display) */
  --text-4xl: clamp(2.4rem, 5vw, 3.4rem);
  --text-5xl: clamp(3rem, 7vw, 5rem);
  --text-hero: clamp(3.2rem, 12vw, 9rem);

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

  --leading-tight:   1.2;
  --leading-snug:    1.4;
  --leading-normal:  1.6;
  --leading-relaxed: 1.8;

  --tracking-tight:  -0.02em;
  --tracking-normal:  0;
  --tracking-wide:    0.05em;
  --tracking-wider:   0.1em;
  --tracking-widest:  0.28em;

  /* ----------------------------------------------------------
     ESPAÇAMENTO — escala 4px do sistema original
     ---------------------------------------------------------- */
  --space-1:  4px;
  --space-2:  8px;
  --space-3:  12px;
  --space-4:  16px;
  --space-5:  20px;
  --space-6:  24px;
  --space-8:  32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-20: 80px;
  --space-24: 96px;

  /* ----------------------------------------------------------
     BORDAS / SOMBRAS
     ---------------------------------------------------------- */
  --radius-sm: 4px;
  --radius-md: 12px;
  --radius-lg: 24px;
  --radius-pill: 999px;

  --shadow-sm: 0 1px 3px rgba(0,0,0,0.4);
  --shadow-md: 0 8px 24px rgba(0,0,0,0.45);
  --shadow-lg: 0 24px 60px rgba(0,0,0,0.55);
  --shadow-glow: 0 0 60px rgba(63, 163, 245, 0.25);

  /* ----------------------------------------------------------
     LAYOUT
     ---------------------------------------------------------- */
  --max-width-doc:  960px;
  --max-width-wide: 1240px;

  --z-base: 0;
  --z-raised: 10;
  --z-nav: 500;
  --z-overlay: 900;
  --z-top: 1000;
}