/* /service-areas city directory (src/service-areas.njk). Each city reuses the page's own green location
   card (.location-column-1, .location-name, .serve-are-list); these rules only add what linked lists need. */

/* Two lists per card (services, problems) instead of the original four-column name grid */
.address-text._2-column-addres.service-area-links {
  grid-template-columns: 1fr 1fr;
  grid-column-gap: 30px;
}

@media screen and (max-width: 767px) {
  .address-text._2-column-addres.service-area-links {
    grid-template-columns: 1fr;
    grid-row-gap: 20px;
  }
}

/* The card's hover zoom moves links under the pointer; keep these cards still */
.location-column-1.service-area-city:hover {
  transform: none;
}

.service-area-group-title {
  margin-bottom: 8px;
  font-weight: 700;
}

.serve-are-list .service-area-link {
  color: #fff;
  font-family: Manrope, Arial, sans-serif;
  font-size: 1.05rem;
  line-height: 2;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.serve-are-list .service-area-link:hover {
  text-decoration-thickness: 2px;
}

.serve-are-list .service-area-link:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 2px;
}

.service-area-also {
  max-width: 963px;
}
