/* ========= HOMEPAGE BASE ========= */

/* Kill horizontal scroll only on homepage template */
body.page-template-page-homepage-php {
  overflow-x: hidden;
}

/* Make sure the base background is light (so no black bars show through) */
html,
body {
  margin: 0;
  background-color: #ffffff;
}

/* Optional: safer box-sizing just on homepage area */
body.page-template-page-homepage-php *,
body.page-template-page-homepage-php *::before,
body.page-template-page-homepage-php *::after {
  box-sizing: border-box;
}



/* ========= SERVICES ========= */

.page-template-page-homepage-php .services {
  background-color: #FAF9F7 !important;
  width: 100%;
  margin: 0;
  padding: 100px 0; /* inner container handles rails */
}

/* Inner rail */
.page-template-page-homepage-php .services .section.image-content {
  max-width: 1240px;
  margin: 0 auto;
  display: flex;
  align-items: stretch;
  gap: clamp(16px, 3vw, 32px);
  padding: 0 40px;
}

/* Columns */
.page-template-page-homepage-php .section.image-content > .left {
  flex: 0 1 45%;
  min-width: 0;
}
.page-template-page-homepage-php .section.image-content > .right {
  flex: 0 1 55%;
  min-width: 0;
}

/* Right column as card */
.page-template-page-homepage-php .section.image-content > .right {
  background: #fff;
  box-shadow: 0 4px 4px rgba(16,24,32,0.08);
  padding: 30px 20px 0 20px;
}

/* Section title */
.page-template-page-homepage-php .services .image-content .services-section-title {
  font-size: clamp(26px, 3vw, 32px) !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  margin: 0 0 16px !important;
}

/* Button spacing in left column */
.page-template-page-homepage-php .services .image-content .left a {
  margin-top: 18px !important;
}

/* Lists (Font Awesome bullets) */
.page-template-page-homepage-php .services .service-list,
.page-template-page-homepage-php .services .service-list ul {
  list-style: none !important;
  margin: 0;
  padding: 0;
}

.page-template-page-homepage-php .services .service-list li {
  width: 48%;
  font-size: 16px !important;
  line-height: 2 !important;
  padding-left: 2.2em !important;
  font-weight: 600;
  font-family: 'Noto Sans', Arial, sans-serif !important;
  text-transform: uppercase !important;
  margin-bottom: 1em;
  position: relative;
  background: none !important;
}

/* Strip theme bullets */
.page-template-page-homepage-php .services .service-list li:before,
.page-template-page-homepage-php .services .service-list li::before,
.page-template-page-homepage-php .services .service-list li:after,
.page-template-page-homepage-php .services .service-list li::after {
  background: none !important;
}

/* Font Awesome checkmark */
.page-template-page-homepage-php .services .service-list li::before {
  content: "\f058" !important;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 1.5em;
  text-align: center;
  line-height: 1;
  font-size: 1.5em;
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  color: #007FA3;
}

/* Paragraphs inside list items */
.page-template-page-homepage-php .services .service-list p {
  margin: 0 !important;
  padding: 0 !important;
}

/* Fine-tune about copy */
.page-template-page-homepage-php .services .about-list p {
  font-size: 15px !important;
}

/* Responsive: stack columns and adjust padding */
@media (max-width: 1080px) {
  .page-template-page-homepage-php .services .section.image-content {
    flex-direction: column;
  }
  .page-template-page-homepage-php .services .service-list li {
    width: 100%;
  }
}

@media (max-width: 768px) {
  .page-template-page-homepage-php .services .section.image-content {
    padding: 0 16px;
  }
}



/* ========= WHAT WE OFFER (carousel section) ========= */

/* ===== WHAT WE OFFER / CAROUSEL SECTION ===== */
/* Markup:
<div class="bg-third overflow offer-section">
  <div class="section ta-center">
    <h2 class="titles marg-b-40 offer-title">...</h2>
    <p>offer_content</p>

    <div class="grid-wrap-panels"> ... owl ... </div>

    <div class="relative">
      <a class="button marg-t-40 desktop">View all services</a>
      <div class="owl-navigation marg-t-10">
        <a class="left-owl-circles">...</a>
        <a class="right-owl-circles">...</a>
      </div>
    </div>

    <a class="button marg-t-40 mobile">View all services</a>
  </div>
</div>
*/

/* Full width background, no side weirdness */
.page-template-page-homepage-php .bg-third.offer-section {
  position: relative;
  width: 100%;
  margin: 0;
  background: #FFFFFF !important;
}

/* Inner rail: same center and padding as other sections */
.page-template-page-homepage-php .bg-third.offer-section > .section.ta-center {
  max-width: 1240px;
  margin-left: auto;
  margin-right: auto;
  padding: 100px 40px;
  box-sizing: border-box;
  text-align: center;
}

/* Make sure the inner wrappers are not shifting left or right */
.page-template-page-homepage-php .bg-third.offer-section .grid-wrap-panels,
.page-template-page-homepage-php .bg-third.offer-section .carousel-services {
  margin: 0;
  padding: 0;
}

/* Title */
.page-template-page-homepage-php h2.offer-title,
.page-template-page-homepage-php .titles.offer-title {
  line-height: 1.2 !important;
  margin: 0 0 16px !important;
  font-weight: 600 !important;
  font-size: 32px !important;
}

.page-template-page-homepage-php .bg-third.offer-section > .section.ta-center > p {
  max-width: 720px;          /* optional: keeps lines readable */
  margin: 0 auto 24px auto;  /* center the paragraph block */
}

/* Desktop carousel spacing */
.page-template-page-homepage-php .carousel-services {
  margin-top: 60px !important;
}


/* Card text tweaks */
.page-template-page-homepage-php .carousel-services .panel .pad-40,
.page-template-page-homepage-php .carousel-services .panel .pad-b-40 {
  padding: 16px !important;
}

.page-template-page-homepage-php .carousel-services .panel.marg-t-60 {
  margin-top: 20px !important;
}

.page-template-page-homepage-php .carousel-services .gradient-bt-50 {
  background: linear-gradient(
    to top,
    rgba(0, 0, 0, .60) 20%,
    rgba(0, 0, 0, 0) 100%
  ) !important;
}

.page-template-page-homepage-php .carousel-services h3.titles.medium.offer-titles {
  margin: 0 0 20px !important;
  line-height: 1.25 !important;
  letter-spacing: .01em;
  color: #fff !important;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* === CTA button + arrows row (desktop) === */
/* Center the button and arrows as a group under the carousel */
.page-template-page-homepage-php .bg-third.offer-section .relative {
  margin-top: 24px;
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}

/* Desktop button inside the group */
.page-template-page-homepage-php .bg-third.offer-section .relative .button.desktop {
  order: 1;
}

/* Arrow navigation inside the group */
.page-template-page-homepage-php .bg-third.offer-section .relative .owl-navigation {
  order: 2;
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
}

/* Make sure the nav arrows themselves do not add strange margins */
.page-template-page-homepage-php .bg-third.offer-section .relative .owl-navigation a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* Mobile button already sits inside the same 1240px rail */
@media (max-width: 768px) {
  .page-template-page-homepage-php .bg-third.offer-section > .section.ta-center {
    padding: 80px 16px;
  }
	
  .page-template-page-homepage-php .bg-third.offer-section .relative {
    margin-top: 24px;
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
	align-content: center;
	justify-content: center;
  }
}



/* ========= "YOU'RE IN THE RIGHT PLACE" ========= */

.page-template-page-homepage-php .right-place {
  position: relative;
  width: 100%;
  margin: 0;
  background: #FAF9F7;
}

/* Inner rail */
.page-template-page-homepage-php .right-place__inner {
  max-width: 1240px;
  margin: 0 auto;
  padding: 100px 40px;
}

/* Heading + intro */
.page-template-page-homepage-php .right-place__heading,
.page-template-page-homepage-php #right-place-title {
  font-size: clamp(26px, 3vw, 32px) !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  margin: 0 0 16px 0 !important;
  text-align: center !important;
}
.page-template-page-homepage-php .right-place__intro {
  text-align: center !important;
  margin-bottom: 40px;
}

/* Grid: 3 → 2 → 1 */
.page-template-page-homepage-php .right-place__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 32px;
}

/* Card */
.page-template-page-homepage-php .right-place__card {
  padding: 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}

/* Icon wrapper */
.page-template-page-homepage-php .right-place__iconwrap {
  display: grid;
  place-items: center;
  width: 160px;
  aspect-ratio: 1 / 1;
  padding: 10px;
  margin: 0 auto 14px;
  background: transparent;
}

/* Icon image */
.page-template-page-homepage-php .right-place__icon {
  display: block;
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
}

/* Title + copy */
.page-template-page-homepage-php .right-place__title {
  font-size: 22px !important;
  font-weight: 600 !important;
  line-height: 1.2 !important;
  margin: 0 0 16px 0 !important;
}
.page-template-page-homepage-php .right-place__text {
  margin: 0;
  font-size: 15px;
  line-height: 1.6;
  color: #101820;
}

/* Responsive */
@media (max-width: 1080px) {
  .page-template-page-homepage-php .right-place__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 575.98px) {
  .page-template-page-homepage-php .right-place__inner {
    padding: 80px 16px;
  }
  .page-template-page-homepage-php .right-place__grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .page-template-page-homepage-php .right-place__iconwrap {
    width: 140px;
  }
}



/* ========= FOOTER CTA ========= */

.page-template-page-homepage-php .bg-image.reviews-wrap {
  width: 100%;
  margin: 0;
  background-size: cover;
  background-position: center;
}

/* Inner rail */
.page-template-page-homepage-php .footer-cta {
  padding: 100px 40px !important;
  max-width: 1240px;
  margin: 0 auto;
}

@media (max-width: 768px) {
  .page-template-page-homepage-php .footer-cta {
    padding: 80px 16px !important;
  }
}