/* Connector section start 

.connect-platform-section {
  background-color: var(--ced-heading-color);
  z-index: 1;
}

.connect-card-wrapper {
  position: relative;
  background-image: linear-gradient(103deg,
      rgba(255, 255, 255, 0.3) 1.21%,
      rgba(255, 255, 255, 0.1) 95.11%);
  backdrop-filter: blur(50px);
}

.connector-box {
  border-radius: 45px;
  background-image: linear-gradient(180deg,
      rgba(255, 255, 255, 0.1) 0%,
      rgba(255, 255, 255, 0.3) 100%);
  font-family: var(--ced-montserrat-b);
  z-index: 11;
}

.connector-box button:before {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  border-radius: 6px;
  background: center/cover no-repeat url(/wp-content/uploads/2023/11/white-dropdown-arrow.svg) rgba(255, 255, 255, 0.18);
}

.dropdown-menu.show {
  display: flex;
  flex-direction: column;
}
.dropdown-menu > li{
  order:20;
}
.connector-box .dropdown-menu {
  transform: unset !important;
  inset: unset !important;
  width: 100%;
  left: 0 !important;
  max-height: 330px;
  overflow: auto;
  border-radius: 16px;
  border: 1px solid transparent;
  background-color: rgba(50, 50, 50, 1);
  padding: 10px 0px;
}

.connector-box .dropdown-item {
  font-family: var(--ced-montserrat-sb);
  color: var(--ced-white-color);
}

.connector-box .dropdown-item:hover {
  background-color: rgba(44, 44, 44, 8.6);
}


@media screen and (min-width: 1400px) {

  .app-suhead {
    max-width: 75%;
  }
}

@media screen and (min-width: 1200px) {
  .connector-box {
    padding: 0px 40px;
    min-height: 84px;
  }

  .connector-box,
  .connect-mid {
    font-size: 40px;
  }

  .connect-card-wrapper {
    padding: 80px;
  }

  .connector-box button:before {
    width: 34px;
    height: 34px;
    right: 45px;
  }

  .connector-box.single-sector img {
    width: 200px;
  }

  .connector-box .dropdown-menu {
    top: 84px !important;
  }
}

@media screen and (min-width: 992px) and (max-width: 1199px) {

  .connector-box,
  .connect-mid {
    font-size: 30px;
  }

  .connector-box {
    padding: 0px 30px;
    min-height: 70px;
  }

  .connector-box.single-sector img {
    width: 140px;
  }

  .connector-box .dropdown-menu {
    top: 70px !important;
  }

  .connect-card-wrapper {
    padding: 60px;
  }

  .connector-box button:before {
    width: 30px;
    height: 30px;
    right: 35px;
  }
}


@media screen and (min-width: 768px) and (max-width: 991px) {

  .connector-box,
  .connect-mid {
    font-size: 26px;
  }

  .connector-box {
    padding: 0px 24px;
    min-height: 60px;
  }

  .connector-box button:before {
    width: 24px;
    height: 24px;
    right: 30px;
  }

  .connector-box .dropdown-menu {
    top: 60px !important;
  }

  .connector-box .dropdown-item {
    padding: 10px 20px;
    line-height: 26px;
  }
}

@media screen and (min-width: 576px) and (max-width: 767px) {

  .connector-box,
  .connect-mid {
    font-size: 24px;
  }

  .connector-box button:before {
    width: 26px;
    height: 26px;
    right: 24px;
  }
}

@media screen and (min-width: 992px) {
  .arrow-left {
    position: absolute;
    left: 13%;
    top: -281px;
    width: 560px;
    transform: translateX(-210%);
    z-index: -2;
    opacity: 0.5;
  }

  .connect-card-wrapper::before {
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: center right/contain no-repeat url(/wp-content/uploads/2023/11/perks-bg-1.png);
    z-index: -1;
    opacity: 0.6;
  }

  .arrow-right {
    position: absolute;
    right: 20%;
    top: -152px;
    width: 560px;
    transform: translateX(190%);
    z-index: -2;
    opacity: 0.5;
  }

  .connector-box .dropdown-item {
    font-size: 20px;
    padding: 15px 20px;
    line-height: 30px;
  }

  .app-suhead {
    font-size: 18px;
    line-height: 32px;
  }

  .connect-card-wrapper {
    border-radius: 30px;
  }

  .connector-box .dropdown-menu .dropdown-item img {
    width: 30px;
    height: 30px;
  }
}

@media screen and (min-width: 768px) and (max-width: 991px) {
  .connect-card-wrapper {
    border-radius: 24px;
    padding: 50px 40px;
  }
}

@media screen and (min-width: 576px) and (max-width: 991px) {
  .app-suhead {
    line-height: 30px;
  }
}

@media screen and (max-width: 991px) {
  .connector-box .dropdown-menu .dropdown-item img {
    width: 20px;
    height: 20px;
  }

  .connector-box.single-sector img {
    width: 120px;
  }
}

@media screen and (min-width: 576px) and (max-width: 767px) {
  .connect-card-wrapper {
    border-radius: 20px;
    padding: 40px 30px;
  }
}

@media screen and (max-width: 767px) {
  .connector-box {
    min-height: 50px;
    padding: 0px 20px;
  }

  .connector-box .dropdown-menu {
    top: 50px !important;
  }

  .connector-box .dropdown-item {
    padding: 8px 16px !important;
    line-height: 24px;
    font-size: 15px;
  }

}

@media screen and (max-width: 575px) {

  .connector-box,
  .connect-mid {
    font-size: 20px;
  }

  .connector-box button:before {
    width: 24px;
    height: 24px;
    right: 22px;
  }

  .connect-card-wrapper {
    border-radius: 16px;
    padding: 30px 20px;
  }

  .app-suhead {
    font-size: 15px;
    line-height: 26px;
  }
}

.connect-platform-section .single-sector {
  max-height: 60px
}
 */
.connect-platform-section {
  background-color: var(--ced-heading-color);
}
.connect-card-wrapper {
  position: relative;
  background-image: linear-gradient(
    126deg,
    rgba(255, 255, 255, 0.15) 2.09%,
    rgba(255, 255, 255, 0.05) 97.24%
  );
  overflow: hidden;
  margin: auto;
  z-index: 1;
}
.connect-card-wrapper::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: top left/contain no-repeat url(/wp-content/uploads/2024/04/multi-gradient.png);
  z-index: -1;
}
.connector-box {
  border-radius: 45px;
  background-image: linear-gradient(180deg,
      rgba(255, 255, 255, 0.1) 0%,
      rgba(255, 255, 255, 0.3) 100%);
  font-family: var(--ced-montserrat-b);
  z-index: 11;
}
.connector-box button:before {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  border-radius: 6px;
  background: center/cover no-repeat url(/wp-content/uploads/2023/11/white-dropdown-arrow.svg) rgba(255, 255, 255, 0.18);
}
.dropdown-menu.show {
  display: flex;
  flex-direction: column;
}
.dropdown-menu > li{
  order:20;
}
.connector-box .dropdown-menu {
  transform: unset !important;
  inset: unset !important;
  width: 100%;
  left: 0 !important;
  overflow: auto;
  border-radius: 16px;
  border: 1px solid transparent;
  background-color: rgba(50, 50, 50, 1);
  padding: 10px 0px;
}
.connector-box .dropdown-item {
  font-family: var(--ced-montserrat-sb);
  color: var(--ced-white-color);
}
.connector-box .dropdown-item:hover {
  background-color: rgba(44, 44, 44, 8.6);
}
/* Coonect section responsive start  */
@media screen and (min-width: 1400px) {
  .app-suhead {
    max-width: 75%;
  }
}
@media screen and (min-width: 1200px) {
  .connector-box {
    padding: 0px 40px;
    min-height: 84px;
  }
  .connector-box,
  .connect-mid {
    font-size: 40px;
  }
  .connect-card-wrapper {
    padding: 80px;
    max-width: 1200px;
  }
  .connector-box button:before {
    width: 34px;
    height: 34px;
    right: 45px;
  }
  .connector-box.single-sector img {
    width: 200px;
  }
  .connector-box .dropdown-menu {
    top: 84px !important;
    max-height: 290px;
  }
}
@media screen and (min-width: 992px) and (max-width: 1199px) {
  .connector-box,
  .connect-mid {
    font-size: 30px;
  }
  .connector-box {
    padding: 0px 30px;
    min-height: 70px;
  }
  .connector-box.single-sector img {
    width: 140px;
  }
  .connector-box .dropdown-menu {
    top: 70px !important;
    max-height: 250px;
  }
  .connect-card-wrapper {
    padding: 60px;
  }
  .connector-box button:before {
    width: 30px;
    height: 30px;
    right: 35px;
  }
}
@media screen and (min-width: 768px) and (max-width: 991px) {
  .connector-box,
  .connect-mid {
    font-size: 26px;
  }
  .connector-box {
    padding: 0px 24px;
    min-height: 60px;
  }
  .connector-box button:before {
    width: 24px;
    height: 24px;
    right: 30px;
  }
  .connector-box .dropdown-menu {
    top: 60px !important;
    max-height: 230px;
  }
  .connector-box .dropdown-item {
    padding: 10px 20px;
    line-height: 26px;
  }
}
@media screen and (min-width: 576px) and (max-width: 767px) {
  .connector-box,
  .connect-mid {
    font-size: 24px;
  }
  .connector-box button:before {
    width: 26px;
    height: 26px;
    right: 24px;
  }
  .connector-box .dropdown-menu {
    max-height: 220px;
  }
}
@media screen and (min-width: 992px) {
  .arrow-left {
    position: absolute;
    left: 13%;
    top: -281px;
    width: 560px;
    transform: translateX(-210%);
    z-index: -2;
    opacity: 0.5;
  }
  .connect-card-wrapper::before {
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: center right/contain no-repeat url(/wp-content/uploads/2023/11/perks-bg-1.png);
    z-index: -1;
    opacity: 0.6;
  }
  .arrow-right {
    position: absolute;
    right: 20%;
    top: -152px;
    width: 560px;
    transform: translateX(190%);
    z-index: -2;
    opacity: 0.5;
  }
  .connector-box .dropdown-item {
    font-size: 20px;
    padding: 15px 20px;
    line-height: 30px;
  }
  .app-suhead {
    font-size: 18px;
    line-height: 32px;
  }
  .connect-card-wrapper {
    border-radius: 30px;
  }
  .connector-box .dropdown-menu .dropdown-item img {
    width: 30px;
    height: 30px;
  }
}
@media screen and (min-width: 768px) and (max-width: 991px) {
  .connect-card-wrapper {
    border-radius: 24px;
    padding: 50px 40px;
  }
}
@media screen and (min-width: 576px) and (max-width: 991px) {
  .app-suhead {
    line-height: 30px;
  }
}
@media screen and (max-width: 991px) {
  .connector-box .dropdown-menu .dropdown-item img {
    width: 20px;
    height: 20px;
  }
  .connector-box.single-sector img {
    width: 120px;
  }
}
@media screen and (min-width: 576px) and (max-width: 767px) {
  .connect-card-wrapper {
    border-radius: 20px;
    padding: 40px 30px;
  }
}
@media screen and (max-width: 767px) {
  .connector-box {
    min-height: 50px;
    padding: 0px 20px;
  }
  .connector-box .dropdown-menu {
    top: 50px !important;
  }
  .connector-box .dropdown-item {
    padding: 8px 16px !important;
    line-height: 24px;
    font-size: 15px;
  }
  .connect-card-wrapper::after{
    background-size: cover !important;
    opacity: .8;
  }
}
@media screen and (max-width: 575px) {
  .connector-box,
  .connect-mid {
    font-size: 20px;
  }
  .connector-box button:before {
    width: 24px;
    height: 24px;
    right: 22px;
  }
  .connect-card-wrapper {
    border-radius: 16px;
    padding: 30px 20px;
  }
  .app-suhead {
    font-size: 15px;
    line-height: 26px;
  }
  .connector-box .dropdown-menu {
    max-height: 200px;
  }
}
.connect-platform-section .single-sector {
  max-height: 60px
}