/* Home services row tuning. Loaded after style.css to avoid old duplicate rules. */
.services-section .service-item {
  grid-template-columns: 390px minmax(0, 1fr) 96px !important;
  gap: 44px !important;
  overflow: visible !important;
}

.services-section .service-copy {
  min-width: 0;
  padding-right: 18px;
}

.services-section .service-copy h3 {
  font-size: clamp(31px, 2.55vw, 50px) !important;
  line-height: 1.06 !important;
}

.services-section .service-copy p {
  max-width: 860px;
  font-size: clamp(16px, 1.12vw, 22px) !important;
  line-height: 1.36 !important;
}

.services-section .service-arrow {
  justify-self: center !important;
  width: 54px !important;
  height: 54px !important;
  overflow: visible !important;
}

.services-section .service-arrow::before {
  right: 10px !important;
  bottom: 10px !important;
  width: 34px !important;
  height: 5px !important;
}

.services-section .service-arrow::after {
  right: 9px !important;
  bottom: 9px !important;
  width: 22px !important;
  height: 22px !important;
}

.services-section .service-item:first-child .service-arrow,
.services-section .service-item:hover .service-arrow,
.services-section .service-item:focus-within .service-arrow {
  transform: none !important;
}

@media (min-width: 810px) and (max-width: 1439px) {
  .services-section .service-item {
    grid-template-columns: 230px minmax(0, 1fr) 62px !important;
    gap: 24px !important;
  }

  .services-section .service-preview {
    width: 230px !important;
    height: 138px !important;
  }

  .services-section .service-copy h3 {
    font-size: clamp(25px, 3.2vw, 36px) !important;
  }

  .services-section .service-copy p {
    font-size: 15px !important;
  }

  .services-section .service-arrow {
    width: 40px !important;
    height: 40px !important;
  }
}

@media (max-width: 809px) {
  .services-section .service-item {
    grid-template-columns: 1fr 44px !important;
    gap: 16px !important;
  }

  .services-section .service-copy h3 {
    font-size: clamp(24px, 7.3vw, 30px) !important;
  }

  .services-section .service-copy p {
    font-size: 15px !important;
  }

  .services-section .service-arrow {
    width: 34px !important;
    height: 34px !important;
  }

  .services-section .service-arrow::before {
    right: 6px !important;
    bottom: 6px !important;
    width: 25px !important;
    height: 4px !important;
  }

  .services-section .service-arrow::after {
    right: 6px !important;
    bottom: 6px !important;
    width: 16px !important;
    height: 16px !important;
    border-right-width: 4px !important;
    border-bottom-width: 4px !important;
  }
}
