/* Define custom color variables */
:root {
    --color-primary: #6D6875;
    --color-secondary: #D4AF37;
    --color-accent: #E8C4C4;
    --color-light: #FFF9F0;
    --color-btnprimary: #01A8FF;
    --color-btnsecondary: #4D86AF;
    --color-blacktext: #000000;
 
}
/* Custom font families */
.font-cormorant { font-family: 'Cormorant Garamond', serif; }
.font-lora { font-family: 'Lora', serif; }

/* Navigation link underline animation on hover */
.nav-link {
background-image: linear-gradient(var(--color-secondary), var(--color-secondary));/* Fallback using custom variable */
background-image: linear-gradient(#D4AF37, #D4AF37); /* Direct color fallback */
background-size: 0% 2px;/* Start with no visible underline */
background-position: 0% 100%; /* Position the underline at the bottom */
transition: background-size 0.3s;/* Smooth animation for underline expansion */
}

.nav-link:hover {
background-size: 100% 2px; /* Expand underline on hover */
}

/* Scale and shadow effect on hover */
.hover-scale {
    transition: transform 0.3s, box-shadow 0.3s; /* Smooth transition for scale and shadow */
}

.hover-scale:hover {
    transform: translateY(-5px); /* Slight upward movement on hover */
    box-shadow: 0 10px 20px rgba(0,0,0,0.1); /* Apply soft shadow */
}