/* ===== Hero (v6) · texto + bloco do mapa-mundi, organizado em grade =====
   Estrutura: .hero-inner (grid)
     ├─ .hero-copy   (badge, h1, sub, botoes)
     ├─ .hero-map    (cartao com #heroNet, legenda, numeros)
     └─ .hero-stats  (linha inteira, 3 indicadores)                        */
.hero {
  min-height:0;
}
.hero-inner {
  max-width:1240px;
  width:100%;
  display:grid;
  grid-template-columns:minmax(0, 1fr);
  grid-template-areas:"copy" "map" "stats";
  gap:32px;
  align-items:center;
  padding-top:104px;
  padding-bottom:56px;
}
.hero-copy {
  grid-area:copy;
  min-width:0;
  max-width:none;
}
.hero-map {
  grid-area:map;
  min-width:0;
}
.hero-stats {
  grid-area:stats;
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:14px;
  margin-top:0;
}
.hero-stat {
  margin:0;
}
.hero h1 {
  font-size:clamp(2.1rem, 5.2vw, 3.6rem);
  margin-bottom:18px;
}
.hero p.sub {
  margin-bottom:26px;
}
@media(min-width:1024px) {
  .hero-inner {
    grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
    grid-template-areas:"copy map" "stats stats";
    gap:36px 48px;
  }
  .hero h1 {
    font-size:clamp(2.2rem, 3.4vw, 3.4rem);
  }
}
@media(max-width:600px) {
  .hero-stats {
    grid-template-columns:1fr;
  }
}

/* Cartao do mapa */
.hero-map-card {
  position:relative;
  background:linear-gradient(160deg, rgba(4, 30, 38, .88), rgba(2, 16, 22, .94));
  border:1px solid rgba(0, 194, 212, .28);
  border-radius:20px;
  padding:14px 14px 12px;
  box-shadow:0 30px 80px -20px rgba(0, 194, 212, .35), inset 0 0 0 1px rgba(255, 255, 255, .03);
  transition:transform .5s ease, box-shadow .5s ease;
  text-shadow:none;
}
.hero-map:hover .hero-map-card, .hero-map:focus-within .hero-map-card {
  transform:translateY(-4px);
  box-shadow:0 36px 90px -24px rgba(0, 194, 212, .5), inset 0 0 0 1px rgba(255, 255, 255, .05);
}
body.light .hero-map-card {
  background:linear-gradient(160deg, #fff, #eef8fa);
  border-color:rgba(0, 120, 140, .25);
  box-shadow:0 30px 60px -25px rgba(0, 120, 140, .3);
}
#heroNet {
  display:block;
  width:100%;
  aspect-ratio:360 / 142;
  border-radius:12px;
  background:radial-gradient(ellipse at 50% 40%, rgba(0, 194, 212, .09), transparent 70%);
}
.hero-map-head {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin-bottom:8px;
  font-size:.8rem;
  font-weight:700;
  letter-spacing:.02em;
  color:#7ff3ff;
}
body.light .hero-map-head {
  color:#00707f;
}
.hero-map-head a {
  font-weight:600;
  color:inherit;
  text-decoration:none;
  opacity:.9;
}
.hero-map-head a:hover, .hero-map-head a:focus-visible {
  text-decoration:underline;
  opacity:1;
}
.hero-map-legend {
  display:flex;
  flex-wrap:wrap;
  gap:6px 14px;
  margin-top:10px;
  font-size:.7rem;
  color:var(--muted);
}
.hero-map-legend span {
  display:inline-flex;
  align-items:center;
  gap:6px;
}
.hero-map-legend i {
  display:inline-block;
  width:16px;
  height:3px;
  border-radius:2px;
  background:rgba(0, 194, 212, .75);
}
.hero-map-legend i.hm-pop {
  width:8px;
  height:8px;
  border-radius:50%;
  background:#f6821f;
}
.hero-map-legend i.hm-land {
  background:repeating-linear-gradient(90deg, #f6821f 0 4px, transparent 4px 7px);
}
.hero-map-stats {
  display:flex;
  gap:18px;
  flex-wrap:wrap;
  margin-top:10px;
  padding-top:10px;
  border-top:1px solid rgba(255, 255, 255, .08);
}
body.light .hero-map-stats {
  border-top-color:rgba(15, 39, 48, .1);
}
.hero-map-stats b {
  font-size:1rem;
  color:#fff;
}
body.light .hero-map-stats b {
  color:#0f2730;
}
.hero-map-stats small {
  font-size:.68rem;
  color:var(--muted);
}
.hero-map-note {
  display:block;
  margin-top:6px;
  font-size:.62rem;
  color:var(--muted);
  font-style:normal;
  opacity:.85;
}
@media(prefers-reduced-motion:reduce) {
  .hero-map-card {
    transition:none;
  }
  .hero-map:hover .hero-map-card {
    transform:none;
  }
}