/* ============================================================
   DESIGN TOKENS — Lovable-style
   Usado exclusivamente em landing.css e login-public.css
   NÃO importar em style.css (app interno usa Bootstrap)
   ============================================================ */

:root {
  /* --- Paleta de cores --- */
  --clr-bg-hero-start:  #0f0c29;
  --clr-bg-hero-mid:    #302b63;
  --clr-bg-hero-end:    #24243e;

  --clr-primary:        #6366f1; /* Indigo 500 */
  --clr-primary-hover:  #4f46e5; /* Indigo 600 */
  --clr-accent:         #a78bfa; /* Violet 400 */
  --clr-accent-2:       #38bdf8; /* Sky 400 — badges e destaques */

  --clr-surface:        rgba(255, 255, 255, 0.05);
  --clr-surface-hover:  rgba(255, 255, 255, 0.09);
  --clr-border:         rgba(255, 255, 255, 0.10);
  --clr-border-hover:   rgba(255, 255, 255, 0.20);

  --clr-text-primary:   #f9fafb;  /* gray-50 */
  --clr-text-secondary: #9ca3af;  /* gray-400 */
  --clr-text-muted:     #6b7280;  /* gray-500 */

  --clr-success:        #34d399;
  --clr-warning:        #fbbf24;

  /* --- Tipografia --- */
  --font-base: 'Plus Jakarta Sans', system-ui, -apple-system, sans-serif;
  --font-size-xs:   0.75rem;
  --font-size-sm:   0.875rem;
  --font-size-base: 1rem;
  --font-size-lg:   1.125rem;
  --font-size-xl:   1.25rem;
  --font-size-2xl:  1.5rem;
  --font-size-3xl:  1.875rem;
  --font-size-4xl:  2.25rem;
  --font-size-5xl:  3rem;
  --font-size-6xl:  3.75rem;

  /* --- Espaçamentos (base 4px) --- */
  --space-1:  0.25rem;
  --space-2:  0.5rem;
  --space-3:  0.75rem;
  --space-4:  1rem;
  --space-5:  1.25rem;
  --space-6:  1.5rem;
  --space-8:  2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;
  --space-32: 8rem;

  /* --- Border radius --- */
  --radius-sm:  0.5rem;
  --radius-md:  0.75rem;
  --radius-lg:  1rem;
  --radius-xl:  1.25rem;
  --radius-2xl: 1.5rem;
  --radius-full: 9999px;

  /* --- Glassmorphism --- */
  --glass-bg:     rgba(255, 255, 255, 0.05);
  --glass-border: 1px solid rgba(255, 255, 255, 0.10);
  --glass-blur:   blur(16px);
  --glass-bg-strong: rgba(255, 255, 255, 0.08);

  /* --- Sombras --- */
  --shadow-sm:     0 1px 3px rgba(0, 0, 0, 0.3);
  --shadow-md:     0 4px 16px rgba(0, 0, 0, 0.4);
  --shadow-lg:     0 8px 32px rgba(0, 0, 0, 0.5);
  --shadow-glow:   0 0 40px rgba(99, 102, 241, 0.35);
  --shadow-glow-sm:0 0 20px rgba(99, 102, 241, 0.25);

  /* --- Transições --- */
  --ease-out:  cubic-bezier(0.4, 0, 0.2, 1);
  --duration-fast:   150ms;
  --duration-normal: 300ms;
  --duration-slow:   500ms;

  /* --- Layout --- */
  --container-max:  1200px;
  --section-py:     var(--space-24);
  --navbar-height:  72px;
}
