/* "Atendemos todo o Brasil". Estado final no CSS: todos os estados em Verde NS. */

.ns-br__grid { display: grid; gap: clamp(2.5rem, 6vw, 4rem); align-items: center; }
@media (min-width: 1024px) { .ns-br__grid { grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr); column-gap: clamp(3rem, 6vw, 6rem); } }

.ns-br__copy { display: grid; gap: var(--ns-s-6); justify-items: start; }
.ns-br__title { display: grid; margin: 0; font-family: var(--ns-font-display); line-height: 0.95; letter-spacing: -0.045em; font-size: clamp(3.25rem, 1.3rem + 5.6vw, 6.75rem); }
.ns-br__title-light { font-weight: 300; color: var(--ns-text); }
.ns-br__title-strong { font-weight: 600; color: var(--ns-blue); }
.ns-br__lead { font-size: var(--ns-fs-lead); line-height: 1.6; color: var(--ns-text-2); max-inline-size: 38ch; }
@media (max-width: 767px) { .ns-br__cta { inline-size: 100%; } }

/* Mapa */
.ns-br__map { margin: 0; display: grid; gap: 0.75rem; justify-items: center; }
.ns-br__map svg { inline-size: min(100%, 36rem); block-size: auto; overflow: visible; }
.ns-br__uf {
  fill: var(--ns-green); stroke: #ffffff; stroke-width: 1; stroke-linejoin: round; vector-effect: non-scaling-stroke;
  transition: fill var(--ns-dur-micro) var(--ns-ease);
}
@media (hover: hover) and (pointer: fine) {
  .ns-br__uf { cursor: default; }
  .ns-br__uf:hover, .ns-br__uf.is-active { fill: var(--ns-blue); }
}
.ns-br__caption { display: grid; gap: 0.25rem; justify-items: center; text-align: center; min-block-size: 2.75rem; }
.ns-br__label { font-family: var(--ns-font-display); font-size: 1.125rem; font-weight: 500; color: var(--ns-blue); min-block-size: 1.5rem; }