/* =============================================================================
   Pronto Já — Design Tokens
   Design system oficial do Pronto Já. Fonte única de cor, tipografia, elevação,
   raio e espaçamento — usada pela Landing Page e pela UI do app.
   Estilize tudo pelas variáveis; não use hex solto nos componentes.
   ============================================================================= */
:root {
  /* grounds — neutro com viés verde (escolhido, não herdado) */
  --ground-0: #04100C;   /* página, o mais fundo */
  --ground-1: #071612;   /* superfície base */
  --ground-2: #0C1F19;   /* card / elevado */
  --ground-3: #12291F;   /* hover / raised */

  --hairline:        rgba(210, 255, 238, 0.10);
  --hairline-strong: rgba(210, 255, 238, 0.18);

  /* texto */
  --text-1: #EAF5EF;   /* primário */
  --text-2: #9DB4AA;   /* secundário */
  --text-3: #647A70;   /* captions / muted */

  /* marca — mint neon */
  --brand-100: #B9FBE2;
  --brand-300: #6FF4C8;
  --brand-500: #35E6A8;  /* ★ cor primária */
  --brand-700: #14B98A;
  --brand-900: #0A6E54;

  /* semânticos — estado de cada ação/pedido */
  --safe:       #2FD46E;   /* sucesso / pronto / rápido */
  --safe-100:   #B7F2CE;
  --warn:       #F5A623;   /* atenção */
  --warn-100:   #FBE0AE;
  --danger:     #F0524A;   /* erro / falha */
  --danger-100: #F9BEB9;

  /* gradientes */
  --grad-brand: linear-gradient(135deg, #6FF4C8 0%, #35E6A8 46%, #14B98A 100%);
  --grad-text:  linear-gradient(90deg, #7CF6D0, #35E6A8);
  --grad-ground:
    radial-gradient(130% 100% at 12% 108%, rgba(20,185,138,0.20), transparent 58%),
    radial-gradient(90% 70% at 92% -10%, rgba(53,230,168,0.08), transparent 60%);

  /* glows / elevação — a assinatura da marca */
  --glow-brand:  0 0 0 1px rgba(53,230,168,0.30), 0 10px 44px -10px rgba(53,230,168,0.60);
  --glow-safe:   0 0 44px -8px rgba(47,212,110,0.50);
  --glow-warn:   0 0 44px -8px rgba(245,166,35,0.46);
  --glow-danger: 0 0 44px -8px rgba(240,82,74,0.46);
  --shadow-card: 0 26px 64px -22px rgba(0,0,0,0.72);

  /* raio */
  --r-xs: 6px; --r-sm: 10px; --r-md: 14px; --r-lg: 20px; --r-xl: 28px; --r-full: 999px;

  /* espaçamento — base 4px */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px;
  --s-5: 24px; --s-6: 32px; --s-7: 48px; --s-8: 64px; --s-9: 96px;

  /* tipografia — embutir Sora + Inter via @font-face em produção */
  --font-display: 'Sora', 'Segoe UI', system-ui, -apple-system, sans-serif;
  --font-body:    'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --font-mono:    'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  /* vidro fosco */
  --glass-bg:   rgba(12, 31, 25, 0.55);
  --glass-blur: 16px;
}
