.mouse-light { position: fixed; top: 0; left: 0; width: 400px; height: 400px; background: radial-gradient(circle, rgba(255, 255, 255, 0.05), transparent 70%); border-radius: 50%; transform: translate(-50%, -50%); pointer-events: none; z-index: -10; }
.background-shapes { position: fixed; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; z-index: -11; }
.shape { position: absolute; border-radius: 20%; background: rgba(255, 255, 255, 0.03); backdrop-filter: blur(5px); }
.shape-1 { width: 200px; height: 200px; top: 10%; left: 15%; animation: float 25s infinite ease-in-out; }
.shape-2 { width: 150px; height: 150px; top: 60%; left: 80%; animation: float 35s infinite ease-in-out reverse; }
@keyframes float { 0% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(-50px) rotate(180deg); } 100% { transform: translateY(0) rotate(360deg); } }

.product-card::before, .product-card::after { content: ''; position: absolute; left: -2px; top: -2px; background: linear-gradient(115deg, transparent 30%, rgba(112, 109, 109, 0.219), transparent 70%); background-size: 300% 300%; width: calc(100% + 4px); height: calc(100% + 4px); z-index: -1; border-radius: var(--border-radius); animation: neon-glow 8s linear infinite; opacity: 0; transition: opacity 0.4s ease-in-out; }
.product-card:hover::before, .product-card:hover::after { opacity: 1; }
.product-card::after { filter: blur(20px); }
@keyframes neon-glow { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } }

.reveal { opacity: 0; transform: translateY(30px); transition: opacity 0.8s ease, transform 0.8s ease; }
.reveal.visible { opacity: 1; transform: translateY(0); }

.char { display: inline-block; opacity: 0; transform: translateY(30px); transition: transform 0.6s cubic-bezier(0.2, 1, 0.3, 1), opacity 0.6s cubic-bezier(0.2, 1, 0.3, 1); transition-delay: var(--char-index) * 50ms; }
.reveal.visible .char { opacity: 1; transform: translateY(0); }

.fade-in { animation: page-fade-in 0.5s ease forwards; }
@keyframes page-fade-in { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }