/* ═══════════════════════════════════════════════════════════════
   FitReserv · Fluid Typography & Spacing Overrides
   Convierte clases Tailwind fijas (text-Nxl, p-X, py-X…) en clamp()
   responsivo. Solo se carga en páginas que lo importan.
   ═══════════════════════════════════════════════════════════════ */

/* ── TIPOGRAFÍA FLUIDA ── */
/* Cubre tanto la versión base (text-Nxl) como las variantes responsivas (md:, lg:, etc.)
   usando el selector de atributo [class*="..."] */

.text-9xl, [class*="text-9xl"] {
    font-size: clamp(2.75rem, 9vw, 8rem) !important;
    line-height: 0.92 !important;
    overflow-wrap: anywhere;
}
.text-8xl, [class*="text-8xl"] {
    font-size: clamp(2.5rem, 7.5vw, 6rem) !important;
    line-height: 0.95 !important;
    overflow-wrap: anywhere;
}
.text-7xl, [class*="text-7xl"] {
    font-size: clamp(2.25rem, 6.5vw, 4.5rem) !important;
    line-height: 1 !important;
    overflow-wrap: anywhere;
}
.text-6xl, [class*="text-6xl"] {
    font-size: clamp(2rem, 5.5vw, 3.75rem) !important;
    line-height: 1.05 !important;
    overflow-wrap: anywhere;
}
.text-5xl, [class*="text-5xl"] {
    font-size: clamp(1.75rem, 4.5vw, 3rem) !important;
    line-height: 1.05 !important;
}
.text-4xl, [class*="text-4xl"] {
    font-size: clamp(1.5rem, 3.4vw, 2.25rem) !important;
    line-height: 1.1 !important;
}
.text-3xl, [class*="text-3xl"] {
    font-size: clamp(1.25rem, 2.6vw, 1.875rem) !important;
    line-height: 1.2 !important;
}
.text-2xl, [class*="text-2xl"] {
    font-size: clamp(1.1rem, 2vw, 1.5rem) !important;
    line-height: 1.25 !important;
}
.text-xl, [class*="text-xl"]:not([class*="text-2xl"]):not([class*="text-3xl"]):not([class*="text-4xl"]):not([class*="text-5xl"]):not([class*="text-6xl"]):not([class*="text-7xl"]):not([class*="text-8xl"]):not([class*="text-9xl"]) {
    font-size: clamp(1rem, 1.5vw, 1.25rem) !important;
    line-height: 1.35 !important;
}
.text-lg, [class*="text-lg"] {
    font-size: clamp(0.95rem, 1.2vw, 1.125rem) !important;
    line-height: 1.4 !important;
}

/* ── PADDING / SPACING FLUIDO ── */
/* Reduce paddings gigantes en pantallas pequeñas */
.py-32 { padding-top: clamp(2.5rem, 6vw, 8rem) !important; padding-bottom: clamp(2.5rem, 6vw, 8rem) !important; }
.py-24 { padding-top: clamp(2rem, 5vw, 6rem) !important;   padding-bottom: clamp(2rem, 5vw, 6rem) !important; }
.py-20 { padding-top: clamp(1.75rem, 4.5vw, 5rem) !important; padding-bottom: clamp(1.75rem, 4.5vw, 5rem) !important; }
.py-16 { padding-top: clamp(1.5rem, 4vw, 4rem) !important; padding-bottom: clamp(1.5rem, 4vw, 4rem) !important; }
.py-12 { padding-top: clamp(1rem, 3vw, 3rem) !important;   padding-bottom: clamp(1rem, 3vw, 3rem) !important; }

.px-12 { padding-left: clamp(0.85rem, 2.5vw, 3rem) !important;  padding-right: clamp(0.85rem, 2.5vw, 3rem) !important; }
.px-10 { padding-left: clamp(0.85rem, 2.2vw, 2.5rem) !important; padding-right: clamp(0.85rem, 2.2vw, 2.5rem) !important; }
.px-8  { padding-left: clamp(0.75rem, 1.8vw, 2rem) !important;   padding-right: clamp(0.75rem, 1.8vw, 2rem) !important; }

.p-12  { padding: clamp(1rem, 2.5vw, 3rem) !important; }
.p-10  { padding: clamp(0.85rem, 2.2vw, 2.5rem) !important; }
.p-8   { padding: clamp(0.75rem, 1.8vw, 2rem) !important; }

/* ── HERO heights ── */
/* Si el contenido tiene min-h-screen o h-[700px], que se adapte */
.h-screen { min-height: clamp(440px, 80vh, 100vh) !important; }

/* ── MARGINS grandes ── */
.mb-24 { margin-bottom: clamp(1.5rem, 4vw, 6rem) !important; }
.mb-20 { margin-bottom: clamp(1.25rem, 3.5vw, 5rem) !important; }
.mb-16 { margin-bottom: clamp(1.25rem, 3vw, 4rem) !important; }
.mb-14 { margin-bottom: clamp(1.1rem, 2.6vw, 3.5rem) !important; }
.mb-12 { margin-bottom: clamp(1rem, 2.5vw, 3rem) !important; }
.mb-10 { margin-bottom: clamp(1rem, 2.2vw, 2.5rem) !important; }
.mb-8  { margin-bottom: clamp(0.85rem, 1.8vw, 2rem) !important; }

/* ── GAP en grids ── */
.gap-12 { gap: clamp(1rem, 2.5vw, 3rem) !important; }
.gap-10 { gap: clamp(0.85rem, 2.2vw, 2.5rem) !important; }
.gap-8  { gap: clamp(0.75rem, 1.8vw, 2rem) !important; }