.bg-gradient-brand {
  background: linear-gradient(135deg, var(--color-brand-primary) 0%, var(--color-brand-accent) 100%);
}


.bg-purple {
  background-color: var(--color-purple);
}

.bg-purple.text-white {
  color: var(--color-text-inverse);
}


.parallax-layer {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: auto;
}

.parallax-layer-1 {
  background: radial-gradient(1200px 300px at 20% -200px, rgba(var(--color-white-rgb), 0.18), rgba(var(--color-white-rgb), 0));
}

.parallax-layer-2 {
  background: radial-gradient(900px 240px at 80% -180px, rgba(var(--color-white-rgb), 0.12), rgba(var(--color-white-rgb), 0));
  mix-blend-mode: screen;
}

.navbar .dropdown-menu {
  z-index: var(--z-dropdown);
}