@import url('https://fonts.googleapis.com/css2?family=Lato:wght@300;400;700&family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;1,400&display=swap');

html { scroll-behavior: smooth; }

@layer utilities {
    .bg-wedding-blush { background-color: #FAF4F4; }
    .bg-wedding-gold { background-color: #D4AF37; }
    .bg-wedding-slate { background-color: #334155; }
    
    .text-wedding-gold { color: #D4AF37; }
    .text-wedding-slate { color: #334155; }
    
    .font-playfair { font-family: 'Playfair Display', serif; }
    .font-lato { font-family: 'Lato', sans-serif; }
    
    .btn-wedding {
        @apply inline-flex items-center justify-center bg-[#D4AF37] text-white font-lato text-sm tracking-widest uppercase py-4 px-8 hover:bg-[#b8952b] transition-all duration-500 shadow-md hover:shadow-xl;
    }
    
    .btn-wedding-outline {
        @apply inline-flex items-center justify-center border border-[#D4AF37] text-[#D4AF37] font-lato text-sm tracking-widest uppercase py-4 px-8 hover:bg-[#D4AF37] hover:text-white transition-all duration-500;
    }
    
    .nav-link {
        @apply text-slate-600 hover:text-[#D4AF37] font-lato text-sm tracking-widest uppercase transition-colors duration-300 relative;
    }
    
    .nav-link::after {
        content: '';
        @apply absolute -bottom-1 left-1/2 -translate-x-1/2 w-0 h-[1px] bg-[#D4AF37] transition-all duration-300;
    }
    
    .nav-link:hover::after, .nav-link.active::after {
        @apply w-full;
    }
    
    .nav-link.active {
        @apply text-[#D4AF37];
    }
}

.parallax-bg {
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}