/* Variables personalizadas */
        :root {
            --oscar-gold: #E5B701;
            --velvet-red: #D40000;
            --surface-deep: #121212;
            --surface-elevated: #1E1E1E;
            --text-muted: #A0A0A0;
            --on-surface: #e5e2e1;
            --on-surface-variant: #d1c5ac;
            --surface-container-lowest: #0e0e0e;
        }
        
        body {
            background-color: #131313;
            color: var(--on-surface);
            font-family: 'Hanken Grotesk', sans-serif;
            -webkit-font-smoothing: antialiased;
        }
        
        /* Tipografías personalizadas */
        .font-display-lg {
            font-family: 'Playfair Display', serif;
            font-size: 64px;
            font-weight: 700;
            line-height: 72px;
            letter-spacing: -0.02em;
        }
        
        .font-display-lg-mobile {
            font-family: 'Playfair Display', serif;
            font-size: 40px;
            font-weight: 700;
            line-height: 48px;
        }
        
        .font-headline-lg {
            font-family: 'Playfair Display', serif;
            font-size: 40px;
            font-weight: 700;
            line-height: 48px;
        }
        
        .font-headline-sm {
            font-family: 'Playfair Display', serif;
            font-size: 24px;
            font-weight: 600;
            line-height: 32px;
        }
        
        .font-title-lg {
            font-family: 'Hanken Grotesk', sans-serif;
            font-size: 20px;
            font-weight: 600;
            line-height: 28px;
        }
        
        .font-body-lg {
            font-family: 'Hanken Grotesk', sans-serif;
            font-size: 18px;
            font-weight: 400;
            line-height: 28px;
        }
        
        .font-body-md {
            font-family: 'Hanken Grotesk', sans-serif;
            font-size: 16px;
            font-weight: 400;
            line-height: 24px;
        }
        
        .font-label-caps {
            font-family: 'Hanken Grotesk', sans-serif;
            font-size: 12px;
            font-weight: 700;
            line-height: 16px;
            letter-spacing: 0.1em;
            text-transform: uppercase;
        }
        
        /* Colores personalizados */
        .text-oscar-gold { color: var(--oscar-gold); }
        .text-velvet-red { color: var(--velvet-red); }
        .bg-surface-elevated { background-color: var(--surface-elevated); }
        .bg-surface-container { background-color: #201f1f; }
        .bg-surface-container-lowest { background-color: var(--surface-container-lowest); }
        .border-oscar-gold { border-color: var(--oscar-gold); }
        
        /* Aspect ratios */
        .aspect-16-9 { aspect-ratio: 16 / 9; }
        .aspect-2-3 { aspect-ratio: 2 / 3; }
        .aspect-square { aspect-ratio: 1 / 1; }
        
        /* Efectos visuales */
        .cinematic-gradient {
            background: linear-gradient(to top, rgba(13, 13, 13, 1) 0%, rgba(13, 13, 13, 0.4) 50%, rgba(13, 13, 13, 0) 100%);
        }
        .cinematic-gradient a{
            color: var(--oscar-gold) !important;
            text-decoration: none;
            text-transform: uppercase;
            font-size: 12px;
            letter-spacing: 0.1em;
        }
        .glass-header {
            backdrop-filter: blur(12px);
            -webkit-backdrop-filter: blur(12px);
            background-color: rgba(19, 19, 19, 0.8);
        }
        
        .img-hover-zoom {
            overflow: hidden;
        }
        
        .img-hover-zoom img {
            transition: transform 0.7s ease;
        }
        
        .img-hover-zoom:hover img {
            transform: scale(1.05);
        }
        
        .hover-gold:hover {
            color: var(--oscar-gold) !important;
            transition: color 0.2s ease;
        }
        
        .hover-border-gold:hover {
            border-color: var(--oscar-gold) !important;
        }
        
        /* Badge de rating */
        .rating-badge {
            position: absolute;
            top: 8px;
            right: 8px;
            background-color: var(--oscar-gold);
            color: #131313;
            padding: 4px 8px;
            border-radius: 4px;
            font-size: 12px;
            font-weight: 700;
            letter-spacing: 0.1em;
            z-index: 10;
        }
        
        /* Filtros para imágenes de aniversario */
        .grayscale-img {
            transition: filter 0.7s ease;
            filter: grayscale(100%);
        }
        
        .grayscale-img:hover {
            filter: grayscale(0%);
        }
        
        /* Overlay oscuro */
        .dark-overlay {
            position: absolute;
            inset: 0;
            background-color: rgba(0,0,0,0.4);
            transition: background-color 0.2s ease;
        }
        
        .dark-overlay:hover {
            background-color: rgba(0,0,0,0.2);
        }
        
        .cursor-pointer {
            cursor: pointer;
        }
        
        /* Transiciones */
        .transition-colors {
            transition: color 0.2s ease, border-color 0.2s ease, background-color 0.2s ease;
        }
        
        /* Clase para texto muted */
        .text-muted-custom {
            color: var(--text-muted);
        }
        
        /* Iconos grandes para redes sociales */
        .social-icon {
            font-size: 24px;
            transition: color 0.2s ease;
        }
        
        .social-icon:hover {
            color: var(--oscar-gold) !important;
        }

        /* ===== ESTILOS UNIFICADOS PARA SECCIONES ===== */

/* Reset para enlaces dentro de cinematic-gradient */
.cinematic-gradient a {
    text-decoration: none !important;
}

/* Enlaces de categoría: solo dorado */
.cinematic-gradient .text-oscar-gold a,
.cinematic-gradient .text-oscar-gold a:link,
.cinematic-gradient .text-oscar-gold a:visited {
    color: var(--oscar-gold) !important;
    font-family: 'Hanken Grotesk', sans-serif;
    font-size: 12px;
    font-weight: 700;
    line-height: 16px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

/* Enlaces de título dentro de destacadas y hero */
.cinematic-gradient .font-headline-sm a,
.cinematic-gradient .font-title-lg a,
.title-link,
.title-link:link,
.title-link:visited {
    color: white !important;
    text-decoration: none !important;
    font-family: inherit;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
    letter-spacing: normal;
    text-transform: none;
}

.cinematic-gradient .font-headline-sm a:hover,
.cinematic-gradient .font-title-lg a:hover,
.title-link:hover {
    color: var(--oscar-gold) !important;
    text-decoration: none !important;
}

/* Asegurar que los textos conserven su tamaño y peso original */
.font-headline-sm,
.font-headline-sm a {
    font-family: 'Playfair Display', serif !important;
    font-size: 24px !important;
    font-weight: 600 !important;
    line-height: 32px !important;
}

.font-title-lg,
.font-title-lg a {
    font-family: 'Hanken Grotesk', sans-serif !important;
    font-size: 20px !important;
    font-weight: 600 !important;
    line-height: 28px !important;
}

.text-muted-custom {
    font-family: 'Hanken Grotesk', sans-serif !important;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 24px !important;
    color: var(--text-muted) !important;
}


/*Para quitarle estilos al footer*/
.menu-item a{
    text-decoration: none;
    color: var(--on-surface-variant) !important;
}
.menu-item a:hover{
    text-decoration: underline;
    color: var(--on-surface-variant) !important;

}
.menu{
   list-style: none;
   padding: 0;
   margin: 0;
}   
#nav_menu-4{
    margin-bottom: 8px;
}