html,
body {
  min-height: 100%;
  background:
    radial-gradient(circle at 12% 8%, rgba(16, 185, 129, 0.16), transparent 30%),
    radial-gradient(circle at 86% 14%, rgba(6, 182, 212, 0.18), transparent 28%),
    radial-gradient(circle at 52% 0%, rgba(59, 130, 246, 0.1), transparent 32%),
    linear-gradient(135deg, #ffffff 0%, #fcfdfe 44%, #ecfeff 100%) !important;
  background-attachment: fixed !important;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(120deg, rgba(16, 185, 129, 0.08), transparent 42%),
    radial-gradient(circle at 78% 82%, rgba(6, 182, 212, 0.12), transparent 28%);
}

header[class*="fixed"] > div > div,
.site-header .nav-shell,
.site-header .header-inner {
  border-color: rgba(255, 255, 255, 0.78) !important;
  background:
    linear-gradient(135deg, rgba(255, 255, 255, 0.94), rgba(248, 250, 252, 0.82)) !important;
  box-shadow: 0 20px 60px -32px rgba(15, 23, 42, 0.25) !important;
  backdrop-filter: blur(18px) !important;
}

header nav > div[class*="relative"] > div[class*="absolute"] {
  left: 50% !important;
  right: auto !important;
  top: 100% !important;
  transform: translateX(-50%) translateY(-8px) !important;
}

header nav > div[class*="relative"]:hover > div[class*="absolute"],
header nav > div[class*="relative"]:focus-within > div[class*="absolute"] {
  opacity: 1 !important;
  transform: translateX(-50%) translateY(0) !important;
  pointer-events: auto !important;
}

header nav > div[class*="relative"]:hover > button svg,
header nav > div[class*="relative"]:focus-within > button svg {
  transform: rotate(180deg) !important;
}

main,
section {
  background-color: transparent !important;
}

[class*="bg-white"],
[class*="bg-slate-50"],
[class*="bg-slate-100"] {
  background-color: rgba(255, 255, 255, 0.88) !important;
}

[class*="bg-slate-900"],
[class*="bg-slate-950"] {
  background:
    radial-gradient(circle at 12% 12%, rgba(16, 185, 129, 0.18), transparent 28%),
    linear-gradient(135deg, #020617, #0f172a) !important;
}

[class*="shadow"],
.card,
.image-card,
.hero-media {
  box-shadow: 0 24px 70px rgba(43, 93, 165, 0.16) !important;
}

[class*="text-green"],
[class*="text-emerald"] {
  color: #00a884 !important;
}

[class*="bg-green"],
[class*="bg-emerald"] {
  background-color: rgba(0, 184, 148, 0.14) !important;
}

[class*="hover:bg-slate"]:hover,
[class*="hover:bg-cyan"]:hover,
[class*="hover:bg-emerald"]:hover {
  background-color: rgba(6, 182, 212, 0.1) !important;
}

a[href*="get-started"],
button[class*="bg-slate-950"],
button[class*="bg-blue"],
.btn {
  border-color: transparent !important;
  background: #020617 !important;
  color: #ffffff !important;
  box-shadow: 0 16px 32px rgba(15, 23, 42, 0.22) !important;
}

footer,
.site-footer {
  background:
    radial-gradient(circle at 15% 0%, rgba(0, 184, 148, 0.18), transparent 30%),
    #0f172a !important;
}
