.intro.has-about-bridge { min-height: 600vh; }
.has-about-bridge .intro-scroll-stage { overflow: hidden; min-height: 100vh; }
.about-bridge-slot { position: relative; margin-top: -100vh; z-index: 9; }
.about.about-bridge { background: transparent; isolation: isolate; }
.about-bridge::before {
  content: ""; position: absolute; inset: 0;
  background:
    radial-gradient(ellipse 53vw 66vh at 58.4% 48.9%, rgba(0,87,51,.24) 0%, rgba(0,87,51,.17) 30%, rgba(0,87,51,.08) 56%, rgba(0,87,51,0) 100%),
    #161616;
  opacity: var(--bridge-background, 1); z-index: -1; pointer-events: none;
}
.about-bridge.is-bridge-fixed { position: fixed; top: 0; left: 0; width: 100%; }
.about-bridge.is-bridge-hidden { visibility: hidden; pointer-events: none; }
.about-bridge .about-copy, .about-bridge .portrait, .about-bridge .metrics {
  opacity: var(--bridge-content, 1);
  transform: translateY(calc((1 - var(--bridge-content, 1)) * 36px));
}
.about-bridge.is-bridge-fixed .about-accent { opacity: 1; }
.about-bridge .about-accent { top: 540px; right: 6vw; width: min(26.4vw, 408px); }
@media(max-width:800px) {
  .intro.has-about-bridge { min-height: 560vh; }
  .about-bridge .about-accent { top: 430px; width: 264px; right: -20px; }
}