/* =============================================================
   FUTURE EVENTS PAGE
   Loaded only on page-future-events-page.php
   ============================================================= */

/* ------------------------------------------
   Layout
------------------------------------------ */
.page-template-page-future-events-page-php .future-events-page {
  padding-bottom: 30px;
}

.page-template-page-future-events-page-php .future-events-hero {
  margin: 40px auto;
}

.page-template-page-future-events-page-php .future-events-hero__grid {
  display: flex;
  align-items: stretch;
  gap: 0;
  border-radius: 25px;
  overflow: auto;
}

.page-template-page-future-events-page-php .future-events-hero__content,
.page-template-page-future-events-page-php .future-events-hero__slider-wrap {
  width: 50%;
  height: 385px;
}

.page-template-page-future-events-page-php .future-events-hero__slider-wrap {
  display: flex;
  align-items: stretch;
}

.page-template-page-future-events-page-php .future-events-hero__content {
  background: var(--asp-plum);
  color: var(--white);
  padding: 40px;
}

.page-template-page-future-events-page-php
  .future-events-richtext
  > *:first-child {
  margin-top: 0;
}

.page-template-page-future-events-page-php .article-title {
  color: var(--asp-plum);
}

.page-template-page-future-events-page-php
  .future-events-richtext
  > *:last-child {
  margin-bottom: 0;
}

/* ------------------------------------------
   Slider
------------------------------------------ */
.page-template-page-future-events-page-php .future-events-slider,
.page-template-page-future-events-page-php .future-events-slider .slick-list,
.page-template-page-future-events-page-php .future-events-slider .slick-track {
  height: 100%;
}

.page-template-page-future-events-page-php .future-events-slider {
  width: 100%;
}

.page-template-page-future-events-page-php .future-events-slider__item {
  height: calc(100% - 5px);
}

.page-template-page-future-events-page-php .future-events-slider .slick-dots {
  bottom: 25px;
}

.page-template-page-future-events-page-php
  .future-events-slider.slick-dotted.slick-slider {
  margin-bottom: 0;
}

.page-template-page-future-events-page-php .future-events-slider__item img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ------------------------------------------
   Events List
------------------------------------------ */
.page-template-page-future-events-page-php .future-events-list {
  margin-top: 30px;
}

.page-template-page-future-events-page-php .future-events-list__row {
  display: flex;
  align-items: flex-start;
  padding-top: 30px;
  padding-bottom: 30px;
  border-bottom: 3px solid var(--asp-green);
  gap: 30px;
}

.page-template-page-future-events-page-php .future-events-list__image-col {
  flex: 0 0 33.3333%;
  max-width: 33.3333%;
}

.page-template-page-future-events-page-php .future-events-list__content-col {
  flex: 0 0 66.6667%;
  max-width: 66.6667%;
}

.page-template-page-future-events-page-php .future-events-list__image-col img {
  display: block;
  width: 100%;
  height: auto;
}

/* ------------------------------------------
   Responsive
------------------------------------------ */
@media (max-width: 768px) {
  .page-template-page-future-events-page-php .future-events-hero__grid {
    flex-direction: column;
  }

  .page-template-page-future-events-page-php .future-events-hero__content,
  .page-template-page-future-events-page-php .future-events-hero__slider-wrap {
    width: 100%;
    height: auto;
  }

  .page-template-page-future-events-page-php .future-events-hero__content {
    padding: 24px;
  }

  .page-template-page-future-events-page-php .future-events-slider__item {
    min-height: 240px;
  }

  .page-template-page-future-events-page-php .future-events-list__row {
    flex-direction: column;
    gap: 20px;
  }

  .page-template-page-future-events-page-php .future-events-list__image-col,
  .page-template-page-future-events-page-php .future-events-list__content-col {
    flex: 0 0 100%;
    max-width: 100%;
  }
}