/* =========================================================
   05. White-label Services
   ========================================================= */

.wl-services-section {
  background:
    radial-gradient(
      circle at top left,
      rgba(0, 97, 255, 0.18),
      transparent 28%
    ),
    linear-gradient(135deg, #020b21 0%, #031b47 48%, #020b21 100%);
}

.wl-services-head {
  max-width: 1120px;
}

.wl-services-kicker {
  color: #ff6a00;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: 0.04em;
}

.wl-services-kicker span {
  width: 54px;
  height: 2px;
  background: currentColor;
  display: block;
}

.wl-services-head h2 {
  font-size: 44px;
  line-height: 1.15;
  font-weight: 900;
  letter-spacing: -0.04em;
}

.wl-services-head p {
  max-width: 920px;
  color: rgba(255, 255, 255, 0.86);
  font-size: 18px;
  line-height: 1.55;
}

.wl-service-card {
  min-height: 360px;
  border: 1px solid rgba(75, 143, 255, 0.45);
  background: rgba(4, 28, 72, 0.72);
  color: #ffffff;
}

.wl-service-icon {
  width: 78px;
  height: 78px;
  display: grid;
  place-items: center;
  border: 2px solid currentColor;
  border-radius: 50%;
  font-size: 36px;
  background: rgba(0, 70, 150, 0.25);
}

.wl-service-card h3 {
  color: #ffffff;
  font-size: 22px;
  line-height: 1.25;
  font-weight: 900;
}

.wl-service-card p {
  color: rgba(255, 255, 255, 0.86);
  font-size: 16px;
  line-height: 1.55;
}

.wl-service-card strong {
  display: block;
  font-size: 15px;
  font-weight: 900;
}

.wl-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.wl-tags span {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  padding: 4px 12px;
  border: 1px solid currentColor;
  border-radius: 50rem;
  font-size: 14px;
  font-weight: 800;
  line-height: 1;
  background: rgba(0, 35, 90, 0.35);
}

.text-orange,
.icon-orange,
.tag-orange {
  color: #ff6a00;
}

.text-blue,
.icon-blue,
.tag-blue {
  color: #2f88ff;
}

.text-green,
.icon-green,
.tag-green {
  color: #83ce38;
}

.text-purple,
.icon-purple,
.tag-purple {
  color: #9a55ff;
}

.text-cyan,
.icon-cyan,
.tag-cyan {
  color: #20c7e8;
}

.text-yellow,
.icon-yellow,
.tag-yellow {
  color: #ffb000;
}

.text-sky,
.icon-sky,
.tag-sky {
  color: #11bdf2;
}

.text-pink,
.icon-pink,
.tag-pink {
  color: #ff4daf;
}

.wl-services-cta {
  border: 1px solid rgba(75, 143, 255, 0.45);
  background: rgba(4, 28, 72, 0.72);
}

.wl-cta-img {
  width: 300px;
  max-width: 100%;
}

.wl-cta-img img {
  display: block;
  width: 100%;
  height: 160px;
  object-fit: contain;
}

.wl-services-cta h3 {
  font-size: 26px;
  line-height: 1.25;
  font-weight: 900;
}

.wl-services-cta p {
  color: rgba(255, 255, 255, 0.86);
  font-size: 18px;
  line-height: 1.45;
}

.wl-cta-btn {
  min-height: 64px;
  padding: 0 34px;
  background: linear-gradient(135deg, #ff7a00, #ff4d00);
  font-size: 16px;
  font-weight: 900;
  box-shadow: 0 12px 28px rgba(255, 90, 0, 0.25);
}

.wl-cta-btn:hover {
  color: #ffffff;
}

.wl-cta-points {
  grid-template-columns: repeat(4, 1fr);
  /* border-top: 1px solid rgba(75, 143, 255, 0.45); */
}

.wl-cta-point {
  min-height: 64px;
  padding: 0 22px;
  border-right: 1px solid rgba(75, 143, 255, 0.45);
  color: #ffffff;
}

.wl-cta-point:last-child {
  border-right: 0;
}

.wl-cta-point i {
  color: #2f88ff;
  font-size: 30px;
}

.wl-cta-point span {
  font-size: 16px;
  line-height: 1.3;
  font-weight: 700;
}

/* =========================================================
   White-label Services Responsive
   ========================================================= */

@media (max-width: 1399px) {
  .wl-services-head {
    max-width: 960px;
  }

  .wl-services-head h2 {
    font-size: 32px;
  }

  .wl-services-head p {
    font-size: 15px;
  }

  .wl-services-kicker {
    font-size: 16px;
  }

  .wl-service-card {
    min-height: 335px;
  }

  .wl-service-card h3 {
    font-size: 16px;
  }

  .wl-service-card p {
    font-size: 14px;
  }

  .wl-service-card strong,
  .wl-tags span {
    font-size: 12px;
  }

  .wl-service-icon {
    width: 64px;
    height: 64px;
    font-size: 30px;
  }

  .wl-services-cta h3 {
    font-size: 22px;
  }

  .wl-services-cta p {
    font-size: 16px;
  }

  .wl-cta-btn,
  .wl-cta-point span {
    font-size: 14px;
  }

  .wl-cta-point i {
    font-size: 24px;
  }
}

@media (max-width: 1199px) {
  .wl-cta-points {
    grid-template-columns: repeat(2, 1fr);
  }

  .wl-cta-point:nth-child(2) {
    border-right: 0;
  }

  .wl-cta-point:nth-child(1),
  .wl-cta-point:nth-child(2) {
    border-bottom: 1px solid rgba(75, 143, 255, 0.45);
  }

  .wl-cta-img {
    margin: 0 auto;
  }
}

@media (max-width: 767px) {
  .wl-services-head h2 {
    font-size: 32px;
  }

  .wl-services-head p {
    font-size: 16px;
  }

  .wl-services-kicker {
    font-size: 14px;
  }

  .wl-services-kicker span {
    width: 34px;
  }

  .wl-service-card {
    min-height: auto;
  }

  .wl-cta-btn {
    width: 100%;
  }

  .wl-cta-points {
    grid-template-columns: 1fr;
  }

  .wl-cta-point {
    border-right: 0;
    border-bottom: 1px solid rgba(75, 143, 255, 0.45);
  }

  .wl-cta-point:last-child {
    border-bottom: 0;
  }
}