/* WebLeadsAI V4.6 launch and colour polish */

:root {
  --wl-canvas: #050505;
  --wl-gold: 36 40% 75%;
}

html,
body,
#root,
#root main {
  background: var(--wl-canvas) !important;
}

/* The original compiled splash is intentionally retired. */
#root [class*="z-\[120\]"],
#root [class~="z-[120]"] {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

/* Keep the first painted frame identical to the settled page. */
#root main {
  animation: none !important;
}

#root main::before {
  background:
    radial-gradient(980px 480px at 13% 7%, hsl(31 78% 42% / 0.085), transparent 59%),
    radial-gradient(880px 520px at 86% 22%, hsl(204 64% 20% / 0.065), transparent 57%),
    radial-gradient(960px 560px at 52% 66%, hsl(28 55% 18% / 0.055), transparent 62%),
    linear-gradient(180deg, #070707 0%, var(--wl-canvas) 36%, #060606 100%) !important;
}

#root main::after {
  opacity: 0.14 !important;
}

/* Hero-to-content handoff: one restrained glow, no visible colour band. */
#home {
  position: relative;
  overflow: hidden;
  padding-bottom: clamp(3.5rem, 5vw, 5.25rem) !important;
}

#home::after {
  content: "";
  position: absolute;
  inset: auto 0 -1px;
  height: clamp(6rem, 10vw, 10rem);
  z-index: 0;
  pointer-events: none;
  background:
    radial-gradient(680px 180px at 50% 25%, hsl(var(--wl-gold) / 0.04), transparent 72%),
    linear-gradient(180deg, transparent, hsl(0 0% 5% / 0.76) 68%, var(--wl-canvas));
}

#home > .container {
  position: relative;
  z-index: 1;
}

#webleads-final-animation.wlf-motion,
.wlf-motion {
  margin-top: -1px !important;
  padding-top: clamp(3rem, 5vw, 5rem) !important;
  padding-bottom: clamp(5rem, 8vw, 8rem) !important;
}

.wlf-motion__kicker {
  display: none !important;
}

.wlf-motion h2 {
  margin-top: 0 !important;
}

/* Two verified-domain portfolio projects; keep the grid balanced. */
.wlp-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.wlp-card {
  transform: translateZ(0);
  backface-visibility: hidden;
}

.wlp-card:hover {
  transform: translate3d(0, -2px, 0);
}

@media (max-width: 720px) {
  .wlp-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  #home {
    padding-bottom: 3rem !important;
  }

  #webleads-final-animation.wlf-motion,
  .wlf-motion {
    padding-top: 3rem !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
}