.card-image img{
  transition:filter .55s ease,transform .7s ease;
}

.business-card:hover .card-image{
  opacity:.88;
}

.business-card:hover .card-image img{
  filter:grayscale(0) saturate(1.38) brightness(1.13) contrast(1.04);
  transform:scale(1.025);
}

@media (max-width:900px), (hover:none), (pointer:coarse){
  .business-card .card-image{
    opacity:.72;
  }

  .business-card .card-image img{
    filter:grayscale(0) saturate(1.16) brightness(1.06) contrast(1.02);
  }

  .business-card .card-image::after{
    background:rgba(0,0,0,.28);
  }

  .business-card.is-active .card-image{
    opacity:.94;
  }

  .business-card.is-active .card-image img{
    filter:grayscale(0) saturate(1.28) brightness(1.1) contrast(1.03);
    transform:scale(1.025);
  }
}

.map-japan{
  background:radial-gradient(circle at 52% 53%,#363636 0,#1c1c1c 48%,#111 100%);
}

.map-japan::before{display:none}

.map-japan::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
  background:radial-gradient(circle at 52% 50%,rgba(255,255,255,.05),transparent 43%);
  box-shadow:inset 0 0 100px rgba(0,0,0,.35);
}

.network-map-canvas{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:0;
}

.japan-land{
  fill:#ed4a22;
  stroke:#ed4a22;
  stroke-width:1;
  vector-effect:non-scaling-stroke;
  filter:drop-shadow(0 0 18px rgba(237,74,34,.12));
}

.client-pin{
  fill:rgba(17,17,17,.56);
  stroke:#f3efe6;
  stroke-width:1.9;
  vector-effect:non-scaling-stroke;
  filter:drop-shadow(0 0 3px rgba(255,255,255,.2));
}

.hub-halo{
  fill:none;
  stroke:#ed4a22;
  stroke-width:2;
  opacity:.55;
  vector-effect:non-scaling-stroke;
  transform-box:fill-box;
  transform-origin:center;
  animation:hubPulse 2.5s ease-in-out infinite;
}

.hub-pin{
  fill:#f3efe6;
  stroke:#ed4a22;
  stroke-width:2.4;
  vector-effect:non-scaling-stroke;
  filter:drop-shadow(0 0 5px rgba(237,74,34,.55));
}

.hub-pin.hub-logistics{fill:#ed4a22;stroke:#f3efe6}
.hub-pin.hub-mixed{fill:#f3efe6;stroke:#ed4a22;stroke-width:3}

@keyframes hubPulse{
  0%,100%{opacity:.25;transform:scale(.82)}
  50%{opacity:.75;transform:scale(1.18)}
}

@media (max-width:900px){
  .stats div{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    justify-content:center;
    gap:12px;
  }

  .stats strong{
    display:block;
    line-height:.88;
  }

  .stats span{
    display:block;
    line-height:1.45;
  }
}
