/*
Theme Name: Astra-Child
Author: March de Luque
Description: Tema hijo optimizado para Tailwind CSS y alto rendimiento.
Version: 1.1
Template: astra
*/

/* ==========================================================================
   1. ESTILOS BASE Y COMPONENTES PERSONALIZADOS
   ========================================================================== */
body { font-family: 'Plus Jakarta Sans', system-ui, sans-serif; scroll-behavior: smooth; }
h1, h2, h3 { letter-spacing: -0.02em; }
.serif-text { font-family: 'Lora', Georgia, serif; }

.hero-bg { background: radial-gradient(circle at top right, #f8fafc, #ffffff); }
.form-shadow { box-shadow: 0 20px 50px -12px rgba(37, 99, 235, 0.15); }

/* Utilidades de Scroll */
.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

/* Animaciones */
.animate-fade-in { animation: fadeIn 0.5s ease-out; }
@keyframes fadeIn { 
    from { opacity: 0; transform: translateY(10px); } 
    to { opacity: 1; transform: translateY(0); } 
}

/* Modal - Fix compatibilidad Webkit (Safari) */
.modal-overlay { 
    background-color: rgba(15, 23, 42, 0.6); 
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px); 
}

/* Checkbox Personalizado - Fix compatibilidad Webkit (Safari) */
.custom-checkbox { 
    -webkit-appearance: none;
    appearance: none; 
    background-color: #fff; 
    margin: 0; 
    font: inherit; 
    color: currentColor; 
    width: 1.15em; 
    height: 1.15em; 
    border: 0.15em solid #cbd5e1; 
    border-radius: 0.15em; 
    display: grid; 
    place-content: center; 
    margin-top: 0.1em; 
}
.custom-checkbox::before { 
    content: ""; 
    width: 0.65em; 
    height: 0.65em; 
    transform: scale(0); 
    transition: 120ms transform ease-in-out; 
    box-shadow: inset 1em 1em white; 
    background-color: canvastext; 
    transform-origin: center; 
    -webkit-clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
    clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%); 
}
.custom-checkbox:checked { background-color: #1e40af; border-color: #1e40af; }
.custom-checkbox:checked::before { transform: scale(1); }

/* Fix Conflicto Tailwind Preflight vs Accesibilidad WP (Ir al contenido) */
.screen-reader-text {
    border: 0 !important;
    clip: rect(1px, 1px, 1px, 1px) !important;
    -webkit-clip-path: inset(50%) !important;
    clip-path: inset(50%) !important;
    height: 1px !important;
    margin: -1px !important;
    overflow: hidden !important;
    padding: 0 !important;
    position: absolute !important;
    width: 1px !important;
    word-wrap: normal !important;
}