/* Tokens do Vexium Design System (projeto claude.ai/design 1c2bdb88). Cópia enxuta de tokens/*.css.
   Pacaembu (display) não está vendorizada: cai para Space Grotesk até os .otf entrarem em assets/fonts. */
:root {
  --vx-areia: #F1F3E8; --vx-verde-profundo: #0A221B; --vx-verde-petroleo: #0C3934; --vx-verde-vivo: #00C25B; --vx-verde-broto: #93CF9C;
  --vx-neutral-0: #FFFFFF; --vx-neutral-50: #F8F9F3; --vx-neutral-200: #E3E7D9; --vx-neutral-300: #CBD1C1; --vx-neutral-400: #A6AF9D;
  --vx-neutral-500: #7C8674; --vx-neutral-600: #586250; --vx-neutral-700: #3A4436; --vx-neutral-800: #1F2B23; --vx-neutral-950: #061510;
  --vx-vivo-100: #D6F7E3; --vx-vivo-400: #3ED37F; --vx-vivo-600: #00A34C; --vx-vivo-700: #00803B;
  --vx-ambar: #E0A93B; --vx-ambar-soft: #FBEBCF; --vx-barro-soft: #F8DED8;

  --surface-page: var(--vx-areia); --surface-card: var(--vx-neutral-0); --surface-muted: var(--vx-neutral-50); --surface-sunken: var(--vx-neutral-200);
  --text-strong: var(--vx-verde-profundo); --text-body: var(--vx-neutral-800); --text-muted: var(--vx-neutral-600); --text-accent: var(--vx-vivo-700);
  --border-subtle: var(--vx-neutral-200); --border-default: var(--vx-neutral-300); --border-focus: var(--vx-verde-vivo);

  --action-primary-bg: var(--vx-verde-profundo); --action-primary-fg: var(--vx-areia);
  --action-primary-bg-hover: var(--vx-neutral-800); --action-primary-bg-active: var(--vx-neutral-950);
  --action-secondary-fg: var(--vx-verde-profundo); --action-secondary-border: var(--vx-neutral-400); --action-secondary-bg-hover: var(--vx-neutral-200);
  --action-disabled-bg: var(--vx-neutral-200); --action-disabled-fg: var(--vx-neutral-400);
  --link-color: var(--vx-vivo-700); --link-color-hover: var(--vx-verde-profundo);

  --feedback-success-fg: var(--vx-vivo-700); --feedback-success-bg: var(--vx-vivo-100);
  --feedback-warning-fg: #8A5A11; --feedback-warning-bg: var(--vx-ambar-soft);
  --feedback-danger-fg: #9B3626; --feedback-danger-bg: var(--vx-barro-soft);
  --feedback-neutral-fg: var(--vx-neutral-700); --feedback-neutral-bg: var(--vx-neutral-200);

  --font-display: "Pacaembu", "Space Grotesk", system-ui, sans-serif;
  --font-text: "Space Grotesk", system-ui, sans-serif;
  --fs-2xs: 11px; --fs-xs: 12px; --fs-sm: 13px; --fs-md: 14px; --fs-xl: 17px; --fs-2xl: 20px; --fs-4xl: 30px; /* escala única do sistema (fonte padrão) */
  --ls-display: -0.03em; --ls-heading: -0.02em; --ls-eyebrow: 0.16em;

  --space-2: 4px; --space-3: 8px; --space-4: 12px; --space-5: 16px; --space-6: 20px; --space-7: 24px; --space-8: 32px; --space-9: 40px;
  --gutter: clamp(20px, 5vw, 64px); --container-xl: 1440px;
  --control-h-sm: 34px; --control-h-md: 44px;

  --radius-xs: 4px; --radius-md: 12px; --radius-lg: 20px; --radius-xl: 28px; --radius-pill: 999px;
  --shadow-xl: 0 36px 80px -20px rgba(10, 34, 27, .24);
  --glass-dark: rgba(10, 34, 27, .62); --glass-light: rgba(241, 243, 232, .72); --blur-glass: 16px;

  --ease-standard: cubic-bezier(.32, .72, 0, 1); --ease-out: cubic-bezier(.16, 1, .3, 1);
  --dur-instant: 80ms; --dur-fast: 140ms; --dur-base: 220ms; --press-scale: .97;
  --transition-color: color var(--dur-fast) var(--ease-standard), background-color var(--dur-fast) var(--ease-standard), border-color var(--dur-fast) var(--ease-standard);
}
@media (prefers-reduced-motion: reduce) { :root { --dur-fast: 0ms; --dur-base: 0ms; --press-scale: 1; } }