/*
 * Focused homepage refinements for the recovered White Turtle site.
 * This file is intentionally scoped so the original site's visual direction
 * and other pages remain unchanged.
 */

.banner-main .swiper-slide > img {
  display: block;
  width: 100%;
  height: clamp(520px, 45vw, 680px);
  object-fit: cover;
  object-position: center bottom;
}

/* The first two banners contain important copy inside the artwork. Anchoring
 * them to the bottom keeps every line visible on differently sized laptops. */
.banner-main .banner-photo-slide > img {
  object-position: center;
}

.banner-main .swiper-heading {
  width: min(88%, 1000px);
}

.banner-main .swiper-heading h2 {
  margin: 0;
  font-size: clamp(1.7rem, 3.2vw, 3.125rem);
  line-height: 1.15;
}

.wpo-mission-vission-section .row,
.wpo-service-section-s4 .row,
.contact-info-section .office-info .row {
  align-items: stretch;
}

.wpo-mission-vission-section .home-mission-item,
.wpo-service-section-s4 .wpo-service-item,
.contact-info-section .office-info .office-info-item {
  height: 100%;
}

@media (max-width: 991.98px) {
  .banner-main .swiper-slide > img {
    height: 56.25vw;
    object-position: center;
  }

  .banner-main .swiper-pagination {
    bottom: 10px;
    display: block;
  }

  .banner-main .swiper-pagination-bullet {
    width: 12px;
    height: 12px;
    background: #fff;
    opacity: 0.8;
  }

  .banner-main .swiper-pagination-bullet-active {
    background: #ff4a17;
    opacity: 1;
  }

  .wpo-mission-vission-section .row,
  .wpo-service-section-s4 .row,
  .contact-info-section .office-info .row {
    row-gap: 20px;
  }

  .wpo-mission-vission-section .wpo-vission-item {
    margin-top: 0;
  }

  .wpo-service-section-s4 .wpo-service-item {
    margin-bottom: 0;
  }

  .contact-info-section .office-info .col .office-info-item,
  .contact-info-section .office-info .col:last-child .office-info-item {
    margin-bottom: 0;
  }

  .wpo-service-section-s4 .wpo-service-item .wpo-service-text .service-content a {
    min-height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
}

@media (max-width: 1200px) {
  .home-about-section .wpo-about-wrap .wpo-about-img .wpo-about-exprience {
    height: auto;
    min-height: 112px;
    box-sizing: border-box;
  }

  .home-about-section .wpo-about-wrap .wpo-about-img .wpo-about-exprience h3 {
    margin: 0 0 8px;
    line-height: 1.2;
  }

  .home-about-section .wpo-about-wrap .wpo-about-img .wpo-about-exprience p {
    margin: 0;
    line-height: 1.4;
    overflow-wrap: anywhere;
  }
}

@media (min-width: 992px) and (max-width: 1399px) {
  #header .wpo-site-header {
    padding-right: 24px;
    padding-left: 24px;
  }
}

@media (max-width: 767px) {
  .home-about-section .wpo-about-wrap {
    margin-bottom: 60px;
  }

  .home-about-section .wpo-about-wrap .wpo-about-img .wpo-about-exprience {
    right: 12px;
    bottom: -40px;
    left: 12px;
    width: auto;
    padding: 16px 14px;
  }

  .home-about-section .wpo-about-wrap .wpo-about-img .wpo-about-exprience h3 {
    font-size: clamp(20px, 4.5vw, 28px);
  }

  .home-about-section .wpo-about-wrap .wpo-about-img .wpo-about-exprience p {
    font-size: 15px;
  }
}

@media (max-width: 575.98px) {
  .banner-main .swiper-slide > img {
    height: 56.25vw;
  }

  .banner-main .banner-photo-slide .swiper-heading {
    top: 73%;
  }

  .banner-main .banner-photo-slide .swiper-heading h2 {
    font-size: clamp(1rem, 5.2vw, 1.25rem);
    line-height: 1.15;
  }

  .swiper-heading {
    width: min(88%, 330px);
  }

  .swiper-heading h2 {
    margin: 0;
    font-size: clamp(1.2rem, 6vw, 1.7rem);
    line-height: 1.25;
  }

  .wpo-mission-vission-section {
    padding: 36px 0;
  }

  .wpo-mission-vission-section .row,
  .wpo-service-section-s4 .row,
  .contact-info-section .office-info .row {
    row-gap: 16px;
  }

  .wpo-mission-vission-section .home-mission-item {
    height: auto;
    min-height: 0;
    padding: 28px 24px;
  }

  .wpo-mission-vission-section .wpo-mission-item .wpo-mission-text h2,
  .wpo-mission-vission-section .wpo-vission-item .wpo-vission-text h2 {
    margin-bottom: 12px;
    font-size: 30px;
  }

  .wpo-mission-vission-section .wpo-mission-item .wpo-mission-text h5,
  .wpo-mission-vission-section .wpo-vission-item .wpo-vission-text h5 {
    margin-bottom: 0;
    font-size: 16px;
    line-height: 1.55;
  }

  .wpo-service-section-s4 .wpo-service-item {
    min-height: 0;
    padding: 28px 20px;
  }

  .wpo-service-section-s4 .wpo-service-item .wpo-service-text .service-icon {
    width: 88px;
    height: 88px;
    margin-bottom: 16px;
    line-height: 88px;
  }

  .wpo-service-section-s4 .wpo-service-item .wpo-service-text .service-icon .fi:before {
    font-size: 38px;
  }

  .wpo-service-section-s4 .wpo-service-item .wpo-service-text .service-content h2 {
    margin-bottom: 14px;
    font-size: 23px;
    line-height: 1.25;
  }

  .wpo-service-section-s4 .wpo-service-item .wpo-service-text .service-content a {
    padding: 9px 24px;
  }

  .home-about-section .wpo-about-text {
    padding-top: 0;
    margin-bottom: 40px;
  }

  .home-about-section .wpo-about-text p {
    text-align: left;
  }

  .home-about-section .wpo-about-wrap .wpo-about-img .wpo-about-exprience h3 {
    margin: 0 0 8px;
    font-size: clamp(20px, 6vw, 26px);
    line-height: 1.2;
  }

  .home-about-section .wpo-about-wrap .wpo-about-img .wpo-about-exprience p {
    margin: 0;
    font-size: 15px;
    line-height: 1.4;
    overflow-wrap: anywhere;
  }

  #header .navigation.sticky-header {
    padding: 8px 10px;
  }

  #header .navigation.sticky-header .navbar-header .navbar-brand img {
    max-width: 130px;
    height: auto;
  }

  .contact-info-section .office-info .office-info-item {
    min-height: 0;
    padding: 26px 18px;
  }

  .contact-info-section .office-info .office-info-item .office-info-text p {
    overflow-wrap: anywhere;
    font-size: 18px;
  }

  .contact-info-section .office-info .office-info-item .office-info-text span {
    margin-top: 14px;
    letter-spacing: 2px;
  }
}
