/* Motion language for the overview hero. */
.overview-hero-block::before {
  position: absolute;
  z-index: 0;
  top: -28%;
  right: -13%;
  width: min(68vw, 860px);
  aspect-ratio: 1;
  border: 1px solid rgba(76, 208, 244, .18);
  border-radius: 50%;
  content: "";
  pointer-events: none;
  background:
    conic-gradient(from 8deg, transparent 0 63%, rgba(47, 204, 248, .15) 68%, transparent 75% 100%),
    repeating-radial-gradient(circle, transparent 0 52px, rgba(83, 202, 235, .07) 53px 54px, transparent 55px 106px),
    radial-gradient(circle at 50% 50%, rgba(12, 108, 150, .12), transparent 69%);
  box-shadow: 0 0 0 36px rgba(57, 197, 234, .018), 0 0 0 92px rgba(57, 197, 234, .012), inset 0 0 80px rgba(57, 197, 234, .055);
  mask-image: radial-gradient(circle, #000 0 69%, transparent 70%);
  animation: hero-reactor-orbit 30s linear infinite;
}
.overview-hero-block .eng-pillar-card {
  position: relative;
  overflow: hidden;
  transform: translateZ(0);
  transition: transform .48s cubic-bezier(.2,.75,.2,1), border-color .35s ease, box-shadow .45s ease;
}
.overview-hero-block .eng-pillar-card::after {
  position: absolute;
  inset: -120% auto -120% -38%;
  width: 32%;
  content: "";
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(108, 226, 255, .16), transparent);
  transform: rotate(24deg) translateX(-220%);
  transition: transform .8s cubic-bezier(.2,.75,.2,1);
}
.overview-hero-block .eng-pillar-card:hover {
  z-index: 2;
  transform: translateY(-7px);
  border-color: rgba(91, 214, 246, .48);
  box-shadow: 0 24px 60px rgba(0, 0, 0, .23), 0 0 30px rgba(31, 183, 226, .11);
}
.overview-hero-block .eng-pillar-card:hover::after { transform: rotate(24deg) translateX(620%); }

.motion-carousel-section {
  margin-top: 0;
  padding-top: clamp(32px, 4svh, 56px);
}

@keyframes hero-reactor-orbit { to { transform: rotate(1turn); } }

@media (max-width: 900px) {
  .overview-hero-block::before { top: -8%; right: -35%; width: min(92vw, 760px); }
}
@media (max-width: 700px) {
  .overview-hero-block::before { top: 5%; right: -52%; width: 110vw; opacity: .7; }
  .overview-hero-block .eng-pillar-card:hover { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .overview-hero-block::before,
  .overview-hero-block .eng-pillar-card::after,
  .motion-carousel-section::before { animation: none !important; }
  .overview-hero-block .eng-pillar-card { transition: none !important; }
  .overview-hero-block .eng-pillar-card:hover { transform: none; }
}