/**
 * Digital Air - Variables de responsividad
 * Solo espaciado fluido y breakpoints. La estructura visual (grids, columnas) no cambia.
 * Así el mismo diseño responde igual en todos los dispositivos.
 */

:root {
  /* Breakpoints únicos para que el corte sea igual en cualquier dispositivo */
  --bp-sm: 480px;
  --bp-md: 768px;
  --bp-lg: 1024px;
  --bp-xl: 1280px;
  --bp-2xl: 2000px;

  /* Contenedor: mismo margen lateral en todas las pantallas (escala con el ancho) */
  --container-max: 1200px;
  --container-padding: clamp(1rem, 4vw, 2.5rem);

  /* Espaciado vertical de secciones (proporcional al viewport) */
  --section-padding-y: clamp(3rem, 6vw, 5rem);
}

@media (min-width: 2000px) {
  :root {
    --container-padding: clamp(3rem, 6vw, 6rem);
    --section-padding-y: clamp(3.5rem, 6vh, 5.5rem);
  }
}