*{margin: 0px; padding: 0px; box-sizing: border-box;}

body {
  font-family: "inter", sans-serif;
  font-size: 15px;
  font-weight: 400;
  color: #484848;
  overflow-x: hidden;
}

h1,h2,h3,h4,h5,h6{
  letter-spacing: 0.6px;
}

p{
   font-family: "inter", sans-serif;
   letter-spacing: 0.6px;
}

a{
 text-decoration: none;
 letter-spacing: 0.6px;
}


ul {
  padding: 0;
  list-style-type: none;
  margin: 0;
}


button {
  background: none;
  border: none;
  cursor: pointer;
}

img {
  max-width: 100%;
  height: auto;
}


:root {
  --primary-color1: #d7172e;
  --primary-color2: #0e1728;
  --primary-color3: #5b5b5c;
  --secondary-color: #373639;
  --drk-color:#2c2f34;
  --white: #fff;
  --txt-color:#55535d;
  --title-color:#36374c;
}




.animate1{
  animation: lft-rgt 2.6s linear 0s infinite alternate;
}



@keyframes lft-rgt {
  0% {
    transform: translateX(-20px);
  }
  100% {
    transform: translateX(0px);
  }
}




/*-------------------------------*/
.banner-card {
    width: 100%;
    height: 635px;
    position: relative;
    z-index: 1;
    overflow: hidden;
}
.banner-card .banner-slider{
  height: 635px;
}
.bnnr-sctn{
    width: 100%;
    height: 635px;
    background-size: cover;
    /* background-image: url(../images/web-banner-pttrn.webp); */
    padding: 45px 0px 0px;
    background-position: center;
    background-repeat: no-repeat;
}



/*-------left------banner----content-----start--------*/

.bnr-lft-content{
    padding-top: 0;
}

.bnr-smll-title p img{
       width: 25px !important;
    display: inline-block !important;
    margin-right: 5px;
}


.bnr-smll-title p{
    font-size: 20px;
    margin: 0;
    
}

.main-title{
  color: #081431;
    font-size: 44px;
    line-height: 57px;
    margin: 5px 0 10px 0;
    font-weight: 700;
    position: relative;
}
.main-title span{
  color: var(--primary-color1);
  display: block;
}
.bnnr-para p{
  font-size: 18px;
    border-bottom: 1px solid #a7a7b1;
    padding-bottom: 12px;
    margin-bottom: 15px
}

.bannr-module-list ul li{
  font-size: 16px;
  padding-bottom: 8px;
  position: relative;
  color: var(--title-color);
  padding-left: 25px;
}

.bannr-module-list ul li:before{
  content: '\f00c';
  font-size: 15px;
  font-family: fontawesome;
  position: absolute;
  margin-top: 2px;
  left: 0px;
  color: var(--primary-color1);
}

/*---------------------*/

.bttn-avtar-wrp{
  display: flex;
    gap: 10px 19px;
    margin: 10px 0px 23px;
}



/*--------avatars-------wrap----start--------*/

.customer-badge {
  display: inline-flex;
  align-items: center;
  gap: 12px;
}

.avatars {
  display: flex;
}

.avatars img {
  width: 35px;
  height: 35px;
  border-radius: 50%;
  border: 2px solid var(--primary-color1);
  margin-left: -10px;
}

.avatars img:first-child {
  margin-left: 0;
}

.info {
  display: flex;
  flex-direction: column;
  line-height: 1.2;
}

.customer-badge .info .title {
  color: var(--primary-color1);
  font-weight: 600;
  font-size: 19px;
  padding-bottom: 3px;
}

.rating {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 15px;
  color: #555;
}

.rating .stars{
  display: flex;
  gap: 5px 6px;
}

.rating .stars li{
  color: #ffb400;
  font-size: 9px;
}

/*--------avatars-------wrap----end--------*/


/*-------left------banner----content------end---------*/


/*-------right------banner---image-----start---------*/

.screen-with-girl-wrp{
    display: flex;
    column-gap: 15px;
    position: relative;
}

.screen-bx{
    position: relative;
}


.screen-bx img{
      width: 550px !important;
    display: inline-block !important;
    margin-left: 20px;
    margin-top: 50px;
}

/*---------------*/

.ai-float-box{
  position: absolute;
  display: flex;
  column-gap: 10px;
  padding: 7px 13px;
  align-items: center;
  background: none;
  animation: lft-rgt 2.6s linear 0s infinite alternate;
}

.bttm-flot-bx{
     top: 62%;
    left: -18%;
}

.top-flot-bx{
   top: 15%;
  right: 0%;
  z-index: 1;
}

.ai-float-box::before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: var(--white);
  border-radius: 5px;
  border-bottom: 2px solid var(--primary-color1);
  border-right: 2px solid var(--primary-color1);
  box-shadow: -3px -3px 5px -1px #cacad5;
  transform: skewX(-16deg);
}

.ai-icon{
  width: 35px;
  padding: 7px 5px 2px;
}

.ai-icon img{
    position: relative;
    z-index: 1;
}


.ai-icon::before {
  content: "";
  position: absolute;
  inset: 0;
  background-color: var(--white);
  border-radius: 3px;
  border: 1px solid #e35e6e8a;
  transform: skewX(-16deg);
}

.ai-icon, .ai-txt{
    position: relative;
}

.ai-txt h6{
   font-size: 18px;
  margin-bottom: 0px;
  color: var(--primary-color1);
  font-style: italic;
  letter-spacing: 0.2px;
  text-align: center;
}

.ai-txt p{
    font-size: 11px;
    margin-bottom: 0px;
    color: var(--txt-color);
}

/*-----------------*/

.girl-img{
      position: absolute;
    right: -38px;
    bottom: -40px;
    text-align: right;
}

.girl-img img{
    width: 335px !important;
    display: inline-block !important;
   
}


.bnr-right-bttm-feature{
        width: 100%;
    
    background-color: rgba(253, 232, 235, 1);
    background: #fff;
    display: flex;
    overflow: hidden;
    padding: 18px 18px;
    column-gap: 50px;
    z-index: 2;
    position: absolute;
    bottom: -85px;
    right: 0;
    justify-content: center;
    border-radius: 5px;
    box-shadow: 0 0 10px rgb(215 23 46 / 25%);
}
.bnr-right-bttm-feature .start-today-btn{
        border: 1px solid #B9B9B9;
    padding: 11px;
    border-radius: 7px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 200px;
}
.bnr-right-bttm-feature .start-today-btn .icn{
  width: 35px;
        height: 35px;
}
.bnr-right-bttm-feature .start-today-btn .icn img{
  display: block;
    width: 100%;
}
.bnr-right-bttm-feature .start-today-btn .cntn {
    width: calc(100% - 40px);
    padding-left: 15px;
}
.bnr-right-bttm-feature .start-today-btn .cntn h4{
  color: var(--primary-color1);
      text-transform: uppercase;
    font-size: 17px;
    font-weight: 700;
    margin: 0;
    letter-spacing: .2px;
}
.bttm-feature-bx{
   display: grid;
  column-gap: 14px;
  grid-template-columns: 0.2fr 3fr;
}

.feature-icon{
      width: 65px;
    height: 65px;
    border-radius: 50%;
    background-color: var(--primary-color1);
    border: 5px solid #f3e7e94f;
    text-align: center;
    line-height: 56px;
}

.feature-icon img{
       width: 28px !important;
    display: inline-block !important
}


.feature-content h6{
    font-size: 18px;
    color: var(--primary-color1);
}

.feature-content p{
    font-size: 14px;
    color: var(--txt-color);
    margin: 0;
}
.banner2-content .bnr2-small{
  color: #081431;
    font-weight: 800;
    font-size: 26px;
    position: relative;
}
.banner2-content .bnr2-small .fr-txt{
    font-family: "Meie Script", cursive;
    font-weight: 400;
    line-height: 1;
    color: #000;
    font-size: 30px;
    position: relative;
    top: 4px;
    left: -10px;
}
.banner2-content .bnr2-small::after{
  content: '';
    position: absolute;
    /* background: url(../css/bnr-line.png); */
    width: 180px;
    height: 2px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    background: linear-gradient(45deg, black 3%, transparent 102%);
    top: 17px;
    margin-left: 10px;
}
.banner2-content .bnnr2-main-heading{
      color: #081431;
    font-size: 44px;
    line-height: 1;
    margin: 13px 0 18px 0;
    font-weight: 700;
}
.banner2-content .bnnr2-main-heading span{
  color: var(--primary-color1);
}
.banner2-content .para{
  color: #081431;
    font-size: 17px;
    letter-spacing: .3px;
}
.banner2-content .para span{
  color: var(--primary-color1);
}
.banner2-content .bnr2-lst{
  list-style-type: none;
  padding: 0;
}
.banner2-content .bnr2-lst li{
      display: flex;
    margin-top: 15px;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
}
.banner2-content .bnr2-lst li .icon{
   width: 53px;
    height: 53px;
    background: #103EA4;
    padding: 13px;
    border-radius: 9px;
}
.banner2-content .bnr2-lst li .icon.billing-bg{
  background: #623BDB;
}
.banner2-content .bnr2-lst li .icon.whatsapp-bg{
  background: #20CE57;
}
.banner2-content .bnr2-lst li .icon.cloud-bg{
  background: #08ABF3;
}
.banner2-content .bnr2-lst li .cntnt{
  width: calc(100% - 50px);
  padding-left: 15px;
}
.banner2-content .bnr2-lst li .cntnt h6{
      color: #081431;
    font-size: 16px;
    margin: 0;
    letter-spacing: 0.2px;
    font-weight: 500;
}
.banner2-content .bnr2-lst li .cntnt p{
  color: #3B3B3B;
    margin: 0;
    font-size: 15px;
    /* padding-top: 0px; */
    letter-spacing: .2px;
    margin-top: 3px;
}
.banner2-content .bnr2-lst li:hover .cntnt h6{
  color: var(--primary-color1);
}
.banner2-content .bnr2-lst li:hover .icon{
  background: var(--primary-color1)!important;
}
.bnr2-lft-imgs{
      position: relative;
    z-index: 1;
}
.bnr2-lft-imgs .bnr2-img-divice{
  position: relative;
}
.bnr2-lft-imgs .bnr2-img-divice ul{
        position: absolute;
    top: -28px;
    right: 165px;
}
.bnr2-lft-imgs .bnr2-img-divice ul li{
        width: 76px;
    height: 76px;
    background: #fff;
    border-radius: 50%;
    padding: 5px;
    margin-top: 8px;
    box-shadow: 0 0 10px rgb(0 0 0 / 40%);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.bnr2-lft-imgs .bnr2-img-divice ul li img{
        left: inherit;
    top: inherit;
    position: inherit;
    width: 30px;
    margin-bottom: 2px;
}
.bnr2-lft-imgs .bnr2-img-divice ul li .txt{
     line-height: 1;
    font-size: 11px;
    font-weight: 500;
    text-align: center;
    color: #000;
}
.bnr2-lft-imgs .bnr2-img-divice img{
      width: 90%;
    position: relative;
    left: -110px;
    top: 130px;
}
.bnr2-lft-imgs .bnr2-img-girls{
    position: absolute;
    bottom: 0;
    right: -17%;
    width: 100%;
    height: 100%;
    z-index: -1;
}
.bnr2-lft-imgs .bnr2-img-girls img{
        width: 60%;
    margin: 20px 0 0 auto;
}
.bnr-dm-card {
   position: absolute;
    background: #fff;
    padding: 15px;
    box-shadow: 0 0 10px rgb(215 23 46 / 25%);
    width: 100%;
    z-index: 2;
    bottom: -135px;
    left: 0;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 25px;
    border-radius: 10px;
}
.bnr-dm-card .itm{
  display: flex;
    align-items: center;
    justify-content: flex-start;
}
.bnr-dm-card .itm .icn{
  width: 40px;
    height: 40px;
}
.bnr-dm-card .itm .cntn{
        width: calc(100% - 40px);
    padding-left: 15px;
}
.bnr-dm-card .itm .cntn h4{
     text-transform: uppercase;
    font-size: 17px;
    font-weight: 700;
    color: #081431;
    margin: 0;
    letter-spacing: .2px;
}
.bnr-dm-card .itm .cntn p{
  margin: 0;
    font-size: 15px;
    line-height: 19px;
    margin-top: 5px;
    letter-spacing: .2px;
    color: #3B3B3B;
}
.bnr-dm-card .itm.free-demo .cntn h4{
  color: var(--primary-color1);
}
.bnr-dm-card .bnnr-dm-card1 .itm.free-demo{
  border: 1px solid #B9B9B9;
    padding: 11px;
    width: 85%;
    border-radius: 7px;
}
.bnr-dm-card .bnnr-dm-card3 .itm.esay-use{
  padding: 11px;
    background: #FDF1F3;
    border-radius: 7px;

}
.bnr-dm-card >div{
  position: relative;
}
.bnr-dm-card >div::after{
      position: absolute;
    content: '';
    right: 3px;
    width: 1px;
    height: 50px;
    background: rgb(0 0 0 / 20%);
    top: 0;
    bottom: 0;
    margin: auto 0;
}
.bnr-dm-card >div:last-child:after{
  display: none;
}
.banner3-content .bnr2-small{
      color: #484848;
    font-weight: 400;
    font-size: 19px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    letter-spacing: 0.6px;
}
.banner3-content .bnr2-small span{
  padding-right: 10px;
}
.banner3-content .bnr2-small span img{
      width: 25px;
}
.bnnr-sctn.bnnr-sctn3 .bnr2-lft-imgs .bnr2-img-divice img{
   width: 145%;
    position: relative;
    left: -80px;
    top: -10px;
    max-width: inherit;
    z-index: -1;
}
.banner3-content .bnnr2-main-heading{
      color: #081431;
    font-size: 44px;
    line-height: 59px;
    margin: 13px 0 18px 0;
    font-weight: 700;
    position: relative;
}
.banner3-content .bnnr2-main-heading::after{
    position: absolute;
    content: '';
    width: 91%;
    height: 2px;
    background: linear-gradient(45deg, #081431, transparent);
    bottom: -6px;
    left: 0;
    display: none;
}
.bnnr-sctn.bnnr-sctn3.bnnr-sctn4 .banner3-content .bnnr2-main-heading::after{
  background: linear-gradient(45deg, #d7172e, transparent);
  bottom: -8px;
}
.banner3-content .bnnr2-main-heading span{
  color: var(--primary-color1);
}
.banner3-content .bnr2-lst{
  list-style-type: none;
    padding: 0;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
}
.banner3-content .bnr2-lst li{
        display: flex;
    margin-top: 7px;
    /* align-items: center; */
    justify-content: flex-start;
    width: 100%;
    align-items: center;
}

.banner3-content .bnr2-lst .icon {
    width: 45px;
    height: 45px;
    padding: 10px;
    border-radius: 9px;
  background: #992801;
}
.banner3-content .bnr2-lst li:nth-child(3n+1) .icon {
   
   background: #D81530;
}

.banner3-content .bnr2-lst .cntnt {
    width: calc(100% - 45px);
    padding-left: 10px;
}
.banner3-content .bnr2-lst .cntnt h6 {
    color: #081431;
    font-size: 16px;
    margin: 0;
    letter-spacing: 0.2px;
    font-weight: 500;
}
.banner3-content .bnr2-lst li .cntnt p {
    color: #3B3B3B;
    margin: 0;
    font-size: 14px;
    letter-spacing: .2px;
    margin-top: 3px;
}
.design-ptrn-list{
    background: #fff;
    padding: 12px;
    box-shadow: 2px 2px 0 1px rgb(215 23 46);
    border-radius: 7px;
    margin-top: 15px;
    z-index: 2;
    position: relative;
}
.design-ptrn-list ul {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    gap: 12px;
}
.design-ptrn-list li h6{
      color: #081431;
    font-size: 15px;
    margin: 0;
    letter-spacing: 0.2px;
    font-weight: 500;
}
.design-ptrn-list li h6 span{
  display: inline-block;
    margin-right: 6px;
    color: var(--primary-color1);
}
.design-ptrn-list li p{
      color: #3B3B3B;
    margin: 0;
    font-size: 14px;
    letter-spacing: .2px;
    margin-top: 5px;
    line-height: 20px;
}
.bnnr-sctn.bnnr-sctn3 .bnr-dm-card{
      bottom: -105px;
      grid-template-columns: .6fr 1.1fr 1.3fr;
          gap: 10px;
}
.bnnr-sctn.bnnr-sctn3 .list-btm ul {
       display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 10px;
    text-align: center;
}
.bnnr-sctn.bnnr-sctn3 .list-btm li img{
  width: 42px;
    display: block;
    margin: 0 auto;
    
}
.bnnr-sctn.bnnr-sctn3 .list-btm li{
  position: relative;
}
.bnnr-sctn.bnnr-sctn3 .list-btm li::after{
 position: absolute;
    content: '';
    right: 1px;
    width: 1px;
    height: 50px;
    background: rgb(0 0 0 / 20%);
    top: 0;
    bottom: 0;
    margin: auto 0;
}
.bnnr-sctn.bnnr-sctn3 .list-btm li:last-child:after{
  display: none;
}
.bnnr-sctn.bnnr-sctn3 .list-btm li:nth-last-child(2)::after {
  right: -12px;
}
.bnnr-sctn.bnnr-sctn3 .list-btm ul .txt{
  margin: 0;
    font-size: 15px;
    line-height: 19px;
    margin-top: 5px;
    letter-spacing: .2px;
    color: #3B3B3B;
}
.bnnr-sctn.bnnr-sctn3 .bnr-dm-card .itm.start-now .icn{
  background: #d7172e3d;
    width: 65px;
    height: 65px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.bnnr-sctn.bnnr-sctn3 .bnr-dm-card .itm.start-now .cntn{
  width: calc(100% - 65px);
}
.bnnr-sctn.bnnr-sctn3 .bnr-dm-card .itm.start-now .icn img{
      width: 32px;
}
.bnnr-sctn.bnnr-sctn3 .bnr-dm-card >div::after {
    right: 10px;
}
.bnnr-sctn.bnnr-sctn3 .bnr-dm-card >div.bnnr-dm-card2::after{
      right: -10px;
}
.bnnr-sctn.bnnr-sctn3.bnnr-sctn4 .bnr2-lft-imgs .bnr2-img-divice img {
    width: 154%;
    left: -190px;
    top: 8px;
}
.bnnr-sctn.bnnr-sctn3.bnnr-sctn4 .banner3-content .bnr2-lst {
   list-style-type: none;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 60px;
    align-items: center;
}
.bnnr-sctn.bnnr-sctn3.bnnr-sctn4 .banner3-content .bnr2-lst .icon {
    width: 55px;
    height: 55px;
    padding: 14px;
   
    border-radius: 50%;
    background: #fff;
        box-shadow: inset 0 0 8px rgb(215 23 46 / 42%);
}

.banner3-content .bnr2-lst .cntnt{
  width: calc(100% - 55px);
    padding-left: 20px;
}
.bnnr-sctn.bnnr-sctn3.bnnr-sctn4 .bnr-dm-card {
    bottom: -75px;
    grid-template-columns: .4fr 1.6fr;
}
.bnnr-sctn.bnnr-sctn3.bnnr-sctn4 .list-btm ul{
    grid-template-columns: 1fr 1fr 1fr 1fr;
    margin-top: 11px;
}
.bnnr-sctn.bnnr-sctn3.bnnr-sctn4 .list-btm li{
      display: flex;
    align-items: center;
    justify-content: center;
}
.bnnr-sctn.bnnr-sctn3.bnnr-sctn4 .list-btm li .txt{
      margin: 0;
    padding-left: 15px;
    width: 46%;
    text-align: left;
}
.bnnr-sctn.bnnr-sctn3.bnnr-sctn4 .list-btm li::after {
    top: -3px;
}
.bnnr-sctn.bnnr-sctn3.bnnr-sctn4 .bnr-dm-card >div::after {
    right: -1px;
}
.bnr-ai{
  background: #fff;
    padding: 20px;
    border-radius: 20px;
    box-shadow: 0 0 7px rgb(215 23 46 / 30%);
    margin-top: 15px;
    z-index: 2;
    position: relative;
}
.bnr-ai .ai-hdng{
        color: var(--primary-color1);
    line-height: 1;
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 15px;
}
.bnr-ai .ai-hdng span{
 display: inline-block;
    padding-right: 7px;
}
.bnr-ai .ai-hdng span img{
  width: 18px;
    position: relative;
    top: 2px;
}
.bnr-ai ul{
        list-style-type: none;
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 15px;
}
.bnr-ai li {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
}
.bnr-ai li .icn{
  width: 55px;
    height: 55px;
    background: rgb(9 21 50 / 20%);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.bnr-ai li .icn img{
  width: 28px;
}
.bnr-ai li .cntnt{
      width: calc(100% - 48px);
    color: #081431;
    font-size: 15px;
    line-height: 18px;
    padding-left: 10px;
}
.bnr3-grwth {
    position: absolute;
    top: 0;
    width: 100px;
    background: #fff;
    padding: 5px;
    box-shadow: 0 0 7px rgb(0 0 0 / 25%);
    border-radius: 5px;
    left: -38px;
    animation: lft-rgt 2.6s linear 0s infinite alternate;
}
.bnr3-grwth p{
  margin: 0;
    font-size: 14px;
    color: #081431;
    font-weight: 500;
}
.bnr3-grwth h6{
       color: #006E3F;
    margin: 0;
    font-weight: 800;
    font-size: 17px;
    margin-bottom: 4px;
    -webkit-text-stroke: .5px #000;
}
.bnr3-grwth span{
  display: block;
 color: #616161;
    font-size: 13px;
    line-height: 1;
}
.bnr3-ai-assign {
    position: absolute;
    top: -15px;
    right: -41px;
    background: #fff;
    width: 100px;
    padding: 6px;
    border-radius: 5px;
    box-shadow: 0 0 7px rgb(0 0 0 / 25%);
    animation: lft-rgt 2.6s linear 0s infinite alternate;
}
.bnr3-ai-assign img{
      width: 50px !important;
    display: block;
    margin: 0 auto;
}
.bnr3-ai-assign p{
  margin: 0;
    color: #081431;
    font-size: 14px;
    text-align: center;
    font-weight: 500;
}
.bnr3-smrt-insighs {
    position: absolute;
    bottom: 141px;
    right: -79px;
    width: 221px;
    background: #fff;
    display: flex;
    justify-content: flex-start;
    padding: 7px;
    box-shadow: 0 0 7px rgb(0 0 0 / 25%);
    border-radius: 5px;
    animation: lft-rgt 2.6s linear 0s infinite alternate;
}
.bnr3-smrt-insighs .icn{
     width: 50px;
}
.bnr3-smrt-insighs .cntnt{
      width: calc(100% - 50px);
    padding-left: 10px;
}
.bnr3-smrt-insighs .cntnt h6{
        margin: 0;
    color: #081431;
    font-size: 15px;
    font-weight: 600;
}
.bnr3-smrt-insighs .cntnt p{
      margin: 0;
    font-size: 13px;
    line-height: 17px;
    color: #616161;
    margin-top: 6px
}
.bnnr-sctn.bnnr-sctn3.bnnr-sctn4 .banner3-content p{
      color: #081431;
    font-size: 17px;
    letter-spacing: .3px;
    margin: 12px 0;
}
.banner-card .owl-dots{
        position: absolute;
    bottom: 45px;
    left: 16%;
    display: none;
}
.banner-card .owl-dots .owl-dot{
  width: 12px;
  height: 12px;
  border-radius: 50%;
  border: 1px solid #5A5A5A;
  margin: 0 5px;
  transition: width 0.3s linear, border-radius 0.3s linear;
}
.banner-card .owl-dots .owl-dot.active{
  background: var(--primary-color1);
  border: 1px solid var(--primary-color1);
  width: 35px;
  border-radius: 40px;
}
.banner-card .owl-dots .owl-dot span{
  display: none;
}
.single-slide.owl-carousel{
  display: block;
}
/*-------right------banner---image------end---------*/

/*--------title-------wrap------start-------*/

.small-title img{
  width: 25px;
}

.small-title{
  font-size: 19px;
  margin-bottom: 8px;
  display: inline-block;
  font-weight: 500;
}

.main-hdng{
  font-size: 30px;
  color: var(--title-color);
  line-height: 38px;
  padding-bottom: 12px;
  font-weight: 600;
}

/*--------title------wrap-----end----------*/

/*----==============about-----wrap------start==============------*/

.about-sctn{
    width: 100%;
    position: relative;
    padding: 70px 0px;
    background-image: url(../images/about-bg.webp);
    background-size: cover;
    background-repeat: no-repeat;
}

.abt-lft-img-wrp{
  display: flex;
  column-gap: 15px;
  padding-right: 2%;
}

.abt-lft-img-wrp .innr-about-img.innr-about-img1{
  width: 45%;
}
.abt-lft-img-wrp .innr-about-img2{
  width: 55%;
}
.abt-cstmr-bdge{
  border: 1px solid #d7172e8f;
  border-radius: 25px;
  background-color: var(--white);
  padding: 6px 14px;
  margin-top: 20px;
}


/*---------------------------*/

.abt-cstmr-bdge .avatar.add {
  background: var(--white);
  color: #747380;
  font-size: 15px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  border: 1px solid #b7b9c2;
  width: 37px;
  height: 37px;
  border-radius: 50%;
  margin-left: -10px;
}

.abt-cstmr-bdge .text {
  display: flex;
  flex-direction: column;
  line-height: 1;
}

.abt-cstmr-bdge .count {
  font-weight: 700;
  font-size: 16px;
  color: var(--primary-color2);
}

.abt-cstmr-bdge .label {
  font-size: 12px;
  color: #555;
}

/*----------------------------*/
.about-exp-bx {
  position: relative;
  width: 210px;
  height: 105px;
  border-radius: 6px;
  padding: 10px;
  display: flex;
  align-items: center;
  /*flex-direction: column;
  justify-content: center;*/
  gap: 6px;
  overflow: hidden;
  z-index: 1;
  margin-bottom: 20px;
}

/* animated border */
.about-exp-bx::before {
  content: "";
  position: absolute;
  width: 300%;
  height: 300%;
  background: conic-gradient(
    from 0deg,
    rgb(216, 49, 69),
    rgb(225, 225, 230),
    rgb(216, 49, 69)
  );
  animation: rotateBorder 4s linear infinite;
  z-index: -2;
}
.about-list ul{
      list-style-type: none;
    padding: 0;
    margin: 0;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 10px;
    margin-bottom: 25px;
}
.about-list ul li{
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.about-list ul li .icn{
  width: 20px;
    height: 20px;
}
.about-list ul li .icn img{
  width: 100%;
  height: 100%;
  object-fit: scale-down;
}
.about-list ul li .txt{
  width: calc(100% - 20px);
    line-height: 1;
    padding-left: 10px;
    color: var(--title-color);
    font-size: 15px;
    font-weight: 500;
}
/* inner content background */
.about-exp-bx::after {
  content: "";
  position: absolute;
  inset: 6px;
  background: var(--primary-color1);
  border-radius: 5px;
  z-index: -1;
  border: 1px dashed var(--white);
}

/* text styling */
.about-exp-bx h6,
.about-exp-bx p {
  color: #fff;
  margin: 0;
  text-align: center;
}

/* animation */
@keyframes rotateBorder {
   100% {
    transform: rotate(360deg);
  }
}



.about-exp-bx h6{
  color: var(--white);
  font-size: 35px;
  line-height: 73px;
  padding-left: 22px;
}

.about-exp-bx p{
  color: var(--white);
  margin-bottom: 0px;
  font-size: 16px;
  line-height: 21px;
}

.abt-img1,
.abt-img2{
  border-radius: 10px;
  overflow: hidden;
}
.abt-img1.height-img1{
      height: 420px;
}
.abt-img1.height-img1 img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.abt-img2.height-img2{
  height: 420px;
}
.abt-img2.height-img2 img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/*----------==================------------*/

.about-content p{
  font-size: 15px;
  line-height: 27px;
  /* text-align: justify; */
  margin-bottom: 20px;
  color: var(--txt-color);
}

.about-content h6{
  font-weight: 600;
}
/*----==============about-----wrap------end==============------*/


/*-------counter------wrap-----start------*/

.counter-sctn2{
    width: 100%;
  position: relative;
  padding: 15px 0px 30px;
 
}

.innr-count2-wrp{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  width: 100%;
  position: relative;
  padding: 0px;
}

.innr-count2-wrp::before{
  content: '';
  width: 100%;
  height: 85px;
  background-image: url(../images/counter-bdr-shape.webp);
  position: absolute;
  top: -20%;
  left: 0px;
  right: 0px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center bottom;
}

.innr-count2-wrp .counter-bx2{
  padding: 5px 5px;
  transition: 0.5s ease-in-out;
  position: relative;
  z-index: 1;
  text-align: left;
  display: grid;
  align-items: center;
  gap: 5px 10px;
  justify-content: center;
  grid-template-columns: 0.4fr 2fr;
  margin: auto;
}


.counter-bx2-icn{
  width: 48px;
  height: 48px;
  border-radius: 50%;
  border: 1px solid var(--primary-color1);
  text-align: center;
  line-height: 44px;
}

.counter-bx2-icn img{
    width: 25px;
}


.counter-bx2-txt h6{
  font-size: 26px;
  color: var(--primary-color1);
  margin-bottom: 0px;
  font-weight: 600;
}

.counter-bx2-txt h3{
  font-size: 13px;
  margin-bottom: 0px;
  line-height: 22px;
  color: var(--title-color);
}


/*------four-----counter------wrap----start-----*/


.four-count-sctn{
  position: relative;
  padding: 60px 0px;
}

.four-count-wrp{
  grid-template-columns: repeat(4, 1fr);
}

.four-count-wrp::before{
  background-image:none;
}

.four-count-wrp li{
  width: 100%;
  position: relative;
  display: flex !important;
  padding: 16px 0px !important;
}


.four-count-wrp li:nth-child(1),
.four-count-wrp li:nth-child(3){
  border-bottom: 1px solid #e25a6a;
  border-right: 1px solid #e25a6a;
  border-radius: 0px 0px 10px 0px;
}

.four-count-wrp li:nth-child(2){
  border-top: 1px solid #e25a6a;
  border-right: 1px solid #e25a6a;
   border-radius: 0px 10px 0px 0px;
}

.four-count-wrp li:nth-child(4){
  border-top: 1px solid #e25a6a;
}

/*-------four----counter----wrap----end-------*/

/*------counter------wrap----end---------*/


/*-------third---party---integrattion---wrap---start-----*/

.thrd-prty-int-sctn{
  width: 100%;
  position: relative;
  padding: 50px 0px;
  background-image: url(../images/integration-bg.webp);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: 78% 100%;
}

.integrations-content p{
  font-size: 14px;
  line-height: 28px;
  color: var(--txt-color);
  text-align: justify;
  margin-bottom: 15px;
}

.integrations-content ul{
  padding-top: 15px;
}


.integrations-content ul li{
  position: relative;
  padding-bottom: 12px;
  font-size: 14px;
  color: var(--txt-color);
  padding-left: 25px;
  /* text-transform: uppercase; */
}


.integrations-content ul li:before{
  content: '\f00c';
  font-family: fontawesome;
  font-size: 14px;
  position: absolute;
  top: 0px;
  left: 0px;
  color: var(--primary-color1);
}

/*---------------------------------------*/


/*---right---third---party----intigration--image----start---------*/

.thrd-prty-integ-img{
  position: relative;
  text-align: center;
}


.main-intigrtn-circle{
  width: 210px;
  height: 210px;
  border-radius: 50%;
  background-color: var(--white);
  position: absolute;
  top: 28%;
  left: 0px;
  right: 0px;
  margin: auto;
  box-shadow: 0 0 5px rgba(234, 115, 129, 0.03) inset, 0 0 10px 2px rgba(241, 86, 104, 0.15) inset, 0 0 15px 4px rgba(215, 23, 46, 0.31) inset;
  
}

.main-intigrtn-circle:after{
  content: '';
  width: 210px;
  height: 210px;
  position: absolute;
  top: 0%;
  left: 0px;
  right: 0px;
  margin: auto;
  border-radius: 50%;
  animation: animate-pulse 3s linear infinite;
}

@keyframes animate-pulse{
    0%{
        box-shadow: 0 0 0 0 rgba(255,109,74,0.7),  0 0 0 0 rgba(255,109,74,0.7);
    }
    40%{
        box-shadow: 0 0 0 20px rgba(255,109,74,0.0),  0 0 0 0 rgba(255,109,74,0.7);
    }
    80%{
        box-shadow: 0 0 0 20px rgba(255,109,74,0.0),  0 0 0 15px rgba(255,109,74,0);
    }
    100%{
        box-shadow: 0 0 0 0 rgba(255,109,74,0.0),  0 0 0 15px rgba(255,109,74,0);
    }
    
}

.inr-inti-logo{
  width: 150px;
  height: 150px;
  border-radius: 50%;
  background-color: var(--white);
  box-shadow: 0 0 5px rgba(234, 115, 129, 0.03) inset, 0 0 10px 2px rgba(241, 86, 104, 0.15) inset, 0 0 15px 4px rgba(215, 23, 46, 0.31) inset;
  padding-top: 0;
  text-align: center;
  margin: 30px auto;
}

.inr-inti-logo img{
      width: 90%;
    height: 90%;
    object-fit: scale-down;
}

.same-inti-icon{
  width: 70px;
  height: 70px;
  line-height: 65px;
  position: absolute;
  background-color: var(--white);
  border-radius: 10px;
  box-shadow: rgba(0, 0, 0, 0.15) 0px 5px 15px 0px;
}

.fb-bx{
  top: -3px;
  left: 140px;
}

.insta-bx{
  top: 27px;
  right: 121px;
}

.linkedin-bx{
  top: 106px;
  left: 118px;
}

.twitter-bx{
  top: 173px;
  right: 46px;
}

.whatsapp-bx{
  top: 203px;
  left: 43px;
}

.sms-bx{
  bottom: 18px;
  left: 154px;
}

.api-bx{
  bottom: 2px;
  right: 182px;
}

.webhook-bx{
  bottom: 113px;
  right: 115px;
}

.same-inti-icon img{
  width: 33px;
}

.integ-plane{
  position: absolute;
  bottom: -48px;
  left: -160px;
}

.integ-plane img{
  width: 230px;
  animation: lft-rgt 2.6s linear 0s infinite alternate;
}





/*---right---third---party----intigration--image----end---------*/

/*-------third---party---integrattion---wrap---end-----*/

/*----------------------------------*/

.offer-sctn{
  position: relative;
  padding: 75px 0px;
  background-image: url(../images/service-bg.webp);
  background-repeat: no-repeat;
  background-size: cover;
}

.wt-we-offr-row{
  margin-top: 70px;
}

.offer-crd{
  background-color: var(--white);
  border-radius: 15px;
  position: relative;
  padding: 130px 17px 15px;
  margin-top: 25px;
  height: auto;
  box-shadow: rgba(50, 50, 93, 0.25) 0px 30px 50px -20px, rgba(0, 0, 0, 0.3) 0px 30px 30px -40px, rgba(10, 37, 64, 0.35) 0px -2px 6px 0px inset;
}

.offer-img{
  width: 90%;
  margin: 0px auto 0px;
  position: absolute;
  left: 0px;
  right: 0px;
  top: -60px;
}

.offer-img img{
  border-radius: 12px;
}

.offer-icon{
  width: 50px;
  height: 50px;
  border-radius: 50%;
  background-color: var(--primary-color1);
  text-align: center;
  position: absolute;
  line-height: 46px;
  left: 0px;
  right: 0px;
  top: 65px;
  margin: auto;
  box-shadow:
    inset 2px 2px 4px rgba(255,255,255,0.35),
    inset -2px -2px 4px rgba(0,0,0,0.25),
    0 6px 12px rgba(0,0,0,0.25);
    transition: all 0.3s ease;
    overflow: hidden;
}

.dflt-cap{
  transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
}

.hover-cap{
  -webkit-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.offer-crd:hover .offer-icon .dflt-cap{
  -webkit-transform: translateY(-150%);
  -ms-transform: translateY(-150%);
  transform: translateY(-150%);
}

.offer-crd:hover .offer-icon .hover-cap {
  top: 50%;
  -webkit-transform: translateY(-150%);
  -ms-transform: translateY(-150%);
  transform: translateY(-150%);
}

.offer-icon img{
  width: 30px;
  filter: brightness(0) invert(1);
}

.offer-crd h5{
  font-size: 16px;
  text-align: center;
  color: var(--title-color);
  padding-bottom: 5px;
}

.offer-crd p{
  font-size: 13px;
    line-height: 23px;
    color: var(--txt-color);
    margin: 0;
    min-height: 93px;
}

/*.offr-bttm-bx{
  display: flex;
  justify-content: space-between;
  border-top: 1px solid #ddd;
  padding-top: 7px;
  position: absolute;
  width: 90%;
  bottom: 15px;
  align-items: center;
}

.offr-rtng-txt .rating-icon{
  justify-content: start;
}

.offr-rtng-txt p{
  margin-bottom: 0px;
  font-size: 12px;
  color: var(--txt-color);
}

.read-more-bttn{
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-color: var(--primary-color2);
  color: var(--white);
  text-align: center;
  line-height: 30px;
  transition: 0.2s ease;
}

.read-more-bttn:hover{
  color: var(--white);
  background-color: var(--primary-color1);
}*/

/*---------------------------------*/


/*------why----choose-----us----wrap------start------*/

.wy-choose-sctn{
  position: relative;
  padding: 75px 0px;
  background-image: url(../images/wy-choose-bg.webp);
}

.lght-blue-crd{
  padding: 10px 10px;
  background-color: rgba(212, 229, 246, 1);
  border-radius: 10px;
  box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.lght-red-crd{
  padding: 10px 10px;
  border-radius: 5px;
  background-color: rgba(246, 208, 213, 1);
  box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
}

.flx-wy-crd{
  display: flex;
  width: 100%;
  position: relative;
  height: 257px;
  margin-bottom: 32px;
  padding: 21px 10px;
}

.spprt-img img{
  position: absolute;
  right: -21px;
  bottom: 0px;
  width: 230px;
}

.flx-wy-contnt{
  width: 65%;
}
.lght-blue-crd.flx-wy-crd.chs-img-crd2 .wy-choose-txt-crd.flx-wy-contnt{
  width: 54%;
}
.six-yrs-contnt{
  display: flex;
  column-gap: 20px;
  padding: 40px 29px 30px;
}

.rgt-six-yrs-txt h6{
  font-size: 20px;
  margin-bottom: 10px;
  color: var(--title-color);
}

.rgt-six-yrs-txt p{
  font-size: 14px;
  font-style: italic;
  color: var(--txt-color);
  line-height: 25px;
  /* text-align: justify; */
}

.lft-six-yrs{
  position: relative;
}

.lft-six-yrs h3{
  font-size: 104px;
  font-weight: 800;
  color: var(--primary-color1);
  text-align: center;
  line-height: 75px;
}

.exp-yrs{
  position: absolute;
  top: 39px;
  background-color: rgba(246, 208, 213, 1);
  color: var(--primary-color1);
  padding: 2px 4px;
  font-size: 15px;
  left: 0px;
  right: 0px;
  text-align: center;
}

.lft-six-yrs p{
  font-size: 15px;
  color: var(--primary-color1);
  font-weight: 600;
}


.client-img img{
  border-radius: 10px;
  margin-bottom: 12px;
}

.wy-choose-txt-crd h6{
  font-size: 20px;
  color: var(--title-color);
}

.wy-choose-txt-crd p{
  font-size: 14px;
  font-style: italic;
  color: var(--txt-color);
  line-height: 23px;
}

/*------why----choose-----us----wrap------end------*/


/*------testimonials-------wrap------start----------*/

.testimonials-sctn{
  position: relative;
  padding: 75px 0px;
  background-image: url(../images/testimonial-bg.webp);
}

.testi-left-content{
  position: relative;
}


/*.testi-plane{
  position: absolute;
  top: -95px;
  left: -64px;
}

.testi-plane img{
  width: 130px;
  animation: lft-rgt 2.6s linear 0s infinite alternate;
}*/

.testi-some-content p{
  font-size: 14px;
  line-height: 27px;
  /* text-align: justify; */
  width: 95%;
  margin-bottom: 19px;
}

.testi-card{
  background-color: var(--white);
  border-radius: 10px;
  padding: 10px 10px;
  position: relative;
  margin-bottom: 30px;
  height: 325px;
}

.qute-rtng-icon-bx{
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0px 20px;
}


.quote-icn{
  font-size: 60px;
  color: var(--primary-color1);
}


.rating-icon{
  display: flex;
  column-gap: 5px;
  justify-content: center;
}

.rating-icon li{
  font-size: 13px;
  color: #E29D31;
}

.testi-card p{
  font-size: 14px;
  letter-spacing: 0.5px;
  text-align: left;
  padding: 0px 15px 9px;
  margin-bottom: 10px;
  color: var(--title-color);
  line-height: 25px;
  height: 145px;
  overflow-y: scroll;
  scrollbar-width: none;
}

.testi-bttm-bx{
  display: flex;
  align-items: center;
  column-gap: 16px;
  padding: 12px 12px 0px;
  position: absolute;
  bottom: 12px;
  border-top: 1px solid #d5d6eb;
  width: 95%;
  left: 0px;
  right: 0px;
  margin: auto;
}

.testi-bttm-bx .testi-img {
  width: 40px !important;
}
.testi-bttm-bx .testi-username{
  width: calc(100% - 56px);
}
.testi-img img{
  border-radius: 50%;
  width: 40px !important;
  height: 40px;
  border: 2px solid var(--primary-color1);
}

/*-----testimonial-----pagination---wrap----start----*/

/* Pagination styling */
.pagination-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  margin-top: 20px;
}

#pagination {
  display: flex;
  gap: 8px;
  list-style: none;
  padding: 0;
  margin: 0;
}

#pagination li a {
  padding: 6px 12px;
  border: 1px solid var(--primary-color1);
  color: var(--primary-color1);
  text-decoration: none;
  border-radius: 4px;
}

#pagination li a:hover {
  background: var(--primary-color1);
  color: #fff;
}

/* Prev / Next buttons */
.page-nav {
  padding: 6px 14px;
  border: 1px solid var(--primary-color1);
  background: transparent;
  color: var(--primary-color1);
  text-decoration: none;
  border-radius: 4px;
}

.page-nav:hover {
  background: var(--primary-color1);
  color: #fff;
}

/* Fade-in animation for cards */
.testi-card {
  animation: fadeIn 0.4s ease-in-out;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/*-----testimonial-----pagination---wrap----end----*/


.testi-review-slider .owl-dot.active span {
  background: var(--primary-color1) !important;
}

.testi-review-slider .owl-dot span {
  border: 1px solid #e89696;
  background-color: #fcc7c7b0 !important;
}

/* --- OWL CUSTOM ARROWS --- */

.owl-nav {
  position: absolute;
  top: 40%;
  width: 100%;
  display: flex;
  justify-content: space-between;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transition: all 0.3s linear;
}
.banner-card:hover .owl-nav{
  opacity: 1;
  visibility: visible;
}
.owl-nav button {
  background: transparent !important;
  color: var(--primary-color1) !important;
  width: 46px;
  height: 46px;
  border-radius: 50%!important;
  pointer-events: all;
  display: flex !important;
  align-items: center;
  justify-content: center;
  transition: 0.3s;
  border: 1px solid var(--primary-color1)!important;
}
.owl-nav button i{
    position: relative;
    top: 1px;
}
.owl-nav button:hover {
  background: var(--primary-color1) !important;
  color: #fff!important;
}

/* --- DOTS --- */
.owl-dots {
  margin-top: 15px;
  text-align: center;
}

.owl-dot span {
  width: 10px;
  height: 10px;
  background: #ccc !important;
  border-radius: 50%;
  margin: 5px 7px;
  transition: 0.3s;
  display: block;
}

.owl-dot.active span {
  background: #003d66 !important;
  transform: scale(1.2);
}


/*------testimonials-------wrap-----end----------*/

/*-------newsletter-------wrap----start----------*/


.newsletter-sctn{
  position: relative;
  width: 100%;
  padding: 50px 0px;
  background-image: url(../images/newsletter-sctn.webp);
  background-size: cover;
  height: 100%;
  background-position: 65% 100%;
}

.newslttr-img{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px 21px;
}

.newlttr-wrp h3{
  font-size: 32px;
  color: var(--title-color);
}

.newlttr-wrp p{
  font-size: 15px;
  color: var(--txt-color);
}

.nwslttr-inpt-wrp{
  display: flex;
  gap: 10px 15px;
}

.nwslttr-inpt-wrp input{
  width: 73%;
  height: 51px;
  border-radius: 25px;
  border: 1px solid #a99e9fa8;
  padding: 4px 18px;
}

.nwslttr-inpt-wrp input:focus{
  outline: none;
  border-color: var(--primary-color1);
}


.nwslttr-inpt-wrp .button-style2 {
  padding: 10px 13px;
}

/*-------newsletter-------wrap----end----------*/


/*------about--------page-----wrap----start-----*/

.our-exp-sctn{
  position: relative;
  width: 100%;
  padding: 50px 0px;
  background-image: url(../images/exp-bg.webp);
  background-size: cover;
  height: 100%;
}

.about-exp-img-bx{
  position: relative;
}

.about-exp-img-bx:before{
  content: '';
  position: absolute;
  left: 7px;
  top: 32%;
  width: 82%;
  height: 100%;
  background-image: url(../images/about-exp-shape.webp);
  background-size: contain;
  background-repeat: no-repeat;
  animation: lft-rgt2 2.6s linear 0s infinite alternate;
}


@keyframes lft-rgt2 {
  0% {
    transform: translateX(-5px);
  }
  100% {
    transform: translateX(0px);
  }
}

.about-exp-img-bx img{
  width: 80%;
  position: relative;
}

.main-our-exp{
  margin-top: 25px;
}

.our-exp-crd{
  background-color: var(--white);
  border-radius: 5px;
  box-shadow: rgba(100, 100, 111, 0.23) 0px 0px 5px 0px;
  padding: 14px 15px;
  display: flex;
  gap: 10px 17px;
  margin-bottom: 20px;
  align-items: center;
}
.our-exp-crd span{
  width: 40px;
}
.our-exp-crd span img{ 
  width: 40px;
 }
.our-exp-crd .our-exp-txt{
  width: calc(100% - 50px);
}
.our-exp-txt h6{
  color: var(--title-color);
  font-size: 18px;
  margin-bottom: 4px;
}

.our-exp-txt p{
  font-size: 14px;
  color: var(--txt-color);
  margin-bottom: 0px;
}

/*------about--------page-----wrap----end-----*/

/*-------pricing-------page-------style---start-----*/

.pricing_sctn{
    position: relative;
    width: 100%;
    padding: 50px 0px;
    background-image: url(../images/pricing-pttrn.webp);
    background-size: cover;
    height: 100%;
}


.pricing_sctn:after{
  content: '';
  position: absolute;
  left: 0px;
  right: 0px;
  top: 0px;
  width: 100%;
  height: 100%;
  background: linear-gradient(80deg,rgba(216, 21, 48, 0.12) 20%, rgb(255, 255, 255) 40%, rgba(39, 128, 212, 0.15) 90%);
}


.title-crrncy-wrp{
  display: flex;
  align-items: center;
  position: relative;
  z-index: 1;
  justify-content: center;
}

.title-crrncy-wrp h3{
    text-align: center;
  font-size: 25px;
  color: var(--primary-color3);
  margin-bottom: 0px;
  font-weight: 600;
  width: 80%;
}

.title-crrncy-wrp h3 span{
    font-style: italic;
    color: var(--primary-color1);
}


/*------features-------pricing------wrap-------start------*/

.pricing-wrapper {
  overflow-x: auto;
  padding: 20px;
  position: relative;
  z-index: 1;
}

.pricing-table {
  display: grid;
  grid-template-columns: 260px repeat(3, 1fr);
  min-width: 950px;
  border-radius: 30px;
  background: var(--white);
  box-shadow: rgba(0, 0, 0, 0.15) 0px 5px 15px 0px;
  overflow: hidden;
  padding: 10px 10px 0px;
  column-gap: 0;
}


.pricing-col.features {
  background-color: rgba(253, 241, 243, 1);
  border-radius: 30px 30px 0px 30px;
  padding: 25px 0px 0px;
}

.pricing-header {
  text-align: center;
}

.pckg_hdr{
  background-color: var(--primary-color1);
    border-radius: 30px;
    border: 1px solid #d7172e5c;
    padding: 19px 1px 1px;
    width: calc(100% - 8px);
    margin: 0 auto 7px auto;
        min-height: 314px;
}

.pricing-header.pckg_hdr h3 {
  color: var(--white);
  margin-bottom: 11px;
  font-size: 20px;
}

.pricing-header .cstmztn-txt {
  display: inline-block;
  font-size: 12px;
  background: #ffe6e9;
  padding: 3px 18px;
  border-radius: 20px;
}

.inr-white-pkg-bx{
  background-color: var(--white);
  border-radius: 25px;
  padding: 10px 10px 15px;
  margin-top: 10px;
}

.maint-txt p{
  margin: 0px auto 0px;
  font-size: 12px;
  border: 1px solid #999baa;
  border-radius: 20px;
  color: #424554;
  padding: 6px 2px;
  width: 95%;
}


.price-bdr-bx{
  border: 1px solid #d7162e96;
  border-radius: 10px;
  width: 85%;
  margin: auto;
  padding: 7px 0px;
}

.price {
  font-size: 24px;
  font-weight: 600;
  color: #4a4a52;
  letter-spacing: 0.5px;
}

.price-bdr-bx small{
    color: var(--primary-color1);
}

.fill-txt{
  text-align: center;
  font-size: 32px;
  color: #ffe5db;
  letter-spacing: 0.10px;
  cursor: pointer;

  /* FAKE STROKE */
  text-shadow:
    -1px -1px 0 #f96d6d,
     1px -1px 0 #f96d6d,
    -1px  1px 0 #f96d6d,
     1px  1px 0 #f96d6d,
     0   -1px 0 #f96d6d,
     0    1px 0 #f96d6d,
    -1px  0   0 #f96d6d,
     1px  0   0 #f96d6d;

}

.feature-img{
    padding: 18px 0px;
    min-height: 211px;
}

.web-ftr-img{
  min-height: 233px;
}
.pricing-header.wbst-prc-hdr {
    min-height: 296px;
}
.feature-img img{
    width: 155px;
    image-rendering: -webkit-optimize-contrast;
}

.pricing-col ul {
  list-style: none;
  margin: 0;
  padding: 0;
}


.rgt-bdr{
     border-right: 1px solid #d9d9dc;
}

.feature-lbl ul{
  display: flex;
  padding: 7px 7px;
  justify-content: space-between;
  column-gap: 7px;
  align-items: center;
  border-top: 1px solid #bdbdce;
  border-bottom: 1px solid #bdbdce;
  margin: 17px auto;
}

.feature-lbl ul li img{
    width: 23px;
}

.feature-lbl ul li i{
  color: var(--primary-color1);
}

.feature-lbl ul li{
  font-size: 13px;
  font-weight: 500;
  color: #575667;
}

.pricing-col .feature-chck-list li {
  padding: 12px;
  border-top: 1px dashed #c0bece;
  text-align: center;
  font-size: 14px;
}

.pricing-col.features .feature-chck-list li {
  text-align: left;
  position: relative;
  font-size: 14px;
  padding: 13px 5px 12px 32px;
}

.pricing-col.features .feature-chck-list li:before{
  content: '';
  position: absolute;
  width: 6px;
  height: 6px;
  border: 1px solid #696878;
  border-radius: 50%;
  margin-top: 9px;
  left: 15px;
}

.yes span{
  color: var(--white);
  font-weight: 500;
  width: 22px;
  height: 22px;
  background-color: #139935;
  border-radius: 50%;
  display: block;
  margin: auto;
  font-size: 13px;
  line-height: 22px;
}

.no span{
  color: var(--white);
  font-weight: 500;
  width: 22px;
  height: 22px;
  background-color: #d91930;
  border-radius: 50%;
  display: block;
  margin: auto;
  font-size: 13px;
  line-height: 22px;
}

.no .addon-txt{
  color: #fff;
  font-weight: 600;
  font-size: 10px;
  background: #139935;
  width: auto;
  height: auto;
  border-radius: 4px;
  display: inline-block;
  margin: auto;
  line-height: 1;
  text-align: center;
  white-space: nowrap;
      padding: 5px 5px;
}

/*.web-fetr-list{
  margin-top: 35px !important;
}
*/
.web-pkg-hdr .feature-lbl ul {
  justify-content: center;
}

/*----pricing---page-----third---party----integration----start------------*/


.integration-icon ul {
   display: flex;
  flex-wrap: wrap;
  gap: 9px 10px;
  justify-content: center;
  margin-bottom: 12px;
}

.integration-icon ul li{
    padding: 0px !important;
    border-top: none !important;
}

.integration-icon ul li:before{
    display: none;
}

.integration-icon .icon {
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    position: relative;
    z-index: 2;
    transition: 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.integration-icon .icon span {
    padding: 0px;
    text-align: center;
    font-size: 14px;
    background-color: #fff;
    width: 30px;
    height: 28px;
    line-height: 28px;
    border-radius: 8px;
    color: #525391;
    box-shadow: rgba(109, 104, 149, 0.17) 0px -13px 15px 0px inset,
        rgba(122, 119, 157, 0.15) 0px -16px 10px 0px inset,
        rgba(158, 151, 185, 0.1) 0px -39px 9px 0px inset,
        rgba(163, 161, 193, 0.06) 0px 2px 1px, rgba(131, 129, 162, 0.09) 0px 4px 2px,
        rgba(164, 161, 179, 0.09) 0px 5px 4px, rgba(0, 0, 0, 0.09) 0px 0px 5px,
        rgba(168, 170, 189, 0.09) 0px 2px 2px;
}


.integration-icon .icon .tooltip {
    position: absolute;
    top: 0;
    z-index: 1;
    background: #fff;
    color: #fff;
    padding: 5px 13px;
    font-size: 12px;
    font-weight: 500;
    border-radius: 25px;
    opacity: 0;
    pointer-events: none;
    white-space: nowrap;
    box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.1);
    transition: 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.integration-icon .icon:hover .tooltip {
    top: -36px;
    opacity: 1;
    pointer-events: auto;
}

.icon .tooltip:before {
    position: absolute;
    content: "";
    height: 10px;
    width: 10px;
    background: #fff;
    left: 50%;
    bottom: -4px;
    transform: translateX(-50%) rotate(45deg);
    transition: 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
}

.integration-icon .icon:hover span {
    color: #fff;
}

.integration-icon .icon:hover span,
.integration-icon .icon:hover .tooltip {
    text-shadow: 0px -1px 0px rgba(0, 0, 0, 0.4);
}

.integration-icon .facebook:hover span,
.integration-icon .facebook:hover .tooltip,
.integration-icon .facebook:hover .tooltip:before {
    background: #3b5999;
}

.integration-icon .instagram:hover span,
.integration-icon .instagram:hover .tooltip,
.integration-icon .instagram:hover .tooltip:before {
    background: #e1306c;
}

.integration-icon .whatsapp:hover span,
.integration-icon .whatsapp:hover .tooltip,
.integration-icon .whatsapp:hover .tooltip:before {
    background: #2b7930;
}

.integration-icon .sms:hover span,
.integration-icon .sms:hover .tooltip,
.integration-icon .sms:hover .tooltip:before {
    background: #db9030;
}

.integration-icon .g-form:hover span,
.integration-icon .g-form:hover .tooltip,
.integration-icon .g-form:hover .tooltip:before {
    background: #2b6779;
}

.integration-icon .bulk-email:hover span,
.integration-icon .bulk-email:hover .tooltip,
.integration-icon .bulk-email:hover .tooltip:before {
    background: #de463b;
}

.integration-icon .qr-form:hover span,
.integration-icon .qr-form:hover .tooltip,
.integration-icon .qr-form:hover .tooltip:before {
    background: #590c3f;
}

.integration-icon .web-form:hover span,
.integration-icon .web-form:hover .tooltip,
.integration-icon .web-form:hover .tooltip:before {
    background: #144f46;
}

.integration-icon .dialer:hover span,
.integration-icon .dialer:hover .tooltip,
.integration-icon .dialer:hover .tooltip:before {
    background: #122553;
}

/*----pricing---page-----third-----party----integration-----end----------*/


/*------features------pricing-------wrap-------end-------*/


/*-------country----currency--------start---------*/
.select2-results__option img,
.select2-selection__rendered img {
    vertical-align: middle;
    border-radius: 2px;
}

.select2-container--default .select2-selection--single {
  background-color:var(--white);
  border: none !important;
  border-radius: 25px !important;
  box-shadow: 1px 3px 7px -1px #a7a4b1;
}

.select2-container .select2-selection--single {
    height: 42px !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
  line-height: 43px !important;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
  height: 42px;
  right: 10px;
}

.select2-container .select2-selection--single .select2-selection__rendered {
  padding-left: 15px !important;
}

.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable {
  background-color: var(--primary-color1) !important;
}

.select2-container--default .select2-results > .select2-results__options {
    scrollbar-width: thin;
}

.select2-container--default .select2-search--dropdown .select2-search__field {
  border: 1px solid #bbbac4 !important;
  border-radius: 5px;
}

.select2-container--default .select2-search--dropdown .select2-search__field:focus{
    border-color: #d7172e7a !important;
    outline: none;
}

/*-----country----currency----end------------*/

/*----===================pricing-------page-------style---end===================-----*/

/*--------service-------card------page----wrap------start------*/

.service-pg-sctn{
  width: 100%;
  position: relative;
  padding: 60px 0px 75px;
  background-image: url(../images/innr-service-bg.webp);
  background-size: cover;
  background-position: center;
}

.service-card {
  width: 100%;
  border-radius: 20px;
  background: #ffffff;
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.25);
  position: relative;
  transition: transform 0.3s ease;
}

.service-card::after {
  content: "";
  position: absolute;
  bottom: -1px;
  right: 0px;
  width: 65px;
  height: 60px;
  background: #f1f1f1;
  border-top-left-radius: 30px;
  z-index: 1;
  box-shadow: inset 35px 28px 40px -52px rgba(0, 0, 0, 0.25);
}


.service-img-bx {
  position: relative;
  margin: 15px auto;
  transition: transform 0.3s ease;
  overflow: hidden;
  border-radius: 14px;
}

.service-img-bx img {
  width: 100%;
  height: 185px;
  object-fit: cover;
  border-radius: 14px;
  transition: transform 0.3s ease;
}

.service-card:hover .service-img-bx img {
  transform: scale(1.1);
}

.service-icon {
  position: absolute;
  bottom: 15px;
  left: 13px;
  width: 42px;
  height: 42px;
  background: var(--white);
  border-radius: 10px;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.15);
  display: flex;
  align-items: center;
  justify-content: center;
}

.service-icon img {
  width: 26px;
  height: 26px;
  border-radius: 0px;
}

.service-crd-content {
  padding:19px 22px 25px;
  position: relative;
}

.service-crd-content h3 {
  font-size: 16px;
  font-weight: 600;
  color: var(--title-color);
  margin-bottom: 10px;
}

.service-crd-content p {
  font-size: 14px;
  line-height: 1.6;
  color: var(--txt-color);
}

.service-bttm-bx {
  margin-top: 13px;
  display: flex;
  justify-content: end;
  align-items: center;
  column-gap: 5px;
  position: relative;
  width: 80%;
}

.service-bttm-bx:before{
  content: '';
  position: absolute;
  width: 59%;
  height: 1px;
  background-color: #7b7b89ab;
  left: 0px;
  top: 12px;
}

.service-bttm-bx .know-more {
  font-size: 14px;
  font-weight: 500;
  color: #e11d48;
  cursor: pointer;
  transition: transform 0.3s ease;
}

.service-card:hover .service-bttm-bx .know-more {
  color: var(--primary-color2);
}

.service-crd-content .arrow-btn {
  width: 36px;
  height: 36px;
  background: #e11d48;
  color: var(--white);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
  transition: transform 0.3s ease;
  position: absolute;
  right: 13px;
  bottom: 12px;
  z-index: 9;
}

.service-card:hover .service-crd-content .arrow-btn {
  background-color: var(--primary-color2);
}

/*--------service------card-----page---wrap------end--------*/

/*-----inner-----service-------content----page---start--------*/

.service-cntnt-sctn{
  position: relative;
  width: 100%;
  padding: 50px 0px;
  background-image: url(../images/innr-service-bg.webp);
  background-size: cover;
  background-position: center;
}

.left-inr-service-contnt p{
  font-size: 14px;
  line-height: 28px;
  color: var(--txt-color);
  text-align: justify;
  margin-bottom: 15px;
}


.inr-service-img-wrp{
  position: relative;
}

.service-screen img{
  width:75%;
}

.point-man-img{
  position: absolute;
  bottom: -50px;
  right: 0px;
}

.point-man-img img{
  width: 95%;
}

/*----=========================-----*/

.benifit-section {
  padding: 70px 0px;
  background-image: url(../images/innr-service-bg.webp);
  background-size: cover;
  background-position: center;
}

.benifit-grid .benfit-bdr-bx{
  border-right: 1px solid #ddddef;
  border-bottom: 1px solid #ddddef;
  padding: 10px;
}

.benifit-grid .benfit-bdr-bx:nth-child(3),
.benifit-grid .benfit-bdr-bx:nth-child(6){
  border-right:none;
}

.benifit-grid .benfit-bdr-bx:nth-child(4),
.benifit-grid .benfit-bdr-bx:nth-child(4),
.benifit-grid .benfit-bdr-bx:nth-child(6){
  border-bottom:none;
}


.benifit-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  max-width: 1200px;
  margin: 25px auto 0px;
  background-color: var(--white);
  border: 1px solid #ddd;
  border-radius: 10px;
  padding: 0px;
}

.benifit-box {
  background: rgba(255, 234, 233, 1);
  border-radius: 12px;
  padding: 18px 20px;
  display: flex;
  align-items: center;
  gap: 14px;
}

.benifit-icon {
  width: 72px;
  height: 72px;
  background: var(--white);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  position: relative;
}

.benifit-icon::before {
  content: '';
  position: absolute;
  inset: 0;
  background-color: var(--primary-color1);
  border-radius: 50%;
  transform: scale(0);
  transition: transform 0.4s ease;
  z-index: 0;
}

.benifit-box:hover .benifit-icon::before {
  transform: scale(1);
}

.benifit-icon img {
  width: 40px;
  height: 40px;
}

.benifit-box:hover .benifit-icon img{
  filter: brightness(0) invert(1);
}

.benifit-box p {
  margin: 0;
  font-size: 14px;
  font-weight: 500;
  color: #333;
}

/*-------===========================-----------*/

/*-----inner-----service-------content----page---end--------*/


/*-------product------wrap---------start--------*/

.prdct-main-wrap{
  display: flex;
  flex-wrap: wrap;
  margin: 25px auto 0px;
  justify-content: center;
  gap: 43px 35px;
}

.inr-prdct-bx{
  display: flex;
  gap: 14px 15px;
  box-shadow: rgba(0, 0, 0, 0.2) 0px 18px 50px -10px;
  position: relative;
  border-radius: 80px;
  padding: 19px 15px 19px 25px;
  align-items: center;
  width: 31%;
} 


.prdt-icon img{
  width: 130px;
}

.prdt-content h6{
  font-size: 18px;
  font-weight: 500;
  color: var(--title-color);
}

.prdt-content p{
  font-size: 14px;
  color: var(--txt-color);
}

.prdt-content a{
  color: var(--primary-color1);
}

.prdct-right-content p {
  font-size: 14px;
  line-height: 25px;
  color: var(--txt-color);
  text-align: justify;
  margin-bottom: 10px;
}


.prdct-right-img{
  border-radius: 10px;
  position: relative;
  width: 100%;
  height: 260px;
}

.prdct-right-img img{
  border-radius: 10px;
  position: relative;
  z-index: 1;
  width: 95%;
  height: 100%;
  object-fit: cover;
  object-position: top;
}

.prdct-right-img:after{
  content: '';
  width: 95%;
  height: 100%;
  background-color: var(--primary-color1);
  position: absolute;
  right: 13px;
  bottom: -19px;
  border-radius: 0px 35px 15px 40px;
}


/*------------------------------------*/

.prdct-service-bttm-sctn{
  position: relative;
  width: 100%;
  padding: 50px 0px;
  background-image: url(../images/newsletter-sctn.webp);
  background-size: cover;
  height: 100%;
  background-position: 65% 100%;
}


.prdct-service-bttm-wrap{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  max-width: 1200px;
  margin: 25px auto 0px;
  background-color: var(--white);
  border: 1px solid #ddd;
  border-radius: 10px;
  padding: 30px 0px 30px;
}

.prdct-smll-bx{
  text-align: center;
  position: relative;
}


.prdct-service-bttm-wrap .prdct-smll-bx:after{
  content: '';
  position: absolute;
  right: 0px;
  width: 1px;
  height: 100%;
  border-right: 1px dashed var(--primary-color1);
  top: 0px;
}

.prdct-service-bttm-wrap .prdct-smll-bx:last-child:after{
  display: none;
}


.prdct-round-img{
  width: 100px;
  height: 100px;
  line-height: 93px;
  border-radius: 50%;
  background-color: rgba(216, 21, 48, 0.06);
  margin: auto;
}

.prdct-round-img img{
  width: 55px;
}


.prdct-smll-bx h6{
  font-size: 20px;
  padding-top: 15px;
  color: var(--txt-color);
}

/*-----------------------------------*/


/*---6-----hexagon-------bx---------wap----------start------------*/

.benfit-three-wrp{
  display: flex;
  gap: 5px 8px;
  justify-content: center;
}


.white-hxzn{
  background: #f7efef !important;
}

.inr-hex-bx{
  width: 100%;
  height: 100%;
  padding-top: 17px;
}


.prdct-icn{
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background-color: var(--white);
  box-shadow: 0px 4px 4px 0px #ddd;
  text-align: center;
  margin: auto;
  line-height: 60px;
}

.prdct-icn img{
  width: 33px;
}


.benift-hex-shdw{
  filter: drop-shadow(0px 2px 3px rgba(70, 68, 79, 0.4));
}

.white-hxzn > .inr-hex-bx span {
  font-size: 14px !important;
  color: var(--txt-color) !important;
  text-transform: capitalize !important;
  line-height: 19px !important;
  margin: auto;
  display: inline-block;
  padding-top: 8px;
}


.benift-hexagon {
  display: flex;
  position: relative;
  width: 160px;
  height: 160px;
  background: var(--primary-color1);
  text-align: center;
  text-decoration: none;
  align-items: center;
  -webkit-clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);
  clip-path: polygon(45% 1.33975%, 46.5798% 0.60307%, 48.26352% 0.15192%, 50% 0%, 51.73648% 0.15192%, 53.4202% 0.60307%, 55% 1.33975%, 89.64102% 21.33975%, 91.06889% 22.33956%, 92.30146% 23.57212%, 93.30127% 25%, 94.03794% 26.5798%, 94.48909% 28.26352%, 94.64102% 30%, 94.64102% 70%, 94.48909% 71.73648%, 94.03794% 73.4202%, 93.30127% 75%, 92.30146% 76.42788%, 91.06889% 77.66044%, 89.64102% 78.66025%, 55% 98.66025%, 53.4202% 99.39693%, 51.73648% 99.84808%, 50% 100%, 48.26352% 99.84808%, 46.5798% 99.39693%, 45% 98.66025%, 10.35898% 78.66025%, 8.93111% 77.66044%, 7.69854% 76.42788%, 6.69873% 75%, 5.96206% 73.4202%, 5.51091% 71.73648%, 5.35898% 70%, 5.35898% 30%, 5.51091% 28.26352%, 5.96206% 26.5798%, 6.69873% 25%, 7.69854% 23.57212%, 8.93111% 22.33956%, 10.35898% 21.33975%);
}


.benift-hexagon > span {
  position: relative;
  z-index: 1;
  color: #fff;
  line-height: 26px;
  font-size: 19px;
  text-transform: uppercase;
}

/*---6-----hexagon-------bx---------wap---------end-----------*/


/*-------==========================product------wrap---------end=================--------*/


/*-------ai----agent------inner---page----wrap---start-------*/


.ai-agent-sctn{
  position: relative;
  padding: 70px 0px 25px;
  width: 100%;
}

.ai-agnt-crd{
  box-shadow: rgba(50, 50, 93, 0.25) 0px 1px 12px -2px, rgba(0, 0, 0, 0.3) -3px -1px 7px -3px;
  background-color: var(--white);
  border-radius: 8px;
  margin-bottom: 25px;
  overflow: hidden;
}


.ai-agnt-crd img{
  width: 100%;
  height: 100%;
}

.ai-agnt-title{
  text-align: center;
  box-shadow: 0px -3px 5px -2px #adacc1;
  padding: 13px 10px;
  transition: 0.5s ease;
}

.ai-agnt-title a{
  font-size: 18px;
  color: var(--title-color);
  
}

.ai-agnt-crd:hover .ai-agnt-title a{
  color: var(--primary-color1);
}

.ai-agnt-2crd{
  margin-bottom: 44px;
}

.ai-agnt-2crd img{
  width: 100%;
  height: 192px;
  object-fit: cover;
  object-position: top;
}

/*-------ai----agent------inner---page----wrap-----end-------*/

/*--------------------------*/


.ai-agn-innr-pg{
  position: relative;
  padding: 50px 0px;
  width: 100%;
  background-image: url(../images/newsletter-sctn.webp);
  background-size: cover;
  height: 100%;
  background-position: 65% 100%;
}

.ai-chat-card{
  border-radius: 10px;
  box-shadow: rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.05) 0px 8px 32px;
  background-color: var(--white);
  padding: 24px 17px;
  height: 230px;
}

.ai-chat-icon img{
  width: 35px;
  margin-bottom: 14px;
}

.ai-chat-card h6{
  font-size: 18px;
  color: var(--title-color);
}


.ai-chat-card p{
  font-size: 14px;
  line-height: 25px;
  color: var(--txt-color);
  margin-bottom: 0px;
}

.ai-chat-img img{
  width: 100%;
  height: 230px;
  object-fit: cover;
  border-radius: 10px;
}

.ai-chat-img, .ai-chat-card{
  margin-bottom: 25px;
}


/*------------------------------*/


/*--------contact---------page-------wrap------start----------*/

.contct-pg-sctn1{
  width: 100%;
  position: relative;
  padding: 50px 0px;
  background-image: url(../images/contact-bg.webp);
  background-size: cover;
  background-position: center;
}

.get-tch-form-wrap{
  background-color: var(--white);
  border-radius: 15px;
  padding: 35px 33px;
}

.contact-lft-content h3{
  font-size: 20px;
  color: var(--primary-color1);
}


.contact-lft-content p{
  font-size: 15px;
  text-align: left;
  line-height: 25px;
  color: var(--txt-color);
}

.contct-list{
  border-top: 1px solid #ddd;
  padding-top: 15px;
}

.contct-list li .cntct-list-icon{
  width: 40px;
  height: 40px;
  box-shadow: 0px 2px 5px 1px #ddd;
  position: absolute;
  text-align: center;
  line-height: 39px;
  border-radius: 4px;
  left: 0px;
  top: 0px;

}

.contct-list li .cntct-list-icon img{
  width: 35px;
}
.contct-list li .cntct-list-txt{
  width: 100%;
}
.contct-list li{
      margin-bottom: 12px;
    display: flex;
    position: relative;
    padding-left: 50px;
    min-height: 40px;
}

.contct-list li .cntct-list-txt a{
  font-size: 15px;
  color: var(--txt-color);
}

/*------------------------*/

.tech-support-img-bx{
    display: grid;
    grid-template-columns: 2.5fr 2fr;
    gap: 10px 10px;
    margin-top: 30px;
}

.tech-spprt-bx{
  background-color: rgba(216, 21, 48, 0.1);
  padding: 25px 12px;
  border-radius: 12px;
  height: 213px;
}

.innr-spprt-dtl{
  display: flex;
  column-gap: 12px;
  align-items: center;
}

.spprt-dtl-txt h6{
  font-size: 18px;
  color: var(--primary-color1);
  margin-bottom: 0px;
}

.spprt-dtl-txt p{
  margin-bottom: 0px;
}

.spprt-dtl-txt p a{
  font-size: 15px;
  color: var(--txt-color);
}

.tech-spprt-bx .foot-social-link {
  border-top: 1px solid #4c4f6333;
  padding-top: 15px;
  margin: 15px auto 0px;
}

.tech-spprt-bx .foot-social-link h6 {
  color: var(--txt-color);
  padding-bottom: 9px;
}

.tech-spprt-bx .foot-social-link ul li a {
  background: var(--primary-color3);
  color: var(--white);
}

.smll-cont-img{
  width: 100%;
  height: 213px;
  border-radius: 10px;
  overflow: hidden;
}

.smll-cont-img img{
  width: 100%;
  height: 100%;
}


/*----------------------------------*/

.contct-pg-sctn2{
  position: relative;
  width: 100%;
  padding: 50px 0px;
}


.contct-map iframe{
  width: 100%;
  height: 300px;
  border-radius: 12px;
  box-shadow: 0px 2px 4px 2px #ddd;
}


.contct-building-img{
  width: 100%;
  height: 300px;
  overflow: hidden;
  border-radius: 12px;
}

.contct-building-img img{
  width: 100%;
  height: 100%;
}

/*-------contact------page------wrap----end------*/
/* start get free demo */
.free-demo-bg{
  width: 100%;
  position: relative;
  padding: 50px 0px;
  background-image: url(../images/free-demo-bg.png);
  background-size: cover;
  background-position: center;
}
/* .mdl-form-wrap.free-dm{
      background: #fff;
    padding: 25px;
    border-radius: 15px;
    box-shadow: 0 0 10px rgb(40 44 53 / 20%);
} */
.mdl-form-wrap.free-dm{
      grid-template-columns: 460px 1.0fr;
      gap: 5px 25px;
}
.mdl-form-wrap.free-dm .popup-lft-form-dtl:before{
  top: 0px;
}
.mdl-form-wrap.free-dm .free-demo-form{
  width: 100%;
  max-width: 100%;
}
.mdl-form-wrap.free-dm .popup-round-img{
      width: 285px;
    height: 285px;
        top: 9%;
}
.mdl-form-wrap.free-dm .popup-lft-form-dtl:before{
      width: 370px;
    height: 375px;
    border-radius: 0px 0px 190px 190px;
    border: 12px solid #39393f;
    border-top: none;
}
.mdl-form-wrap.free-dm .popup-lft-form-dtl:after{
     width: 370px;
    height: 390px;
    background-color: #ffffff14;
    left: 0px;
    margin: auto;
    top: 1px;
    right: 0;
    display: none;
}
.mdl-form-wrap.free-dm .popup-lft-form-dtl{
      border-radius: 34px;
}
/* end get free demo */



/*-------breadcrumb-------wrap------start-----------*/

.brdcrmb-sctn{
    width: 100%;
    height: auto;
    position: relative;
    padding: 45px 0px;
    background-image: url(../images/breadcrmb-pttrn.webp);
    background-size: cover;
    background-position: center;
}

.brdcrmb-sctn:after{
    content: '';
    position: absolute;
    left: 0px;
    right: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    background: linear-gradient(80deg,rgba(216, 21, 48, 0.2) 30%, rgba(9, 9, 121, 0) 50%, rgba(39, 128, 212, 0.2) 80%);
}


.innr-brdcrmb-wrp{
    position: relative;
    z-index: 1;
}

.innr-brdcrmb-wrp h3{
    font-size: 28px;
    text-align: center;
    color: var(--primary-color1);
    font-weight: 700;
}


.breadcrumb-list{
    display: flex;
    column-gap: 27px;
    justify-content: center;
}

.breadcrumb-list li{
   position: relative;
  /*color: #48494f;*/
  font-size: 15px;
}

.breadcrumb-list li a{
    color:#48494f;
    transition: 0.3s ease;
}

.active-pg-link,
.breadcrumb-list li a:hover{
    color: var(--primary-color1);
}

.breadcrumb-list li:after{
    content: '\f054';
    font-family: fontawesome;
    font-size: 13px;
    color: #48494f;
    position: absolute;
    top: 3px;
    margin-left: 8px;
}

.breadcrumb-list li:last-child:after{
    display: none;
}

/*-------breadcrumb-------wrap------end-----------*/

/*--------career--------page----------wrap-----start--------*/

.current-opportunities{
  position: relative;
  width: 100%;
  padding: 50px 0px 80px;
  background-image: url(../images/newsletter-sctn.webp);
  background-size: cover;
  height: 100%;
  background-position: 65% 100%;
}

.job-card{
  background-color: var(--white);
  box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
  border-radius: 10px;
  transition: 0.2s ease-in-out;
}

.job-img{
  overflow: hidden;
  border-radius: 10px;
}

.job-img img{
  width: 100%;
  height: 100%;
  transition: 0.2s ease-in-out;
}

.job-img:hover img{
  transform: scale(1.1);
}

.innr-job-dtl{
  padding: 13px 17px 8px;
  position: relative;
}

.innr-job-dtl h6{
  font-size: 18px;
  color: var(--title-color);
  text-align: center;
}

.innr-job-dtl p{
  font-size: 14px;
  color: var(--txt-color);
  text-align: center;
  line-height: 25px;
  padding-bottom: 9px;
}

.btn-apply{
  text-align: center;
  position: absolute;
  left: 0px;
  right: 0px;
  bottom: -9px;
}

.btn-apply a{
  color: var(--white);
  background-color: var(--primary-color1);
  font-size: 13px;
  padding: 5px 10px;
  border-radius: 20px;
  transition: 0.2s ease-in-out;
}

.btn-apply a:hover{
  background-color: var(--primary-color2);
}


/*--------------------------*/

.career-group-sctn{
  position: relative;
  padding: 75px 0px;
  background-image: url(../images/testimonial-bg.webp);
}

.career-group-content h4{
  font-size: 27px;
  color: var(--title-color);
  font-weight: 600;
  margin-bottom: 15px;
}

.career-group-content p{
  font-size: 17px;
  line-height: 33px;
  color: var(--txt-color);
  width: 95%;
}

/*----------------------------*/

.career-krs-img{
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 10px 12px;
}


.career-krs-img img{
  border-radius: 10px;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/*---------------------------*/

.why-work{
  position: relative;
  width: 100%;
  padding: 50px 0px 80px;
  background-image: url(../images/newsletter-sctn.webp);
  background-size: cover;
  height: 100%;
  background-position: 65% 100%;
}

.inner-wy-work-wrap{
  margin-top: 50px;
  position: relative;
}

.wy-work-bdr{
  position: absolute;
  left: 0px;
  right: 0px;
}


.why-card{
  position: relative;
  z-index: 1;
}


.wy-work-icon{
  width: 110px;
  height: 110px;
  border-radius: 50%;
  background-color: var(--white);
  display: inline-block;
  line-height: 106px;
  box-shadow: inset 4px -4px 16px 9px #f0dfdf;
  border: 1px solid #dec9c9;
  margin-bottom: 16px;
}


.wy-work-icon img{
  width: 60px;
}

.why-card h6{
  font-size: 18px;
  color: var(--title-color);
}

.why-card p{
  font-size: 13px;
  text-align: center;
  width: 90%;
  color: var(--txt-color);
  margin: auto;
}

.two-wy-crd-bttm{
  margin-top: 23px;
}

/*----------------------*/

.how-apply-job-bx h4{
  font-size: 31px;
  color: var(--title-color);
  font-weight: 600;
  margin-bottom: 17px;
}

.how-apply-job-bx p{
  font-size: 16px;
  line-height: 28px;
  color: var(--txt-color);
  margin-bottom: 11px;
  width: 90%;
}

.how-apply-job-bx p a{
  color: var(--primary-color1);
  transition: 0.3s ease;
}

.how-apply-job-bx p a:hover{
  color: var(--primary-color3);
}


/*--------career--------page----------wrap-----end-------*/

/*-------privacy---policy-----page-------wrap-----start-----*/

.cmpny-polcy-sctn{
  position: relative;
  width: 100%;
  padding: 60px 0px;
}


.cmpny-detail-content h3{
  font-size: 30px;
  color: var(--title-color);
  padding-bottom: 6px;
  text-transform: uppercase;
  border-bottom: 1px solid #ddd;
  margin-bottom: 20px;
}

.cmpny-detail-content p{
  font-size: 15px;
  color: var(--txt-color);
  line-height: 29px;
  text-align: justify;
}


.cmpny-detail-img{
  position: relative;
}

.cmpny-detail-img:before{
  content: '';
  width: 30px;
  height: 94%;
  background-color: var(--primary-color1);
  position: absolute;
  right: 0px;
  top: 0px;
}

.cmpny-detail-img:after{
  content: '';
  width: 80%;
  height: 20px;
  background-color: #d7172e4f;
  position: absolute;
  right: 0px;
  bottom: -10px;
  clip-path: polygon(1% 0, 100% 0, 100% 20%, 0 25%);
  z-index: 1;
}



.cmpny-detail-img img{
  width: 92%;
  height: 280px;
  position: relative;
  z-index: 1;
  object-fit: cover;
  border-radius: 20px 0px 30px 0px;
}

.list-rfnd{
  margin-bottom: 15px;
}


.list-rfnd li {
  display: flex;
  line-height: 21px;
  padding-left: 15px;
  padding-bottom: 13px;
  font-size: 14px;
  color: var(--txt-color);
  position: relative;
}

.list-rfnd li:before{
  content: '\f105';
  color: var(--primary-color1);
  font-family: fontawesome;
  font-size: 12px;
  position: absolute;
  top: 0px;
  left: 0px;
}

/*-------privacy---policy-----page-------wrap-----end-----*/

/*--------career-----form----wrap---start--------*/
.carrer-form-bg{
 background: url(../images/carrer-bg-form.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    padding: 60px 0;
}
.career-form-wrp {
    width: 100%;
    background-color: #fff;
    border-radius: 15px;
    box-shadow: 0 0 10px rgba(0, 0, 0, .25);
    padding: 35px;
}
.career-form-wrp .col-md-6{
  position: relative;
}
.carrer-lft-cntnt h4{
  font-size: 31px;
    color: var(--title-color);
    font-weight: 600;
    margin-bottom: 17px;
}
.carrer-lft-cntnt p{
      font-size: 16px;
    line-height: 28px;
    color: var(--txt-color);
    margin-bottom: 11px;
}
.carrer-lft-cntnt ul{
  list-style-type: none;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: 15px;
}
.carrer-lft-cntnt li{
  display: block;
    position: relative;
    padding-left: 32px;
    margin-top: 13px;
    font-size: 16px;
    color: #5A5A5A;
    font-weight: 500;
}
.carrer-lft-cntnt li::before{
  position: absolute;
    content: '\f00c';
    font-family: 'fontAwesome';
    width: 18px;
    height: 18px;
    background: var(--primary-color1);
    color: #fff;
    border-radius: 3px;
    font-size: 10px;
    text-align: center;
    line-height: 18px;
    left: 0;
    top: 4px;
}

.career-img{
     width: 100%;
    position: relative;
    margin-top: 45px;
    overflow: hidden;
    border-radius: 25px;
    height: 458px;
}

.career-img img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.carrer-form-bg .career-form{
    background-color: var(--white);
    padding: 50px 38px 30px;
    border-radius: 30px;
    width: 100%;
    position: relative;
    border: 1px solid #bdbdbd;
    z-index: 1;
    overflow: hidden;
    margin-top: 23px;
}
.carrer-form-bg .career-form::after{
      position: absolute;
    content: '';
    width: 400px;
    height: 400px;
    border-radius: 50%;
    top: -170px;
    right: -170px;
    z-index: -1;
    background: radial-gradient(circle, rgb(39 128 212 / 09%) 26%, #ffffff00 54%);
}
.carrer-form-bg .career-form::before{
      position: absolute;
    content: '';
    width: 400px;
    height: 400px;
    border-radius: 50%;
    bottom: -170px;
    left: -170px;
    z-index: -1;
    background: radial-gradient(circle, rgb(216 21 48 / 09%) 26%, #ffffff00 54%);
}

/* ===== ULTRA PREMIUM DROPZONE FILE UPLOAD - KRS EDITION ===== */
/* ===== MINIMALIST & PREMIUM DROPZONE FILE UPLOAD - KRS EDITION ===== */
.resume-upload-wrap {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  width: 100%;
  padding: 13px 10px;
  border: 2px dashed rgb(215 23 46 / 35%);
  border-radius: 16px;
  background-color: #fff4f5; /* Clean slate background */
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  cursor: pointer;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02);
}

/* ==== HOVER STATE ==== */
.resume-upload-wrap:hover {
  border-color: var(--primary-color1);
  /* background-color: rgba(215, 23, 46, 0.015); */
  transform: translateY(-2px);
  box-shadow: 0 10px 25px -5px rgba(215, 23, 46, 0.05), 0 8px 10px -6px rgba(215, 23, 46, 0.05);
}

/* ==== DRAG OVER STATE ==== */
.resume-upload-wrap.drag-over {
  border-color: var(--primary-color1);
  border-style: solid;
  background-color: rgba(215, 23, 46, 0.03);
  transform: scale(1.01);
}

/* ==== FILE SELECTED STATE ==== */
.resume-upload-wrap.has-file {
  border-color: #22c55e;
  border-style: solid;
  background-color: #f0fdf4;
  min-height: 140px;
  gap: 12px;
}

/* ===== UPLOAD ICON ===== */
.resume-upload-wrap .upload-icon {
  display: flex;
    align-items: center;
    justify-content: center;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background-color: #ffffff;
    color: #d7172e;
    font-size: 22px;
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    border: 1px solid rgb(215 23 46 / 25%);
}

.resume-upload-wrap:hover .upload-icon {
  background-color: rgba(215, 23, 46, 0.08);
  color: var(--primary-color1);
  transform: scale(1.05);
}

.resume-upload-wrap.has-file .upload-icon {
  background-color: rgba(34, 197, 94, 0.1);
  color: #22c55e;
}

/* ===== UPLOAD TEXT ===== */
.resume-upload-wrap .upload-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
}

.resume-upload-wrap .upload-text .upload-title {
  font-size: 15px;
  font-weight: 600;
  color: #334155;
  margin: 0;
  line-height: 1.4;
}

.resume-upload-wrap .upload-text .browse-link {
  color: var(--primary-color1);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.resume-upload-wrap .upload-text .upload-sub {
  font-size: 12px;
  color: #64748b;
  margin: 0;
  line-height: 1.4;
}

.resume-upload-wrap.has-file .upload-text {
  display: none;
}

/* ===== FILE INFO BAR ===== */
.resume-upload-wrap .file-info {
  display: none;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  background-color: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 10px;
  width: 100%;
  max-width: 320px;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.05), 0 2px 4px -2px rgba(0, 0, 0, 0.05);
  animation: slideUpFile 0.25s cubic-bezier(0.4, 0, 0.2, 1);
}

@keyframes slideUpFile {
  0% {
    opacity: 0;
    transform: translateY(8px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.resume-upload-wrap.has-file .file-info {
  display: flex;
}

.resume-upload-wrap .file-info .file-icon {
  color: #22c55e;
  font-size: 18px;
  flex-shrink: 0;
}

.resume-upload-wrap .file-info .file-name {
  font-size: 13px;
  font-weight: 500;
  color: #1e293b;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 1;
}

.resume-upload-wrap .file-info .file-remove {
  color: #94a3b8;
  font-size: 14px;
  cursor: pointer;
  flex-shrink: 0;
  transition: all 0.2s ease;
  background: #f1f5f9;
  border: none;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.resume-upload-wrap .file-info .file-remove:hover {
  color: #fff;
  background-color: #ef4444;
  transform: scale(1.05);
}

/* ===== HIDDEN FILE INPUT ===== */
.file-input {
  position: absolute;
  inset: 0;
  opacity: 0;
  cursor: pointer;
  z-index: 10;
}

/* Hide default browser button */
.file-input::-webkit-file-upload-button {
  display: none;
}
.file-input::file-selector-button {
  display: none;
}

.career-frm-title{
      position: absolute;
    top: 4px;
    left: 0px;
    right: 0px;
    background-color: var(--primary-color1);
    border-radius: 20px;
    padding: 6px 18px;
    width: fit-content;
    border-bottom: 2px solid var(--primary-color2);
    margin: auto;
    z-index: 2;
}

.career-frm-title h5{
  color: var(--white);
  margin-bottom: 0px;
  font-size: 18px;
}

/*--------career----form----wrap----end----------*/

/* start ai powered */
.ai-powered-bg{
      position: relative;
    padding: 70px 0px;
    background-image: url(../images/ai-bg-bx.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
.robot-img{
  display: none;
}
.ai-pwrd-lst {
    margin-top: 35px;
}
.ai-pwrd-lst ul {
        display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    padding-right: 40px;
}
.ai-pwrd-lst  li{
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    border: 1px solid rgb(215 23 46 / 35%);
    box-shadow: inset 0 0 15px rgb(215 23 46 / 25%);
    padding: 7px;
    border-radius: 50px;
    backdrop-filter: blur(5px);
}
.ai-pwrd-lst li .icn{
    width: 45px;
    height: 45px;
    background: var(--primary-color1);
    border-radius: 50%;
    padding: 10px;
}
.ai-pwrd-lst li .icn img{
  width: 100%;
  height: 100%;
  object-fit: scale-down;
}
.ai-pwrd-lst li .cntnt{
  width: calc(100% - 50px);
}
.ai-pwrd-lst li .cntnt p{
  margin: 0;
}
.select2-dropdown {
    
    z-index: 91!important;
}
/* start new pricing */
.mobile-show .feature-chck-list.mbl-shw{
  display: none;
}
.more_feature{
  display: none;
}
.frs-txt{
  display: none;
}
/* end new pracing */
/* two */
/* .ai-crm{
  position: relative;
    padding: 75px 0px;
    background-image: url(../images/ai-powered-bg.png);
    background-repeat: no-repeat;
    background-size: cover;
}
.ai-cntnt-mdl{
  background: url(../images/ai-bg-bx.png);
    background-repeat: no-repeat;
    background-size: cover;
    padding: 30px;
    background-position: center;
    border-radius: 15px;
    position: relative;
}
.robot{
  position: absolute;
    bottom: 11px;
    left: 60px;
    width: 300px;
    height: 300px;
}
.ai-cntnt-bx {
        width: 50%;
    margin: 0 0 0 auto;
    background: rgb(255 255 255 / 8%);
   padding: 30px 25px;
    border-radius: 15px;
    border: 1px solid rgb(255 255 255 / 50%);
    backdrop-filter: blur(4px);
}

.ai-cntnt-bx h3{
      color: #fff;
    font-size: 29px;
    font-weight: 600;
    line-height: 37px;
    margin-bottom: 18px;
}
.ai-cntnt-bx p{
  color: rgb(255 255 255 / 85%);
    font-size: 14px;
    font-weight: 300;
}
.ai-cntnt-bx ul{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 15px;
}
.ai-cntnt-bx li{
    text-align: center;
    padding: 2px;
  border-radius: 15px;
  overflow: hidden;
  position: relative;
}
.glow-border {
    position: absolute;
    inset: -80%;
    background: conic-gradient(
      from 0deg,
      rgba(124, 58, 237, 0.5) 0%,
      rgba(124, 58, 237, 0.5) 40%,
      #7c3aed 55%,
      #38bdf8 65%,
      #f472b6 75%,
      rgba(124, 58, 237, 0.5) 90%,
      rgba(124, 58, 237, 0.5) 100%
    );
    animation: spin 3.5s linear infinite;
  }
  @keyframes spin {
  to {
    transform: rotate(360deg);
  }
}
.ai-cntnt-bx li .box33{
  background: rgb(43, 24, 103);
    padding: 15px 12px;
    z-index: 2;
    position: relative;
    width: 100%;
    border-radius: 15px;
    min-height: 143px
}
.ai-cntnt-bx li h6{
    margin: 0;
    color: rgb(255 255 255 / 95%);
    font-size: 13px;
    line-height: 18px;
}
.ai-cntnt-bx li .icn{
    width: 65px;
    height: 65px;
    margin: 0 auto 12px auto;
    background: rgb(255 255 255 / 10%);
    border-radius: 59%;
    padding: 13px;
    border: 1px solid rgb(255 255 255 / 25%);
}
.ai-cntnt-bx li .icn img{
  width: 100%;
  height: 100%;
  object-fit: scale-down;
} */
/* end ai powered */

/*==============================================================================================*/
/*==================================== BLOG PAGE STYLES ========================================*/
/*==============================================================================================*/

/* Blog Page Banner */
.blog-banner.page-banner{
  background: linear-gradient(135deg, var(--primary-color2) 0%, #1a2a4a 50%, var(--primary-color1) 100%);
  padding: 60px 0;
  position: relative;
  overflow: hidden;
}

.blog-banner.page-banner::before{
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 20% 50%, rgba(215,23,46,0.15) 0%, transparent 50%), radial-gradient(circle at 80% 50%, rgba(14,23,40,0.3) 0%, transparent 50%);
}

.blog-banner .banner-title{
  font-size: 40px;
  font-weight: 700;
  color: var(--white);
  position: relative;
  z-index: 1;
}

.blog-banner .banner-subtitle{
  font-size: 17px;
  color: rgba(255,255,255,0.8);
  max-width: 550px;
  margin: 8px auto 0;
  position: relative;
  z-index: 1;
}

/* Blog List Section */
.blog-list-section{
  padding: 70px 0;
  background: #f8f9fc;
}

/* Blog Card */
.blog-card{
  background: var(--white);
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(0,0,0,0.06);
  transition: all 0.35s cubic-bezier(0.4,0,0.2,1);
  border: 1px solid #edf0f5;
  display: flex;
  flex-direction: column;
}

.blog-card:hover{
  transform: translateY(-6px);
  box-shadow: 0 12px 35px rgba(215,23,46,0.12);
  border-color: rgba(215,23,46,0.15);
}

/* Blog Image Wrap */
.blog-img-wrap{
  position: relative;
  height: 210px;
  overflow: hidden;
}

.blog-img-wrap img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.6s cubic-bezier(0.4,0,0.2,1);
}

.blog-card:hover .blog-img-wrap img{
  transform: scale(1.08);
}

.blog-date-badge{
  position: absolute;
  top: 12px;
  right: 12px;
  background: var(--white);
  color: var(--primary-color1);
  border-radius: 8px;
  text-align: center;
  padding: 6px 10px;
  min-width: 50px;
  box-shadow: 0 3px 12px rgba(0,0,0,0.15);
  line-height: 1.2;
  z-index: 2;
}

.blog-date-badge .date-day{
  display: block;
  font-size: 18px;
  font-weight: 700;
  color: var(--primary-color1);
}

.blog-date-badge .date-month{
  display: block;
  font-size: 10px;
  font-weight: 600;
  text-transform: uppercase;
  color: var(--txt-color);
  letter-spacing: 0.5px;
}

/* Blog Body */
.blog-body{
  padding: 20px 22px 22px;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.blog-meta{
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 10px;
  font-size: 13px;
  color: #8a8f9a;
}

.blog-meta span i{
  margin-right: 5px;
  color: var(--primary-color1);
}

.blog-title{
  font-size: 17px;
  font-weight: 600;
  line-height: 24px;
  margin-bottom: 10px;
  color: var(--title-color);
  transition: color 0.3s ease;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 48px;
}

.blog-title a:hover{
  color: var(--primary-color1);
}

.blog-link{
  font-size: 14px;
  font-weight: 600;
  color: var(--primary-color1);
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 16px;
  background: rgba(215, 23, 46, 0.08);
  border-radius: 20px;
  transition: all 0.3s ease;
  margin-top: auto;
  width: fit-content;
}

.blog-link:hover{
  gap: 10px;
  background: var(--primary-color1);
  color: #fff;
}

/* Blog Pagination */
.blog-pagination .pagination{
  gap: 6px;
}

.blog-pagination .page-num{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 8px;
  border: 1px solid #e0e3e8;
  background: var(--white);
  color: var(--txt-color);
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  transition: all 0.3s ease;
}

.blog-pagination .page-num:hover,
.blog-pagination .page-num.active{
  background: var(--primary-color1);
  border-color: var(--primary-color1);
  color: #fff;
}

.blog-pagination .page-arrow{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 8px;
  border: 1px solid #e0e3e8;
  background: var(--white);
  color: var(--title-color);
  font-size: 14px;
  text-decoration: none;
  transition: all 0.3s ease;
}

.blog-pagination .page-arrow:hover:not(.disabled){
  background: var(--primary-color1);
  border-color: var(--primary-color1);
  color: #fff;
}

.blog-pagination .page-arrow.disabled{
  opacity: 0.4;
  cursor: not-allowed;
  pointer-events: none;
}

/*==============================================================================================*/
/*==================================== BLOG DETAIL STYLES ======================================*/
/*==============================================================================================*/

.blog-detail-section{
  padding: 50px 0 80px;
  background: #f8f9fc;
}

.blog-detail-hero{
  width: 100%;
  height: 420px;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(0,0,0,0.08);
  margin-bottom: 30px;
}

.blog-detail-hero img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Meta */
.blog-detail-meta-top{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px 24px;
  margin-bottom: 18px;
}

.blog-detail-category{
  background: var(--primary-color1);
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  padding: 6px 18px;
  border-radius: 20px;
}

.blog-detail-meta-item{
  font-size: 14px;
  color: #8a8f9a;
}

.blog-detail-meta-item i{
  margin-right: 6px;
  color: var(--primary-color1);
}

/* Title */
.blog-detail-heading{
  font-size: 32px;
  font-weight: 700;
  color: var(--title-color);
  line-height: 42px;
  margin-bottom: 25px;
  padding-bottom: 20px;
  border-bottom: 1px solid #e8ecf2;
}

/* Body Content */
.blog-detail-body{
  padding-bottom: 25px;
}

.blog-detail-body p{
  font-size: 16px;
  line-height: 28px;
  color: var(--txt-color);
  margin-bottom: 20px;
}

.blog-detail-body h4{
  font-size: 22px;
  font-weight: 600;
  color: var(--title-color);
  margin: 30px 0 14px;
  position: relative;
  padding-left: 20px;
}

.blog-detail-body h4::before{
  content: '';
  position: absolute;
  left: 0;
  top: 6px;
  width: 5px;
  height: 24px;
  background: var(--primary-color1);
  border-radius: 3px;
}

/* Footer */
.blog-detail-footer{
  padding: 22px 0 0;
  border-top: 1px solid #e8ecf2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
}

.blog-detail-share{
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.share-label{
  font-size: 15px;
  font-weight: 500;
  color: var(--title-color);
}

.share-icons{
  display: flex;
  gap: 8px;
}

.share-icon{
  width: 36px;
  height: 36px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  color: #fff;
  transition: all 0.3s ease;
  text-decoration: none;
}

.share-fb{ background: #3b5998; }
.share-tw{ background: #1da1f2; }
.share-li{ background: #0077b5; }
.share-wa{ background: #25d366; }

.share-icon:hover{
  transform: translateY(-3px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.2);
}

.blog-back-btn{
  display: inline-flex;
  align-items: center;
  padding: 10px 22px;
  background: var(--primary-color1);
  color: var(--white);
  border-radius: 8px;
  font-size: 14px;
  font-weight: 500;
  text-decoration: none;
  transition: all 0.3s ease;
}

.blog-back-btn:hover{
  background: var(--primary-color2);
  color: var(--white);
}

.blog-back-btn-ghost{
  display: inline-flex;
  align-items: center;
  padding: 8px 16px;
  border: 1.5px solid #d7172e;
  color: #d7172e;
  border-radius: 8px;
  font-size: 13px;
  font-weight: 500;
  text-decoration: none;
  transition: all 0.3s ease;
  background: transparent;
}

.blog-back-btn-ghost:hover{
  background: #d7172e;
  color: #fff;
}

.blog-single-meta{
  display: flex;
  flex-wrap: wrap;
  gap: 10px 20px;
  padding: 12px 0 18px;
  margin-bottom: 15px;
  border-bottom: 1px solid #e8ecf2;
}

.blog-single-meta .meta-item{
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 14px;
  color: #8a8f9a;
}

.blog-single-meta .meta-item i{
  color: var(--primary-color1);
  font-size: 14px;
}

.blog-detail-content p{
  font-size: 16px;
  line-height: 28px;
  color: var(--txt-color);
  margin-bottom: 20px;
}

.blog-detail-content h5{
  font-size: 18px;
  font-weight: 600;
  color: var(--title-color);
  margin: 25px 0 12px;
}

.blog-detail-content ul{
  padding-left: 20px;
  margin-bottom: 20px;
  list-style: disc;
}

.blog-detail-content ul li{
  font-size: 15px;
  line-height: 26px;
  color: var(--txt-color);
  margin-bottom: 6px;
}

.blog-detail-content ul li strong{
  color: var(--title-color);
}

/* Blog Responsive */
@media (max-width: 992px){
  .blog-banner .banner-title{ font-size: 32px; }
  .blog-detail-heading{ font-size: 26px; line-height: 36px; }
}

@media (max-width: 768px){
  .blog-banner.page-banner{ padding: 40px 0; }
  .blog-banner .banner-title{ font-size: 26px; }
  .blog-detail-hero{ height: 260px; }
  .blog-detail-heading{ font-size: 22px; line-height: 32px; }
  .blog-detail-meta-top{ gap: 10px 16px; }
  .blog-detail-footer{ flex-direction: column; align-items: flex-start; }
  .blog-list-section{ padding: 50px 0; }
}

@media (max-width: 575px){
  .blog-banner.page-banner{ padding: 30px 0; }
  .blog-banner .banner-title{ font-size: 22px; }
  .blog-detail-hero{ height: 200px; }
  .blog-detail-heading{ font-size: 20px; line-height: 28px; }
  .blog-detail-body p{ font-size: 15px; line-height: 26px; }
  .blog-detail-section{ padding: 30px 0 50px; }
}