/* Local Playfair variable fonts */
            @font-face {
                font-family: 'PlayfairLocal';
                src: url('Playfair_Display/PlayfairDisplay-VariableFont_wght.ttf') format('truetype');
                font-weight: 100 900;
                font-style: normal;
                font-display: swap;
            }
            @font-face {
                font-family: 'PlayfairLocal';
                src: url('Playfair_Display/PlayfairDisplay-Italic-VariableFont_wght.ttf') format('truetype');
                font-weight: 100 900;
                font-style: italic;
                font-display: swap;
            }

            * {
                margin: 0;
                padding: 0;
                box-sizing: border-box;
            }

            :root {
                --gold: #D4AF37;
                --dark: #1a1a1a;
                --ivory: #FAF9F6;
                --charcoal: #2d2d2d;
            }

            body {
                font-family: 'Montserrat', sans-serif;
                background: var(--dark);
                color: var(--ivory);
                overflow-x: hidden;
            }

            .font-display {
                font-family: 'PlayfairLocal', 'Playfair Display', serif;
            }

            .font-elegant {
                font-family: 'Cormorant Garamond', serif;
            }

            /* Hero Section with Parallax Effect */
            .hero {
                height: 100vh;
                position: relative;
                overflow: hidden;
            }

            .hero-bg {
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                background: linear-gradient(rgba(26, 26, 26, 0.5), rgba(26, 26, 26, 0.7)), 
                            url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1920 1080"><rect fill="%232d2d2d"/><text x="50%" y="50%" font-size="48" fill="%23D4AF37" text-anchor="middle" opacity="0.3">EVENTO DE LUJO - IMAGEN HERO</text></svg>');
                background-size: cover;
                background-position: center;
                transition: transform 0.5s ease-out;
            }

            /* Elegant Navigation: default transparent, keep blur; shadow appears on scroll */
            nav {
                background: transparent;
                backdrop-filter: blur(10px);
                transition: box-shadow 0.3s ease, backdrop-filter 0.3s ease;
            }

            nav.scrolled {
                box-shadow: 0 4px 30px rgba(212, 175, 55, 0.12);
            }

            .nav-link {
                position: relative;
                transition: color 0.3s ease;
            }

            .nav-link::after {
                content: '';
                position: absolute;
                bottom: -5px;
                left: 0;
                width: 0;
                height: 2px;
                background: var(--gold);
                transition: width 0.3s ease;
            }

            .nav-link:hover::after {
                width: 100%;
            }

            /* Gold Accent Line */
            .gold-line {
                width: 80px;
                height: 2px;
                background: var(--gold);
                margin: 20px auto;
            }

            /* Service Cards with Hover Effect */
            .service-card {
                background: linear-gradient(145deg, var(--charcoal), var(--dark));
                border: 1px solid rgba(212, 175, 55, 0.2);
                transition: all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
                position: relative;
                overflow: hidden;
            }

            .service-card::before {
                content: '';
                position: absolute;
                top: 0;
                left: -100%;
                width: 100%;
                height: 100%;
                background: linear-gradient(90deg, transparent, rgba(212, 175, 55, 0.1), transparent);
                transition: left 0.5s ease;
            }

            .service-card:hover::before {
                left: 100%;
            }

            .service-card:hover {
                transform: translateY(-10px);
                border-color: var(--gold);
                box-shadow: 0 20px 60px rgba(212, 175, 55, 0.2);
            }

            /* Gallery Grid */
            .gallery-item {
                position: relative;
                overflow: hidden;
                cursor: pointer;
            }

            .gallery-item img {
                transition: transform 0.6s ease;
            }

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

            .gallery-overlay {
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                background: linear-gradient(to top, rgba(26, 26, 26, 0.9), transparent);
                opacity: 0;
                transition: opacity 0.4s ease;
                display: flex;
                align-items: flex-end;
                padding: 30px;
            }

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

            /* Testimonial Card */
            .testimonial {
                background: rgba(45, 45, 45, 0.5);
                border-left: 3px solid var(--gold);
                transition: all 0.3s ease;
            }

            .testimonial:hover {
                background: rgba(45, 45, 45, 0.8);
                transform: translateX(10px);
            }

            /* CTA Button: dorado por defecto; hover -> transparente + shadow dorado; sin animación interna */
            .cta-button {
                background: var(--gold);
                color: var(--dark);
                font-weight: 600;
                letter-spacing: 1px;
                transition: background-color 0.28s ease, color 0.28s ease, box-shadow 0.28s ease, transform 0.28s ease;
                position: relative;
                overflow: visible;
                border: none;
                cursor: pointer;
                display: inline-block;
                transform: translateY(0);
            }

            /* Disable internal ripple/expand animation */
            .cta-button::before { display: none; }

            .cta-button:hover {
                background: transparent;
                color: var(--gold);
                transform: translateY(-2px);
                box-shadow: 0 10px 30px rgba(212, 175, 55, 0.28);
            }

            .cta-button:active {
                transform: translateY(0px);
            }

            /* Form Styling */
            .form-input {
                background: rgba(45, 45, 45, 0.5);
                border: 1px solid rgba(212, 175, 55, 0.3);
                color: var(--ivory);
                transition: all 0.3s ease;
            }

            .form-input:focus {
                outline: none;
                border-color: var(--gold);
                background: rgba(45, 45, 45, 0.8);
                box-shadow: 0 0 20px rgba(212, 175, 55, 0.2);
            }

            /* Scroll Reveal Animation */
            .reveal {
                opacity: 0;
                transform: translateY(50px);
                transition: all 0.8s ease;
            }

            .reveal.active {
                opacity: 1;
                transform: translateY(0);
            }

            /* Logo Styling */
            .logo {
                font-size: 28px;
                font-weight: 700;
                letter-spacing: 3px;
                background: linear-gradient(135deg, var(--gold), #f4d479);
                -webkit-background-clip: text;
                -webkit-text-fill-color: transparent;
                background-clip: text;
            }

            /* Responsive Breakpoints */
            @media (max-width: 1024px) {
                .gold-line {
                    width: 60px;
                }
            }

            @media (max-width: 768px) {
                .hero {
                    height: 80vh;
                }

                nav {
                    padding: 0.5rem 0;
                }

                .gold-line {
                    width: 50px;
                    margin: 15px auto;
                }

                .service-card {
                    padding: 1.5rem;
                }

                .testimonial {
                    padding: 1.5rem;
                }

                .testimonial p {
                    font-size: 1rem;
                }

                .gallery-item {
                    height: 15rem;
                }

                .gallery-overlay {
                    padding: 20px;
                }

                .gallery-overlay h4 {
                    font-size: 1.25rem;
                }

                .gallery-overlay p {
                    font-size: 0.875rem;
                }
            }

            @media (max-width: 640px) {
                body {
                    font-size: 14px;
                }

                .hero {
                    height: 70vh;
                }

                .cta-button {
                    padding: 0.75rem 1.5rem;
                    font-size: 0.75rem;
                }

                .service-card {
                    padding: 1rem;
                }

                .testimonial {
                    padding: 1rem;
                }

                .testimonial .text-lg {
                    font-size: 1rem;
                }

                .gallery-item {
                    height: 12rem;
                }

                .gallery-overlay {
                    padding: 15px;
                }

                .gallery-overlay h4 {
                    font-size: 1rem;
                }

                .gallery-overlay p {
                    font-size: 0.75rem;
                }

                .form-input {
                    padding: 0.75rem;
                    font-size: 14px;
                }
            }
            .accordion-header {
                background: linear-gradient(to right, #2d2d2d, #1a1a1a);
                cursor: pointer;
            }

            .accordion-content {
                max-height: 0;
                overflow: hidden;
                transition: max-height 0.4s ease;
            }

            .accordion-item.active .accordion-content {
                max-height: 1000px;
            }
            .social-link {
                position: relative;
                padding: 0.4rem 0.75rem;
                border-radius: 999px;
                transition: 
                    box-shadow 0.28s ease,
                    transform 0.28s ease,
                    color 0.28s ease;
            }

            .social-link:hover {
                color: var(--gold);
                transform: translateY(-2px);
                box-shadow: 0 10px 30px rgba(212, 175, 55, 0.28);
            }

            .social-link img {
                transition: 
                    opacity 0.28s ease,
                    filter 0.28s ease;
            }

            .social-link:hover img {
                opacity: 1;
                filter: drop-shadow(0 0 6px rgba(212, 175, 55, 0.6));
            }

            