/* Shared hero map animation. Coordinates and routes live in hero-network.js. */
.page-home .home-hero.network-hero{
  min-height:clamp(580px,76vh,820px);
  background:#fafaf8;
  border-bottom:1px solid rgba(18,24,36,.06);
}
.page-home .network-hero .hero-content{
  display:block;
  width:min(1440px,calc(100% - 80px));
  padding-top:58px;
  padding-bottom:58px;
}
.network-hero-copy{position:relative;z-index:2;max-width:760px}
.network-hero .hero-overlay{
  background:linear-gradient(90deg,rgba(250,250,248,.96) 0%,rgba(250,250,248,.9) 30%,rgba(250,250,248,.68) 52%,rgba(250,250,248,.08) 78%);
}
.page-home .network-hero .hero-title-block{
  background:transparent;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  padding:12px 0 12px 22px!important;
}
.page-home .network-hero h1{
  font-size:clamp(2rem,3.6vw,3.2rem);
  line-height:1.22;
  letter-spacing:.01em;
  text-wrap:balance;
  margin:0;
  text-shadow:none;
}
.network-hero .hero-brand-image{width:min(350px,100%)}
.network-hero .hero-brand-mark{margin-bottom:30px}
.network-hero-art{position:absolute;inset:0;pointer-events:none}
.pricing-network{position:absolute;inset:0;isolation:isolate}
.network-map{display:block;width:100%;height:100%;object-fit:cover;object-position:center;mix-blend-mode:multiply}
.network-overlay{position:absolute;inset:0;width:100%;height:100%;overflow:hidden}
.page-hero.network-hero--compact,.article-header.network-hero--compact{
  background:#fafaf8;
  padding:44px 0;
}
.page-hero.network-hero--compact{display:flex;align-items:center;min-height:240px}
.network-hero--compact>.container,.network-hero--compact>.narrow{position:relative;z-index:2}
/* Keep northern markets in the shallow crop, moving image and SVG together. */
.network-hero--compact .pricing-network{
  top:min(0px,calc(50% - 26.25vw));
  bottom:auto;
  height:max(100%,75vw);
}
.network-hero--compact .hero-overlay{
  background:linear-gradient(90deg,rgba(250,250,248,.94) 0%,rgba(250,250,248,.9) 55%,rgba(250,250,248,.5) 100%);
}
.article-header.network-hero--compact h1{font-size:clamp(1.85rem,3.5vw,2.75rem)}
.network-route,.network-flow,.network-tip{fill:none;stroke-linecap:round}
.network-route{stroke:#af9139;stroke-width:1.6;opacity:.25}
.network-flow{
  stroke:#c39931;
  stroke-width:3;
  stroke-dasharray:1 1;
  stroke-dashoffset:1;
  opacity:0;
  animation:network-draw var(--cycle,22s) linear infinite;
}
.network-tip{
  stroke:#fff6ce;
  stroke-width:5;
  stroke-dasharray:.006 1;
  opacity:0;
  filter:drop-shadow(0 0 3px #ad8420);
  animation:network-travel var(--cycle,22s) linear infinite;
}
.network-node-halo{fill:#fff9e6;opacity:.65}
.network-node-ring{fill:#fffdf5;stroke:#af9139;stroke-width:2.2}
.network-node-core{fill:#1c3e54}
.network-signal{
  fill:none;
  stroke:#c49a39;
  stroke-width:2;
  opacity:0;
  transform-box:fill-box;
  transform-origin:center;
  animation:network-signal var(--cycle,22s) ease-out infinite;
}
.network-flow,.network-tip,.network-signal{animation-delay:var(--delay,0s);animation-play-state:paused}
[data-network-hero][data-running="true"] .network-flow,
[data-network-hero][data-running="true"] .network-tip,
[data-network-hero][data-running="true"] .network-signal{animation-play-state:running}
@keyframes network-draw{
  0%{stroke-dashoffset:1;opacity:0}
  1%{opacity:.95}
  10%{stroke-dashoffset:0;opacity:.95}
  16%,100%{stroke-dashoffset:0;opacity:0}
}
@keyframes network-travel{
  0%{stroke-dashoffset:0;opacity:0}
  1%{opacity:1}
  10%{stroke-dashoffset:-1;opacity:1}
  11%,100%{stroke-dashoffset:-1;opacity:0}
}
@keyframes network-signal{
  0%{transform:scale(.8);opacity:0}
  1%{transform:scale(1);opacity:.6}
  5%,100%{transform:scale(2.6);opacity:0}
}
@media(max-width:900px){
  .page-home .home-hero.network-hero{min-height:560px}
  .page-home .network-hero .hero-content{
    width:calc(100% - 40px);
    padding-top:40px;
    padding-bottom:40px;
  }
  .network-hero-copy{max-width:660px}
  .network-hero .hero-brand-image{width:min(270px,70vw)}
  .network-hero .hero-brand-mark{margin-bottom:20px}
  .page-home .network-hero h1{font-size:clamp(1.75rem,4.6vw,2.6rem)}
  .network-hero .hero-overlay{background:rgba(250,250,248,.82)}
  .page-hero.network-hero--compact,.article-header.network-hero--compact{padding:32px 0}
  .page-hero.network-hero--compact{min-height:200px}
  .network-hero--compact .hero-overlay{background:rgba(250,250,248,.9)}
}
@media(prefers-reduced-motion:reduce){
  .network-flow,.network-tip,.network-signal{animation:none!important;display:none}
  .network-route{opacity:.5}
}
