/* === SECCIÓN: VARIABLES GLOBALES — modulosecho.com === */

:root {

  /* === COLORES DE FONDO === */
  --color-bg-primary:      #FFFFFF;
  --color-bg-secondary:    #F6F7F8;
  --color-bg-card:         #FFFFFF;

  /* === COLORES ACENTO === */
  --color-accent:          #FF7A00;
  --color-accent-hover:    #FF8F33;
  --color-accent-dark:     #E66200;
  --color-accent-subtle:   #FFE8D2;

  /* === COLORES DE TEXTO === */
  --color-text-primary:    #111316;
  --color-text-secondary:  #60666B;
  --color-text-muted:      #9A9EA3;

  /* === COLORES DE BORDE === */
  --color-border:          #E6E8EA;
  --color-border-accent:   rgba(255, 122, 0, 0.30);

  /* === BLANCO PURO === */
  --color-white:           #FFFFFF;

  /* === SOMBRAS === */
  --shadow-card:   0 2px 12px rgba(17, 19, 22, 0.08);
  --shadow-hover:  0 8px 32px rgba(17, 19, 22, 0.14);
  --shadow-accent: 0 4px 20px rgba(255, 122, 0, 0.20);
  --shadow-navbar: 0 1px 0 #E6E8EA;

  /* === BORDES REDONDEADOS === */
  --border-radius:    8px;
  --border-radius-lg: 16px;
  --border-radius-xl: 24px;

  /* === TRANSICIONES === */
  --transition-fast: 0.2s ease;
  --transition-base: 0.35s ease;
  --transition-slow: 0.5s ease;

  /* === TIPOGRAFÍA === */
  --font-sans:  'DM Sans', 'Inter', system-ui, sans-serif;
  --font-ui:    'Inter', 'DM Sans', system-ui, sans-serif;
  --font-mono:  'JetBrains Mono', 'Courier New', monospace;

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

  --font-weight-normal:   400;
  --font-weight-medium:   500;
  --font-weight-semibold: 600;
  --font-weight-bold:     700;

  --line-height-tight:  1.2;
  --line-height-snug:   1.35;
  --line-height-base:   1.6;
  --line-height-loose:  1.75;

  /* === ESPACIADO === */
  --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 */

  /* === LAYOUT === */
  --container-max:    1200px;
  --container-wide:   1400px;
  --container-narrow: 800px;

  /* === Z-INDEX === */
  --z-base:      0;
  --z-elevated:  1;
  --z-card:      2;
  --z-navbar:    100;
  --z-modal:     200;
  --z-whatsapp:  300;

}