:root {
    --primary-bg: #111111; /* Negro profundo para elegancia */
    --secondary-bg: #1a1a1a;
    --accent-gold: #d4af37; /* Dorado clásico y premium */
    --text-main: #fcfcfc;
}

body {
    background-color: var(--primary-bg);
    color: var(--text-main);
    font-family: 'Montserrat', sans-serif;
}

body::after {
    content: '';
    position: fixed;
    top: 0; left: 0; width: 100vw; height: 100vh;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");
    opacity: 0.05;
    pointer-events: none;
    z-index: 9999;
}

h1, h2, h3, h4, h5, h6, .font-serif {
    font-family: 'Playfair Display', serif;
}

.font-script {
    font-family: 'Great Vibes', cursive;
}

/* Tailwind configuration for custom colors */
.bg-primary-bg { background-color: var(--primary-bg); }
.bg-secondary-bg { background-color: var(--secondary-bg); }
.from-primary-bg { --tw-gradient-from: var(--primary-bg) var(--tw-gradient-from-position); }
.text-text-main { color: var(--text-main); }
.text-accent-gold { color: var(--accent-gold); }
.bg-accent-gold { background-color: var(--accent-gold); }

/* Utilities for Swiper & Gallery */
.swiper-container {
    width: 100%;
    padding-bottom: 2rem;
    overflow: hidden;
}

.swiper-slide {
    width: 250px; /* Tamaño ideal en móvil para que se vea parte de la siguiente foto */
}

@media (min-width: 768px) {
    .swiper-slide {
        width: 320px; /* Más grande en escritorio */
    }
}

.gallery-item {
    cursor: pointer;
    overflow: hidden;
    border-radius: 0.25rem;
    position: relative;
    /* Relación de aspecto vertical clásica de fotografía 3:4 */
    aspect-ratio: 3/4; 
    background-color: var(--secondary-bg);
}

.gallery-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.5s ease;
}

/* Estado inicial para lazy loading */
.gallery-item img.lazyload-hide {
    opacity: 0;
}

.gallery-item:hover img {
    transform: scale(1.08);
}

/* Efecto elegante al hacer hover y click en swiper */
.swiper-slide {
    transition: transform 0.4s ease, opacity 0.4s ease;
}

/* Oscurecer un poco los slides inactivos (opcional) */
/* .swiper-slide:not(.swiper-slide-active) { opacity: 0.8; } */

/* Animaciones Reveal */
.reveal-up {
    opacity: 0;
    transform: translateY(40px);
    transition: opacity 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94), 
                transform 1.2s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.reveal-up.active {
    opacity: 1;
    transform: translateY(0);
}
.delay-100 { transition-delay: 100ms; }
.delay-300 { transition-delay: 300ms; }
.delay-500 { transition-delay: 500ms; }

/* Overlay sutil al hacer hover */
.gallery-item::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.4) 0%, transparent 50%);
    opacity: 0;
    transition: opacity 0.4s ease;
    pointer-events: none;
}

.gallery-item:hover::after {
    opacity: 1;
}

/* Personalización ligera de LightGallery */
.lg-backdrop {
    background-color: rgba(10, 10, 10, 0.95);
}
