:root {
           
           --nude-bg: #fdfaf7;
            --blush: #f8e1e1;
            --rose-gold: #d4af37;
            --lavender: #e6e6fa;
            --charcoal: #333333;
            --espresso: #4a3728;
        }

        body {
            font-family: 'Inter', sans-serif;
            background-color: var(--nude-bg);
            color: var(--charcoal);
            scroll-behavior: smooth;
        }

        h1, h2, h3, .serif { font-family: 'Playfair Display', serif; color: var(--espresso); }
        .ui-label { font-family: 'Poppins', sans-serif; }

        .glass-nav {
            background: rgba(253, 250, 247, 0.85);
            backdrop-filter: blur(25px);
            -webkit-backdrop-filter: blur(25px);
            border-bottom: 1px solid rgba(248, 225, 225, 0.4);
        }

        .video-card-hover:hover .play-overlay {
            opacity: 1;
            transform: scale(1);
        }

        .play-overlay {
            background: rgba(0, 0, 0, 0.25);
            opacity: 0;
            transform: scale(1.1);
            transition: all 0.5s cubic-bezier(0.175, 0.885, 0.32, 1.275);
        }

        .cart-sidebar, .legal-modal {
            transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.4s ease;
        }

        .auth-input {
            background: #ffffff;
            border: 1px solid #eee;
            transition: all 0.3s ease;
        }
        .auth-input:focus {
            border-color: var(--blush);
            box-shadow: 0 0 0 4px rgba(248, 225, 225, 0.2);
            outline: none;
        }

        .filter-tab.active {
            background: var(--blush);
            color: var(--espresso);
            border-color: var(--blush);
        }

        .glow-card {
            background: white;
            transition: all 0.4s ease;
        }
        .glow-card:hover {
            box-shadow: 0 20px 40px rgba(74, 55, 40, 0.05);
            transform: translateY(-5px);
        }

        .custom-scrollbar::-webkit-scrollbar { width: 5px; }
        .custom-scrollbar::-webkit-scrollbar-track { background: transparent; }
        .custom-scrollbar::-webkit-scrollbar-thumb { background: var(--blush); border-radius: 10px; }

        .section-fade {
            animation: fadeIn 0.7s ease-out forwards;
        }
        @keyframes fadeIn {
            from { opacity: 0; transform: translateY(20px); }
            to { opacity: 1; transform: translateY(0); }
        }

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