body {
    font-family: 'Poppins', sans-serif;
}

.scrollbar-hide::-webkit-scrollbar {
    display: none;
}

.scrollbar-hide {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.text-shadow {
    text-shadow: 2px 2px 4px rgba(75, 90, 129, 0.1);
}

.text-shadow-lg {
    text-shadow: 0 4px 12px rgba(75, 90, 129, 0.3);
}

header.scrolled,
header.header-solid {
    background-color: rgba(255, 255, 255, 1);
    color: #4b5a81;
    border-bottom: 1px solid rgba(75, 90, 129, 0.1);
    box-shadow: 0 1px 2px 0 rgba(75, 90, 129, 0.05);
}

header.scrolled {
    position: fixed;
    top: 0;
    height: 4.5rem;
}

header.scrolled .nav-text,
header.header-solid .nav-text,
header.scrolled i,
header.header-solid i {
    color: #4b5a81;
}

header.scrolled #header-logo,
header.header-solid #header-logo {
    filter: none;
}

/* Robust Header Hover States */
.nav-link {
    transition: all 0.3s ease;
    color: inherit;
}

/* Transparent State (At Top) */
header:not(.scrolled):not(.header-solid) .nav-link {
    color: rgba(255, 255, 255, 0.95);
    text-shadow: 0 1px 3px rgba(75, 90, 129, 0.3);
}

header:not(.scrolled):not(.header-solid) .nav-link:hover {
    color: #ffffff !important;
    text-shadow: 0 0 12px rgba(255, 255, 255, 0.6);
    transform: translateY(-1px);
}

header:not(.scrolled):not(.header-solid) #header-logo {
    filter: brightness(0) invert(1) drop-shadow(0 1px 2px rgba(75, 90, 129, 0.3));
}

/* Sticky/Solid State */
header.scrolled .nav-link,
header.header-solid .nav-link {
    color: #4b5a81;
}

header.scrolled .nav-link:hover,
header.header-solid .nav-link:hover {
    color: #DA1884 !important;
    /* Pink */
}

[x-cloak] {
    display: none !important;
}

/* 1. Global Font Family */
body {
    font-family: 'Poppins', sans-serif !important;
    font-weight: 400;
    /* Regular font for all website */
}

/* 3. Exception Restoration (Sizes) */
/* Ensure utility classes work as expected in excluded sections */
header .text-xs,
footer .text-xs,
#philosophy-section .text-xs {
    font-size: 0.75rem !important;
}

header .text-sm,
footer .text-sm,
#philosophy-section .text-sm {
    font-size: 0.875rem !important;
}

header .text-base,
footer .text-base,
#philosophy-section .text-base {
    font-size: 1rem !important;
}

header .text-lg,
footer .text-lg,
#philosophy-section .text-lg {
    font-size: 1.125rem !important;
}

header .text-xl,
footer .text-xl,
#philosophy-section .text-xl {
    font-size: 1.25rem !important;
}

header .text-2xl,
footer .text-2xl,
#philosophy-section .text-2xl {
    font-size: 1.5rem !important;
}

header .text-3xl,
footer .text-3xl,
#philosophy-section .text-3xl {
    font-size: 1.875rem !important;
}

header .text-4xl,
footer .text-4xl,
#philosophy-section .text-4xl {
    font-size: 2.25rem !important;
}

header .text-5xl,
footer .text-5xl,
#philosophy-section .text-5xl {
    font-size: 3rem !important;
}

/* Philosophy-specific restoration */
@media (min-width: 768px) {
    #philosophy-section h3 {
        font-size: 3rem !important;
    }

    /* Restore 5xl */
    #philosophy-section p {
        font-size: 1.875rem !important;
    }

    /* Restore 3xl */
}

#philosophy-section h3 {
    font-size: 2.25rem !important;
}

/* Restore 4xl-ish */
#philosophy-section p {
    font-size: 1.25rem !important;
}

/* Wishlist Icon Active & Hover States */
.wishlist-btn.wishlist-active {
    color: #E94560 !important;
}
.wishlist-btn.wishlist-active i {
    color: #E94560 !important;
    transition: color 0.3s ease;
}
.wishlist-btn.wishlist-active:hover {
    background-color: #DA1884 !important;
    color: #ffffff !important;
}
.wishlist-btn.wishlist-active:hover i {
    color: #ffffff !important;
}