.herobgsection {
    position: relative;
    height: 100vh;
    overflow: hidden;
}
.herobgsection h1{
    font-size: 60px;
    line-height: 60px;
}
.herobgsection p{
    width: 80%;
    padding-top: 20px;
    padding-bottom: 20px;
}
.herobgsection a{
    padding: 30px 65px ;
    text-decoration: none;
    background: var(--button-background);
    border-radius: 48px;
    color: #fff;
    width: 324px;
height: 83px;
display: block;
}
#videoCarousel {
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
}

.carousel-inner {
    width: 100%;
    height: 100%;
}

.carousel-item {
    width: 100%;
    height: 100%;
    position: relative;
}

video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.dontchasesection{
    background-color: #000;
    padding-top: 100px;
}
.dontchasesection .row{
    height: 250px;
}
.dontchasesection h1{
    font-size: 50px;
    color: #fff;
    line-height: 56px;
}
.dontchasesection .contentbox{
   padding-top: 100px;
}
.dontchasesection .contentbox2{
    padding-top: 10px;
    text-align: center;
 }
 .dontchasesection .contentbox2 p{
    color: #fff;
    opacity: 0.9;
 }
 .dontchasesection .contentbox2 p span{
    color: var(--primary-color);
 }
 .listsection{
    background: #000;
 padding-top: 100px;

 }
 .listsection h1{
    text-align: left;
    font: normal normal 600 90px/130px Poppins;
    letter-spacing: -5.2px;
    color: #D3C2DB;
    padding-left: 130px;
    height: 130px;
    transition: color 0.3s ease;
 }
 .listsection .row{
    border-top: 1px solid rgba(255, 255, 255, 0.5);
 }
 .listsection .row {
    background-color: black; /* Default background color */
    transition: background 0.3s ease; /* Add transition effect for smooth color change */
}

.listsection .row:hover {
    background: transparent linear-gradient(90deg, #FF00AD 0%, #C818D0 100%) 0% 0% no-repeat padding-box;
cursor: pointer;
}

.listsection .row p {
    display: none; /* Initially hide paragraphs */
    padding-top: 40px;
    width: 70%;
    color:#fff
}

.listsection .row:hover p {
    display: block; /* Show paragraph on hover */
}
.listsection .row:hover h1 {
    color: white; /* Color on hover (same as default color) */
}
/* .homepageimagesection{
    background-color: #000;
    padding-top: 100px;
} */
.clients{
    padding-top: 200px;
}
.clients h1{
    text-align: center;
font: normal normal 600 90px/110px Poppins;
letter-spacing: -4.5px;
color: #000000;
opacity: 1;
padding-bottom: 50px;
}
.clients .client-carousel img{
width: 50% !important;
}

.homepageimagesection .row{
    margin-top: 200px;
}
.homepageimagesection .row h3{
    text-align: left;
font: normal normal bold 45px/57px Poppins;
letter-spacing: 0px;
color: #000000;
opacity: 1;
}
.homepageimagesection .row h5{
    text-align: left;
font: normal normal normal 30px/35px Poppins;
letter-spacing: 0px;
color: #000000;
opacity: 1;
padding-top: 28px;
}
.homepageimagesection .row span.quotetext{
    text-align: left;
    font: normal normal bold 120px/66px Mukta Mahee;
    letter-spacing: 0px;
    color: #000000;
    opacity: 1;
}
.homepageimagesection .row img{
    width: 100%;

}
.homepageimagesection .row .textbox{
    padding-top: 150px;
}
@keyframes scroll-animation {
    0% {
        transform: scaleY(1);
        transform-origin: top center;
      }
      100% {
        transform: scaleY(0);
        transform-origin: top center;
      }
  }
  
  .scroll-image {
      /* Animation duration, infinite loop, and linear timing function */
  }
.testimonialsection{
    margin-top: 250px;
}
.testimonialsection .contentdiv{
    padding: 30px;
    text-align: center;
}
.testimonialsection  .owl-carousel .owl-item img{
    width: 125px !important;
    height: 125px !important;
    border-radius:50%;
    transform: translateX(65px);
}
.testimonialsection .contentdiv h3{
    font-size: 22px;
    padding-top: 25px;
}
.testimonialsection .contentdiv .checked {
    color: orange;
  }
  .testimonialsection .contentdiv h6{
    color: #C1C1C1;
    
  }
  .testimonialsection .contentdiv p{
    margin-bottom: 10px !important;
    color: #C1C1C1;
    color: #000;
    opacity: 0.8;
  }

  .whyussection{
   /* Layout Properties */
top: 10588px;
left: -6px;
width: 1940px;
height: 4520px;
/* UI Properties */
background: transparent url('../images/Purple Pink Gradient Background - Web Design & Marketing.svg') 0% 0% no-repeat padding-box;
opacity: 1;
  }



  .blogsection{
    background: #000;
    padding-top: 150px;
  }
  .blogsection .row{
    padding-top: 50px;
  }
  .blogsection h1{
    text-align: center;
font: normal normal 600 90px/110px Poppins;
letter-spacing: -4.5px;
color: #FFFFFF;
opacity: 1;
  }
  .blogsection h5{
    text-align: center;
font: normal normal normal 22px/32px Poppins;
letter-spacing: -0.44px;
color: #FFFFFF;
opacity: 1;
  }
  .faqsection{
    background: #000;
    padding-top: 200px;
    padding-bottom: 80px;
  }
/* Button Text Styles */
.faqsection .button-text {
    text-align: left;
    font: normal normal normal 27px/78px Poppins;
    letter-spacing: 0px;
    color: #FFFFFF;
    opacity: 1;
}

/* Accordion Header Styles */
.faqsection .accordion-item h2.accordion-header button.accordion-button {
    background: #000;
    color: #fff; /* Plus and minus icon color */
}

/* Plus Icon */
.faqsection .accordion-button.collapsed::after {
    content: "+";
    background-image: none !important;
    color: #FF00B2;
}

/* Minus Icon */
.faqsection .accordion-button::after {
    content: "-";
    background-image: none !important;
    color: #FF00B2;
}

/* Remove border from accordion items */
.faqsection .accordion-item {
    border: none;
}

/* Remove border from accordion buttons */
.faqsection .accordion-button {
    border: none !important;
}
.faqsection .accordion-body{
    background: #000;
    border: none !important;
    color: #fff;
}
.haveanideasection{
    background: #0B0010 0% 0% no-repeat padding-box;
    padding-top: 150px;
    padding-bottom: 250px;
}
.haveanideasection h1{
    text-align: left;
font: normal normal 300 90px/105px Poppins;
letter-spacing: -2.7px;
color: #FFFFFF;
opacity: 1;
}
.haveanideasection a{
    padding: 20px 50px;
    text-decoration: none;
    background: var(--button-background);
    border-radius: 48px;
    color: #fff;
    font-size: 30px;
    display: inline-block;
    margin-top: 30px;
}
footer{
    background: #000;
}
footer p {
    margin-bottom: 0px !important;
    padding-top: 18px;
    text-align: left;
    font: normal normal normal 15px/40px Poppins;
    letter-spacing: -0.4px;
    color: #FFFFFF;
    opacity: 0.83;
    padding-left: 60px;
}
footer ul li{
    padding-left: 15px;
}
footer ul li a {
    text-align: center;
font: normal normal normal 20px/40px Poppins;
letter-spacing: -0.4px;
color: #FFFFFF !important;
opacity: 0.83;

}
.video-container {
    position: relative;
    max-width: 100%;
    max-height: 100%;
    margin: 0 auto; /* Center the video horizontally */
    transition: width 0.3s ease; 
  }
  
  .play-button {
    width: 120px;
    height: 120px;
    background: url('../images/placyicon.png') no-repeat center center;
    background-size: 80%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    cursor: pointer;
    display: block;
    z-index: 1;
    opacity: 0;
  }
  
  .close-button {
    width: 30px;
    height: 30px;
    background: url('path/to/your/close-icon.png') no-repeat center center;
    background-size: 60%;
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
    display: none;
    z-index: 2;
  }
  
  #my-video {
    width: 100%;
    height: auto;
  }
  
  .hide-controls #my-video::-webkit-media-controls {
    display:none !important;
  }
  
  .hide-controls #my-video::-webkit-media-controls-panel {
    width: calc(var(--width) - 50px);
    height: calc(var(--height) - 50px);
    display: none !important;
    opacity: 0;
  }
  .homepagevideosection{
    background: #000;
    padding-top: 200px;
    padding-bottom: 100px;
  }
  .magnetimg{
    animation: rotate 5s linear infinite;
  }
  @keyframes rotate {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(90deg);
    }
}