/* ================================
   Services Page Custom CSS (page-id-1063)
================================== */

/* 🔧 Reset Base */
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

/* 🎯 Typography Adjustments */
.page-id-1063 h1 {
  font-family: 'Montserrat', sans-serif;
  font-weight: 800 !important;
}

.page-id-1063 h2.dsm-animated-gradient-text.et_pb_module_header {
  font-weight: 800 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-size: clamp(2.5rem, 5vw, 4rem) !important;
  line-height: 1.2 !important;
  margin: 0 !important;
  padding: 0 !important;
  transform: translateY(2px);
  -webkit-font-smoothing: antialiased;
  overflow: visible;
}

.page-id-1063 .et_pb_heading_0 h3.et_pb_module_heading,
.page-id-1063 #benefit h3.dsm_blob_title {
  font-weight: 800 !important;
  font-family: 'Montserrat', sans-serif !important;
}

/* 🖼 Services Image */
.page-id-1063 .services-event-img {
  max-width: 100% !important;
  height: auto !important;
  display: block !important;
  aspect-ratio: auto !important;
  content-visibility: auto !important;
  border: transparent;
}

/* 🟣 Transparent image wrapper */
.page-id-1063 .services-event-img-wrapper {
  background: transparent;
  border-bottom-right-radius: 0 !important;
  overflow: hidden; /* Optional: clips inner content if it spills outside rounded corner */
}


/* ================================
   🎠 Default Carousel Layout Fix
================================== */

.page-id-1063 .slick-slide {
  min-height: 100% !important;
  height: auto !important;
}

.page-id-1063 .et_pb_blurb {
  margin-bottom: 20px !important;
  height: 100% !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
}

/* Optional class for special slide config */
.page-id-1063 .pac_dcm_column_1.slick-slide {
  min-height: 100% !important;
  display: flex !important;
  align-items: stretch !important;
}

.page-id-1063 .pac_dcm_column_1 .et_pb_blurb {
  height: 100% !important;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

/* ================================
   ✅ Test Carousel Styles
================================== */
.page-id-1063 #test-services-carousel .test_services_card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100% !important;
  padding: 2rem;
  background: #f6f4ff;
  border-radius: 12px;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
  transition: transform 0.3s ease;
}

.page-id-1063 #test-services-carousel .test_services_card:hover {
  transform: translateY(-5px);
}

.page-id-1063 #test-services-carousel .et_pb_blurb_image {
  margin-bottom: 1.5rem;
}

.page-id-1063 #test-services-carousel .et_pb_button {
  margin-top: auto;
  align-self: center;
}

/* 🎯 Responsive Fix @1024px–1100px */
@media (min-width: 981px) and (max-width: 1100px) {
  .page-id-1063 .slick-slide {
    width: 100% !important;
    max-width: 320px !important;
    margin: 0 auto !important;
  }

  .page-id-1063 .slick-track {
    display: flex !important;
    justify-content: center !important;
    align-items: stretch !important;
    gap: 1rem !important;
  }

  .page-id-1063 .slick-slide > div {
    display: flex !important;
    height: auto !important;
  }

  .page-id-1063 .et_pb_blurb {
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
  }

  .page-id-1063 .et_pb_blurb_content {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    height: 100% !important;
  }

  .page-id-1063 .et_pb_blurb_container {
    flex-grow: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
  }

  .page-id-1063 .et_pb_main_blurb_image {
    flex-shrink: 0 !important;
  }
}

/* 💠 Desktop-only image rounding */
@media (min-width: 981px) {
  .page-id-1063 .services-event-img {
    border-top-right-radius: 0 !important;
  }
}

/* 📱 Small phone text adjustment */
@media (max-width: 480px) {
  .page-id-1063 h1 {
    font-size: 2.4rem !important;
    line-height: 1.2 !important;
    margin-top: 1rem;
    margin-bottom: 1rem;
    border-bottom-right-radius: 0 !important;
  }
}

/* 📱 Tablet Portrait (max-width: 600px) */
@media (max-width: 600px) {
  .page-id-1063 .hero-section {
    padding-bottom: 0 !important;
    overflow: visible !important;
    position: relative;
    z-index: 1;
  }

  .page-id-1063 .services-hero-row {
    padding-top: 3rem !important;
    padding-bottom: 3rem !important;
    display: block !important;
    height: auto !important;
    overflow: visible !important;
    position: relative;
    z-index: 2;
  }

  .page-id-1063 .et_pb_text_0 {
    padding-top: 1rem !important;
    padding-bottom: 2rem !important;
    margin-bottom: 2rem !important;
    height: auto !important;
    overflow: visible !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  .page-id-1063 .et_pb_text_0 h1 {
    font-size: clamp(2.6rem, 6vw, 3.2rem) !important;
    margin-top: 0.5rem !important;
    margin-bottom: 1.5rem !important;
    display: block !important;
  }
}

@media (max-width: 768px) {
  .page-id-1063 .sessions-divider {
    padding-top: 2rem !important;
  }
}

@media (max-width: 800px) {
  .page-id-1063 .slick-track {
    display: flex !important;
    align-items: stretch !important;
  }

  .page-id-1063 .slick-slide {
    display: flex !important;
    height: auto !important;
    align-items: stretch !important;
  }

  .page-id-1063 .slick-slide > div {
    display: flex !important;
    flex: 1 0 100% !important;
  }

  .page-id-1063 .test_services_card {
    height: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    padding: 15px !important;
  }
}

@media (min-width: 1024px) {
  .page-id-1063 .test_services_card {
    justify-content: flex-start !important;
  }

  .page-id-1063 .et_pb_blurb_content,
  .page-id-1063 .et_pb_blurb_container {
    justify-content: flex-start !important;
  }

  .page-id-1063 .et_pb_button {
    margin-top: 2rem !important; /* Space between body text and button */
  }
}

/* 🚫 Prevent horizontal scroll */
.page-id-1063 html,
.page-id-1063 body,
.page-id-1063 #et-boc,
.page-id-1063 #main-content,
.page-id-1063 #page-container {
  overflow-x: hidden !important;
  max-width: 100vw !important;
  position: relative;
}