
section.content {
  background: var(--color-gray-100);
  padding: var(--spacing-10) 0 var(--spacing-20) 0;
}


/* CONTACT SECTION */
section.contact {
  background: var(--color-yellow-200);
  padding: var(--spacing-20) 0;
}
.contact-grid {
  display: grid;
  grid-template-columns: 1fr;
  grid-gap: var(--spacing-10);
}
.contact h2 {
  margin-top: 0;
}
.contact p {
  margin-bottom: var(--spacing-6);
}
.contact-map {
  margin-top: var(--spacing-6);
}
.contact-form {
}

@media screen and (min-width: 40rem) {

}

@media screen and (min-width: 72rem) {
  .contact-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-gap: var(--spacing-20);
  }
}


.prose p {
  max-width: 100%;
}
.service-location:before {
  content: "📍";
}
.service-location h3 {
  display: inline-block;
  padding-left: var(--spacing-4);
}
.service-location h3 a {
  text-decoration: underline;
  text-decoration-color: var(--color-link);
  text-decoration-thickness: 2px;
}
.service-location:after {
  content: "→";
  color: var(--color-gray);
  font-weight: var(--font-line);
}
.service-location h3 a:hover {
  margin-right: 2px;
  transition: 0.05s;
  text-decoration-color: var(--color-link-hover);
}

@media all and (max-width: 48em) {

  .service-locations-list {
/*    display: block;
    max-width: 100%;*/
  }
}


.latest .prose {
	max-width: 100%;
}

.location_feed_list {
}

.location_feed_article {
}
.location_feed_list_image {
  height: 180px;
}
.location_feed_list_image img {
  width: 100%;
  height: 180px;

}

.location_feed_list_info {
/*  grid-column: 1;*/
}
.location_feed_list_info h3 {
  padding-top: 0;
  margin-top: 0;
}
.location_feed_list_info h3 a {
  color: var(--color-menu-text);
  text-decoration: none;
  transition: color 0.1s ease;
}
.location_feed_list_info h3 a:hover {
  color: rgb(237, 76, 103);
  transition: color 0.1s ease;
}
.location_feed_list_info h3 a:after {
  content: "»";
  padding-left: 0.5rem;
  transition: padding 0.1s ease;
}
.location_feed_list_info h3 a:hover:after {
  padding-left: 0.75rem;
}
.location_feed_list_info a.read_more {
/*  font-family: monospace;*/
  color: white;
  text-decoration: none;
  padding: 0.25rem 0.75rem;
  background: rgb(237, 76, 103);
  transition: padding 0.1s ease;
}
.location_feed_list_info a.read_more:hover {
  background: rgb(237, 76, 103);
  transition: padding 0.1s ease;
  padding-left: 1rem;
}

/* --- Location page polish: card-style service-locations list --- */

.service-locations {
  margin: var(--spacing-16) auto;
}
.service-locations h2 {
  margin-top: 0;
  margin-bottom: var(--spacing-6);
}
.service-locations-list.columns {
  grid-template-columns: 1fr;
  grid-gap: var(--spacing-4);
}
.service-location {
  position: relative;
  background: var(--color-gray-100, #f5f5f5);
  border-radius: var(--rounded-xl);
  padding: var(--spacing-5) var(--spacing-8) var(--spacing-5) var(--spacing-10);
  transition: transform 0.25s ease, box-shadow 0.25s ease, background 0.25s ease;
}
.service-location:before {
  content: "";
  position: absolute;
  left: var(--spacing-6);
  top: 1.7rem;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--color-menu-bg);
}
.service-location h3 {
  display: block;
  padding-left: 0;
  margin: 0;
  font-size: var(--text-lg);
  line-height: var(--leading-snug);
}
.service-location h3 a {
  text-decoration: none;
  color: inherit;
}
.service-location:after {
  content: "\2192";
  position: absolute;
  right: var(--spacing-5);
  top: 50%;
  transform: translateY(-50%);
  color: var(--color-menu-bg);
  font-weight: var(--font-bold);
  opacity: 0;
  transition: opacity var(--transition-base), right var(--transition-base);
}
.service-location:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-md);
  background: var(--color-white);
}
.service-location:hover h3 a {
  color: var(--color-menu-bg);
}
.service-location:hover:after {
  opacity: 1;
  right: var(--spacing-4);
}

/* Contact section polish */
.contact-map .responsive-iframe {
  border-radius: var(--rounded-xl);
  overflow: hidden;
  box-shadow: var(--shadow-md);
}

@media screen and (min-width: 40rem) {
  .service-locations-list.columns {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media screen and (min-width: 72rem) {
  .service-locations-list.columns {
    grid-template-columns: repeat(3, 1fr);
  }
}