@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;600;800&family=Fira+Code:wght@400;500&display=swap');

body { background-color: #000000; color: #ffffff; font-family: 'Outfit', sans-serif; overflow-x: hidden; scroll-behavior: smooth; }
.font-mono { font-family: 'Fira Code', monospace; }
.bg-grid { background-size: 40px 40px; background-image: linear-gradient(to right, rgba(255, 255, 255, 0.03) 1px, transparent 1px), linear-gradient(to bottom, rgba(255, 255, 255, 0.03) 1px, transparent 1px); mask-image: radial-gradient(circle at top center, black, transparent 80%); -webkit-mask-image: radial-gradient(circle at top center, black, transparent 80%); }

.hamburger-line { transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); transform-origin: center; }
.menu-open .line-1 { transform: translateY(6px) rotate(45deg); background-color: #ffffff; }
.menu-open .line-2 { opacity: 0; transform: scale(0); }
.menu-open .line-3 { transform: translateY(-6px) rotate(-45deg); background-color: #ffffff; }

.toggle-checkbox:checked + .toggle-label { background-color: #3b82f6; }
.cursor-blink { animation: blink 1s step-end infinite; }
@keyframes blink { 50% { opacity: 0; } }

.ping-dot { box-shadow: 0 0 10px 2px rgba(59, 130, 246, 0.5); }
.spec-item { transition: background 0.3s ease, border-color 0.3s ease; }
.plan-card:hover .spec-item { background: rgba(255,255,255,0.03); border-color: rgba(255,255,255,0.1); }
.mc-list-item { transition: transform 0.3s ease, color 0.3s ease; }
.plan-card:hover .mc-list-item { transform: translateX(5px); color: #ffffff; }

.page-enter { animation: fadeIn 0.4s ease-out forwards; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
.fade-in { animation: smoothFade 0.3s ease-in forwards; }
@keyframes smoothFade { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }

@keyframes cartBounce { 0%, 100% { transform: translateY(0) scale(1); } 50% { transform: translateY(-4px) scale(1.2); } }
.animate-cart-bounce { animation: cartBounce 0.4s ease-in-out; }

/* PREMIUM SLIDE TO CLEAR CART */
#clear-slider::-webkit-slider-thumb {
    -webkit-appearance: none; appearance: none; width: 48px; height: 48px;
    background: #ffffff; border-radius: 10px; cursor: pointer;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="%23000000" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="9" cy="21" r="1"></circle><circle cx="20" cy="21" r="1"></circle><path d="M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6"></path></svg>');
    background-repeat: no-repeat; background-position: center;
    box-shadow: 0 0 10px rgba(0,0,0,0.3);
    transition: transform 0.1s;
}
#clear-slider::-webkit-slider-thumb:active { transform: scale(0.95); }
.custom-scrollbar::-webkit-scrollbar { width: 4px; }
.custom-scrollbar::-webkit-scrollbar-track { background: transparent; }
.custom-scrollbar::-webkit-scrollbar-thumb { background: #333; border-radius: 4px; }