/* Hallmark · ORE landing v2 · tokens
 * theme: ORE Nova Marca (custom · identidade fornecida) · paper-band: light · display: geometric-sans (Geist) · accent-hue: cool (blue 217°)
 * Toda cor e toda família de fonte usadas em v2.css passam por estas variáveis.
 */
:root {
  /* ── Identidade (board da nova marca) ── */
  --color-blue:        #2563EB;   /* Azul Principal */
  --color-navy:        #0F172A;   /* Azul Escuro */
  --color-sky:         #60A5FA;   /* Azul Claro */
  --color-mist:        #F3F6FA;   /* Cinza Claro */
  --color-slate:       #475569;   /* Cinza Escuro */

  /* ── Derivados da identidade ── */
  --color-paper:       #FFFFFF;
  --color-blue-hover:  #1D4ED8;
  --color-blue-tint:   #EAF1FE;
  --color-mist-2:      #E8EEF6;
  --color-slate-2:     #64748B;   /* texto de apoio, 4.7:1 sobre branco */
  --color-line:        #E2E8F0;
  --color-line-soft:   #EDF1F7;
  --color-focus:       #2563EB;

  /* ── Tints de módulo (ícones do grid) ── */
  --color-orange:      #EA580C;  --color-orange-tint: #FFF1E6;
  --color-green:       #16A34A;  --color-green-tint:  #E6F6EC;
  --color-violet:      #6D5BD0;  --color-violet-tint: #EEEBFB;
  --color-red:         #DC2626;  --color-red-tint:    #FDECEC;
  --color-teal:        #0D9488;  --color-teal-tint:   #E0F5F2;
  --color-amber:       #D97706;  --color-amber-tint:  #FEF3DC;

  /* ── WhatsApp ── */
  --color-wa:          #25D366;
  --color-wa-ink:      #128C4A;
  --color-wa-paper:    #EFE9E0;
  --color-wa-bubble:   #DCF8C6;

  /* ── Cores dos modelos de PDF (miniaturas) ── */
  --color-tpl-amber:   #F5B301;
  --color-tpl-orange:  #F97316;
  --color-tpl-ink:     #1E293B;

  /* ── Tipografia ── */
  --font-display: 'Geist', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-body:    'Geist', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-hand:    'Caveat', 'Segoe Print', cursive;

  --text-xs:   0.8125rem;
  --text-sm:   0.9375rem;
  --text-base: 1.0625rem;
  --text-lg:   1.25rem;
  --text-xl:   1.5rem;
  --text-2xl:  clamp(1.75rem, 3.2vw, 2.5rem);
  --text-display: clamp(2.5rem, 4.7vw, 4rem);

  /* ── Espaço (escala 4pt) ── */
  --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-28: 112px;
  --gutter: clamp(16px, 4vw, 40px);
  --content-max: 1200px;

  /* ── Forma ── */
  --radius-sm: 10px;
  --radius:    14px;
  --radius-lg: 20px;
  --radius-xl: 28px;
  --rule: 1px solid var(--color-line);

  /* ── Sombra ── */
  --shadow-soft: 0 1px 2px rgba(15, 23, 42, 0.04), 0 8px 24px -12px rgba(15, 23, 42, 0.14);
  --shadow-lift: 0 2px 4px rgba(15, 23, 42, 0.05), 0 20px 40px -20px rgba(37, 99, 235, 0.28);

  /* ── Movimento ── */
  --ease-out:    cubic-bezier(0.22, 1, 0.36, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --dur-fast: 140ms;
  --dur-base: 220ms;
  --dur-slow: 520ms;

  /* ── App real (ore-web, tema claro — app/globals.css) ──
     Usados só na miniatura do Painel de Serviços, pra ela ser fiel à UI de verdade,
     não ao tom da landing. */
  --app-bg:             #F3F6FA;
  --app-surface:        #FFFFFF;
  --app-border:         #DCE4EF;
  --app-primary:        #2563EB;
  --app-primary-tint:   rgba(37, 99, 235, 0.1);
  --app-text:           #0F172A;
  --app-muted:          #5B6B82;
  --app-success:        #15803D;
  --app-success-bg:     #E6F5EC;
  --app-success-border: #B5DFC4;
  --app-warning:        #B45309;
  --app-warning-bg:     #FEF3DC;
  --app-warning-border: #F3D392;
  --app-neutral-text:   #475569;
  --app-neutral-bg:     #EDF2F9;
  --app-neutral-border: #DCE4EF;

  /* ── Inbox escuro (amostrado da captura real do app, pixel a pixel) ──
     Usado só no destaque "API WhatsApp Business". */
  --dark-bg:           #101828;
  --dark-surface:      #182034;
  --dark-surface-high: #182444;
  --dark-border:       #303858;
  --dark-text:         #F4F8F8;
  --dark-text-sub:     #ACB8C8;
  --dark-muted:        #8894AC;
  --dark-accent:       #4868E4;
  --dark-success:      #70D070;
  --dark-success-bg:   #243C38;
  --dark-warning:      #F0C048;
  --dark-warning-tint: rgba(240, 192, 72, 0.08);
  --dark-warning-border: rgba(240, 192, 72, 0.3);
}
