/* About only. A fixed landscape, one scroll-bound energy stream, no orbit motion. */
.about-page .about-main::before {
  background: var(--story-sky, linear-gradient(#f8faff 24%, #e8f0fc 38%, #6084a9 58%, #15334f 78%, #031320 90%));
}
.about-page .about-main::after { opacity:.35; }
.about-page .about-story { z-index:2; }
.about-page .story-energy-ready .story-timeline::before,
.about-page .story-energy-ready .story-timeline::after { display:none; }
.about-page .story-energy {
  --energy-progress:0;
  position:absolute;
  z-index:1;
  width:3px;
  margin-left:-1.5px;
  border-radius:4px;
  background:#74a3d44d;
  pointer-events:none;
}
.about-page .story-energy-fill {
  position:absolute;
  inset:0;
  border-radius:inherit;
  transform:scaleY(var(--energy-progress));
  transform-origin:top;
  background:linear-gradient(180deg,#246ef4,#60b9ff 35%,#c8efff 63%,#318eff);
  box-shadow:0 0 9px #378aff77,0 0 22px #51aaff33;
  will-change:transform;
}
.about-page .story-energy-fill::after {
  content:"";
  position:absolute;
  inset:0;
  background:repeating-linear-gradient(180deg,transparent 0 90px,#e9faff 110px,transparent 140px);
  background-size:100% 140px;
  opacity:.7;
  animation:story-energy-flow 2.2s linear infinite;
  animation-play-state:paused;
}
.about-page .story-energy-tip {
  position:absolute;
  top:-5px;
  left:-3.5px;
  width:10px;
  height:10px;
  border-radius:50%;
  background:#edfaff;
  box-shadow:0 0 10px 3px #73c6ff,0 0 28px 6px #318cff66;
  transform:translateY(var(--energy-tip-y,0px));
  opacity:0;
}
.about-page .story-energy.is-started .story-energy-tip { opacity:1; }
.about-page .story-motion-visible .story-energy-fill::after { animation-play-state:running; }
.about-page .story-step:nth-child(n) .story-node {
  width:70px;
  height:70px;
  border-radius:22px;
  border:1px solid var(--step-ring,#abc6e4);
  background:var(--step-disc,#f5f9ff);
  color:var(--step-icon,#315c9f);
  box-shadow:0 5px 20px #17365112,inset 0 1px #ffffff42;
  opacity:1;
  transform:none;
  transition:border-color .18s,background-color .18s,box-shadow .18s;
}
.about-page .story-step:nth-child(n) .story-node::before {
  inset:5px;
  border-radius:17px;
  border-color:#78a5d326;
}
.about-page .story-node svg {
  width:30px;
  height:30px;
  overflow:visible;
  transform-origin:center;
}
.about-page .story-step:nth-child(n).is-energized .story-node {
  border-color:#6eafff;
  box-shadow:0 0 0 4px #73b2ff10,0 6px 25px #0d386b22,inset 0 1px #ffffff60;
}
.about-page .story-step.is-energized .story-icon-detail { color:#56a7ff; }
.about-page .story-step:nth-child(n).is-crossing .story-node {
  border-color:#9dd8ff;
  box-shadow:0 0 0 5px #56aaff20,0 0 25px #4aa3ff54,inset 0 0 16px #66b8ff20;
}
.about-page .story-step:nth-child(n) .story-copy {
  opacity:1;
  transform:none;
}
.about-page .story-step:nth-child(n) .story-copy h3 { color:var(--step-ink,#10213b); }
.about-page .story-step:nth-child(n) .story-copy p { color:var(--step-muted,#263b55); }
.about-page .about-earth {
  margin-top:-28px;
  opacity:1;
  transform:none;
  will-change:auto;
}
.about-page .about-earth::after {
  content:"";
  position:absolute;
  z-index:1;
  inset:0;
  pointer-events:none;
  background:radial-gradient(ellipse 27% 10% at var(--energy-impact-x,50%) var(--energy-impact-y,17%),#5abfff44,transparent 85%);
  opacity:0;
  transition:opacity .2s;
}
.about-page .about-earth.is-connected::after { opacity:1; }
.about-page .earth-fallback {
  top:17%;
  left:-54%;
  width:208%;
  background-image:linear-gradient(#2279b144,#03142566),url("/assets/img/about/earth-night-4096-1bd5f0affdfef5b4.webp");
  background-repeat:no-repeat;
  background-position:0 0,50% -12vw;
  background-size:100% 100%,100% 50%;
  transform:none;
}
.about-page .story-side-particles,
.about-page .story-earth-connector { display:none; }
@keyframes story-energy-flow { to { background-position:0 140px; } }
@media(max-width:760px) {
  .about-page .story-step:nth-child(n) .story-node { width:58px; height:58px; border-radius:18px; }
  .about-page .story-step:nth-child(n) .story-node::before { border-radius:13px; }
  .about-page .story-node svg { width:26px; height:26px; }
  .about-page .earth-fallback {
    background-image:linear-gradient(#2279b144,#03142566),url("/assets/img/about/earth-night-2048-7196a71c8adc5878.webp");
  }
}
@media(prefers-reduced-motion:reduce) {
  .about-page .story-energy-fill { will-change:auto; }
  .about-page .story-energy-fill::after { animation:none; }
  .about-page .story-step:nth-child(n) .story-node,
  .about-page .about-earth::after { transition:none; }
}