/**
* Theme Name: Blocksy Child
* Description: Blocksy Child theme
* Author: Creative Themes
* Template: blocksy
* Text Domain: blocksy
*/

.progress {
	position: fixed;
	top: 0;
	left: 0;
	height: 3px;
	width: 0;
	z-index: 999;
	background: linear-gradient(90deg, #00c6df, #ddd929);
}
#webgl {
	position: fixed;
	inset: 0;
	width: 100%;
	height: 100%;
	z-index: -5;
	pointer-events: none;
}

.global-map {
  width: 100%;
  height: 100%;
  min-height: clamp(280px, 52vw, 560px);
  position: relative;
  overflow: hidden;
/*   background: #000; */
  border: none;
  border-radius: 0;
  box-shadow: none;
  backdrop-filter: none;
}

.global-map svg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.map-dots circle {
  fill: rgba(0, 198, 223, 0.42);
  animation: twinkle 2.4s infinite alternate;
}

.map-dots circle:nth-child(3n) {
  fill: rgba(221, 217, 41, 0.55);
}

.flight-path {
  stroke: rgba(221, 217, 41, 0.55);
  stroke-width: 1.5;
  fill: none;
  stroke-dasharray: 8 12;
  animation: dash 9s linear infinite;
  filter: drop-shadow(0 0 8px rgba(221, 217, 41, 0.3));
}

.city circle {
  fill: #00c6df;
  filter: drop-shadow(0 0 10px #00c6df);
  animation: cityPulse 2s infinite;
  transform-box: fill-box;
  transform-origin: center;
}

.city text {
  fill: #fff;
  font-size: 12px;
  font-family: sans-serif;
  dominant-baseline: middle;
}

@keyframes twinkle {
  to {
    opacity: 0.35;
    transform: scale(0.65);
  }
}

@keyframes cityPulse {
  50% {
    transform: scale(1.8);
    fill: #ddd929;
  }
}

@keyframes dash {
  to {
    stroke-dashoffset: -220;
  }
}

@media (max-width: 575px) {
  .global-map {
    min-height: 320px;
    border-radius: 20px;
  }

  .city text {
    font-size: 10px;
  }

  .flight-path {
    stroke-width: 1;
  }
}

@media (max-width: 390px) {
  .global-map {
    min-height: 280px;
  }

  .city text {
    display: none;
  }
}