/* Base Overrides */
html {
 scroll-behavior: smooth;
}

body {
 background-color: #050505;
 color: #ffffff;
 font-family: 'Inter', sans-serif;
 overflow-x: hidden;
}

h1, h2, h3, h4, h5, h6, .font-display {
 font-family: 'Space Grotesk', sans-serif;
}

/* Scrollbar Customization */
::-webkit-scrollbar {
 width: 8px;
}
::-webkit-scrollbar-track {
 background: #050505;
}
::-webkit-scrollbar-thumb {
 background: #1f1f22;
 border-radius: 4px;
}
::-webkit-scrollbar-thumb:hover {
 background: #E63B2E;
}

/* Utility Classes */
.noise-overlay {
 position: fixed;
 top: 0;
 left: 0;
 width: 100vw;
 height: 100vh;
 pointer-events: none;
 z-index: 9999;
 opacity: 0.04;
 background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E");
}

.text-gradient {
 background: linear-gradient(135deg, #ffffff 0%, #a1a1aa 100%);
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;
 background-clip: text;
}

.text-gradient-accent {
 background: linear-gradient(135deg, #ff5f53 0%, #E63B2E 100%);
 -webkit-background-clip: text;
 -webkit-text-fill-color: transparent;
 background-clip: text;
}

.glass-panel {
 background: rgba(13, 13, 18, 0.6);
 backdrop-filter: blur(16px);
 -webkit-backdrop-filter: blur(16px);
 border: 1px solid rgba(255, 255, 255, 0.05);
}

.glass-panel-hover:hover {
 background: rgba(255, 255, 255, 0.03);
 border: 1px solid rgba(255, 255, 255, 0.1);
}

/* Animations */
.magnetic-btn {
 transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.magnetic-btn:hover {
 transform: scale(1.03) translateY(-1px);
}

/* Link Hover */
.link-hover {
 position: relative;
 display: inline-block;
}
.link-hover::after {
 content: '';
 position: absolute;
 width: 100%;
 transform: scaleX(0);
 height: 1px;
 bottom: -2px;
 left: 0;
 background-color: #E63B2E;
 transform-origin: bottom right;
 transition: transform 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.link-hover:hover::after {
 transform: scaleX(1);
 transform-origin: bottom left;
}

/* Hide scrollbar for carousel but keep functionality */
.no-scrollbar::-webkit-scrollbar {
 display: none;
}
.no-scrollbar {
 -ms-overflow-style: none; /* IE and Edge */
 scrollbar-width: none; /* Firefox */
}

/* Dot animation */
@keyframes pulse-dot {
 0% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(34, 197, 94, 0.7); }
 70% { transform: scale(1); box-shadow: 0 0 0 6px rgba(34, 197, 94, 0); }
 100% { transform: scale(0.95); box-shadow: 0 0 0 0 rgba(34, 197, 94, 0); }
}
.status-dot {
 animation: pulse-dot 2s infinite;
}

.reveal-text {
 clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
}

.hero-bg {
 background: radial-gradient(circle at 50% 50%, rgba(230, 59, 46, 0.08) 0%, rgba(5, 5, 5, 1) 60%);
}

/* Apple Premium Card Hover Effect */
.hardware-card {
 position: relative;
 overflow: hidden;
}
.hardware-card .card-img-bg {
 position: absolute;
 inset: 0;
 width: 100%;
 height: 100%;
 object-fit: cover;
 transition: transform 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.4s ease;
 z-index: 0;
 opacity: 0.82;
}
.hardware-card:hover .card-img-bg {
 transform: scale(1.06);
 opacity: 1;
}
.hardware-card .card-overlay {
 position: absolute;
 inset: 0;
 background: linear-gradient(to top, rgba(5,5,5,0.96) 0%, rgba(5,5,5,0.6) 38%, rgba(5,5,5,0.12) 65%, transparent 100%);
 z-index: 1;
}
.hardware-card-content {
 position: relative;
 z-index: 2;
 display: flex;
 flex-direction: column;
 justify-content: flex-end;
 height: 100%;
}

/* Navbar on scroll */
#navbar.navbar-scrolled {
 background: rgba(5, 5, 5, 0.85);
 backdrop-filter: blur(24px);
 -webkit-backdrop-filter: blur(24px);
 border: 1px solid rgba(255, 255, 255, 0.06);
 box-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);
}

/* Active drag cursor for carousels */
.active-drag {
 cursor: grabbing !important;
 user-select: none;
}