/**
 * ================================================================
 * GARANTÍA DE TAMAÑO DE FUENTE BASE PARA ELEMENTOS REM
 * ================================================================
 * Este archivo asegura que todos los elementos que usan rem tengan
 * un tamaño de fuente base consistente y predecible.
 */

/* ================================================================
 * CONFIGURACIÓN BASE DE TAMAÑO DE FUENTE
 * ================================================================ */

/* Establecer tamaño de fuente base en html */
html {
    font-size: 16px !important; /* Base para cálculos rem */
}

/* Asegurar que body herede correctamente */
body {
    font-size: 1rem !important; /* 16px */
    line-height: 1.6;
}

/* ================================================================
 * GARANTÍAS PARA ELEMENTOS ESPECÍFICOS
 * ================================================================ */

/* Iconos y elementos que usan rem */
.card-icon {
    font-size: 2.5rem !important; /* 40px - tamaño apropiado para emojis */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-bottom: 1rem !important;
    text-align: center !important;
    line-height: 1 !important;
}

[data-lucide],
.lucide,
.icon-mail,
.campus-btn i,
.fab-agendar span[data-lucide] {
    font-size: 1.25rem !important; /* 20px */
    width: 1.25rem !important;
    height: 1.25rem !important;
}

/* Iconos más pequeños */
.card-badge,
.badge-icon {
    font-size: 0.75rem !important; /* 12px */
    width: 0.75rem !important;
    height: 0.75rem !important;
}

/* Iconos grandes */
.hero-icon,
.feature-icon {
    font-size: 2rem !important; /* 32px */
    width: 2rem !important;
    height: 2rem !important;
}

/* Iconos de filosofía - más grandes */
.philosophy-card .card-icon {
    font-size: 3rem !important; /* 48px - mantener el tamaño original */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin-bottom: 1.5rem !important;
    text-align: center !important;
    line-height: 1 !important;
}

/* ================================================================
 * RESPONSIVE FONT SIZING
 * ================================================================ */

/* Ajustes para pantallas pequeñas */
@media (max-width: 768px) {
    html {
        font-size: 14px !important; /* Ligeramente más pequeño en móvil */
    }
    
    .card-icon {
        font-size: 2rem !important; /* 28px en móvil */
    }
    
    .philosophy-card .card-icon {
        font-size: 2.5rem !important; /* 35px en móvil */
    }
    
    [data-lucide],
    .lucide {
        font-size: 1.125rem !important; /* 18px en móvil */
        width: 1.125rem !important;
        height: 1.125rem !important;
    }
}

/* Ajustes para pantallas muy pequeñas */
@media (max-width: 480px) {
    html {
        font-size: 13px !important; /* Aún más pequeño en móviles pequeños */
    }
    
    .card-icon {
        font-size: 1.75rem !important; /* 22.75px en móviles pequeños */
    }
    
    .philosophy-card .card-icon {
        font-size: 2rem !important; /* 26px en móviles pequeños */
    }
    
    [data-lucide],
    .lucide {
        font-size: 1rem !important; /* 16px en móviles pequeños */
        width: 1rem !important;
        height: 1rem !important;
    }
}

/* ================================================================
 * GARANTÍAS PARA ELEMENTOS DE NAVEGACIÓN
 * ================================================================ */

/* Header navigation icons */
.header-ctas .icon-mail i,
.campus-btn i {
    font-size: 1.125rem !important; /* 18px */
    width: 1.125rem !important;
    height: 1.125rem !important;
}

/* Mobile menu icons */
.campus-btn-mobile i {
    font-size: 1.25rem !important; /* 20px */
    width: 1.25rem !important;
    height: 1.25rem !important;
}

/* ================================================================
 * GARANTÍAS PARA ELEMENTOS DE CONTENIDO
 * ================================================================ */

/* Texto de tarjetas */
.card-title {
    font-size: 1.125rem !important; /* 18px */
}

.card-description {
    font-size: 0.95rem !important; /* 15.2px */
}

/* Botones */
.btn {
    font-size: 0.95rem !important; /* 15.2px */
}

.btn-large {
    font-size: 1.125rem !important; /* 18px */
}

/* ================================================================
 * GARANTÍAS PARA ELEMENTOS DE FORMULARIO
 * ================================================================ */

/* Inputs y labels */
input, textarea, select {
    font-size: 1rem !important; /* 16px */
}

label {
    font-size: 0.95rem !important; /* 15.2px */
}

/* ================================================================
 * GARANTÍAS PARA ELEMENTOS DE TABLA
 * ================================================================ */

/* Tablas */
.table-elevated {
    font-size: 0.95rem !important; /* 15.2px */
}

.table-elevated th {
    font-size: 0.9rem !important; /* 14.4px */
}

/* ================================================================
 * GARANTÍAS PARA ELEMENTOS DE MODAL
 * ================================================================ */

/* Modales */
.modal-title {
    font-size: 1.25rem !important; /* 20px */
}

.modal-body {
    font-size: 1rem !important; /* 16px */
}

/* ================================================================
 * GARANTÍAS PARA ELEMENTOS DE ESTADÍSTICAS
 * ================================================================ */

/* Números de estadísticas */
.stat-card h3 {
    font-size: 2rem !important; /* 32px */
}

.stat-card p {
    font-size: 0.9rem !important; /* 14.4px */
}

/* ================================================================
 * GARANTÍAS PARA ELEMENTOS DE BADGES Y ETIQUETAS
 * ================================================================ */

/* Badges */
.badge {
    font-size: 0.8rem !important; /* 12.8px */
}

.duration.badge,
.audience.badge {
    font-size: 0.75rem !important; /* 12px */
}

/* ================================================================
 * GARANTÍAS PARA ELEMENTOS DE LISTAS
 * ================================================================ */

/* Listas de beneficios */
.solution-benefits li {
    font-size: 0.95rem !important; /* 15.2px */
}

.sitemap-list li {
    font-size: 0.9rem !important; /* 14.4px */
}

/* ================================================================
 * GARANTÍAS PARA ELEMENTOS DE FOOTER
 * ================================================================ */

/* Footer y elementos de contacto */
.contact-alt {
    font-size: 0.95rem !important; /* 15.2px */
}

/* ================================================================
 * GARANTÍAS PARA ELEMENTOS DE PROGRESO
 * ================================================================ */

/* Barras de progreso */
.progress-bar {
    height: 0.5rem !important; /* 8px */
}

/* ================================================================
 * GARANTÍAS PARA ELEMENTOS DE AVATAR
 * ================================================================ */

/* Avatares */
.card-avatar img {
    width: 3.75rem !important; /* 60px */
    height: 3.75rem !important; /* 60px */
}

.card-badge {
    width: 1.5rem !important; /* 24px */
    height: 1.5rem !important; /* 24px */
    font-size: 0.75rem !important; /* 12px */
}

/* ================================================================
 * GARANTÍAS PARA ELEMENTOS DE LOGO
 * ================================================================ */

/* Logo */
.logo-img {
    width: 2.5rem !important; /* 40px */
    height: 2.5rem !important; /* 40px */
}

.logo-text {
    font-size: 1.25rem !important; /* 20px */
}

/* ================================================================
 * GARANTÍAS PARA ELEMENTOS DE TÍTULOS
 * ================================================================ */

/* Títulos principales */
.slide-title {
    font-size: clamp(1.5rem, 4vw, 3rem) !important; /* Responsive */
}

.slide-subtitle {
    font-size: clamp(1rem, 2.5vw, 1.25rem) !important; /* Responsive */
}

/* ================================================================
 * GARANTÍAS PARA ELEMENTOS DE PUNCHLINE
 * ================================================================ */

/* Punchline */
.punchline {
    font-size: 1.125rem !important; /* 18px */
}

/* ================================================================
 * GARANTÍAS PARA ELEMENTOS DE ROLES
 * ================================================================ */

/* Roles en equipo */
.role {
    font-size: 1rem !important; /* 16px */
}

/* ================================================================
 * GARANTÍAS PARA ELEMENTOS DE ENFOQUE
 * ================================================================ */

/* Enfoque en equipo */
.focus {
    font-size: 0.95rem !important; /* 15.2px */
}

/* ================================================================
 * GARANTÍAS PARA ELEMENTOS DE RECURSOS
 * ================================================================ */

/* Enlaces de recursos */
.resource-link {
    font-size: 0.95rem !important; /* 15.2px */
}

/* ================================================================
 * GARANTÍAS PARA ELEMENTOS DE TABS
 * ================================================================ */

/* Botones de tabs */
.tab-button {
    font-size: 0.95rem !important; /* 15.2px */
}

/* ================================================================
 * GARANTÍAS PARA ELEMENTOS DE SKIP LINK
 * ================================================================ */

/* Skip link para accesibilidad */
.skip-link {
    font-size: 0.9rem !important; /* 14.4px */
}

/* ================================================================
 * GARANTÍAS PARA ELEMENTOS DE JOURNEY PROGRESS
 * ================================================================ */

/* Barra de progreso del journey */
.journey-progress {
    height: 0.25rem !important; /* 4px */
}

/* ================================================================
 * GARANTÍAS PARA ELEMENTOS DE MICROINTERACCIONES
 * ================================================================ */

/* Elementos con microinteracciones */
.animate-smart-glow {
    font-size: inherit !important; /* Mantener tamaño heredado */
}

/* ================================================================
 * GARANTÍAS PARA ELEMENTOS DE PERSONALIZACIÓN
 * ================================================================ */

/* Contenido personalizado */
.personalized-content {
    font-size: inherit !important; /* Mantener tamaño heredado */
}

/* ================================================================
 * GARANTÍAS PARA ELEMENTOS DE A/B TESTING
 * ================================================================ */

/* Variantes de A/B testing */
.ab-test-variant {
    font-size: inherit !important; /* Mantener tamaño heredado */
}

/* ================================================================
 * GARANTÍAS PARA ELEMENTOS DE NAVEGACIÓN ACTIVA
 * ================================================================ */

/* Navegación activa */
.nav-active {
    font-size: inherit !important; /* Mantener tamaño heredado */
}

/* ================================================================
 * GARANTÍAS PARA ELEMENTOS DE SPOTLIGHT
 * ================================================================ */

/* Elementos con spotlight */
.spot-target {
    font-size: inherit !important; /* Mantener tamaño heredado */
}

/* ================================================================
 * GARANTÍAS PARA ELEMENTOS DE FOCUS VISIBLE
 * ================================================================ */

/* Elementos con focus visible */
*:focus-visible {
    font-size: inherit !important; /* Mantener tamaño heredado */
}

/* ================================================================
 * GARANTÍAS PARA ELEMENTOS DE TRANSICIONES
 * ================================================================ */

/* Elementos con transiciones */
* {
    font-size: inherit !important; /* Mantener tamaño heredado para transiciones */
}

/* ================================================================
 * GARANTÍAS PARA ELEMENTOS DE RESPONSIVE
 * ================================================================ */

/* Asegurar que los tamaños responsive funcionen correctamente */
@media (min-width: 640px) {
    .text-sm { font-size: 0.875rem !important; } /* 14px */
    .text-base { font-size: 1rem !important; } /* 16px */
    .text-lg { font-size: 1.125rem !important; } /* 18px */
    .text-xl { font-size: 1.25rem !important; } /* 20px */
    .text-2xl { font-size: 1.5rem !important; } /* 24px */
    .text-3xl { font-size: 1.875rem !important; } /* 30px */
    .text-4xl { font-size: 2.25rem !important; } /* 36px */
    .text-5xl { font-size: 3rem !important; } /* 48px */
}

@media (min-width: 768px) {
    .md\:text-lg { font-size: 1.125rem !important; } /* 18px */
    .md\:text-xl { font-size: 1.25rem !important; } /* 20px */
    .md\:text-2xl { font-size: 1.5rem !important; } /* 24px */
    .md\:text-3xl { font-size: 1.875rem !important; } /* 30px */
}

@media (min-width: 1024px) {
    .lg\:text-xl { font-size: 1.25rem !important; } /* 20px */
    .lg\:text-2xl { font-size: 1.5rem !important; } /* 24px */
    .lg\:text-3xl { font-size: 1.875rem !important; } /* 30px */
    .lg\:text-4xl { font-size: 2.25rem !important; } /* 36px */
}

@media (min-width: 1280px) {
    .xl\:text-2xl { font-size: 1.5rem !important; } /* 24px */
    .xl\:text-3xl { font-size: 1.875rem !important; } /* 30px */
    .xl\:text-4xl { font-size: 2.25rem !important; } /* 36px */
    .xl\:text-5xl { font-size: 3rem !important; } /* 48px */
}