html {
  background-color: #09090b !important;
}

body, #__next {
  background-color: transparent !important;
  background-image:
    radial-gradient(ellipse 80% 50% at 50% 0%, rgba(99,102,241,0.07) 0%, transparent 60%),
    radial-gradient(ellipse 50% 40% at 80% 100%, rgba(56,189,248,0.04) 0%, transparent 50%) !important;
  background-attachment: fixed !important;
  min-height: 100vh !important;
}

body::before {
  content: '';
  position: fixed;
  top: 0; left: 0;
  width: 100vw; height: 100vh;
  pointer-events: none;
  z-index: -1;
  background:
    radial-gradient(circle 300px at 10% 20%, rgba(99,102,241,0.05) 0%, transparent 100%),
    radial-gradient(circle 200px at 80% 25%, rgba(56,189,248,0.04) 0%, transparent 100%),
    radial-gradient(circle 250px at 65% 65%, rgba(139,92,246,0.04) 0%, transparent 100%),
    radial-gradient(circle 180px at 20% 75%, rgba(99,102,241,0.04) 0%, transparent 100%),
    radial-gradient(circle 220px at 85% 80%, rgba(56,189,248,0.03) 0%, transparent 100%),
    radial-gradient(circle 160px at 45% 50%, rgba(168,85,247,0.03) 0%, transparent 100%);
  animation: drift 25s ease-in-out infinite alternate;
}

@keyframes drift {
  0% { transform: translate(0, 0) scale(1); }
  50% { transform: translate(-15px, 10px) scale(1.02); }
  100% { transform: translate(10px, -10px) scale(0.98); }
}

.service-card {
  background: rgba(255,255,255,0.03) !important;
  border: 1px solid rgba(255,255,255,0.06) !important;
  border-radius: 12px !important;
}

.service-card:hover {
  background: rgba(255,255,255,0.06) !important;
  border-color: rgba(255,255,255,0.1) !important;
}

.widget-card {
  background: rgba(255,255,255,0.03) !important;
  border: 1px solid rgba(255,255,255,0.06) !important;
  border-radius: 12px !important;
}

#search {
  border-radius: 10px !important;
  border: 1px solid rgba(255,255,255,0.08) !important;
  background: rgba(255,255,255,0.04) !important;
}

#search:focus {
  border-color: rgba(99,102,241,0.35) !important;
  background: rgba(255,255,255,0.06) !important;
}

header {
  backdrop-filter: blur(12px) saturate(1.1) !important;
  background: rgba(9,9,11,0.75) !important;
  border-bottom: 1px solid rgba(255,255,255,0.05) !important;
}

::-webkit-scrollbar { width: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.08); border-radius: 3px; }

::selection { background: rgba(99,102,241,0.25); color: #fff; }
