/* Scoped styles. The site's existing Manrope and brand variables take priority. */
.mvz-route {
  --route-navy: var(--color-primary, #041756);
  --route-blue: var(--color-alt, #2040a9);
  --route-sky: #8fc4ef;
  --route-accent: #448dcd;
  container: mvz-route / inline-size;
  width: 100%;
  color: #fff;
  font-family: var(--font-primary, "Manrope", Arial, sans-serif);
  font-weight: 500;
  text-align: left;
  -webkit-font-smoothing: antialiased;
}
.mvz-route *, .mvz-route *::before, .mvz-route *::after { box-sizing: border-box; }
.mvz-route .mvz-route__banner {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: 43cqw;
  padding: 4cqw 4.6cqw;
  border: 1px solid #ffffff38;
  border-radius: clamp(20px, 2cqw, 48px);
  background:
    radial-gradient(ellipse at 79% 74%, #3376bd80, transparent 54%),
    linear-gradient(162deg, #1b2d62 0%, var(--route-navy) 53%, var(--route-blue) 130%);
}
.mvz-route .mvz-route__content { position: relative; z-index: 2; width: 43%; }
.mvz-route .mvz-route__badge {
  display: inline-flex;
  align-items: center;
  gap: .65cqw;
  padding: .4cqw 1.05cqw .4cqw .45cqw;
  border: 1px solid #8fc4ef66;
  border-radius: 100px;
  background: #448dcd30;
  color: #d4e6fc;
  font-size: clamp(13px, 1.1cqw, 27px);
  line-height: 1.5;
  white-space: nowrap;
}
.mvz-route .mvz-route__pin {
  display: grid;
  place-items: center;
  flex: none;
  width: 1.9cqw;
  height: 1.9cqw;
  min-width: 25px;
  min-height: 25px;
  border-radius: 50%;
  background: var(--route-accent);
}
.mvz-route .mvz-route__pin svg { display: block; width: 60%; height: 66%; fill: #fff; }
.mvz-route .mvz-route__title {
  margin: 1.65cqw 0 1.25cqw;
  padding: 0;
  color: #fff;
  font: inherit;
  font-size: clamp(32px, 3.34cqw, 80px);
  font-weight: 700;
  line-height: 1.1;
  letter-spacing: -.035em;
}
.mvz-route .mvz-route__title span { display: block; color: var(--route-sky); }
.mvz-route .mvz-route__description {
  margin: 0;
  padding: 0;
  color: #c2d2ed;
  font-size: clamp(16px, 1.34cqw, 32px);
  line-height: 1.5;
  letter-spacing: -.022em;
}
.mvz-route .mvz-route__features {
  display: flex;
  flex-wrap: wrap;
  gap: .65cqw;
  margin: 1.8cqw 0 0;
  padding: 0;
  list-style: none;
}
.mvz-route .mvz-route__features li {
  display: inline-flex;
  align-items: center;
  gap: .55cqw;
  margin: 0;
  padding: .5cqw .8cqw;
  border: 1px solid #a3b8e240;
  border-radius: .9cqw;
  background: #8baff21a;
  color: #e3edff;
  font-size: clamp(12px, 1.08cqw, 26px);
  line-height: 1.3;
  white-space: nowrap;
  transition: background-color .6s, border-color .6s, box-shadow .6s;
}
.mvz-route .mvz-route__features li.is-active { border-color: #a2d4ff91; background: #6eacfa2e; box-shadow: inset 0 0 1cqw #8fc4ef12, 0 0 1.1cqw #448dcd16; }
.mvz-route .mvz-route__features li::before {
  content: "";
  flex: none;
  width: .68cqw;
  height: .68cqw;
  min-width: 8px;
  min-height: 8px;
  border-radius: .15cqw;
  background: #3b82f6;
}
.mvz-route .mvz-route__features li:nth-child(2)::before { background: #2dc58e; }
.mvz-route .mvz-route__features li:nth-child(3)::before { background: #8360f0; }
.mvz-route .mvz-route__features li:nth-child(4)::before { background: #efbd78; }
.mvz-route .mvz-route__cta {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 1cqw;
  min-height: 4.4cqw;
  margin: 2.15cqw 0 0;
  padding: .6cqw .65cqw .6cqw 1.8cqw;
  border: 0;
  border-radius: 1.3cqw;
  background: #fff;
  box-shadow: 0 .6cqw 1.6cqw #00113a24;
  color: var(--route-navy);
  font-size: clamp(16px, 1.35cqw, 32px);
  font-weight: 700;
  line-height: 1.25;
  text-decoration: none;
  transition: background-color .18s, box-shadow .18s;
}
.mvz-route .mvz-route__cta:visited { color: var(--route-navy); }
.mvz-route .mvz-route__cta:hover { background: #eef7ff; box-shadow: 0 .6cqw 2cqw #00113a50; }
.mvz-route .mvz-route__cta:focus-visible { outline: 3px solid var(--route-sky); outline-offset: 5px; }
.mvz-route .mvz-route__arrow {
  display: grid;
  place-items: center;
  flex: none;
  width: 3cqw;
  height: 3cqw;
  min-width: 38px;
  min-height: 38px;
  border-radius: .9cqw;
  background: var(--route-accent);
  color: #fff;
}
.mvz-route .mvz-route__arrow svg { transition: transform .2s; }
.mvz-route .mvz-route__cta:hover .mvz-route__arrow svg { transform: translateX(2px); }
.mvz-route .mvz-route__arrow svg { width: 45%; height: 45%; fill: none; stroke: currentColor; stroke-width: 2.6; }
.mvz-route .mvz-route__vehicles {
  margin: 1cqw 0 0;
  padding: 0;
  color: #a6bde0;
  font-size: clamp(12px, 1.08cqw, 26px);
  line-height: 1.5;
  letter-spacing: -.025em;
}
.mvz-route .mvz-route__visual {
  position: absolute;
  z-index: 1;
  right: -.2%;
  bottom: -1.5%;
  width: 58.5%;
  pointer-events: none;
}
.mvz-route .mvz-route__scene { display: block; width: 100%; height: auto; overflow: visible; transition: opacity .7s; }
.mvz-route .mvz-route__costs { position: absolute; top: 4%; right: 5%; width: 31%; padding: 1.05cqw 1.1cqw; border: 1px solid #8fc4ef52; border-radius: 1.3cqw; background: #081d54eb; color: #bcd0ed; font-size: .9cqw; line-height: 1.5; transition: border-color .7s, box-shadow .7s, transform .7s; }
.mvz-route .mvz-route__example { display: block; margin-bottom: .45cqw; color: #9eb9db; font-size: .7cqw; }
.mvz-route .mvz-route__cost-total { display: flex; flex-direction: column; padding-bottom: .6cqw; margin-bottom: .6cqw; border-bottom: 1px solid #88b7ed26; color: #dbeaff; }
.mvz-route .mvz-route__cost-total strong { margin-top: .15cqw; color: #fff; font-size: 1.7cqw; line-height: 1.35; font-weight: 700; font-variant-numeric: tabular-nums; }
.mvz-route .mvz-route__cost-row { display: flex; align-items: center; justify-content: space-between; gap: .7cqw; margin-top: .45cqw; white-space: nowrap; }
.mvz-route .mvz-route__cost-row strong { color: #dbeaff; font-weight: 600; font-variant-numeric: tabular-nums; }
.mvz-route .mvz-route__cost-row::before { content: ""; flex: none; width: .35cqw; height: .35cqw; border-radius: 50%; background: #56d9b3; }
.mvz-route .mvz-route__cost-row:nth-child(4)::before { background: #8fc4ef; }
.mvz-route .mvz-route__cost-row:nth-child(5)::before { background: #a38bf5; }
.mvz-route .mvz-route__cost-row > span { flex: 1; }
.mvz-route[data-phase="cost"] .mvz-route__costs { border-color: #67e0bc99; box-shadow: 0 0 2cqw #46d0b320; transform: translateY(-2px); }
.mvz-route .mvz-route__map-label { position: absolute; top: 0; left: 0; display: inline-flex; align-items: center; gap: .4cqw; padding: .35cqw .65cqw; border: 1px solid #8fc4ef77; border-radius: 100px; background: #092a50ec; color: #e5f4ff; font-size: .8cqw; font-weight: 700; line-height: 1.25; white-space: nowrap; }
.mvz-route .mvz-route__map-label.is-destination { border-color: #56d9b388; color: #b4ffe4; background: #073f40ec; }
.mvz-route .mvz-route__three { position: absolute; inset: 0; opacity: 0; transition: opacity 1s; }
.mvz-route .mvz-route__canvas { position: absolute; inset: 0; display: block; width: 100%; height: 100%; outline: none; -webkit-mask-image: linear-gradient(90deg, transparent, #000 13%, #000 98%, transparent); mask-image: linear-gradient(90deg, transparent, #000 13%, #000 98%, transparent); }
.mvz-route .mvz-route__labels { position: absolute; inset: 0; }
.mvz-route.is-three-ready .mvz-route__three { opacity: 1; }
.mvz-route.is-three-ready .mvz-route__scene { opacity: 0; }
.mvz-route .mvz-route__load { position: absolute; top: 0; left: 0; padding: .3cqw .65cqw; border: 1px solid #3bdca6b3; border-radius: 100px; background: #073e3ce8; box-shadow: 0 .25cqw 1.2cqw #061c4860; color: #defff5; font-size: .95cqw; font-weight: 700; line-height: 1.25; white-space: nowrap; }
.mvz-route .mvz-route__stage { position: absolute; bottom: 3.5%; left: 8%; display: none; align-items: center; gap: .55cqw; width: 35%; padding: .65cqw .8cqw; border: 1px solid #94c8fc38; border-radius: .8cqw; background: #081d54bd; color: #d3e8ff; font-size: .85cqw; line-height: 1.3; white-space: nowrap; }
.mvz-route.is-three-ready .mvz-route__stage { display: flex; }
.mvz-route .mvz-route__stage-dot { flex: none; width: .38cqw; height: .38cqw; border-radius: 50%; background: #59dab2; box-shadow: 0 0 .6cqw #59dab2b3; }
.mvz-route .mvz-route__stage-track { flex: 1; height: 2px; margin-left: .25cqw; overflow: hidden; border-radius: 2px; background: #bedaff24; }
.mvz-route .mvz-route__stage-track span { display: block; width: 100%; height: 100%; background: #8fc4ef; transform: scaleX(0); transform-origin: left; }
.mvz-route .mvz-route__pdf { position: absolute; right: 8%; bottom: 18%; display: flex; align-items: center; gap: .65cqw; padding: .75cqw .9cqw; border: 1px solid #75e8bc55; border-radius: 1cqw; background: #0d3155e8; box-shadow: 0 .5cqw 2cqw #00133850; color: #cde6ff; font-size: .85cqw; line-height: 1.45; opacity: 0; transform: translateY(12px); transition: opacity .6s, transform .6s; }
.mvz-route[data-phase="report"].is-three-ready .mvz-route__pdf { opacity: 1; transform: translateY(0); }
.mvz-route .mvz-route__pdf > span > span { display: block; color: #a9c2df; font-size: .75cqw; }
.mvz-route .mvz-route__pdf strong { font-weight: 700; color: #eff8ff; }
.mvz-route .mvz-route__pdf-icon { display: flex; width: 1.55cqw; color: #8fc4ef; }
.mvz-route .mvz-route__pdf-icon svg { display: block; width: 100%; height: auto; }
.mvz-route .mvz-route__pdf-check { display: grid; place-items: center; width: 1.3cqw; height: 1.3cqw; margin-left: .3cqw; border-radius: 50%; background: #2fc38c; color: #062d2d; }
.mvz-route .mvz-route__pdf-check svg { width: 75%; height: 75%; }
.mvz-route .mvz-route__motion { position: absolute; z-index: 3; right: 1.4cqw; bottom: 1.4cqw; display: none; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; border: 1px solid #94c8fc4d; border-radius: 50%; background: #081d547a; color: #d3e8ff; cursor: pointer; transition: background-color .2s; }
.mvz-route.is-three-ready .mvz-route__motion { display: inline-flex; }
.mvz-route .mvz-route__motion:hover { background: #224375; }
.mvz-route .mvz-route__motion:focus-visible { outline: 3px solid #8fc4ef; outline-offset: 3px; }
.mvz-route .mvz-route__motion svg { display: block; width: 15px; height: 15px; }
.mvz-route .mvz-route__motion .mvz-route__play-icon { display: none; }
.mvz-route.is-motion-paused .mvz-route__motion .mvz-route__pause-icon { display: none; }
.mvz-route.is-motion-paused .mvz-route__motion .mvz-route__play-icon { display: block; }
.mvz-route .mvz-route__axles {
  position: absolute;
  top: 4%;
  right: 5%;
  width: 29%;
  padding: 1.05cqw 1.1cqw;
  border: 1px solid #8fc4ef52;
  border-radius: 1.3cqw;
  background: #081d54eb;
  color: #bcd0ed;
  font-size: 1cqw;
  line-height: 1.5;
}
.mvz-route .mvz-route__axles-header { display: flex; justify-content: space-between; align-items: center; gap: .6cqw; margin-bottom: .55cqw; }
.mvz-route .mvz-route__axles-header strong { color: #fff; font-size: 1.12cqw; font-weight: 700; white-space: nowrap; }
.mvz-route .mvz-route__status { padding: .2cqw .55cqw; border-radius: 100px; background: #25c58d29; color: #53e3ad; font-size: .87cqw; font-weight: 700; white-space: nowrap; }
.mvz-route .mvz-route__axle { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 1cqw; margin-top: .55cqw; white-space: nowrap; }
.mvz-route .mvz-route__bar { height: .48cqw; border-radius: 100px; background: #2e4374; overflow: hidden; }
.mvz-route .mvz-route__bar::before { content: ""; display: block; width: 100%; height: 100%; border-radius: inherit; background: #2fc38c; transform: scaleX(var(--mvz-load, var(--mvz-rest, .84))); transform-origin: left; transition: transform .45s; }
.mvz-route .mvz-route__axle:nth-child(3) .mvz-route__bar::before { --mvz-rest: .62; }
.mvz-route .mvz-route__axle:nth-child(4) .mvz-route__bar::before { --mvz-rest: .46; }
@container mvz-route (max-width: 900px) {
  .mvz-route .mvz-route__banner { padding: 7.2cqw 4.85cqw 0; border-radius: 5.4cqw; background: radial-gradient(ellipse at 94% 61%, #3070b694, transparent 65%), linear-gradient(160deg, #1b2d62, var(--route-navy) 67%, #173b89); }
  .mvz-route .mvz-route__content { width: 100%; }
  .mvz-route .mvz-route__badge { gap: 2.1cqw; padding: 1.5cqw 3.6cqw 1.5cqw 1.5cqw; font-size: 3.6cqw; line-height: 1.3; }
  .mvz-route .mvz-route__pin { width: 6.2cqw; height: 6.2cqw; min-width: 0; min-height: 0; }
  .mvz-route .mvz-route__title { margin: 5.2cqw 0 4.1cqw; font-size: 7cqw; line-height: 1.12; letter-spacing: -.038em; }
  .mvz-route .mvz-route__description { font-size: 4.2cqw; line-height: 1.5; letter-spacing: -.025em; }
  .mvz-route .mvz-route__features { gap: 2.2cqw; margin-top: 5.8cqw; }
  .mvz-route .mvz-route__features li { gap: 1.9cqw; padding: 1.35cqw 2.25cqw; border-radius: 2.9cqw; font-size: 3.45cqw; line-height: 1.3; }
  .mvz-route .mvz-route__features li::before { width: 2.2cqw; height: 2.2cqw; min-width: 0; min-height: 0; border-radius: .5cqw; }
  .mvz-route .mvz-route__cta { width: 100%; min-height: 14.5cqw; gap: 2cqw; margin-top: 6.3cqw; padding: 2.2cqw 2.2cqw 2.2cqw 6cqw; border-radius: 4cqw; font-size: 4.5cqw; }
  .mvz-route .mvz-route__arrow { width: 10cqw; height: 10cqw; min-width: 0; min-height: 0; border-radius: 3cqw; }
  .mvz-route .mvz-route__vehicles { margin-top: 3.1cqw; font-size: 3.5cqw; line-height: 1.5; }
  .mvz-route .mvz-route__visual { position: relative; right: auto; bottom: auto; width: 110.8%; margin: -1.5cqw -5.4% -1.5cqw; }
  .mvz-route .mvz-route__axles { top: 5%; right: 9%; width: 28%; padding: 1.7cqw 1.9cqw; border-radius: 2.4cqw; font-size: 1.55cqw; }
  .mvz-route .mvz-route__axles-header { gap: 1cqw; margin-bottom: .9cqw; }
  .mvz-route .mvz-route__axles-header strong { font-size: 1.8cqw; }
  .mvz-route .mvz-route__status { padding: .35cqw .8cqw; font-size: 1.4cqw; }
  .mvz-route .mvz-route__axle { gap: 1.5cqw; margin-top: .9cqw; }
  .mvz-route .mvz-route__bar { height: .8cqw; }
  .mvz-route .mvz-route__costs { top: 5%; right: 9%; width: 32%; padding: 1.7cqw 1.9cqw; border-radius: 2.4cqw; font-size: 1.75cqw; }
  .mvz-route .mvz-route__example { font-size: 1.35cqw; margin-bottom: .6cqw; }
  .mvz-route .mvz-route__cost-total { padding-bottom: .9cqw; margin-bottom: .9cqw; }
  .mvz-route .mvz-route__cost-total strong { margin-top: .3cqw; font-size: 3.25cqw; }
  .mvz-route .mvz-route__cost-row { gap: 1cqw; margin-top: .8cqw; }
  .mvz-route .mvz-route__cost-row::before { width: .65cqw; height: .65cqw; }
  .mvz-route .mvz-route__map-label { gap: .7cqw; padding: .65cqw 1.2cqw; font-size: 1.6cqw; }
  .mvz-route .mvz-route__load { padding: .55cqw 1.2cqw; font-size: 1.8cqw; }
  .mvz-route .mvz-route__stage { gap: 1cqw; width: 39%; padding: 1.2cqw 1.5cqw; border-radius: 1.5cqw; font-size: 1.65cqw; }
  .mvz-route .mvz-route__stage-dot { width: .8cqw; height: .8cqw; }
  .mvz-route .mvz-route__pdf { gap: 1.2cqw; padding: 1.5cqw 1.8cqw; border-radius: 2cqw; font-size: 1.65cqw; }
  .mvz-route .mvz-route__pdf > span > span { font-size: 1.5cqw; }
  .mvz-route .mvz-route__pdf-icon { width: 3cqw; }
  .mvz-route .mvz-route__pdf-check { width: 2.5cqw; height: 2.5cqw; }
  .mvz-route .mvz-route__motion { right: 2.5cqw; bottom: 2.5cqw; }
}
@media (prefers-reduced-motion: reduce) {
  .mvz-route *, .mvz-route *::before, .mvz-route *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  .mvz-route.is-three-ready .mvz-route__motion { display: none; }
}