::selection {
  background: #0a0a0a;
  color: #f5f5f3;
}

/* Nav dynamic scroll states */
nav {
  background: transparent;
  border-bottom-color: rgba(255, 255, 255, 0.06);
  transition:
    background-color 0.4s ease,
    border-color 0.4s ease;
}
nav.scrolled {
  background: rgba(245, 245, 243, 0.92);
  border-bottom-color: rgba(0, 0, 0, 0.06);
}
.nav-logo {
  filter: brightness(0) invert(1);
  transition: filter 0.4s ease;
}
nav.scrolled .nav-logo {
  filter: none;
}
.nav-cta {
  background: #f5f5f3;
  color: #0a0a0a;
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease,
    background-color 0.4s ease,
    color 0.4s ease;
}
nav.scrolled .nav-cta {
  background: #0a0a0a;
  color: #f5f5f3;
}

/* Hero background overlay */
.hero-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at center, transparent 30%, #0a0a0a 80%),
    linear-gradient(to bottom, transparent 50%, #0a0a0a 100%);
}

/* CTA radial glow */
.cta-inner::before {
  content: "";
  position: absolute;
  top: -50%;
  left: 50%;
  transform: translateX(-50%);
  width: 600px;
  height: 600px;
  background: radial-gradient(
    circle,
    rgba(255, 255, 255, 0.04) 0%,
    transparent 70%
  );
  pointer-events: none;
}

/* Scroll reveals */
.reveal {
  opacity: 0;
  transform: translateY(32px);
  transition:
    opacity 0.8s ease,
    transform 0.8s ease,
    color 0.4s ease,
    background-color 0.4s ease;
}
.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}
.reveal-delay-1 {
  transition-delay: 0.1s;
}
.reveal-delay-2 {
  transition-delay: 0.2s;
}
.reveal-delay-3 {
  transition-delay: 0.3s;
}