/* style for home page   */
           .home-hero-sec {
      background-image: url("../img/new-banner-4.png");
      background-position: center;
      background-repeat: no-repeat;
      background-size: cover;
    }

    /* Swiper style for brand section */
    .swiper-slide {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      text-align: center;
      border-radius: 15px;
      background: #fff;
      /*padding: 1.5rem;*/
      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    }
    .card-image {
      height: 90px;
      object-fit: contain;
      /*margin-bottom: 1rem;*/
    }
    .swiper-button-next,
    .swiper-button-prev {
      color: #fff;
      background: rgba(0, 0, 0, 0.5);
      width: 25px;
      height: 25px;
      border-radius: 50%;
      --swiper-navigation-size: 20px;
    }
    .swiper-button-next:after,
    .swiper-button-prev:after {
      font-size: 20px;
    }
    @media (max-width: 640px) {
      .swiper-button-next,
      .swiper-button-prev {
        display: none;
      }
    }


    .custom-underline{
        position: relative;
    }
 .custom-underline:before {
            content: "";
            position: absolute;
            bottom: -5px;
            left: 48%;
            transform: translateX(-50%);
            width: 80px;
            height: 3px;
            background: var(--accent);
            border-radius: 3px;
        }
        
        .custom-underline:after {
            content: "";
            position: absolute;
            bottom: -5px;
            left: 50%;
            transform: translateX(30px);
            width: 25px;
            height: 3px;
            background-color: white;
            border-radius: 3px;
        }
         .news-letter-sec form{
                background-color:#fff;
            }


        @media screen and (max-width: 650px) {
            .news-letter-sec form{
                background-color:#16488D !important;
            }
              .news-letter-sec form input{
               margin-block:15px
            }

}



/* style for about us section card icon  */
    .aboutus-card i{
        color:var(--accent)
    }



/* style for newsletter section  */

      .news-letter-sec {
            background-color:var(--primary-bg);
            position: relative;
        }
        .news-letter-sec::after{
position: absolute;
content: "";
height: 100%;
width: 100%;
top: 0;
left: -450px;
opacity: 0.1;
background-image: url("../img/sec-bg.png");
background-position: center;
background-repeat: no-repeat;
background-size: contain;
        }

                .news-letter-sec::before{
position: absolute;
content: "";
height: 100%;
width: 100%;
bottom: 0;
right: -450px;
opacity: 0.1;
background-image: url("../img/sec-bg.png");
background-position: center;
background-repeat: no-repeat;
background-size: contain;
  transform: scaleX(-1);
  overflow:hidden;
        }




/* style for Our servies section  */

       .card-bg-sec {
    position: relative;
    height: 100%;
    width: 100%;
}

.card-bg-sec-1::after {
    content: ""; 
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-image: url("../img/card-bg-1.png");
    background-size: cover;
    background-repeat: no-repeat; 
    background-position: center;
    z-index: -1;
}
.card-bg-sec-2::after {
    content: ""; 
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-image: url("../img/card-bg-2.png");
    background-size: cover;
    background-repeat: no-repeat; 
    background-position: center;
    transform: rotate(30deg);
        z-index: -1;
}
.card-bg-sec-3::after {
    content: ""; 
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-image: url("../img/card-bg-3.png");
    background-size: cover;
    background-repeat: no-repeat; 
    background-position: center;
    transform: rotate(50deg);
        z-index: -1;
}
.card-bg-sec-4::after {
    content: ""; 
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-image: url("../img/card-bg-4.png");
    background-size: cover;
    background-repeat: no-repeat; 
    background-position: center;
    transform: rotate(220deg);
        z-index: -1;
}
.card-bg-sec-5::after {
    content: ""; 
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-image: url("../img/card-bg-5.png");
    background-size: cover;
    background-repeat: no-repeat; 
    background-position: center;
    transform: rotate(-150deg);
        z-index: -1;
}
.card-bg-sec-6::after {
    content: ""; 
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-image: url("../img/card-bg-6.png");
    background-size: cover;
    background-repeat: no-repeat; 
    background-position: center;
    transform: rotate(45deg);
        z-index: -1;
}
.card-bg-sec-7::after {
    content: ""; 
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-image: url("../img/card-bg-7.png");
    background-size: cover;
    background-repeat: no-repeat; 
    background-position: center;
    transform: rotate(180deg);
        z-index: -1;
}
.card-bg-sec-8::after {
    content: ""; 
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-image: url("../img/card-bg-8.png");
    background-size: cover;
    background-repeat: no-repeat; 
    background-position: center;
    transform: rotate(200deg);
        z-index: -1;
}

.home-page-service-icons{
    height: 50px !important;
}



/* style for Industries section  */
        .bg-pattern {
            background-image: radial-gradient(circle, rgba(255, 255, 255, 0.1) 1px, transparent 1px);   
            background-size: 20px 20px;
        }
        /* .industry-btn{
            width: 180px;
            height: 130px;
        } */




        /* Steps for process  */

            .our-process-sec{
        position: relative;

    }
    .our-process-sec::before{

        content: "";
        position: absolute;
        height: 100%;
        width: 100%;
        top: 0;
        left: 0;
        background-image: url("../img/process-bg-3.jpg");
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        z-index: -9;
    }
        .our-process-sec::after{
        content: "";
        position: absolute;
        height: 100%;
        width: 100%;
        top: 0;
        left: 0;
        background-color: black;
        opacity: 0.8 ;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        z-index: -9;
    }



    /* style for we are best in class section */

            .circle-container {
            position: relative;
            width: 120px;
            height: 120px;
            margin: 0 auto;
        }

        .circle-container svg {
            width: 100%;
            height: 100%;
            transform: rotate(-90deg);
        }

        .circle-bg {
            fill: none;
            stroke: #e5e7eb;
            stroke-width: 10;
        }

        .circle-progress {
            fill: none;
            stroke: var(--primary-bg);
            stroke-width: 10;
            stroke-linecap: round;
            stroke-dasharray: 0 314;
            transition: stroke-dasharray 2s ease-in-out;
        }

        .percentage-text {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            font-size: 1.5rem;
            font-weight: bold;
            color: #1f2937;
        }

        @media (max-width: 640px) {
            .circle-container {
                width: 100px;
                height: 100px;
            }
            .percentage-text {
                font-size: 1.2rem;
                top: 60%;
            left: 60%;
            }

            .circle-container svg {
            width: 120%;
            height: 120%;
        }
        }

        .industries-we-serve-accordian{
            position: relative;
            background-color: var(--primary-bg)  ;
            height: 100%;
            width: 100%;
            z-index: 9999;
        }

        .industries-we-serve-accordian::before {
            content: "";
            position: absolute;
            height: 50%;
            width: 50%;
            opacity: 0.1;
            bottom: 0;
            left: 0;
            background-image: url("../img/sec-bg.png");
            background-position: center;
            background-repeat: no-repeat;
            background-size: cover;
            z-index: -9;
        }

        .industries-we-serve-accordian::after {
            content: "";
            position: absolute;
            height: 50%;
            width: 50%;
            opacity: 0.1;
            top: 0;
            right: 0;
            background-image: url("../img/sec-bg.png");
            background-position: center;
            background-repeat: no-repeat;
            background-size: cover;
            transform: rotate(180deg);
            z-index: -999;
        }





        /* style for about us page   */

#process-sec {
    position: relative;
    width: 100%;
    z-index: 1;
    overflow: hidden;
    background-color: var(--primary-bg);
}
#process-sec::before {
    content: '';
    position: absolute;
    height: 100%;
    width: 80%;
    top: 0;
    left: 10%;
    /* background-image: url('../img/process-bg-2.png'); */
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    z-index: 0;
}

.process-tag{
  place-content: center;
background-color:green; 
font-size:48px;
 height:70px ;
 width:70px;
  border-radius:50%
}





/* style for page social media agency in delhi  */




       /* Swiper style for brand logo slider */
    .swiper-slide {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      text-align: center;
      border-radius: 15px;
      background: #fff;
      /*padding: 1.5rem;*/
      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
    }
    .card-image {
      object-fit: cover;
      /*margin-bottom: 1rem;*/
    }
    .swiper-button-next,
    .swiper-button-prev {
      color: #fff;
      background: rgba(0, 0, 0, 0.5);
      width: 25px;
      height: 25px;
      border-radius: 50%;
      --swiper-navigation-size: 20px;
    }
    .swiper-button-next:after,
    .swiper-button-prev:after {
      font-size: 20px;
    }
    @media (max-width: 640px) {
      .swiper-button-next,
      .swiper-button-prev {
        display: none;
      }
    }






    .card-container {
            perspective: 1000px;
            
        }
        .guaranteed {
            transform: rotateY(0deg);
            transition: transform 0.3s ease;
        }
        .guaranteed {
            background-color: #66666633;
            border: 3px solid var(--accent);
             box-shadow: 8px 15px 11px -12px  #23803dbb;
        }
        .guaranteed-card {
            position: relative;
            z-index: 0;
        }
        .guaranteed:hover{
            transform: rotateY(5deg) rotateX(5deg);
        }
        .guaranteed-card::before {
            position: absolute;
            content: "";
            top: 50%;
            transform: translateY(-50%);
            left: 0;
            height: 90%;
            width: 100%;
            border-radius: 5px;
            clip-path: polygon(0 0, 100% 20%, 100% 100%, 0 80%);
            background-color: #ffb20096;
            z-index: -1;
            transition: clip-path 0.5s ease-in-out, background-color 0.3s ease-in-out;
        }
        .guaranteed-card:hover::before {
            clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
            height: 100%;
        }
        @media (max-width: 640px) {
            .card {
                width: 100%;
                max-width: 300px;
            }

            .card-image{
              height: 70px !important;
            }
        }








        /* style for seo-audit-page  */
          

.Our-top-noch-services-sec-toggle .active{
  background-color: var(--primary-bg) !important;
  border-radius: 8px;
  transition: transform 3s;
  color:white !important;
  font-weight:bold;

}
.Our-top-noch-services-sec-toggle.active i{
  font-size: 38px !important;
  color: #072C60;
}
.Our-top-noch-services-sec-toggle button:hover{
  background-color: var(--primary-bg) !important;
  transition: transform 3s;
}.Our-top-noch-services-sec-toggle button{
  margin-inline: 10px;
  width:160px;
}





    .slider-container {
      overflow-x: hidden;
      position: relative;
    }
    .slider {
      display: flex;
      gap: 1.5rem;
      transition: transform 0.5s ease-in-out;
    }
    .slider-item {
      flex: 0 0 auto;
      width: 200px;
    }
    .slider-container::-webkit-scrollbar {
      display: none;
    }

    .industry-tab{
      position: relative;
      /* height: 100%;
      width: 100%; */
     /* background: var(--accent); */
     background-image: url("https://softwebgroup.online/img/tab-bg-img.png");
     background-position: center;
     background-repeat: no-repeat;
     background-size: cover;
     /* z-index: 0; */
     border-top-left-radius: 15px;
     border-bottom-left-radius: 15px;
      
    }

    .industry-tab h2,p,li{
      color: black;
    }
    .industry-tab::before{
      position: absolute;
      content: "";
      background-color: white;
      height: 100%;
      width: 100%;
      top: 0;
      left: 0;
      z-index: -1;
       border-top-left-radius: 15px;
     border-bottom-left-radius: 15px;
    }


    .industries-slider{
      width: 100%;
    }