/* Valor Digital · Design System · tokens
 * Família visual da Direção V. (ValorBrain): papel editorial, obsidiana, verde de síntese.
 * Fonte única dos valores. Componentes usam só os aliases semânticos (--vd-surface-*, --vd-text-*, ...).
 * Contraste conferido (WCAG 2.2): texto ≥ 4.5:1, bordas de controle ≥ 3:1. Tabela na página /design-system/. */

:root {
  /* ---------- primitivos de marca ---------- */
  --vd-obsidian: #111317;
  --vd-graphite: #26292E;
  --vd-slate: #5F636B;
  --vd-paper: #F6F7F3;
  --vd-ink: #192321;
  --vd-white: #FFFFFF;
  --vd-green: #3F9E5E;

  /* ---------- rampas ---------- */
  --vd-neutral-50: #F8F9F7;
  --vd-neutral-100: #F0F2EE;
  --vd-neutral-150: #ECEEE8;
  --vd-neutral-200: #E2E5E0;
  --vd-neutral-250: #E5E8E3;
  --vd-neutral-300: #D8DCD7;
  --vd-neutral-400: #8A908B;
  --vd-neutral-500: #5F636B;
  --vd-neutral-600: #4A4E55;
  --vd-neutral-700: #383C42;
  --vd-neutral-800: #26292E;
  --vd-neutral-900: #191B1F;
  --vd-neutral-950: #111317;

  --vd-green-50: #F0F8F3;
  --vd-green-100: #DCF0E3;
  --vd-green-200: #BCE3C9;
  --vd-green-300: #8FD0A5;
  --vd-green-400: #5EBA7F;
  --vd-green-500: #3F9E5E;
  --vd-green-600: #31824C;
  --vd-green-700: #26663C;
  --vd-green-800: #1F4F30;
  --vd-green-900: #143520;

  /* ---------- semânticas de estado (nunca o verde da marca) ---------- */
  --vd-success: #15803D;
  --vd-success-surface: #F0FDF4;
  --vd-success-border: #BBF7D0;
  --vd-warning: #B45309;
  --vd-warning-surface: #FFFBEB;
  --vd-warning-border: #FDE68A;
  --vd-error: #B91C1C;
  --vd-error-surface: #FEF2F2;
  --vd-error-border: #FECACA;
  --vd-info: #1D4ED8;
  --vd-info-surface: #EFF6FF;
  --vd-info-border: #BFDBFE;

  /* ---------- aliases semânticos (tema papel, padrão) ---------- */
  --vd-surface-canvas: var(--vd-paper);
  --vd-surface-card: var(--vd-white);
  --vd-surface-muted: var(--vd-neutral-100);
  --vd-surface-sunken: var(--vd-neutral-150);
  --vd-surface-callout: #E7ECE6;
  --vd-surface-inverse: var(--vd-obsidian);
  --vd-surface-header: rgba(246, 247, 243, 0.94);

  --vd-text-primary: var(--vd-ink);
  --vd-text-secondary: var(--vd-slate);
  --vd-text-caption: #666B70;
  --vd-text-link: var(--vd-green-700);
  --vd-text-link-hover: var(--vd-green-800);
  --vd-text-inverse: #F3F4F6;
  --vd-text-accent: var(--vd-green-700);

  --vd-border-default: var(--vd-neutral-300);
  --vd-border-subtle: var(--vd-neutral-250);
  --vd-border-control: var(--vd-neutral-400);
  --vd-border-strong: var(--vd-slate);

  --vd-action-primary-bg: var(--vd-obsidian);
  --vd-action-primary-fg: var(--vd-white);
  --vd-action-primary-hover: var(--vd-graphite);
  --vd-action-accent-bg: var(--vd-green-600);
  --vd-action-accent-fg: var(--vd-white);
  --vd-action-accent-hover: var(--vd-green-700);

  --vd-focus: var(--vd-green-700);
  --vd-selection-bg: var(--vd-green-100);
  --vd-selection-fg: var(--vd-ink);
  --vd-dot: var(--vd-green);

  --vd-code-bg: var(--vd-obsidian);
  --vd-code-text: #E5E7EB;

  /* ---------- tipografia ---------- */
  --vd-font-sans: "Hanken Grotesk", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --vd-font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  --vd-weight-regular: 400;
  --vd-weight-medium: 500;
  --vd-weight-semibold: 600;
  --vd-weight-bold: 700;
  --vd-weight-extrabold: 800;

  --vd-text-display-1: clamp(2.5rem, 1.6rem + 3.9vw, 4.25rem);   /* 40 → 68 */
  --vd-text-display-2: clamp(2rem, 1.45rem + 2.4vw, 3rem);       /* 32 → 48 */
  --vd-text-h1: clamp(1.75rem, 1.4rem + 1.5vw, 2.25rem);         /* 28 → 36 */
  --vd-text-h2: clamp(1.375rem, 1.18rem + 0.85vw, 1.75rem);      /* 22 → 28 */
  --vd-text-h3: 1.3125rem;                                       /* 21 */
  --vd-text-h4: 1.125rem;                                        /* 18 */
  --vd-text-lead: clamp(1.125rem, 1.03rem + 0.4vw, 1.375rem);    /* 18 → 22 */
  --vd-text-body-lg: 1.125rem;                                   /* 18 */
  --vd-text-body: 1rem;                                          /* 16 */
  --vd-text-body-sm: 0.875rem;                                   /* 14 */
  --vd-text-caption-size: 0.75rem;                               /* 12 */
  --vd-text-eyebrow: 0.71875rem;                                 /* 11.5 */
  --vd-text-mono: 0.8125rem;                                     /* 13 */

  --vd-leading-tight: 1.06;
  --vd-leading-snug: 1.2;
  --vd-leading-normal: 1.5;
  --vd-leading-relaxed: 1.65;

  --vd-tracking-display: -0.04em;
  --vd-tracking-heading: -0.025em;
  --vd-tracking-body: -0.005em;
  --vd-tracking-caps: 0.12em;

  /* ---------- espaço (base 4 px) ---------- */
  --vd-space-0-5: 2px;
  --vd-space-1: 4px;
  --vd-space-2: 8px;
  --vd-space-3: 12px;
  --vd-space-4: 16px;
  --vd-space-5: 20px;
  --vd-space-6: 24px;
  --vd-space-8: 32px;
  --vd-space-10: 40px;
  --vd-space-12: 48px;
  --vd-space-16: 64px;
  --vd-space-20: 80px;
  --vd-space-24: 96px;
  --vd-section-pad: clamp(56px, 4rem + 2.5vw, 104px);

  /* ---------- forma ---------- */
  --vd-radius-sm: 4px;
  --vd-radius-md: 8px;
  --vd-radius-lg: 12px;
  --vd-radius-xl: 18px;
  --vd-radius-squircle: 22.5%;
  --vd-radius-pill: 9999px;
  --vd-rule: 1px;

  --vd-shadow-sm: 0 1px 2px rgba(17, 19, 23, 0.05);
  --vd-shadow-md: 0 4px 12px rgba(17, 19, 23, 0.08);
  --vd-shadow-lg: 0 12px 32px rgba(17, 19, 23, 0.12);
  --vd-shadow-focus: 0 0 0 3px rgba(38, 102, 60, 0.35);

  /* ---------- movimento ---------- */
  --vd-ease: cubic-bezier(0.16, 1, 0.3, 1);
  --vd-duration-fast: 150ms;
  --vd-duration-normal: 250ms;

  /* ---------- layout ---------- */
  --vd-container: 76rem;          /* 1216 */
  --vd-container-narrow: 46rem;   /* 736: leitura longa */
  --vd-container-mid: 60rem;      /* 960 */
  --vd-gutter: clamp(1rem, 0.6rem + 2vw, 2.5rem);
  --vd-header-h: 68px;

  color-scheme: light;
}

/* Tema obsidiana: seções escuras, rodapé e páginas inteiras com data-theme="dark". */
[data-theme="dark"],
.vd-theme-dark {
  --vd-surface-canvas: var(--vd-obsidian);
  --vd-surface-card: var(--vd-neutral-900);
  --vd-surface-muted: var(--vd-graphite);
  --vd-surface-sunken: #0D0E11;
  --vd-surface-callout: #13221A;
  --vd-surface-header: rgba(17, 19, 23, 0.94);
  --vd-text-primary: #F3F4F6;
  --vd-text-secondary: #A3A9A5;
  --vd-text-caption: #9CA3AF;
  --vd-text-link: var(--vd-green-300);
  --vd-text-link-hover: var(--vd-green-200);
  --vd-text-accent: var(--vd-green-300);
  --vd-border-default: var(--vd-neutral-700);
  --vd-border-subtle: var(--vd-neutral-800);
  --vd-border-control: #8A908B;
  --vd-border-strong: #A3A9A5;
  --vd-action-primary-bg: var(--vd-white);
  --vd-action-primary-fg: var(--vd-obsidian);
  --vd-action-primary-hover: var(--vd-neutral-150);
  --vd-action-accent-bg: var(--vd-green-400);
  --vd-action-accent-fg: var(--vd-obsidian);
  --vd-action-accent-hover: var(--vd-green-300);
  --vd-focus: var(--vd-green-300);
  --vd-selection-bg: var(--vd-green-800);
  --vd-selection-fg: var(--vd-white);
  --vd-code-bg: #0B0C0F;
  --vd-shadow-focus: 0 0 0 3px rgba(143, 208, 165, 0.4);
  color-scheme: dark;
}