:root {
  --about-gradient-ink: #070b23;
  --about-gradient-blue: #00156c;
  --about-gradient-cobalt: #244cd8;
  --about-gradient-violet: #6741bb;
  --about-gradient-lavender: #9783ca;
  --about-gradient-ink-rgb: 7, 11, 35;
  --about-gradient-violet-rgb: 103, 65, 187;
  --about-gradient-lavender-rgb: 151, 131, 202;
  --about-gradient-dissolve: 2200ms;
  --about-gradient-return: 450ms;
  --about-gradient-easing: cubic-bezier(.45, 0, .55, 1);
}
.about-gradient {
  position: fixed;
  z-index: 1;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
  opacity: 0;
  background:
    linear-gradient(115deg, rgba(var(--about-gradient-ink-rgb), .30), transparent 68%),
    linear-gradient(27deg, transparent 32%, rgba(var(--about-gradient-violet-rgb), .62) 72%, rgba(var(--about-gradient-lavender-rgb), .28)),
    linear-gradient(132deg, var(--about-gradient-blue) 5%, var(--about-gradient-cobalt) 49%, var(--about-gradient-violet) 86%);
  transition: opacity var(--about-gradient-dissolve) var(--about-gradient-easing);
  contain: paint;
}
/* Work's static/reduced fallback follows the same localized edge-light treatment. */
body[data-video-destination="work"] .about-gradient {
  background:
    radial-gradient(ellipse 58% 70% at 112% 54%, rgba(var(--about-gradient-cobalt-rgb), .96) 0%, rgba(var(--about-gradient-violet-rgb), .72) 18%, rgba(var(--about-gradient-blue-rgb), .28) 38%, transparent 60%),
    radial-gradient(ellipse 55% 46% at -12% 108%, rgba(var(--about-gradient-lavender-rgb), .88) 0%, rgba(var(--about-gradient-violet-rgb), .66) 18%, rgba(var(--about-gradient-blue-rgb), .20) 38%, transparent 62%),
    var(--about-gradient-ink);
}
.about-gradient.is-visible,
html[data-video-intro="false"] body[data-video-detail]:not(.is-gradient-suppressed) .about-gradient { opacity: 1; }
body.is-gradient-suppressed .about-gradient { opacity: 0; }
.about-gradient.is-instant { transition: none; }
.about-gradient.is-returning { transition-duration: var(--about-gradient-return); }
.about-gradient__canvas { display: block; width: 100%; height: 100%; opacity: 0; transition: opacity 600ms ease; }
.about-gradient.is-rendered .about-gradient__canvas { opacity: 1; }
.about-gradient.is-warmed .about-gradient__canvas { transition: none; }
.about-gradient[data-renderer="css"] .about-gradient__canvas { opacity: 0; transition: none; }
@media (prefers-reduced-motion: reduce) {
  .about-gradient, .about-gradient__canvas { transition: none; }
}