
        html { scroll-behavior: smooth; }
        .scroll-anchor { scroll-margin-top: 100px; }
        body {
            font-family: 'Vazirmatn', 'Vazir', sans-serif;
            cursor: none;
        }
        
        /* Custom Cursor */
        .custom-cursor {
            width: 20px;
            height: 20px;
            border: 2px solid #ff6b9d;
            border-radius: 50%;
            position: fixed;
            transform: translate(-50%, -50%);
            pointer-events: none;
            z-index: 9999;
            transition: all 0.1s ease;
            background: rgba(255, 107, 157, 0.2);
        }
        
        .cursor-dot {
            width: 4px;
            height: 4px;
            background: #ff6b9d;
            border-radius: 50%;
            position: fixed;
            transform: translate(-50%, -50%);
            pointer-events: none;
            z-index: 10000;
            transition: all 0.05s ease;
        }
        
        /* Glass Morphism */
        .glass {
            backdrop-filter: blur(20px);
            -webkit-backdrop-filter: blur(20px);
            background: rgba(255, 255, 255, 0.05);
            border: 1px solid rgba(255, 255, 255, 0.1);
            box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);
        }
        
        /* Premium Gradients */
        .gradient-luxury {
            background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
        }
        
        .gradient-rose {
            background: linear-gradient(135deg, #ff6b9d 0%, #c44569 50%, #f8b500 100%);
        }
        
        .gradient-purple {
            background: linear-gradient(135deg, #a8edea 0%, #fed6e3 100%);
        }
        
        .gradient-gold {
            background: linear-gradient(135deg, #d4af37 0%, #ffd700 50%, #ffed4a 100%);
        }
        
        /* 3D Effects */
        .card-3d {
            transform-style: preserve-3d;
            transition: all 0.5s cubic-bezier(0.23, 1, 0.320, 1);
        }
        
        .card-3d:hover {
            transform: rotateY(10deg) rotateX(10deg) scale(1.05);
            box-shadow: 0 25px 50px rgba(0, 0, 0, 0.2);
        }
        
        /* Floating Animations */
        .floating-slow {
            animation: floating 4s ease-in-out infinite;
        }
        
        .floating-medium {
            animation: floating 3s ease-in-out infinite;
            animation-delay: 1s;
        }
        
        .floating-fast {
            animation: floating 2s ease-in-out infinite;
            animation-delay: 0.5s;
        }
        
        @keyframes floating {
            0%, 100% { transform: translateY(0px) rotate(0deg); }
            25% { transform: translateY(-10px) rotate(1deg); }
            50% { transform: translateY(-20px) rotate(0deg); }
            75% { transform: translateY(-10px) rotate(-1deg); }
        }
        
        /* Premium Button Effects */
        .btn-premium {
            position: relative;
            overflow: hidden;
            background: linear-gradient(45deg, #ff6b9d, #c44569, #f8b500);
            background-size: 300% 300%;
            animation: gradientShift 2s ease infinite;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        }
        
        .btn-premium:hover {
            transform: translateY(-3px) scale(1.05);
            box-shadow: 0 20px 40px rgba(255, 107, 157, 0.4);
        }
        
        .btn-premium::before {
            content: '';
            position: absolute;
            top: 0;
            left: -100%;
            width: 100%;
            height: 100%;
            background: linear-gradient(90deg, transparent, rgba(255,255,255,0.4), transparent);
            transition: left 0.5s;
        }
        
        .btn-premium:hover::before {
            left: 100%;
        }
        
        @keyframes gradientShift {
            0% { background-position: 0% 50%; }
            50% { background-position: 100% 50%; }
            100% { background-position: 0% 50%; }
        }
        
        /* Shimmer Effect */
        .shimmer {
            background: linear-gradient(90deg, #f0f0f0 25%, #e0e0e0 50%, #f0f0f0 75%);
            background-size: 200% 100%;
            animation: shimmer 2s infinite;
        }
        
        @keyframes shimmer {
            0% { background-position: -200% 0; }
            100% { background-position: 200% 0; }
        }
        
        /* Particle Background */
        .particle {
            position: absolute;
            border-radius: 50%;
            pointer-events: none;
            opacity: 0.6;
            animation: particleFloat 10s infinite ease-in-out;
        }
        
        @keyframes particleFloat {
            0%, 100% { transform: translateY(0px) translateX(0px) scale(1); }
            33% { transform: translateY(-100px) translateX(50px) scale(1.1); }
            66% { transform: translateY(-50px) translateX(-30px) scale(0.9); }
        }
        
        /* Product Card Hover Effect */
        .product-card {
            position: relative;
            overflow: hidden;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        }
        
        .product-card:hover .product-overlay {
            opacity: 1;
            transform: translateY(0);
        }
        
        .product-overlay {
            position: absolute;
            bottom: 0;
            left: 0;
            right: 0;
            background: linear-gradient(transparent, rgba(0, 0, 0, 0.8));
            opacity: 0;
            transform: translateY(100%);
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
            padding: 20px;
        }
        .product-card:hover .product-overlay,
        .product-card:focus-within .product-overlay {
            color: #111827; /* text-gray-900 */
        }

        /* Mobile: show product actions (no hover on touch) */
        @media (max-width: 767px) {
            .product-overlay { opacity: 1; transform: translateY(0); }
        }
        
        /* Category Hover Effects */
        .category-card {
            position: relative;
            overflow: hidden;
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        }
        
        .category-card:hover {
            transform: scale(1.05);
            z-index: 10;
        }
        
        .category-card::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            background: linear-gradient(135deg, rgba(255, 107, 157, 0.1), rgba(196, 69, 105, 0.1));
            opacity: 0;
            transition: opacity 0.3s ease;
        }
        
        .category-card:hover::before {
            opacity: 1;
        }
        
        /* Testimonial Card */
        .testimonial-card {
            background: linear-gradient(135deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.05));
            backdrop-filter: blur(10px);
            border: 1px solid rgba(255, 255, 255, 0.2);
            transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        }
        
        .testimonial-card:hover {
            transform: translateY(-10px) scale(1.02);
            box-shadow: 0 25px 50px rgba(0, 0, 0, 0.15);
        }
        
        /* Loading Animation */
        .loading-dots {
            display: inline-flex;
            gap: 4px;
        }
        
        .loading-dot {
            width: 8px;
            height: 8px;
            border-radius: 50%;
            background: #ff6b9d;
            animation: loadingDots 1.4s ease-in-out infinite both;
        }
        
        .loading-dot:nth-child(1) { animation-delay: -0.32s; }
        .loading-dot:nth-child(2) { animation-delay: -0.16s; }
        
        @keyframes loadingDots {
            0%, 80%, 100% { transform: scale(0); opacity: 0.5; }
            40% { transform: scale(1); opacity: 1; }
        }
        
        /* Shopping Cart Animation */
        .cart-bounce {
            animation: cartBounce 0.6s cubic-bezier(0.68, -0.55, 0.265, 1.55);
        }
        
        @keyframes cartBounce {
            0% { transform: scale(1); }
            50% { transform: scale(1.3); }
            100% { transform: scale(1); }
        }
        
        /* Notification Toast */
        .toast {
            opacity: 0;
            transform: translateX(-16px);
            pointer-events: none;
            transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1), transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        }

        .toast.show {
            opacity: 1;
            transform: translateX(0);
            pointer-events: auto;
        }
        
        /* Price Strike Through */
        .price-old {
            position: relative;
        }
        
        .price-old::after {
            content: '';
            position: absolute;
            left: 0;
            top: 50%;
            width: 100%;
            height: 2px;
            background: #ff6b9d;
            transform: rotate(-5deg);
        }
        
        /* Search Bar Glow */
        .search-glow {
            box-shadow: 0 0 20px rgba(255, 107, 157, 0.3);
            transition: all 0.3s ease;
        }
        
        .search-glow:focus {
            box-shadow: 0 0 30px rgba(255, 107, 157, 0.5);
            transform: scale(1.02);
        }

        /* Touch devices: disable custom cursor */
        @media (pointer: coarse) {
            body { cursor: auto; }
            .custom-cursor, .cursor-dot { display: none; }
        }

        /* Mobile: soften heavy blur and shadows for performance */
        @media (max-width: 767px) {
            .glass {
                backdrop-filter: none;
                -webkit-backdrop-filter: none;
                background: rgba(255, 255, 255, 0.85);
                box-shadow: 0 4px 12px rgba(31, 38, 135, 0.15);
            }
            /* Keep animations on mobile but faster */
            .floating-slow { animation-duration: 3.2s; }
            .floating-medium { animation-duration: 2.4s; }
            .floating-fast { animation-duration: 1.6s; }
        }

        /* Respect reduced motion: disable animations/transitions */
        @media (prefers-reduced-motion: reduce) {
            * { animation: none !important; transition: none !important; }
        }
        
        /* Chips visibility helper */
        .chip-active { color: #ffffff !important; }

        /* Hide scrollbar for custom carousels */
        .no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }
        .no-scrollbar::-webkit-scrollbar { display: none; }

        /* Testimonial Pro Styles */
        .testi-card {
            position: relative;
            border-radius: 24px;
            background: rgba(255, 255, 255, 0.75);
            backdrop-filter: blur(12px);
            -webkit-backdrop-filter: blur(12px);
            border: 0;
            transform-style: preserve-3d;
            transition: transform 400ms cubic-bezier(0.23, 1, 0.32, 1), box-shadow 400ms ease, opacity 300ms ease;
            box-shadow: 0 10px 30px rgba(0,0,0,0.08);
            will-change: transform, box-shadow;
        }
        .testi-card::before { display: none; }
        .testi-card.is-active { transform: scale(1.02); box-shadow: 0 20px 48px rgba(0,0,0,0.14); }
        .testi-tilt { transform: rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); transform-style: preserve-3d; }
        .testi-quote { position:absolute; top: -8mm; left: -2mm; font-size: 34mm; opacity: 0.08; color: #ff6b9d; pointer-events: none; transform: translateZ(30px); }

        /* 3D stage and parallax layers */
        .testi-stage { perspective: 1100px; }
        .layer-1, .layer-2, .layer-3 { will-change: transform; transform-style: preserve-3d; }
        .layer-1 { --z: 28px; transform: translateZ(var(--z)) translate(var(--tx,0px), var(--ty,0px)); }
        .layer-2 { --z: 44px; transform: translateZ(var(--z)) translate(var(--tx,0px), var(--ty,0px)); }
        .layer-3 { --z: 64px; transform: translateZ(var(--z)) translate(var(--tx,0px), var(--ty,0px)); }
        .testi-glare { position:absolute; inset: -10% -20% auto auto; width: 60%; height: 100%; background: radial-gradient(120% 80% at 10% 10%, rgba(255,255,255,0.38), rgba(255,255,255,0.08) 40%, transparent 70%); mix-blend-mode: screen; pointer-events: none; transform: translateZ(80px) rotate(8deg); opacity: .28; }

        /* Drag scroll styles */
        #testiTrack { cursor: grab; }
        #testiTrack.dragging { cursor: grabbing; user-select: none; scroll-behavior: auto; }

        /* Category Pro Styles */
        .cat-card { position: relative; border-radius: 24px; background: rgba(255,255,255,0.8); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); transition: transform 360ms cubic-bezier(0.23,1,0.32,1), box-shadow 360ms ease; box-shadow: 0 10px 26px rgba(0,0,0,0.08); }
        .cat-card::before { content: ''; position: absolute; inset: 0; border-radius: 24px; padding: 1mm; background: conic-gradient(from 210deg, rgba(255,107,157,.35), rgba(248,181,0,.25), rgba(102,126,234,.3), rgba(255,107,157,.35)); -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0); -webkit-mask-composite: xor; mask-composite: exclude; pointer-events: none; opacity: .6; }
        .cat-card:hover { transform: translateY(-2mm) scale(1.02); box-shadow: 0 18px 48px rgba(0,0,0,0.14); }
        .cat-tilt { transform-style: preserve-3d; transform: rotateX(var(--cat-rx,0deg)) rotateY(var(--cat-ry,0deg)); }
        .cat-media { transform: translateZ(20px) scale(1); transition: transform 300ms ease; }
        .cat-card:hover .cat-media { transform: translateZ(26px) scale(1.04); }
        .cat-glare { position:absolute; inset: -10% -10% auto auto; width: 55%; height: 100%; background: radial-gradient(120% 80% at 10% 10%, rgba(255,255,255,0.35), rgba(255,255,255,0.1) 40%, transparent 70%); mix-blend-mode: screen; pointer-events:none; opacity:.22; transform: translateZ(40px) rotate(6deg); }

        /* Mobile fixes: ensure testimonials visible & simple layout */
        @media (max-width: 640px) {
            #testiTrack { padding-right: 4px; padding-left: 4px; min-height: 260px; }
            #testiTrack article { min-width: calc(100% - 24px) !important; }
        }
        @media (pointer: coarse) {
            .testi-tilt { transform: none !important; }
        }

        /* Hero Pro Styles */
        .hero-card { position: relative; border-radius: 28px; background: rgba(255,255,255,0.76); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); box-shadow: 0 24px 60px rgba(0,0,0,0.12); overflow: hidden; transform-style: preserve-3d; }
        .hero-card::before { content:''; position:absolute; inset:-2px; border-radius:30px; padding:2px; background: conic-gradient(from 210deg, #ff6b9d, #f8b500, #667eea, #ff6b9d); -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite: xor; mask-composite: exclude; pointer-events:none; opacity:.6; }
        .hero-glow { position:absolute; inset:-20% -10% auto auto; width:60%; height:120%; background: radial-gradient(100% 60% at 0% 0%, rgba(255,255,255,0.48), rgba(255,255,255,0.08) 40%, transparent 70%); mix-blend-mode: screen; transform: translateZ(60px) rotate(8deg); pointer-events:none; }
        .hero-media { position: relative; border-radius: 24px; background: linear-gradient(135deg,#ff6b9d 0%,#c44569 45%,#f8b500 100%); box-shadow: inset 0 0 0 1px rgba(255,255,255,0.2); }
        .hero-media .sheen { position:absolute; inset:0; background: linear-gradient(120deg, transparent 0%, rgba(255,255,255,0.35) 40%, transparent 60%); transform: translateX(-120%); animation: sheenMove 3.2s ease-in-out infinite; }
        @keyframes sheenMove { 0%{ transform: translateX(-120%);} 60%{ transform: translateX(120%);} 100%{ transform: translateX(120%);} }
        .chip-soft { display:inline-flex; align-items:center; gap:6px; padding:8px 12px; border-radius:9999px; background: rgba(0,0,0,0.04); color:#4b5563; font-weight:600; font-size:12px; }
        .hero-tilt { transform: perspective(1100px) rotateX(var(--hx,0deg)) rotateY(var(--hy,0deg)); will-change: transform; }
  