@font-face{
  font-family:"Archivo Black";
  font-style:normal;
  font-weight:400;
  font-display:optional;
  src:url("/assets/fonts/archivo-black-latin.woff2") format("woff2");
}
@font-face{
  font-family:"Manrope";
  font-style:normal;
  font-weight:400 800;
  font-display:optional;
  src:url("/assets/fonts/manrope-latin.woff2") format("woff2");
}
:root{--muted:#58677e}
.blog-page .page-hero h1{font-family:Impact,"Arial Black",sans-serif;font-weight:400}

@media (min-width:981px){
  .hero-copy h1{font-size:clamp(3.1rem,5vw,4.6rem);max-width:13ch}
  .page-hero h1{font-size:clamp(3rem,5vw,4.8rem);max-width:15ch}
}
@media (max-width:640px){
  .location-chip{width:auto;max-width:100%;white-space:normal;line-height:1.4}
}

@media (prefers-reduced-motion:no-preference){
  .route-steps::before{transform-origin:left;animation:route-draw .75s cubic-bezier(.16,1,.3,1) both}
  .route-steps li span{animation:route-stop .45s cubic-bezier(.16,1,.3,1) both}
  .route-steps li:nth-child(2) span{animation-delay:.1s}
  .route-steps li:nth-child(3) span{animation-delay:.2s}
  .route-steps li:nth-child(4) span{animation-delay:.3s}
}

@keyframes route-draw{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes route-stop{from{opacity:.72;transform:scale(.82)}to{opacity:1;transform:scale(1)}}
