.services .page-banner {
  background-image: url("../images/service_banner_bg.png");
}
.services .page-banner-main-container {
  margin-top: 272px;
}
.services .page-banner-description {
  width: 819px;
}
.services-section-container {
  display: flex;
  flex-direction: column;
  gap: 160px;
  padding-top: 80px;
  padding-bottom: 160px;
}
.services-partners-section-content {
  display: flex;
  flex-wrap: wrap;
  column-gap: 24px;
  row-gap: 48px;
}
.services-partners-section-content-card {
  width: 336px;
  height: 240px;
  position: relative;
  border: 2px solid transparent;
  box-sizing: border-box;
}
.services-partners-section-content-card:hover {
  border: 2px solid transparent;
  border-image: linear-gradient(
      to right bottom,
      rgba(228, 25, 54, 1),
      rgba(228, 25, 54, 0.2),
      rgba(228, 25, 54, 1)
    )
    1;
}
.services-partners-section-content-card-inner {
  width: 100%;
  height: 100%;
  position: relative;
}
.card-1 .services-partners-section-content-card-inner {
  background: url("../images/service_partners_1.jpg");
}
.card-1:hover .services-partners-section-content-card-inner {
  background: linear-gradient(
      0deg,
      rgba(249, 0, 43, 0.08) 0%,
      rgba(249, 0, 43, 0.08) 100%
    ),
    linear-gradient(180deg, #18181b 0%, #18181b 100%),
    url("../images/service_partners_1.jpg");
  background: linear-gradient(
      0deg,
      color(display-p3 0.8941 0.098 0.2118 / 0.08) 0%,
      color(display-p3 0.8941 0.098 0.2118 / 0.08) 100%
    ),
    linear-gradient(
      180deg,
      color(display-p3 0.0941 0.0941 0.1059 / 0) 0%,
      color(display-p3 0.0941 0.0941 0.1059) 100%
    ),
    url("../images/service_partners_1.jpg");
  backdrop-filter: blur(2px);
}
.card-2 .services-partners-section-content-card-inner {
  background: url("../images/service_partners_2.jpg");
}
.card-2:hover .services-partners-section-content-card-inner {
  background: linear-gradient(
      0deg,
      rgba(249, 0, 43, 0.08) 0%,
      rgba(249, 0, 43, 0.08) 100%
    ),
    linear-gradient(180deg, #18181b 0%, #18181b 100%),
    url("../images/service_partners_2.jpg");
  background: linear-gradient(
      0deg,
      color(display-p3 0.8941 0.098 0.2118 / 0.08) 0%,
      color(display-p3 0.8941 0.098 0.2118 / 0.08) 100%
    ),
    linear-gradient(
      180deg,
      color(display-p3 0.0941 0.0941 0.1059 / 0) 0%,
      color(display-p3 0.0941 0.0941 0.1059) 100%
    ),
    url("../images/service_partners_2.jpg");
  backdrop-filter: blur(2px);
}
.card-3 .services-partners-section-content-card-inner {
  background: url("../images/service_partners_3.jpg");
}
.card-3:hover .services-partners-section-content-card-inner {
  background: linear-gradient(
      0deg,
      rgba(249, 0, 43, 0.08) 0%,
      rgba(249, 0, 43, 0.08) 100%
    ),
    linear-gradient(180deg, #18181b 0%, #18181b 100%),
    url("../images/service_partners_3.jpg");
  background: linear-gradient(
      0deg,
      color(display-p3 0.8941 0.098 0.2118 / 0.08) 0%,
      color(display-p3 0.8941 0.098 0.2118 / 0.08) 100%
    ),
    linear-gradient(
      180deg,
      color(display-p3 0.0941 0.0941 0.1059 / 0) 0%,
      color(display-p3 0.0941 0.0941 0.1059) 100%
    ),
    url("../images/service_partners_3.jpg");
  backdrop-filter: blur(2px);
}
.card-4 .services-partners-section-content-card-inner {
  background: url("../images/service_partners_4.jpg");
}
.card-4:hover .services-partners-section-content-card-inner {
  background: linear-gradient(
      0deg,
      rgba(249, 0, 43, 0.08) 0%,
      rgba(249, 0, 43, 0.08) 100%
    ),
    linear-gradient(180deg, #18181b 0%, #18181b 100%),
    url("../images/service_partners_4.jpg");
  background: linear-gradient(
      0deg,
      color(display-p3 0.8941 0.098 0.2118 / 0.08) 0%,
      color(display-p3 0.8941 0.098 0.2118 / 0.08) 100%
    ),
    linear-gradient(
      180deg,
      color(display-p3 0.0941 0.0941 0.1059 / 0) 0%,
      color(display-p3 0.0941 0.0941 0.1059) 100%
    ),
    url("../images/service_partners_4.jpg");
  backdrop-filter: blur(2px);
}
.card-5 .services-partners-section-content-card-inner {
  background: url("../images/service_partners_5.jpg");
}
.card-5:hover .services-partners-section-content-card-inner {
  background: linear-gradient(
      0deg,
      rgba(249, 0, 43, 0.08) 0%,
      rgba(249, 0, 43, 0.08) 100%
    ),
    linear-gradient(180deg, #18181b 0%, #18181b 100%),
    url("../images/service_partners_5.jpg");
  background: linear-gradient(
      0deg,
      color(display-p3 0.8941 0.098 0.2118 / 0.08) 0%,
      color(display-p3 0.8941 0.098 0.2118 / 0.08) 100%
    ),
    linear-gradient(
      180deg,
      color(display-p3 0.0941 0.0941 0.1059 / 0) 0%,
      color(display-p3 0.0941 0.0941 0.1059) 100%
    ),
    url("../images/service_partners_5.jpg");
  backdrop-filter: blur(2px);
}
.card-6 .services-partners-section-content-card-inner {
  background: url("../images/service_partners_6.jpg");
}
.card-6:hover .services-partners-section-content-card-inner {
  background: linear-gradient(
      0deg,
      rgba(249, 0, 43, 0.08) 0%,
      rgba(249, 0, 43, 0.08) 100%
    ),
    linear-gradient(180deg, #18181b 0%, #18181b 100%),
    url("../images/service_partners_6.jpg");
  background: linear-gradient(
      0deg,
      color(display-p3 0.8941 0.098 0.2118 / 0.08) 0%,
      color(display-p3 0.8941 0.098 0.2118 / 0.08) 100%
    ),
    linear-gradient(
      180deg,
      color(display-p3 0.0941 0.0941 0.1059 / 0) 0%,
      color(display-p3 0.0941 0.0941 0.1059) 100%
    ),
    url("../images/service_partners_6.jpg");
  backdrop-filter: blur(2px);
}
.card-7 .services-partners-section-content-card-inner {
  background: url("../images/service_partners_7.jpg");
}
.card-7:hover .services-partners-section-content-card-inner {
  background: linear-gradient(
      0deg,
      rgba(249, 0, 43, 0.08) 0%,
      rgba(249, 0, 43, 0.08) 100%
    ),
    linear-gradient(180deg, #18181b 0%, #18181b 100%),
    url("../images/service_partners_7.jpg");
  background: linear-gradient(
      0deg,
      color(display-p3 0.8941 0.098 0.2118 / 0.08) 0%,
      color(display-p3 0.8941 0.098 0.2118 / 0.08) 100%
    ),
    linear-gradient(
      180deg,
      color(display-p3 0.0941 0.0941 0.1059 / 0) 0%,
      color(display-p3 0.0941 0.0941 0.1059) 100%
    ),
    url("../images/service_partners_7.jpg");
  backdrop-filter: blur(2px);
}
.card-8 .services-partners-section-content-card-inner {
  background: url("../images/service_partners_8.jpg");
}
.card-8:hover .services-partners-section-content-card-inner {
  background: linear-gradient(
      0deg,
      rgba(249, 0, 43, 0.08) 0%,
      rgba(249, 0, 43, 0.08) 100%
    ),
    linear-gradient(180deg, #18181b 0%, #18181b 100%),
    url("../images/service_partners_8.jpg");
  background: linear-gradient(
      0deg,
      color(display-p3 0.8941 0.098 0.2118 / 0.08) 0%,
      color(display-p3 0.8941 0.098 0.2118 / 0.08) 100%
    ),
    linear-gradient(
      180deg,
      color(display-p3 0.0941 0.0941 0.1059 / 0) 0%,
      color(display-p3 0.0941 0.0941 0.1059) 100%
    ),
    url("../images/service_partners_8.jpg");
  backdrop-filter: blur(2px);
}
.card-9 .services-partners-section-content-card-inner {
  background: url("../images/service_partners_9.jpg");
}
.card-9:hover .services-partners-section-content-card-inner {
  background: linear-gradient(
      0deg,
      rgba(249, 0, 43, 0.08) 0%,
      rgba(249, 0, 43, 0.08) 100%
    ),
    linear-gradient(180deg, #18181b 0%, #18181b 100%),
    url("../images/service_partners_9.jpg");
  background: linear-gradient(
      0deg,
      color(display-p3 0.8941 0.098 0.2118 / 0.08) 0%,
      color(display-p3 0.8941 0.098 0.2118 / 0.08) 100%
    ),
    linear-gradient(
      180deg,
      color(display-p3 0.0941 0.0941 0.1059 / 0) 0%,
      color(display-p3 0.0941 0.0941 0.1059) 100%
    ),
    url("../images/service_partners_9.jpg");
  backdrop-filter: blur(2px);
}
.services-partners-section-content-card-logo {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: all 0.3s ease-in-out;
}
.services-partners-section-content-card-extra {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateY(10px) translateX(-50%);
  width: 304px;
  height: 50%;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 24px;
  opacity: 0;
  transition: all 0.3s ease-in-out;
  text-align: center;
}
.services-partners-section-content-card-separator {
  width: 100%;
  height: 1px;
  background: linear-gradient(
    90deg,
    #fff 0%,
    rgba(255, 255, 255, 0.6) 50.48%,
    #fff 100%
  );
  background: linear-gradient(
    90deg,
    color(display-p3 1 1 1 / 0) 0%,
    color(display-p3 1 1 1 / 0.6) 50.48%,
    color(display-p3 1 1 1 / 0) 100%
  );
}
.services-partners-section-content-card-desc {
  font-size: 12px;
}
.services-partners-section-content-card:hover
  .services-partners-section-content-card-logo {
  transform: scale(0.77) translateY(-70px);
}
.services-partners-section-content-card:hover
  .services-partners-section-content-card-extra {
  opacity: 1;
  transform: translateY(0) translateX(-50%);
}
.services-onsite-offerings-section-title {
  font-size: 40px;
  font-family: "Magnita";
  font-weight: 400;
  margin-bottom: 36px;
}

.services-onsite-offerings-section-flexbox {
  display: flex;
  gap: 23px;
  align-items: stretch;
}
.services-onsite-offerings-section-flexbox-side {
  width: 516px;
}
.services-onsite-offerings-section-flexbox-card {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
.services-onsite-offerings-section-flexbox-card.left {
  height: 540px;
  background-image: url("../images/service_onsite_1.jpg");
}
.services-onsite-offerings-section-flexbox-right {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.services-onsite-offerings-section-flexbox-card.right {
  height: 258px;
  display: flex;
  flex-direction: column;
}
.services-onsite-offerings-section-flexbox-card.right.top {
  background-image: url("../images/service_onsite_2.jpg");
}
.services-onsite-offerings-section-flexbox-card.right.bottom {
  background-image: url("../images/service_onsite_3.jpg");
}
.services-onsite-offerings-section-flexbox-card-content {
  padding: 24px;
  color: #fff;
}
.services-onsite-offerings-section-flexbox-card-content-title {
  font-size: 20px;
  font-weight: 400;
  font-family: "Funnel Display";
}
.services-onsite-offerings-section-flexbox-card-content-separator {
  width: 100%;
  height: 1px;
  background-color: rgba(255, 255, 255, 0.2);
  margin: 12px 0;
}
.services-onsite-offerings-section-flexbox-card-content-desc {
  color: rgba(255, 255, 255, 0.7);
  font-size: 14px;
}
