/* ==========================================
   TABLETAS (A partir de 768px)
   ========================================== */
@media (min-width: 768px) {
    /* Aquí ajustas layouts de 1 a 2 columnas */
}

/* ==========================================
   DESKTOP (A partir de 1024px)
   ========================================== */
@media (min-width: 1024px) {
    /* Ajustes para pantallas de laptops */
   :root {
      --font-base: 1.125rem; /* Sube a 18px */
      --font-xxl: 4rem;
   }
}

/* ==========================================
   PANTALLAS GRANDES (A partir de 1440px)
   ========================================== */
@media (min-width: 1440px) {
    /* Limitación de ancho máximo para que el diseño no se rompa */
}