/* Broad sheets of light: the gradients stay rasterized while their layers drift. */
.launch-hero::before {
  background:linear-gradient(110deg,#02272e 4%,#03353f 48%,#005763);
}
.hero-atmosphere {
  position:absolute;
  inset:0;
  z-index:-1;
  overflow:hidden;
  pointer-events:none;
  contain:paint;
}
.hero-atmosphere::after {
  content:'';
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,#01232b70,transparent 64%),linear-gradient(0deg,#032e3644,transparent 35%);
}
.ambient-light {
  position:absolute;
  inset:-16%;
  transform-origin:55% 50%;
  animation-play-state:paused;
}
.ambient-light--tide {
  opacity:.65;
  background:radial-gradient(ellipse 54% 36% at 25% 29%,#087cb47a, #087cb420 54%,transparent 79%),radial-gradient(ellipse 66% 47% at 78% 77%,#009ca8a3,#009ca830 56%,transparent 78%);
  transform:translate3d(-3%,-2%,0) rotate(-7deg) scale(1.04);
  animation:ambient-tide 28s cubic-bezier(.45,0,.55,1) -7s infinite alternate paused;
}
.ambient-light--silk {
  opacity:.45;
  background:linear-gradient(125deg,transparent 23%,#4ac4dc00 32%,#409fbc30 40%,#85d9e344 47%,#11a0af29 55%,transparent 65%);
  transform:translate3d(2%,1%,0) rotate(4deg) scale(1.03);
  animation:ambient-silk 36s cubic-bezier(.45,0,.55,1) -17s infinite alternate paused;
}
.ambient-is-running .ambient-light { animation-play-state:running; }
.hero-lens {
  position:absolute;
  border-radius:47% 53% 60% 40% / 55% 42% 58% 45%;
  background:radial-gradient(ellipse at 45% 47%,#087bbbba 8%,#097fb879 32%,#04779b3b 52%,transparent 73%);
  filter:blur(13px);
  opacity:0;
  animation:hero-lens-flow var(--lens-duration) cubic-bezier(.45,0,.55,1) var(--lens-delay) infinite both paused;
}
.hero-lens--edge { left:-7%; top:15%; width:20%; height:29%; --lens-duration:12s; --lens-delay:-3.9s; --lens-tilt:-23deg; --lens-x:7%; --lens-y:5%; }
.hero-lens--high { left:31%; top:0; width:18%; height:19%; --lens-duration:14s; --lens-delay:-5.9s; --lens-tilt:28deg; --lens-x:-6%; --lens-y:8%; }
.hero-lens--low { left:0; top:65%; width:16%; height:21%; --lens-duration:13s; --lens-delay:-4.8s; --lens-tilt:-30deg; --lens-x:6%; --lens-y:-5%; }
.hero-lens--bridge { left:35%; top:49%; width:21%; height:23%; --lens-duration:16s; --lens-delay:-5.1s; --lens-tilt:38deg; --lens-x:-5%; --lens-y:6%; }
.ambient-is-running .hero-lens { animation-play-state:running; }
@keyframes hero-lens-flow {
  0%,100% { opacity:0; transform:translate3d(0,0,0) rotate(var(--lens-tilt)) scale(.96); }
  32% { opacity:.8; transform:translate3d(var(--lens-x),var(--lens-y),0) rotate(var(--lens-tilt)) scale(1.04); }
  52% { opacity:.6; }
  85% { opacity:0; transform:translate3d(calc(var(--lens-x) * -.5),var(--lens-y),0) rotate(var(--lens-tilt)) scale(1.09); }
}
@keyframes ambient-tide {
  from { transform:translate3d(-3%,-2%,0) rotate(-7deg) scale(1.04); }
  to { transform:translate3d(5%,4%,0) rotate(5deg) scale(1.12); }
}
@keyframes ambient-silk {
  from { transform:translate3d(2%,1%,0) rotate(4deg) scale(1.03); }
  to { transform:translate3d(-6%,-3%,0) rotate(-9deg) scale(1.12); }
}
.hero-footnote { align-items:center; color:#d2e6e7; }
.hero-footnote-end { display:flex; align-items:center; gap:26px; }
.ambient-toggle {
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:36px;
  margin:-8px 0;
  padding:8px 0;
  border:0;
  background:none;
  color:inherit;
  font:inherit;
}
.ambient-toggle:hover { color:var(--paper); }
.ambient-toggle svg { width:12px; height:12px; fill:currentColor; }
.ambient-toggle .ambient-play { display:none; }
.ambient-toggle[aria-pressed="true"] .ambient-pause { display:none; }
.ambient-toggle[aria-pressed="true"] .ambient-play { display:block; }
@media(max-width:700px) {
  .ambient-light { inset:-10%; }
  .ambient-light--tide { opacity:.5; }
  .ambient-light--silk { opacity:.35; }
  .hero-lens { filter:blur(9px); }
  .hero-lens--edge { left:-22%; top:2%; width:78%; height:260px; }
  .hero-lens--high { left:44%; top:30%; width:66%; height:220px; }
  .hero-lens--low { left:8%; top:78%; width:75%; height:200px; }
  .hero-lens--bridge { left:-10%; top:47%; width:70%; height:260px; }
  .hero-footnote { align-items:flex-start; }
  .hero-footnote-end { flex-direction:column; align-items:flex-end; gap:12px; text-align:right; }
}
@media(prefers-reduced-motion:reduce) {
  .ambient-light { animation:none; }
  .hero-lens { animation:none; opacity:.25; }
  .ambient-toggle { display:none; }
}
