/* ============================================================
   JJD TAX CENTER - DESIGN TOKENS
   Sistema BKF Glass aplicado à identidade JJD
   Paleta: dark profundo + ciano elétrico do logo + azul institucional
   ============================================================ */

:root {
  /* ---------- Cores institucionais JJD ---------- */
  --jjd-dark-deep:  #050B17;     /* Background mais escuro - hero, masthead */
  --jjd-dark:       #070D1C;     /* Background principal */
  --jjd-dark-soft:  #0B1428;     /* Surface elevada (sections) */
  --jjd-blue:       #0055AA;     /* Azul institucional */
  --jjd-blue-deep:  #003B7A;     /* Azul institucional escuro */
  --jjd-cyan:       #00C2FF;     /* Ciano elétrico do logo */
  --jjd-cyan-soft:  #39C2FF;     /* Ciano do SVG original do logo */
  --jjd-cyan-pale:  #7BD8FF;     /* Ciano claro para hover */

  /* ---------- Glassmorphism ---------- */
  --surface:        rgba(255, 255, 255, 0.04);
  --surface-strong: rgba(255, 255, 255, 0.08);
  --surface-cyan:   rgba(57, 194, 255, 0.06);
  --border:         rgba(57, 194, 255, 0.18);
  --border-strong:  rgba(57, 194, 255, 0.45);
  --border-soft:    rgba(255, 255, 255, 0.08);

  /* ---------- Texto ---------- */
  --text:           #E8EDF5;
  --text-light:     #C5D4E8;
  --text-muted:     #7A8FA8;
  --text-dim:       #5A6D82;
  --text-on-cyan:   #050B17;

  /* ---------- Acentos funcionais ---------- */
  --accent:         var(--jjd-cyan);
  --accent-light:   var(--jjd-cyan-pale);
  --accent-deep:    var(--jjd-blue);

  /* ---------- Sombras e overlays ---------- */
  --shadow-soft:    0 10px 40px rgba(0, 0, 0, 0.4);
  --shadow-medium:  0 20px 60px rgba(0, 0, 0, 0.5);
  --shadow-cyan:    0 12px 40px -12px rgba(0, 194, 255, 0.5);
  --overlay-deep:   rgba(5, 11, 23, 0.85);
  --overlay-medium: rgba(7, 13, 28, 0.7);
  --overlay-soft:   rgba(7, 13, 28, 0.4);

  /* ---------- Tipografia (Helvetica-like via Inter) ---------- */
  --font-display:   'Inter', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --font-body:      'Inter', -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --font-mono:      'DM Mono', 'JetBrains Mono', monospace;

  /* Pesos institucionais (próximos de Helvetica Bold/Black) */
  --fw-regular:     400;
  --fw-medium:      500;
  --fw-bold:        700;
  --fw-extrabold:   800;
  --fw-black:       900;

  /* Type scale (mais compacto) */
  --fs-xs:          11px;
  --fs-sm:          13px;
  --fs-base:        15px;
  --fs-md:          17px;
  --fs-lg:          20px;
  --fs-xl:          26px;
  --fs-2xl:         clamp(30px, 3.4vw, 42px);
  --fs-3xl:         clamp(40px, 5vw, 60px);
  --fs-display:     clamp(46px, 6.5vw, 88px);

  /* Line height */
  --lh-tight:       1.05;
  --lh-snug:        1.2;
  --lh-normal:      1.55;
  --lh-relaxed:     1.7;

  /* Tracking */
  --tk-tight:       -0.025em;
  --tk-normal:      0;
  --tk-wide:        0.08em;
  --tk-wider:       0.18em;

  /* ---------- Espaçamento (8px scale) ---------- */
  --s-1:            4px;
  --s-2:            8px;
  --s-3:            12px;
  --s-4:            16px;
  --s-5:            20px;
  --s-6:            24px;
  --s-8:            32px;
  --s-10:           40px;
  --s-12:           48px;
  --s-16:           64px;
  --s-20:           80px;
  --s-24:           96px;
  --s-32:           128px;

  /* Section padding (responsivo, mais compacto) */
  --section-pad-y:  clamp(48px, 6vw, 88px);
  --section-pad-x:  clamp(20px, 4vw, 56px);
  --container-max:  1240px;

  /* ---------- Radii ---------- */
  --r-sm:           8px;
  --r-md:           12px;
  --r-lg:           16px;
  --r-xl:           24px;
  --r-pill:         999px;

  /* ---------- Transitions ---------- */
  --t-fast:         0.2s ease;
  --t-base:         0.35s ease;
  --t-slow:         0.6s ease;
  --t-cinematic:    0.8s cubic-bezier(0.22, 1, 0.36, 1);
}