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

html { scroll-behavior: smooth; }

@layer utilities {
    .bg-pat-primary { background-color: #FDFBF7; }
    .bg-pat-dark { background-color: #4A3B32; }
    .bg-pat-accent { background-color: #E2A76F; }
    .bg-pat-rose { background-color: #E8D3CD; }
    
    .text-pat-primary { color: #4A3B32; }
    .text-pat-accent { color: #E2A76F; }
    .text-pat-rose { color: #B28377; }
    
    .border-pat-accent { border-color: #E2A76F; }
    .border-pat-dark { border-color: #4A3B32; }
    
    .font-playfair { font-family: 'Playfair Display', serif; }
    .font-lora { font-family: 'Lora', serif; }
    
    .btn-pat {
        @apply inline-flex items-center justify-center bg-[#4A3B32] text-[#FDFBF7] font-lora text-sm tracking-wider uppercase py-4 px-10 hover:bg-[#E2A76F] transition-colors duration-500 rounded-sm;
    }
    
    .btn-pat-outline {
        @apply inline-flex items-center justify-center border border-[#4A3B32] text-[#4A3B32] font-lora text-sm tracking-wider uppercase py-4 px-10 hover:bg-[#4A3B32] hover:text-[#FDFBF7] transition-colors duration-500 rounded-sm;
    }
    
    .nav-link {
        @apply text-[#4A3B32] hover:text-[#E2A76F] font-lora text-sm uppercase tracking-widest transition-colors duration-300 relative;
    }
    
    .nav-link::after {
        content: '';
        @apply absolute -bottom-2 left-1/2 -translate-x-1/2 w-0 h-[1px] bg-[#E2A76F] transition-all duration-300;
    }
    
    .nav-link:hover::after, .nav-link.active::after {
        @apply w-1/2;
    }
    
    .nav-link.active {
        @apply text-[#E2A76F];
    }
}

/* Elegant Box Shadow */
.shadow-elegant {
    box-shadow: 0 10px 40px -10px rgba(74, 59, 50, 0.08);
}

.menu-item-dots {
    border-bottom: 1px dotted #E2A76F;
    flex-grow: 1;
    margin: 0 1rem;
    position: relative;
    top: -6px;
    opacity: 0.5;
}

/* Leaf decoration */
.leaf-pattern {
    background-image: url('data:image/svg+xml;utf8,<svg width="40" height="40" viewBox="0 0 40 40" xmlns="http://www.w3.org/2000/svg"><path d="M20 0C20 0 30 10 30 20C30 30 20 40 20 40C20 40 10 30 10 20C10 10 20 0 20 0Z" fill="none" stroke="%23E8D3CD" stroke-width="1"/></svg>');
    background-repeat: space;
}
