.global-route-loader {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: var(--deep);
  color: var(--paper);
  opacity: 1;
  transition: opacity .34s ease, visibility 0s linear 0s;
}
.global-route-loader.is-hidden { visibility: hidden; pointer-events: none; opacity: 0; transition-delay: 0s, .34s; }
.global-route-loader__inner {
  width: min(36vw, 680px);
  display: grid;
  align-content: center;
  justify-items: center;
  gap: 0;
}
.global-route-loader__inner > img {
  width: 132px;
  height: auto;
  justify-self: center;
  margin: 0 auto;
  position: relative;
  top: -24px;
  opacity: 0;
  animation: loader-logo-in .22s ease-out forwards;
}
.global-route-loader__eyebrow {
  justify-self: center;
  margin: 7px 0 0;
  color: #b8c5bb;
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .18em;
}
.global-route-loader__route { position: relative; width: 100%; margin-top: 0; }
.global-route-loader__track { width: 100%; height: clamp(170px, 22vh, 230px); }
.loader-scene { display: block; width: 100%; height: 100%; overflow: visible; }
.global-route-loader__origin,
.global-route-loader__destination {
  position: absolute;
  z-index: 2;
  color: var(--paper);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .14em;
}
.global-route-loader__origin { left: 0; top: 65%; }
.global-route-loader__destination { right: 0; top: 65%; }
.loader-scene .loader-road,
.loader-scene .loader-road-center,
.loader-scene .loader-event path {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.loader-road { stroke: var(--brand); stroke-width: 6; stroke-dasharray: 1200; stroke-dashoffset: 1200; animation: loader-road-draw .62s .24s ease-out forwards; }
.loader-road-center { stroke: rgba(248,245,238,.48); stroke-width: 1.5; stroke-dasharray: 7 12; }
.loader-origin-marker { fill: none; stroke: var(--gold); stroke-width: 2.2; opacity: .78; }
.loader-origin-core { fill: var(--gold); stroke: var(--deep); stroke-width: 2; }
.loader-icon-connector { fill: none; stroke: rgba(221,155,46,.58); stroke-width: 1.5; stroke-dasharray: 4 5; stroke-linecap: round; transition: opacity .2s ease, stroke .2s ease; }
.loader-icon-connector.is-active { stroke: var(--gold); opacity: 1; }
.loader-event { opacity: .26; transition: opacity .2s ease, filter .2s ease; }
.loader-event.is-active { opacity: 1; }
.loader-event.is-past { opacity: .38; }
.loader-icon path { fill: none; stroke: currentColor; stroke-width: 2.5; stroke-linecap: round; stroke-linejoin: round; color: var(--gold); }
.loader-icon rect { stroke: none; }
.loader-icon ellipse { stroke: none; }
.loader-event path { stroke: var(--gold); stroke-width: 2.3; }
.loader-waterfall { filter: drop-shadow(0 0 3px rgba(221,155,46,.28)); }
.loader-waterfall .loader-water { stroke: var(--gold); stroke-width: 3.2; stroke-dasharray: 48; stroke-dashoffset: 48; }
.loader-waterfall.is-active .loader-water { animation: loader-water-fall .4s ease-out forwards; }
.loader-border.is-open .loader-icon { filter: drop-shadow(0 0 4px rgba(221,155,46,.35)); }
.loader-border.is-past { opacity: .8; }
.loader-border.is-cleared { opacity: .38; }
.loader-destination-halo { fill: none; stroke: var(--gold); stroke-width: 2.2; opacity: .7; }
.loader-destination-core { fill: var(--gold); stroke: var(--deep); stroke-width: 2; }
.route-complete .loader-destination-halo { animation: loader-arrival-pulse .22s ease-out forwards; }
.loader-van { opacity: 0; }
.loader-van-body path:first-child { fill: var(--deep); stroke: var(--gold); stroke-width: 2.4; stroke-linejoin: round; }
.loader-van-body path:nth-child(2) { fill: #dce9db; stroke: var(--gold); stroke-width: 1.3; }
.loader-van-body circle { fill: var(--deep); stroke: var(--gold); stroke-width: 2; }

/* The actual hero opens at the measured destination marker. */
.hero.loader-hero-ready {
  position: relative;
  z-index: 1001;
  clip-path: circle(0px at var(--loader-reveal-x) var(--loader-reveal-y));
  pointer-events: none;
}
.hero.loader-hero-ready.loader-hero-open {
  clip-path: circle(150vmax at var(--loader-reveal-x) var(--loader-reveal-y));
  transition: clip-path .55s cubic-bezier(.16,.8,.23,1);
}
.hero.loader-hero-ready .hero-coordinate,
.hero.loader-hero-ready h1,
.hero.loader-hero-ready .hero-description,
.hero.loader-hero-ready .hero-actions,
.hero.loader-hero-ready .hero-territory,
.hero.loader-hero-ready .hero-transfer,
.hero.loader-hero-ready .hero-bottom {
  opacity: 0;
  transform: translateY(9px);
}
.hero.loader-hero-open .hero-coordinate,
.hero.loader-hero-open h1,
.hero.loader-hero-open .hero-description,
.hero.loader-hero-open .hero-actions,
.hero.loader-hero-open .hero-territory,
.hero.loader-hero-open .hero-transfer,
.hero.loader-hero-open .hero-bottom {
  opacity: 1;
  transform: translateY(0);
  transition: opacity .3s ease, transform .35s cubic-bezier(.2,.8,.2,1);
}
.hero.loader-hero-open .hero-coordinate { transition-delay: .12s; }
.hero.loader-hero-open h1 { transition-delay: .17s; }
.hero.loader-hero-open .hero-description { transition-delay: .22s; }
.hero.loader-hero-open .hero-actions { transition-delay: .27s; }
.hero.loader-hero-open .hero-territory,
.hero.loader-hero-open .hero-transfer,
.hero.loader-hero-open .hero-bottom { transition-delay: .31s; }
.header.loader-header-ready { z-index: 1002; opacity: 0; }
.header.loader-header-open { opacity: 1; transition: opacity .3s ease .24s; }

@keyframes loader-logo-in { from { opacity: 0; transform: translateY(7px); } to { opacity: 1; transform: translateY(0); } }
@keyframes loader-road-draw { to { stroke-dashoffset: 0; } }
@keyframes loader-water-fall { to { stroke-dashoffset: 0; } }
@keyframes loader-arrival-pulse { to { opacity: 1; transform: scale(1.35); } }

@media (max-width: 600px) {
  .global-route-loader__inner { width: min(76vw, 330px); }
  .global-route-loader__inner > img { width: 112px; }
  .global-route-loader__inner > img { top: -18px; }
  .global-route-loader__eyebrow { font-size: 8px; }
  .global-route-loader__track { height: min(43vh, 330px); }
  .global-route-loader__origin { top: 68px; left: 0; }
  .global-route-loader__destination { right: 0; top: auto; bottom: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .global-route-loader__inner > img, .loader-road, .loader-waterfall .loader-water, .route-complete .loader-destination-halo { animation: none; }
  .global-route-loader__inner > img { opacity: 1; }
  .loader-road { stroke-dashoffset: 0; }
  .hero.loader-hero-ready { clip-path: none; pointer-events: auto; }
  .hero.loader-hero-ready.loader-hero-open { transition: none; }
}

