/* Keep the services intro and cards on a predictable grid at laptop widths. */
/* The theme enables its full XL navigation at 1200px, although all header
   controls only fit comfortably from 1400px. Use the compact menu in between. */
@media (min-width: 1200px) and (max-width: 1399.98px) {
  .header .navbar.d-xl-flex {
    display: none !important;
  }

  .header .menu_toggler.d-xl-none {
    display: block !important;
  }

  .header .container > .row {
    flex-wrap: nowrap;
    align-items: center;
  }

  .header .hd_ct_item,
  .header .hd_ct_item a {
    white-space: nowrap;
  }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
  .posts_archive_wr > .col-lg-6 {
    flex: 0 0 100%;
    max-width: 100%;
    height: auto;
    margin-bottom: 28px;
  }

  .posts_archive_wr > .loop_service_wr {
    display: flex;
    align-self: stretch;
  }

  .posts_archive_wr > .loop_service_wr > .inner_wr {
    width: 100%;
  }
}

@media (min-width: 576px) and (max-width: 991.98px) {
  .posts_archive_wr > .loop_service_wr {
    display: flex;
    align-self: stretch;
  }

  .posts_archive_wr > .loop_service_wr > .inner_wr {
    width: 100%;
  }
}

/* Portfolio taxonomy filters must keep readable labels instead of shrinking
   every item to a few characters per line. */
.section_portfoliobuttons_wr .filter_wr {
  display: flex;
  flex-wrap: nowrap;
  gap: 12px;
  overflow-x: auto;
  overflow-y: visible;
  padding-bottom: 14px;
  scroll-snap-type: x proximity;
  scrollbar-width: thin;
  scrollbar-color: rgba(255, 255, 255, 0.45) transparent;
  -webkit-overflow-scrolling: touch;
}

.section_portfoliobuttons_wr .filter_wr .filter_item {
  flex: 0 0 auto;
  width: auto;
  min-width: max-content;
  margin-right: 0 !important;
  padding-inline: 20px;
  white-space: nowrap;
  line-height: 1.25;
  scroll-snap-align: start;
}

.section_portfoliobuttons_wr .portfolio_archive_wr .loop_portfolio_image_wr,
.section_portfoliobuttons_wr .portfolio_archive_wr .cover_image {
  display: block;
  width: 100%;
  overflow: hidden;
}

.section_portfoliobuttons_wr .portfolio_archive_wr .cover_image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

@media (max-width: 991.98px) {
  .section_portfoliobuttons_wr .filter_wr {
    margin-inline: -15px;
    width: calc(100% + 30px);
    padding-inline: 15px;
  }

  .section_portfoliobuttons_wr .filter_wr .filter_item:first-child,
  .section_portfoliobuttons_wr .filter_wr .filter_item.selected:first-child {
    margin-left: 0;
  }
}

@media (max-width: 575.98px) {
  .section_portfoliobuttons_wr .filter_wr .filter_item {
    min-height: 46px;
    height: auto;
    padding: 12px 16px;
    font-size: 15px;
  }

  .section_portfoliobuttons_wr .portfolio_archive_wr .loop_portfolio_image_wr {
    aspect-ratio: 16 / 10;
    height: auto;
  }
}