/* =============================================
   F-LABS TECNOLOGIA — DESIGN SYSTEM TOKENS
   ============================================= */

:root {
  /* ── CORES PRIMÁRIAS ── */
  --color-primary-950: #0F172E;
  --color-primary-900: #1B3A5C;
  --color-primary-800: #1E4976;
  --color-primary-700: #2B5C8A;
  --color-primary-600: #3D5A95;
  --color-primary-500: #4F6FAF;
  --color-primary-400: #6B8DC9;
  --color-primary-300: #90ADE0;
  --color-primary-200: #B8CFF0;
  --color-primary-100: #DAEAF9;

  /* ── ACENTOS ── */
  --color-cyan-500: #00D4FF;
  --color-cyan-400: #33DCFF;
  --color-cyan-300: #66E4FF;
  --color-cyan-600: #00B8DB;

  --color-pink-500: #FF6B9D;
  --color-pink-400: #FF8FB3;
  --color-pink-600: #E8497D;

  --color-green-500: #10B981;
  --color-green-400: #34D399;
  --color-green-600: #059669;

  /* ── NEUTROS ── */
  --color-white:      #FFFFFF;
  --color-gray-50:    #F9FAFB;
  --color-gray-100:   #F3F4F6;
  --color-gray-200:   #E5E7EB;
  --color-gray-300:   #D1D5DB;
  --color-gray-400:   #9CA3AF;
  --color-gray-500:   #6B7280;
  --color-gray-600:   #4B5563;
  --color-gray-700:   #374151;
  --color-gray-800:   #1F2937;
  --color-gray-900:   #111827;

  /* ── ALIASES SEMÂNTICOS ── */
  --c-bg:             var(--color-white);
  --c-bg-alt:         var(--color-gray-50);
  --c-bg-dark:        var(--color-primary-950);
  --c-text:           var(--color-gray-700);
  --c-text-strong:    var(--color-gray-900);
  --c-text-muted:     var(--color-gray-400);
  --c-text-inverse:   var(--color-white);
  --c-border:         var(--color-gray-200);
  --c-brand:          var(--color-primary-950);
  --c-accent:         var(--color-cyan-500);
  --c-accent-2:       var(--color-pink-500);
  --c-success:        var(--color-green-500);

  /* ── TIPOGRAFIA ── */
  --font-display: 'Sora', system-ui, -apple-system, sans-serif;
  --font-body:    'Inter', system-ui, -apple-system, sans-serif;

  --text-xs:   0.75rem;   /* 12px */
  --text-sm:   0.875rem;  /* 14px */
  --text-base: 1rem;      /* 16px */
  --text-lg:   1.125rem;  /* 18px */
  --text-xl:   1.25rem;   /* 20px */
  --text-2xl:  1.5rem;    /* 24px */
  --text-3xl:  1.875rem;  /* 30px */
  --text-4xl:  2.25rem;   /* 36px */
  --text-5xl:  3rem;      /* 48px */
  --text-6xl:  3.75rem;   /* 60px */

  --fw-regular:   400;
  --fw-medium:    500;
  --fw-semibold:  600;
  --fw-bold:      700;

  --lh-tight:   1.2;
  --lh-snug:    1.375;
  --lh-normal:  1.5;
  --lh-relaxed: 1.625;
  --lh-loose:   1.75;

  --ls-tight:  -0.025em;
  --ls-normal:  0;
  --ls-wide:    0.025em;

  /* ── ESPAÇAMENTO ── */
  --space-1:  0.25rem;   /* 4px  */
  --space-2:  0.5rem;    /* 8px  */
  --space-3:  0.75rem;   /* 12px */
  --space-4:  1rem;      /* 16px */
  --space-5:  1.25rem;   /* 20px */
  --space-6:  1.5rem;    /* 24px */
  --space-8:  2rem;      /* 32px */
  --space-10: 2.5rem;    /* 40px */
  --space-12: 3rem;      /* 48px */
  --space-16: 4rem;      /* 64px */
  --space-20: 5rem;      /* 80px */
  --space-24: 6rem;      /* 96px */
  --space-32: 8rem;      /* 128px */

  /* ── BORDER RADIUS ── */
  --radius-sm:   0.25rem;   /* 4px  */
  --radius-md:   0.5rem;    /* 8px  */
  --radius-lg:   0.75rem;   /* 12px */
  --radius-xl:   1rem;      /* 16px */
  --radius-2xl:  1.5rem;    /* 24px */
  --radius-full: 9999px;

  /* ── SOMBRAS ── */
  --shadow-sm:  0 1px 3px rgba(0,0,0,0.08), 0 1px 2px rgba(0,0,0,0.05);
  --shadow-md:  0 4px 12px rgba(0,0,0,0.10), 0 2px 4px rgba(0,0,0,0.06);
  --shadow-lg:  0 10px 30px rgba(0,0,0,0.12), 0 4px 8px rgba(0,0,0,0.06);
  --shadow-xl:  0 20px 60px rgba(0,0,0,0.14), 0 8px 16px rgba(0,0,0,0.06);
  --shadow-cyan: 0 0 24px rgba(0, 212, 255, 0.35);
  --shadow-glow: 0 0 40px rgba(0, 212, 255, 0.18);

  /* ── TRANSIÇÕES ── */
  --ease-out:  cubic-bezier(0.0, 0.0, 0.2, 1);
  --ease-in:   cubic-bezier(0.4, 0.0, 1, 1);
  --ease-in-out: cubic-bezier(0.4, 0.0, 0.2, 1);

  --duration-75:  75ms;
  --duration-100: 100ms;
  --duration-150: 150ms;
  --duration-200: 200ms;
  --duration-300: 300ms;
  --duration-500: 500ms;
  --duration-700: 700ms;

  --transition-fast:   var(--duration-150) var(--ease-out);
  --transition-base:   var(--duration-300) var(--ease-out);
  --transition-slow:   var(--duration-500) var(--ease-out);

  /* ── LAYOUT ── */
  --container-max:  1200px;
  --container-sm:   640px;
  --container-md:   768px;
  --container-lg:   1024px;
  --container-xl:   1280px;

  --header-height: 80px;

  /* ── Z-INDEX ── */
  --z-below:   -1;
  --z-base:     0;
  --z-raised:   10;
  --z-dropdown: 100;
  --z-sticky:   200;
  --z-overlay:  300;
  --z-modal:    400;
  --z-toast:    500;
}

/* ── DARK SECTION OVERRIDES ── */
.section-dark {
  --c-bg:          var(--color-primary-950);
  --c-bg-alt:      var(--color-primary-900);
  --c-text:        var(--color-gray-300);
  --c-text-strong: var(--color-white);
  --c-text-muted:  var(--color-gray-500);
  --c-border:      rgba(255,255,255,0.10);
}
