/* ============================================
   EMPREGA+ — Design Tokens
   Fonte da verdade: a produção (IMO + EditalHub), não o site.
   ADR-0002 decisão 1 — 2026-09-17.

   Identidade de PRODUTO: navy #1c2444 + índigo de ação #4f46e5 sobre
   superfície clara. O ouro (#c49a3c) permanece como pigmento de
   prestígio (site / PdV), não como accent do sistema.

   Prefixos --emp-* são pigmento (ADR-0001: nomes de cor só nesta camada).
   A ponte (ds-bridge.css) traduz para papéis --accent-*.
   ============================================ */

:root {
  /* ---- Navy (base institucional, IMO) ---- */
  --emp-navy: #1c2444;
  --emp-navy-2: #34427a;
  --emp-table-head: #2a2f45;

  /* ---- Índigo (ação de produto — preenchimento) ----
     O FILL do botão de Ação no IMO é --eds-indigo-dark, não o índigo cru.
     Cru #6366f1 + branco = 4,47:1 (abaixo de AA). #4f46e5 + branco = 6,29:1. */
  --emp-indigo: #6366f1;
  --emp-indigo-dark: #4f46e5;
  --emp-indigo-hover: #4940d3; /* 92% do dark + preto; branco 7,10:1 */
  --emp-violet: #8b5cf6;
  --emp-violet-dark: #7c3aed;

  /* Tinta do índigo SOBRE superfície. Sólido — a ponte não aceita color-mix.
     :root = tema escuro da ponte (45% índigo + branco). Light sobrescreve. */
  --emp-indigo-ink: #b9baf9;

  /* ---- Gold (prestígio — site, não o accent do produto) ---- */
  --emp-gold-light: #d4ad55;
  --emp-gold: #c49a3c;
  --emp-gold-warm: #c49a3c;
  --emp-gold-dark: #a8842f;
  --emp-gold-ink: #c49a3c;
  --emp-purple: #7c3aed;
  --emp-purple-light: #a855f7;
  --emp-purple-soft: rgba(124, 58, 237, 0.12);

  /* ---- Superfícies — :root = escuro IMO (o resolver da ponte lê daqui) ---- */
  --emp-bg: #171b2b;
  --emp-surface-1: #1e2335;
  --emp-surface-deep: #0f1320;
  --emp-surface: #171b2b;
  --emp-surface-tonal: #1e2335;
  --emp-border: #2a3047;

  /* ---- Superfícies claras (Gov, site, IMO light) ---- */
  --emp-light-bg: #ffffff;
  --emp-light-subtle: #fafbfe;
  --emp-light-muted: #eef0f7;
  --emp-light-border: #e9ebf3;

  /* ---- Glass ---- */
  --emp-glass-bg: rgba(255, 255, 255, 0.7);
  --emp-glass-border: rgba(28, 36, 68, 0.08);
  --emp-glass-border-hover: rgba(28, 36, 68, 0.15);

  /* ---- Texto em fundo escuro ---- */
  --emp-text: #e8eaf2;
  --emp-text-secondary: #a3abc4;
  --emp-text-muted: #6f7796;
  --emp-text-subtle: #6f7796;
  --emp-text-inverse: #1e2433;

  /* ---- Semânticas (IMO claro; dark sobrescreve no bloco abaixo) ---- */
  --emp-success: #34d399;
  --emp-success-dark: #047857;
  --emp-error: #f87171;
  --emp-error-dark: #b91c1c;
  --emp-warning: #fbbf24;

  /* ---- Tipografia (passo 1 — Sora/Inter, teto 600 no produto) ---- */
  --emp-font-heading: 'Sora', ui-sans-serif, system-ui, sans-serif;
  --emp-font-sans: 'Inter', ui-sans-serif, system-ui, sans-serif;
  --emp-font-mono: 'JetBrains Mono', monospace;

  --emp-weight-regular: 400;
  --emp-weight-medium: 500;
  --emp-weight-semibold: 600;
  --emp-weight-bold: 600;
  --emp-weight-extrabold: 600;

  /* ---- Motion (IMO = site) ---- */
  --emp-duration-fast: 150ms;
  --emp-duration-normal: 300ms;
  --emp-duration-slow: 500ms;
  --emp-duration-reveal: 700ms;
  --emp-ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --emp-ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);

  /* ---- Escala ---- */
  --emp-text-display: clamp(2.5rem, 6vw, 4.5rem);
  --emp-text-h1: 2.5rem;
  --emp-text-h2: 2rem;
  --emp-text-h3: 1.25rem;
  --emp-text-eyebrow: 0.75rem;
  --emp-text-body-lg: 1.25rem;
  --emp-text-body: 1rem;
  --emp-text-small: 0.875rem;
  --emp-text-code: 0.8125rem;

  /* ---- Espaçamento ---- */
  --emp-space-xs: 0.25rem;
  --emp-space-sm: 0.5rem;
  --emp-space-md: 1rem;
  --emp-space-lg: 1.5rem;
  --emp-space-xl: 2rem;
  --emp-space-2xl: 3rem;
  --emp-space-3xl: 5rem;
  --emp-space-section: clamp(4rem, 3rem + 5vw, 10rem);

  /* ---- Sombras (IMO dark) ---- */
  --emp-shadow-sm: 0 1px 3px rgba(0, 0, 0, .45);
  --emp-shadow-md: 0 14px 32px -14px rgba(0, 0, 0, .7);
  --emp-shadow-lg: 0 12px 34px -12px rgba(0, 0, 0, .6);
  --emp-glow-brand: 0 0 20px rgba(79, 70, 229, 0.20);
  --emp-glow-brand-lg: 0 0 40px rgba(79, 70, 229, 0.25), 0 0 80px rgba(79, 70, 229, 0.10);
  --emp-glow-purple: 0 0 20px rgba(124, 58, 237, 0.20);
  --emp-glow-purple-lg: 0 0 40px rgba(124, 58, 237, 0.28), 0 0 80px rgba(124, 58, 237, 0.12);

  --emp-container-max: 1200px;
  --emp-gutter: 1.5rem;
  --emp-margin-mobile: 1rem;
  --emp-margin-desktop: 2.5rem;

  --emp-radius-sm: 10px;
  --emp-radius-md: 12px;
  --emp-radius-lg: 16px;
  --emp-radius-xl: 20px;
}

/* Light = IMO :root. A ponte lê este bloco para o tema claro. */
[data-theme="light"] {
  --emp-indigo-ink: #363885; /* 55% índigo + preto; 10,19:1 sobre branco */
  --emp-gold-ink: #866425;
  --emp-bg: #ffffff;
  --emp-surface: #ffffff;
  --emp-surface-1: #fafbfe;
  --emp-surface-tonal: #fafbfe;
  --emp-surface-deep: #eef0f7;
  --emp-border: #e9ebf3;
  --emp-table-head: #2a2f45;
  --emp-text: #1e2433;
  --emp-text-secondary: #6b7280;
  --emp-text-muted: #9aa3b5;
  --emp-text-subtle: #9aa3b5;
  --emp-text-inverse: #ffffff;
  --emp-success: #047857;
  --emp-error: #b91c1c;
  --emp-warning: #a94e08;
  --emp-shadow-sm: 0 1px 3px rgba(30, 36, 51, .06);
  --emp-shadow-md: 0 4px 12px rgba(30, 36, 51, .08);
  --emp-shadow-lg: 0 10px 30px -12px rgba(49, 46, 129, .22);
}

@keyframes emp-fade-in-up {
  from { opacity: 0; transform: translateY(32px); }
  to { opacity: 1; transform: translateY(0); }
}
.emp-reveal {
  animation: emp-fade-in-up var(--emp-duration-reveal) var(--emp-ease-out-expo) forwards;
}
.emp-reveal.d1 { animation-delay: 100ms; opacity: 0; }
.emp-reveal.d2 { animation-delay: 200ms; opacity: 0; }
.emp-reveal.d3 { animation-delay: 300ms; opacity: 0; }

@media (prefers-reduced-motion: reduce) {
  .emp-reveal, .emp-reveal.d1, .emp-reveal.d2, .emp-reveal.d3 {
    animation: none;
    opacity: 1;
    transform: none;
  }
}

.emp-glass {
  background: var(--emp-glass-bg);
  border: 1px solid var(--emp-glass-border);
  backdrop-filter: blur(12px);
}
.emp-glass:hover {
  border-color: var(--emp-glass-border-hover);
}
