/* Global styles for Rashmi Healer */
:root {
    --font-serif: 'Cormorant Garamond', serif;
    --font-sans: 'Plus Jakarta Sans', sans-serif;
}

body {
    font-family: var(--font-sans);
}

.font-serif {
    font-family: var(--font-serif) !important;
}

.font-sans {
    font-family: var(--font-sans) !important;
}


.material-symbols-outlined {
    font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24;
}

/* Dropdown Animation */
.dropdown-menu {
    opacity: 0;
    transform: translateY(12px);
    pointer-events: none;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

.group:hover .dropdown-menu {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

/* Header Link Hover Animation */
.nav-link {
    position: relative;
    transition: color 0.3s ease;
}

.nav-link::after {
    content: '';
    position: absolute;
    width: 100%;
    height: 1.5px;
    bottom: -4px;
    left: 0;
    background: currentColor;
    transform: scaleX(0);
    transform-origin: right;
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    opacity: 0.6;
}

.nav-link:hover::after {
    transform: scaleX(1);
    transform-origin: left;
}

/* Mobile Menu Animation */
#mobile-menu {
    transform: translateX(100%);
    transition: transform 0.4s cubic-bezier(0.4, 0, 0.2, 1);
}

#mobile-menu.active {
    transform: translateX(0);
}

#mobile-menu-overlay.active {
    opacity: 1;
    pointer-events: auto;
}

.custom-scrollbar::-webkit-scrollbar {
    width: 4px;
}

.custom-scrollbar::-webkit-scrollbar-track {
    background: transparent;
}

.custom-scrollbar::-webkit-scrollbar-thumb {
    background: rgba(32, 19, 62, 0.1);
    border-radius: 10px;
}

.custom-scrollbar::-webkit-scrollbar-thumb:hover {
    background: rgba(32, 19, 62, 0.2);
}

/* Custom Bold Cursive Styling for Titles */
.cursive-bold-gold {
    font-family: 'Great Vibes', cursive !important;
    font-size: 2.75rem !important;
    font-weight: 700 !important;
    color: #a67c52 !important;
    line-height: 1.25 !important;
    -webkit-text-stroke: 1.2px #a67c52;
    text-shadow: 0.3px 0 0 #a67c52, -0.3px 0 0 #a67c52, 0 0.3px 0 #a67c52, 0 -0.3px 0 #a67c52;
}

.cursive-bold-purple {
    font-family: 'Great Vibes', cursive !important;
    font-size: 2.75rem !important;
    font-weight: 700 !important;
    color: #2d1a47 !important;
    line-height: 1.25 !important;
    -webkit-text-stroke: 1.2px #2d1a47;
    text-shadow: 0.3px 0 0 #2d1a47, -0.3px 0 0 #2d1a47, 0 0.3px 0 #2d1a47, 0 -0.3px 0 #2d1a47;
}

@media (min-width: 768px) {
    .cursive-bold-gold {
        font-size: 3.5rem !important;
    }
    .cursive-bold-purple {
        font-size: 3.5rem !important;
    }
}