/* Expressive corridor motion, scoped to request item 1. */
.motion-corridor-v2 .corridor-section {
  overflow: clip;
}

.motion-corridor-v2 .corridor-section > .container {
  position: relative;
  z-index: 3;
}

.motion-corridor-v2 .motion-corridor-network {
  position: absolute;
  inset: 2% -8% 0;
  z-index: 1;
  opacity: 0;
  pointer-events: none;
  transform-origin: 50% 50%;
  mask-image: linear-gradient(
    180deg,
    transparent 0%,
    #000 14%,
    #000 85%,
    transparent 100%
  );
}

.motion-corridor-v2 .motion-corridor-network::before {
  position: absolute;
  inset: 14% 8%;
  border-radius: 50%;
  background: radial-gradient(circle, rgb(92 132 164 / 0.1), transparent 62%);
  content: "";
  filter: blur(18px);
}

.motion-corridor-v2 .motion-corridor-network svg {
  width: 100%;
  height: 100%;
  overflow: visible;
}

.motion-corridor-v2 .motion-network-base,
.motion-corridor-v2 .motion-network-route {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.motion-corridor-v2 .motion-network-base {
  stroke: rgb(104 124 142 / 0.2);
  stroke-width: 3;
}

.motion-corridor-v2 .motion-network-base--secondary {
  stroke-dasharray: 8 12;
  opacity: 0.65;
}

.motion-corridor-v2 .motion-network-route {
  stroke: rgb(86 142 176 / 0.94);
  stroke-width: 5;
  filter: url("#slc-corridor-glow");
}

.motion-corridor-v2 .motion-network-route--b {
  stroke: rgb(120 158 182 / 0.76);
  stroke-width: 3.5;
}

.motion-corridor-v2 .motion-network-nodes circle {
  fill: rgb(31 52 69 / 0.96);
  stroke: rgb(170 194 210 / 0.92);
  stroke-width: 3;
  filter: drop-shadow(0 0 8px rgb(87 140 173 / 0.42));
}

.motion-corridor-v2 .motion-network-marker {
  fill: rgb(239 245 248 / 0.98);
  stroke: rgb(74 129 164 / 0.96);
  stroke-width: 5;
  filter:
    drop-shadow(0 0 10px rgb(88 143 176 / 0.55))
    drop-shadow(0 0 24px rgb(47 91 123 / 0.32));
}

.motion-corridor-v2 .corridor-section .briefing-group,
.motion-corridor-v2 .corridor-section .material-callout {
  position: relative;
  z-index: 4;
  -webkit-backdrop-filter: blur(4px);
  backdrop-filter: blur(4px);
}

@media (max-width: 64rem) {
  .motion-corridor-v2 .motion-corridor-network {
    inset-inline: -32%;
    opacity: 0.42;
  }
}

@media (max-width: 47.99rem) {
  .motion-corridor-v2 .motion-corridor-network {
    inset: 12% -85% 6%;
    opacity: 0.3;
  }

  .motion-corridor-v2 .motion-corridor-network svg {
    min-width: 72rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .motion-corridor-v2 .motion-corridor-network {
    display: none !important;
  }
}
