/* Reset y Base */
body, html { margin: 0; padding: 0; background-color: #020617; color: #f8fafc; overflow-x: hidden; }

/* Paneles Glass Principales */
.glass-panel {
    background: rgba(10, 15, 30, 0.6); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(204, 255, 0, 0.15); border-radius: 12px;
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.5), inset 0 0 20px rgba(204, 255, 0, 0.05);
}

/* Forzar modo oscuro en calendarios y selects nativos del navegador */
input[type="datetime-local"], 
input[type="text"], 
input[type="tel"], 
input[type="email"], 
select {
    color-scheme: dark !important;
}

/* Viñeteado Cinemático 2.5D para el fondo del bosque */
.vignette-overlay {
    background: radial-gradient(circle at center, rgba(2, 6, 23, 0.15) 0%, rgba(2, 6, 23, 0.95) 100%);
}

/* MARCOS MÁGICOS (Sub-secciones del Menú) */
.firefly-frame {
    background: rgba(2, 6, 23, 0.7);
    border: 1px solid rgba(204, 255, 0, 0.3);
    border-radius: 16px;
    box-shadow: inset 0 0 20px rgba(204, 255, 0, 0.05), 0 5px 15px rgba(0,0,0,0.3);
    transition: all 0.5s ease;
}
.firefly-frame:hover {
    border-color: rgba(204, 255, 0, 0.6);
    box-shadow: 0 0 30px rgba(204, 255, 0, 0.15), inset 0 0 20px rgba(204, 255, 0, 0.1);
    transform: translateY(-2px);
}

/* Animación de aleteo realista para las alas */
@keyframes flapLeft {
    0%, 100% { transform: rotate(0deg) scaleX(1); }
    50% { transform: rotate(-12deg) scaleX(0.85); }
}

@keyframes flapRight {
    0%, 100% { transform: rotate(0deg) scaleX(1); }
    50% { transform: rotate(12deg) scaleX(0.85); }
}

.wing-left {
    transform-origin: 50px 35px;
    animation: flapLeft 0.35s ease-in-out infinite;
}

.wing-right {
    transform-origin: 50px 35px;
    animation: flapRight 0.35s ease-in-out infinite;
}

/* Efecto Esfumado del Hero */
.hero-glow {
    background: radial-gradient(ellipse at center, rgba(2, 6, 23, 0.85) 0%, rgba(2, 6, 23, 0.4) 50%, rgba(2, 6, 23, 0) 80%);
}

/* Slideshow Robusto basado en etiquetas <img> */
.slideshow-img {
    opacity: 0;
    transition: opacity 1.5s ease-in-out;
}
.slideshow-img.active {
    opacity: 1;
}

/* Respiración sutil del bosque */
@keyframes breath {
    0% { transform: scale(1); }
    50% { transform: scale(1.05); }
    100% { transform: scale(1); }
}
.animate-breath {
    animation: breath 30s infinite ease-in-out;
}

/* Flotación suave del cuerpo */
@keyframes float {
    0% { transform: translateY(0px); }
    50% { transform: translateY(-8px); }
    100% { transform: translateY(0px); }
}
.animate-float {
    animation: float 4s ease-in-out infinite;
}

/* Paleta Interactiva */
.interactive-card { position: relative; }
.interactive-card::before {
    content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; border-radius: inherit;
    background: radial-gradient(500px circle at var(--mouse-x, -500px) var(--mouse-y, -500px), rgba(204, 255, 0, 0.12), transparent 40%);
    z-index: 0; pointer-events: none; transition: background 0.3s ease;
}

/* Tarjetas Experiencia */
.experience-card .hover-reveal { transform: translateY(20px); }
.experience-card:hover .hover-reveal { transform: translateY(0); }
.experience-card:hover img { transform: scale(1.1); }
.experience-card:hover .description { opacity: 1; }

/* Glow & Misc */
.text-glow { text-shadow: 0 0 10px rgba(204, 255, 0, 0.3); }
.btn-glow { box-shadow: 0 0 15px rgba(204, 255, 0, 0.4); transition: all 0.3s ease; }
.btn-glow:hover { box-shadow: 0 0 25px rgba(204, 255, 0, 0.8); transform: translateY(-2px); }
.menu-dots { flex-grow: 1; border-bottom: 1px border rgba(255, 255, 255, 0.2); border-bottom-style: dotted; margin: 0 15px; position: relative; top: -6px; }

/* Animaciones */
.fade-up { opacity: 0; transform: translateY(40px); transition: opacity 0.8s cubic-bezier(0.25, 0.8, 0.25, 1), transform 0.8s cubic-bezier(0.25, 0.8, 0.25, 1); }
.fade-up.visible { opacity: 1; transform: translateY(0); }
::-webkit-scrollbar { width: 8px; } ::-webkit-scrollbar-track { background: #020617; } ::-webkit-scrollbar-thumb { background: #01352c; border-radius: 4px; } ::-webkit-scrollbar-thumb:hover { background: #ccff00; }

/* Carrusel Infinito de Reseñas */
.mask-edges {
    -webkit-mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
    mask-image: linear-gradient(to right, transparent, black 10%, black 90%, transparent);
}
@keyframes marquee {
    0% { transform: translateX(0); }
    100% { transform: translateX(-50%); }
}
.animate-marquee {
    animation: marquee 30s linear infinite;
    will-change: transform;
}

/* Ocultar scrollbar para los menús deslizables en móvil */
.hide-scrollbar::-webkit-scrollbar { 
    display: none; 
}
.hide-scrollbar { 
    -ms-overflow-style: none; 
    scrollbar-width: none; 
}