/* 1. Configuración Global y Scroll Snapping */
html {
    scroll-behavior: smooth;
}

body {
    font-family: 'Inter', sans-serif;
    margin: 0; padding: 0;
    overflow-x: hidden;
}

section, header {
    min-height: 100vh;
    padding: 80px 0;
    display: flex;
    align-items: center;
    position: relative;
    overflow: hidden;
}

.section-ia-fix {
    scroll-margin-top: 80px;
    padding-top: 80px;
}

/* Navegación */
.nav-custom {
    background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(12px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}

.btn-demo {
    background: linear-gradient(135deg, #1e293b 0%, #334155 100%);
    transition: all 0.3s ease;
}

.btn-demo:hover {
    transform: translateY(-2px);
    background: #2563eb;
}

/* Colores Pastel */
.bg-pastel-blue { background-color: #e2eefb; }
.bg-pastel-mint { background-color: #e3f2e8; }
.bg-pastel-cream { background-color: #f5efe2; }
.gradient-bg { background: linear-gradient(135deg, #1e293b 0%, #0f172a 100%); }

.video-container {
    border-radius: 1.5rem;
    overflow: hidden;
    box-shadow: 0 20px 40px -10px rgba(0, 0, 0, 0.3);
    border: 4px solid rgba(255, 255, 255, 0.5);
    background: #000;
}

/* Flechas y Flotantes */
.arrow-float {
    position: fixed; bottom: 2.5rem; left: 50%;
    margin-left: -28px; z-index: 50;
    transition: opacity 0.4s ease-in-out;
}

.arrow-float button {
    background-color: rgba(15, 23, 42, 0.9);
    color: white; width: 56px; height: 56px;
    border-radius: 50%; display: flex; align-items: center; justify-content: center;
    animation: bounce-inner 2s infinite;
}

@keyframes bounce-inner {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-10px); }
}

.whatsapp-float {
    position: fixed; bottom: 2rem; right: 2rem; z-index: 100;
}

.whatsapp-float a {
    background-color: #25D366; color: white;
    width: 60px; height: 60px; border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
}

/* --- FIX PARA EL MODAL --- */
#demoModal { transition: all 0.3s ease-in-out; }
.modal-active { display: flex !important; opacity: 1 !important; }
.modal-active #modalContent { transform: scale(1) !important; opacity: 1 !important; }
body.modal-open { overflow: hidden; }

.blob {
    position: absolute; filter: blur(60px); z-index: 0;
    border-radius: 50%; opacity: 0.4; pointer-events: none;
}
/* Estilo para el contenedor del captcha */
.captcha-box {
    background: rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(5px);
    transition: all 0.3s ease;
}

.captcha-box:focus-within {
    background: rgba(255, 255, 255, 0.08);
    border-color: #3b82f6;
}

/* Animación para que el mensaje de éxito destaque */
#status-alert {
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.3), 0 10px 10px -5px rgba(0, 0, 0, 0.2);
}