/* Pastel green theme and hero carousel corrections */
:root {
  --clr-main: #7fbea0;
  --clr-txt: #30463c;
  --clr-txt-sub: #496056;
  --clr-sub: #f4fbf7;
  --clr-body: #344b41;
  --clr-link: #344b41;
  --bg-main: #7fbea0;
  --bg-grn: #7fbea0;
  --bg-grn-02: #73aa93;
  --bg-grn-03: #64937f;
  --bg-grn-04: #4f7d68;
  --bg-grn-05: #669a83;
  --bg-grn-06: #78ad94;
  --bg-grn-07: #dff2e7;
  --bg-grn-08: #f4fbf7;
  --bg-grn-09: #8bc9ac;
  --bg-grn-10: #e7f4ec;
  --bg-grn-11: #e3f0e8;
  --bg-grn-12: #5f8f7b;
  --bg-grn-13: #85c3a6;
  --bg-grn-14: #e8f7ee;
  --bg-grn-15: #7fbea0;
  --bg-grn-16: #7fbea0;
  --bg-grn-17: #edf8f1;
}

body {
  color: var(--clr-body);
  background-color: #fbfefc;
}

/* Keep white text legible on the softened principal green. */
.btn a,
.gnav--contact a,
.cta_contact a,
.home_news_btn,
[class*="bg-main"] {
  transition: background-color .3s ease, color .3s ease, opacity .3s ease;
}

.hero--content .main_ttl > span.marker::before {
  background-image: linear-gradient(100deg, #86c6a8 0%, #5f917c 100%);
  box-shadow: 0 8px 24px rgba(79, 125, 104, .12);
}

.hero_slides-main {
  background: #eef8f2 !important;
  overflow: hidden;
  isolation: isolate;
}

.hero_carousel {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 100%;
  background: #eef8f2;
}

.hero_carousel:not(.slick-initialized) {
  display: block;
}

.hero_carousel:not(.slick-initialized) .hero_carousel-item {
  display: none;
}

.hero_carousel:not(.slick-initialized) .hero_carousel-item:first-child,
.hero_carousel.hero_carousel-fallback .hero_carousel-item:first-child {
  display: block;
}

.hero_carousel-item,
.hero_carousel-item img,
.hero_carousel .slick-list,
.hero_carousel .slick-track,
.hero_carousel .slick-slide,
.hero_carousel .slick-slide > div {
  width: 100%;
  height: 100%;
}

.hero_carousel-item img {
  display: block;
  object-fit: cover;
  object-position: center;
}

.hero_carousel .slick-dots button {
  border: 1px solid rgba(255, 255, 255, .9);
  background: rgba(255, 255, 255, .72);
  box-shadow: 0 2px 10px rgba(48, 70, 60, .14);
}

.hero_carousel .slick-dots .slick-active button {
  background: #7fbea0;
  border-color: #fff;
}

.home_news > div.flex,
.home_feature--item,
.home_service--item,
.home_story--slide .slick-slide > div {
  box-shadow: 0 12px 35px rgba(69, 107, 89, .08);
}

@media (prefers-reduced-motion: reduce) {
  .hero_carousel .slick-track,
  .hero_carousel .slick-slide {
    transition-duration: 0.01ms !important;
  }
}