/* ==========================================================================
   PUNTO ONCE — Sistema de diseño
   Aquí se cambian colores, tipografía y espaciado de TODO el sitio.
   Si cambia el verde del logo, cambie únicamente --verde y se actualiza todo.
   ========================================================================== */

:root {
  /* ---------- Color ---------- */
  --negro:          #000000;   /* fondo dominante */
  --negro-2:        #080808;   /* franjas alternas, casi imperceptible */
  --superficie:     #0E0E0E;   /* tarjetas */
  --superficie-2:   #141414;   /* tarjetas en hover */
  --linea:          #1E1E1E;   /* divisorias */
  --linea-fuerte:   #2E2E2E;   /* bordes de tarjeta */

  --verde:          #76BC21;   /* acento único. Contraste 8.9:1 sobre negro (AA y AAA) */
  --verde-claro:    #8FD635;   /* hover */
  --verde-tenue:    rgba(118, 188, 33, 0.12);
  --verde-borde:    rgba(118, 188, 33, 0.35);

  --texto:          #F2F2F2;   /* texto principal. 18.9:1 */
  --texto-2:        #B3B3B3;   /* texto secundario. 8.6:1 — pasa AA */
  --texto-3:        #8A8A8A;   /* mínimo permitido. 4.7:1 — NO usar más oscuro */
  --blanco:         #FFFFFF;

  --ambar:          #FFB020;   /* SOLO para marcadores [PENDIENTE] */

  /* ---------- Tipografía ---------- */
  --fuente: 'Outfit', 'Poppins', 'Montserrat', -apple-system, BlinkMacSystemFont,
            'Segoe UI', Roboto, Helvetica, Arial, sans-serif;

  /* Escala fluida: primer valor = 375px, segundo = 1280px */
  --t-display:  clamp(2.125rem, 1.60rem + 2.25vw, 3.75rem); /* 34 → 60 */
  --t-h2:       clamp(1.75rem, 1.30rem + 1.9vw, 3.0rem);   /* 28 → 48 */
  --t-h3:       clamp(1.30rem, 1.13rem + 0.7vw, 1.75rem);  /* 21 → 28 */
  --t-lead:     clamp(1.06rem, 0.98rem + 0.35vw, 1.31rem); /* 17 → 21 */
  --t-base:     1rem;
  --t-sm:       0.9375rem;
  --t-xs:       0.8125rem;
  --t-etiqueta: 0.75rem;

  --peso-ligero: 300;
  --peso-normal: 400;
  --peso-medio:  500;
  --peso-semi:   600;
  --peso-bold:   700;

  --alto-titulo: 1.08;
  --alto-texto:  1.65;

  /* ---------- Espaciado ---------- */
  --e-1:  0.25rem;
  --e-2:  0.5rem;
  --e-3:  0.75rem;
  --e-4:  1rem;
  --e-5:  1.5rem;
  --e-6:  2rem;
  --e-7:  3rem;
  --e-8:  4rem;
  --e-9:  6rem;
  --e-10: 8rem;

  /* Aire vertical entre secciones (mucho, por indicación de marca) */
  --seccion-y: clamp(4.5rem, 3rem + 6.5vw, 9rem);

  /* ---------- Estructura ---------- */
  --ancho-max:      1180px;
  --ancho-texto:    62ch;
  --margen-lateral: clamp(1.25rem, 0.6rem + 2.8vw, 3rem);

  --radio-sm: 4px;
  --radio:    8px;
  --radio-lg: 14px;
  --radio-full: 999px;

  --transicion: 180ms cubic-bezier(0.2, 0, 0.2, 1);

  /* Altura de la barra superior fija */
  --barra-h: 64px;
}

@media (min-width: 768px) {
  :root { --barra-h: 76px; }
}

/* Respeta a quien pide menos movimiento */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
