/* ============================================
   SINERGIADS — DESIGN TOKENS
   variables.css
============================================ */
:root {
  /* Colores */
  --bg:        #F3F2EE;
  --bg-w:      #FAFAF7;
  --bg-c:      #EFEDE8;
  --txt:       #2F2F2F;
  --muted:     #7A7A72;
  --white:     #FAFAF7;
  --blue:      #4A6CF7;
  --blue-h:    #3558f0;
  --dark:      #1E1E1E;
  --dark-2:    #141414;

  /* Bordes */
  --bdr:       rgba(47,47,47,0.10);
  --bdr-l:     rgba(47,47,47,0.06);
  --bdr-blue:  rgba(74,108,247,0.25);

  /* Sombras */
  --sh-s:      0 2px 12px rgba(47,47,47,0.06);
  --sh-m:      0 8px 32px rgba(47,47,47,0.10);
  --sh-l:      0 16px 48px rgba(47,47,47,0.13);

  /* Radios */
  --r:         8px;
  --rm:        14px;
  --rl:        24px;

  /* Tipografía */
  --f:         'Satoshi', 'General Sans', system-ui, sans-serif;

  /* Transiciones */
  --t:         0.25s ease;
  --t-slow:    0.4s ease;

  /* Espaciado de secciones */
  --sec:       7rem;
  --sec-sm:    4.5rem;
}

@media (max-width: 768px) {
  :root {
    --sec:     4.5rem;
    --sec-sm:  3rem;
  }
}