*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}
/* Fonts */
@font-face {
    font-family: Aventa-Black;
    src: url(../dashboard/assets/fonts/ellenluff-aventa/Aventa-Black.ttf);
}
@font-face {
    font-family: Aventa-Bold;
    src: url(../dashboard/assets/fonts/ellenluff-aventa/Aventa-Bold.ttf);
}
@font-face {
    font-family: Aventa-Semibold;
    src: url(../dashboard/assets/fonts/ellenluff-aventa/Aventa-SemiBold.ttf);
}
@font-face {
    font-family: Aventa-Regular;
    src: url(../dashboard/assets/fonts/ellenluff-aventa/Aventa-Regular.ttf);
}
@font-face {
    font-family: Aventa-Medium;
    src: url(../dashboard/assets/fonts/ellenluff-aventa/Aventa-Medium.ttf);
}
@font-face {
    font-family: Aventa-Light;
    src: url(../dashboard/assets/fonts/ellenluff-aventa/Aventa-Light.ttf);
}
@font-face {
    font-family: Aventa-Thin;
    src: url(../dashboard/assets/fonts/ellenluff-aventa/Aventa-Thin.ttf);
}
body{
    background-color: #05030E;
}
/* Navigation */
.navbar{
    width: 100%;
    background-color: #05030E;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 7rem;
}
.navbar .nav_logo{
    width: 8.5rem;
    height: auto;
    object-fit: contain;
}
.navbar .nav_item:nth-child(2){
    display: flex;
    color: #fff;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    font-family:Aventa-Regular ;
}
.navbar .nav_links a{
    color: white;
    font-size: 1.1rem;
    cursor: pointer;
}
.navbar .nav_links a:hover{
    color: #BECCEE;
}
.navbar .nav_item:nth-child(3){
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
}
.navbar .nav_btn a{
    text-decoration: none;
    color: #fff;
    font-family: Aventa-Regular;
    font-size: 1rem;
}
.navbar .nav_btn:first-child a:hover{
    color: #BECCEE;
}
.navbar .nav_btn:nth-child(2){
    padding: .5rem 2rem;
    border: 1px solid #424DC5;
    border-radius: 10rem;
    transition: all .1s ease;
}

.navbar .nav_btn:nth-child(2):hover{
    background-color: #424DC5;
    color: #fff;
}
/* Section1 Styling */
.section1 {
    background-color: #05030E;
    width: 100%;
    height: 80vh; /* Full viewport height for responsiveness */
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden; /* Prevent cursors from spilling outside the section */
}

.section1 .content {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: auto;
    color: #fff;
    text-align: center;
    max-width: 45rem;
    gap: 2rem;
    z-index: 2; /* Ensure content is above cursors */
}

.section1 .content h1 {
    font-size: 4.8vw; /* Responsive font size */
    font-family: Aventa-Black;
    line-height: 105%;
}

.section1 .content p {
    font-family: Aventa-Light;
    font-size: 1rem;
    color: #ffffffde;
    max-width: 80%;
    line-height: 1.5;
}

.section1 .content .cta {
    padding: 0.7rem 2.1rem;
    transition: all ease-out 0.5s;
    border-radius: 10rem;
    background: linear-gradient(131.745deg, #525EE4 0%, #0F0D18 100%);
}

.section1 .content .cta:hover {
    background: linear-gradient(131.745deg, #0F0D18 0%, #525EE4 100%);
}

.section1 .content .cta a {
    text-decoration: none;
    color: #fff;
    font-family: Aventa-Regular;
}

/* Cursors Styling */
.section1 .cursors {
    pointer-events: none;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1; /* Behind the content */
}

.section1 .cursors .cursor {
    width: 8vw; /* Responsive size based on viewport width */
    height: auto;
    position: absolute;
    object-fit: contain;
    animation-timing-function: ease-in-out; /* Smooth movement */
    animation-iteration-count: infinite; /* Repeat indefinitely */
}

/* Cursor 1 Animation */
.section1 .cursors .cursor:nth-child(1) {
    animation-name: move1;
    animation-duration: 6s;
}

@keyframes move1 {
    0% { top: 10%; left: 10%; }
    33% { top: 20%; left: 15%; }
    66% { top: 15%; left: 9%; }
    100% { top: 10%; left: 10%; }
}

/* Cursor 2 Animation */
.section1 .cursors .cursor:nth-child(2) {
    animation-name: move2;
    animation-duration: 7s;
}

@keyframes move2 {
    0% { top: 80%; left: 20%; }
    33% { top: 70%; left: 30%; }
    66% { top: 85%; left: 15%; }
    100% { top: 80%; left: 20%; }
}

/* Cursor 3 Animation */
.section1 .cursors .cursor:nth-child(3) {
    animation-name: move3;
    animation-duration: 8s;
}

@keyframes move3 {
    0% { top: 80%; left: 70%; }
    33% { top: 60%; left: 75%; }
    66% { top: 70%; left: 65%; }
    100% { top: 80%; left: 70%; }
}

/* Cursor 4 Animation */
.section1 .cursors .cursor:nth-child(4) {
    animation-name: move4;
    animation-duration: 7s;
}

@keyframes move4 {
    0% { top: 20%; left: 80%; }
    33% { top: 30%; left: 70%; }
    66% { top: 15%; left: 78%; }
    100% { top: 20%; left: 80%; }
}

.section2{
    background-color: #05030E;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0rem 8vw;
}
.section2 .container{
    width: 100%;
    height: 50rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
}
.section2 .container .con{
    width: 100%;
    height: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    color: #fff;
}
.section2 .container .con:nth-child(1) .box:nth-child(1){
    width: 40%;
    height: 100%;
    background-color: #34343436;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 1rem;
    border-radius: 1.5rem;
    border: 1px solid #ffffff7a;
}
.section2 .container .con:nth-child(1) .box:nth-child(1) .img{
    width: 100%;
    height: 80%;
    background-image: url(../dashboard/assets/img/box1.png);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}
.section2 .container .con:nth-child(1) .box:nth-child(1) .content{
    display: flex;
    align-items: flex-start;
    gap: .5rem;
    justify-content: center;
    flex-direction: column;
}
.section2 .container .con:nth-child(2) .box:nth-child(2) .content{
    display: flex;
    align-items: flex-start;
    gap: .5rem;
    justify-content: center;
    flex-direction: column;
}
.section2 .container .con .box .content h3{
    font-family:Aventa-Regular;
}
.section2 .container .con .box .content p{
    font-family:Aventa-Light;
}
.section2 .container .con:nth-child(1) .box:nth-child(2){
    width: 60%;
    height: 100%;
    background-color: #34343436;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid #ffffff7a;
    border-radius: 1.5rem;
}
.section2 .container .con:nth-child(1) .box:nth-child(2) .content{
    display: flex;
    align-items: flex-end;
    gap: 1rem;
    justify-content: center;
}
.section2 .container .con:nth-child(1) .box:nth-child(2) .content .text{
    display: flex;
    flex-direction: column;
    align-items: end;
    justify-content: center;
    text-align: left;
    gap: .5rem;
}
.section2 .container .con .box .content .text p{
    font-size: .9rem;
}
.section2 .container .con:nth-child(1) .box:nth-child(2) .content .text p{
    text-align: end;
}
.section2 .container .con:nth-child(1) .box:nth-child(2) .content .btn{
    padding:.7rem 1rem;
    border-radius: 10rem;
    height: fit-content;
    background-color: #424DC5;
    font-family: Aventa-Regular;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #424DC5;
    transition: all .1s ease-in-out;
}
.section2 .container .con:nth-child(1) .box:nth-child(2) .content .btn a{
    text-decoration: none;
    color: #fff;
    font-size:.8rem;
    white-space: nowrap;
}
.section2 .container .con:nth-child(1) .box:nth-child(2) .img{
    width: 100%;
    height: 80%;
    background-image: url(../dashboard/assets/img/box2.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    border-radius: .5rem;
}
.section2 .container .con:nth-child(2) .box:nth-child(1){
    width: 60%;
    height: 100%;
    background-color: #34343436;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid #ffffff7a;
    border-radius: 1.5rem;
}
.section2 .container .con:nth-child(2) .box:nth-child(1) .content{
    display: flex;
    align-items: flex-end;
    justify-content: center;
    flex-direction: row-reverse;
    gap: 1rem;
}
.section2 .container .con:nth-child(2) .box:nth-child(1) .content .text{
    display: flex;
    flex-direction: column;
    align-items: start;
    justify-content: center;
    text-align: left;
    gap: .5rem;
}
.section2 .container .con:nth-child(2) .box:nth-child(1) .content .btn{
    padding:.7rem 1rem;
    border-radius: 10rem;
    height: fit-content;
    background-color: #424DC5;
    font-family: Aventa-Regular;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #424DC5;
    transition: all .1s ease-in-out;
}
.section2 .container .con:nth-child(2) .box:nth-child(1) .content .btn:hover{
    background-color: transparent;
}
.section2 .container .con:nth-child(1) .box:nth-child(2) .content .btn:hover{
    background-color: transparent;
}
.section2 .container .con:nth-child(2) .box:nth-child(1) .content .btn a{
    text-decoration: none;
    color: #fff;
    font-size:.8rem;
    white-space: nowrap;
}
.section2 .container .con:nth-child(2) .box:nth-child(1) .img{
    width: 100%;
    height: 80%;
    background-image: url(../dashboard/assets/img/box4.png);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}
.section2 .container .con:nth-child(2) .box:nth-child(2){
    width: 40%;
    height: 100%;
    background-color: #34343436;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid #ffffff7a;
    border-radius: 1.5rem;
}
.section2 .container .con:nth-child(2) .box:nth-child(2) .img{
    width: 100%;
    height: 80%;
    background-image: url(../dashboard/assets/img/box3.png);
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
}

/* Section3 Styling */
.section3{
    width: 100%;
    padding: 10% 0rem;
    background-color: #05030E;
    display: flex;
    align-items: center;
    justify-content: center;
}
.section3 .container{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 3rem;
    flex-direction: column;
    color: #fff;
}
.section3 .container .top{
    width: calc(100% - 30rem);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
}
.section3 .container .top h1{
    font-family: Aventa-Black;
    font-size: 3rem;
    text-align: center;
}
.section3 .container .top p{
    width: 60%;
    font-family: Aventa-Light;
    font-size: 1rem;
    text-align: center;
}
.section3 .container .center{
    width: calc(100% - 20rem);
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
}
.section3 .container .center .con{
    background-color: #0F0D18;
    border-radius: .8rem;
    padding: .8rem;
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 1rem;
}
.section3 .container .center .con h1{
    font-family: Aventa-Black;
    font-size: 3rem;
}
.section3 .container .center .con p{
    font-family: Aventa-Light;
    font-size: 1rem;
}
.section3 .container .bottom{
    display: flex;
    align-items: center;
    justify-content: center;
}
.section3 .container .bottom .btn{
    padding: 0.8rem 2.1rem;
    transition: all ease-out 0.5s;
    border-radius: 10rem;
    background: linear-gradient(131.745deg, #525EE4 0%, #0F0D18 100%);
}

.section3 .container .bottom .btn:hover {
    background: linear-gradient(131.745deg, #0F0D18 0%, #525EE4 100%);
}

.section3 .container .bottom .btn a {
    text-decoration: none;
    color: #fff;
    font-family: Aventa-Regular;
}
.section4{
    background-color: #05030E;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}
.section4 .container{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2.5rem;
    padding: 0rem 5rem;
    position: relative;
    z-index: 2;
}
.section4 .intro-text {
    color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1rem;
}
.section4 .intro-text h1{
    font-size: 2.5rem;
    font-family: Aventa-Black;
} 
.section4 .intro-text p{
    color: #fff;
    font-family: Aventa-Light;
    width: calc(100% - 35rem);
    text-align: center;
}
  
  /* SWITCH STYLES
  –––––––––––––––––––––––––––––––––––––––––––––––––– */
  .switch-wrapper {
    position: relative;
    display: inline-flex;
    padding: 1rem;
    border: 1px solid #ffffff2f;
    border-radius: 10rem;
    background-color: #0f0d188a;
    color: #fff;
  }
  
  .switch-wrapper [type="radio"] {
    position: absolute;
    left: -9999px;
  }
  
  .switch-wrapper [type="radio"]:checked#monthly ~ label[for="monthly"]:hover,
  .switch-wrapper [type="radio"]:checked#yearly ~ label[for="yearly"]:hover {
    background: transparent;
  }
  
  .switch-wrapper
    [type="radio"]:checked#monthly
    + label[for="yearly"]
    ~ .highlighter {
    transform: none;
  }
  
  .switch-wrapper
    [type="radio"]:checked#yearly
    + label[for="monthly"]
    ~ .highlighter {
    transform: translateX(100%);
  }
  
  .switch-wrapper label {
    font-size: 1rem;
    padding: 0rem .5rem;
    z-index: 1;
    font-family: Aventa-Light;
    cursor: pointer;
    border-radius: 10rem;
    transition: color 0.25s ease-in-out;
  }
  .switch-wrapper label:hover {
    color: #ffffffc4;
  }
  .switch-wrapper #label1{
    margin-right: 1.5rem;
  }

  .switch-wrapper .highlighter {
    position: absolute;
    top: 6px;
    left: 6px;
    width: calc(50% - 6px);
    height: calc(100% - 12px);
    border-radius: 30px;
    background: linear-gradient(131.745deg, #525EE4 0%, #0F0D18 100%);
    transition: transform 0.25s ease-in-out;
  }
  
  .pricing-container {
    display: flex;
    justify-content: center;
    gap: 1rem;
    width: 100%;
    padding: 0rem 3rem;
}

.section4 .pricing-card {
    flex: 1;
    background: white;
    border: 1px solid #d3d3d3;
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 3rem;
    background-color: #0f0d1891;
    border: 1px solid #ffffff2a;
    color: #fff;
    justify-content: space-between;
}
.section4 .pricing-card:nth-child(2){
    background: linear-gradient(-148.141deg, rgba(66, 77, 197, 31%) 0%, rgba(37, 41, 98, 50%) 7%, rgba(28, 29, 67, 54%) 13%, rgba(18, 16, 33, 47%) 25%, rgba(15, 13, 24, 42%) 100%);
}

.section4 .pricing-card .heading {
    font-size: 1.5rem;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 1rem;
}
.section4 .pricing-card .heading h4{
    font-family: Aventa-Medium;
    font-size: 1.5rem;
}
.section4 .pricing-card .heading p{
    font-family: Aventa-Light;
    text-align: start;
    font-size: 0.9rem;
}

.section4 .pricing-card .info{
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.section4 .pricing-card .amount {
    font-size: 2rem;
    font-family: Aventa-Black;
}

.section4 .pricing-card .amount span {
    font-size: 0.8rem;
}

.section4 .pricing-card .content{
    width: 100%;
    font-family: Aventa-Light;
    display: flex;
    gap: .5rem;
    flex-direction: column;
}
.section4 .content .list{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 1rem;
    position: relative;
}
.section4 .pricing-card .info .content .list img{
    height: 1rem;
}
.section4 .pricing-card .bottom{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0rem 10%;
}
.section4 .pricing-card .bottom button{
    outline: none;
    border: 1px solid #424DC5;
    border-radius: 10rem;
    width: 100%;
    padding: .7rem 1rem;
    background-color: transparent;
    color: white;
}
.section4 .pricing-card .bottom button:hover{
    background-color: #424DC5;
}
.section4 .circle{
    position: absolute;
    opacity: 40%;
    width: 30rem;
    height: 30rem;
    background-color: #424DC5;
    border-radius: 50%;
    filter: blur(10rem);
    z-index: 1;
}
.hide {
    display: none !important;
}
/*------------Section 5----------------*/
.section5{
    width: 100%;
    /* height: 100vh; */
    background-color: #05030E;
}
.section5 .wrapper{
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    position: relative;
    margin-top: 10rem;
    margin-bottom: 10rem;
}
.section5 .container{
    width: 100%;
    display: flex;
    padding: 0rem 5rem;
    color: #fff;
    align-items: flex-start;
    gap: 2rem;
}   
.section5 .container .con{
    width: 50%;
}
.section5 .container .con:nth-child(1) .heading{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 2rem;
}
.section5 .container .con:nth-child(1) .heading h1{
    font-size: 3rem;
    font-family: Aventa-Black;
}
.section5 .container .con:nth-child(1) .heading p{
    width: calc(100% - 12rem);
    font-size: 1rem;
    font-family: Aventa-Light;
}
.section5 .container .con .faqs{
    display: flex;
    flex-direction: column;
    gap: 1rem;
}
.section5 .container .con .faqs .faq{
    background-color: #05030E;
    border-radius: .6rem;
}
.section5 .accordion {
    background-color: #0F0D18;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #fff;
    padding: 1rem;
    width: 100%;
    border: none;
    text-align: left;
    outline: none;
    font-size: 1rem;
    transition: 0.2s;
    border-radius: .6rem;
}
.section5 .active,
.accordion{
    border-bottom-left-radius: 0rem;
    border-bottom-right-radius: 0rem;
}
.section5 .active,
.accordion:hover {
    color: #ffffffcb;
}

.section5 .accordion:after {
    content: '\002B';
    color: #fff;
    float: right;
    font-size: 1.5rem;
}

.section5 .active:after {
    content: "\2212";
}
.section5 .panel {
    font-family: Aventa-Light;
    font-size: .9rem;
    background-color: #0F0D18;
    max-height: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    transition: max-height 0.4s ease-out;
}
.section5 .panel .content{
    padding-top: 1rem;
    border-top: 1px solid #ffffff86;
}

/*----------------Section6------------------*/
.section6{
    width: 100%;
    background-color: #05030E;
    display: flex;
    align-items: center;
    padding: 0rem;
    justify-content: center;
}
.section6 .container{
    background-image: url(../dashboard/assets/img/sec_6.png);
    background-size: contain;
    background-repeat: no-repeat;
    border-radius: 1rem;
    background-position: center;
    width: 80%;
    height: fit-content;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem 0rem;
}
.section6 .container .content{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5vw;
    flex-direction: column;
    width: calc(100% - 15rem);
}
.section6 .container .content h1{
    font-family: Aventa-Black;
    font-size: 3.4vw;
    color: #0F0D18;
    text-align: center;
}
.section6 .container .content p{
    font-family: Aventa-Light;
    font-size: 1rem;
    color: #0F0D18;
    text-align: center;
    width: calc(100% - 20rem);
}
.section6 .container .content .btn{
    border-radius: 10rem;
    background-color: #424DC5;
    padding: .8rem 2rem;
    border: 1px solid #424DC5;
    transition: all .1s ease-in-out;
}
.section6 .container .content .btn:hover{
    background-color: transparent;
}
.section6 .container .content .btn:hover a{
    color: #424DC5;
}
.section6 .container .content .btn a{
    text-decoration: none;
    font-family: Aventa-Light;
    font-size: 1rem;
    color: #fff;
}

/* --------- Section 7 Styling -------- */

.section7 {
    padding: 3.125rem 1.25rem;
    margin-top: 5rem;
    text-align: center;
    background-color: #05030E;
    color: #fff;
    display: flex;
    flex-direction: column;
    gap: 1rem;
    margin-bottom: 5rem;
}
.section7 .heading{
    display: flex;
    flex-direction: column;
    gap: 1rem;
    align-items: center;
    justify-content: center;
}
.section7 .heading h1 {
    font-size: 2.5em;
    margin-bottom: 10px;
    font-family: Aventa-Black;
}

.section7 .heading p {
    font-size: 1.2em;
    color: #fff;
    font-family: Aventa-Light;
    margin-bottom: 30px;
    width: calc(100% - 45rem);
}

.section7 .wrapper {
    margin-top: .4rem;
    width: 100%;
    max-width: 1536px;
    margin-inline: auto;
    height: 12.5rem;
    position: relative;
    overflow: hidden;
    mask-image: linear-gradient(
      to right,
      rgba(0, 0, 0, 0),
      rgba(0, 0, 0, 1) 20%,
      rgba(0, 0, 0, 1) 80%,
      rgba(0, 0, 0, 0)
    );
  }
  
  @keyframes scrollLeft {
    to {
      left: -18rem;
    }
  }
  
  @keyframes scrollRight {
    to {
      right: -18rem;
    }
  }
  
  .itemLeft,
  .itemRight {
    width: 18rem;
    height: 12.5rem;
    background-color: #0f0d1890;
    border-radius: .5rem;
    position: absolute;
    animation-timing-function: linear;
    animation-duration: 30s;
    animation-iteration-count: infinite;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 1rem;
  }
  .section7 .wrapper:hover 
  .itemRight{
    animation-play-state: paused;
  }
  .section7 .wrapper:hover 
  .itemLeft{
    animation-play-state: paused;
  }
  .itemLeft,
  .itemRight p{
    font-family: Aventa-Light;
    text-align: left;
    font-size: 1rem;
  }
  .itemLeft h5{
    font-family: Aventa-Light;
    align-self: flex-end;
    font-size: 1rem;
  }
  .itemRight h5{
    font-family: Aventa-Light;
    align-self: flex-end;
    font-size: 1rem;
  }
  .testimonial_img{
    align-self: flex-start;
    width: 2rem;
    height: 2rem;
    object-fit: contain;
    background-position: center;
  }
  
  .itemLeft {
    left: max(calc(17rem * 8), 100%);
    animation-name: scrollLeft;
  }
  
  .itemRight {
    right: max(calc(17rem * 8), calc(100% + 17rem));
    animation-name: scrollRight;
  }
  
  .item1 {
    animation-delay: calc(30s / 8 * (8 - 1) * -1);
  }
  
  .item2 {
    animation-delay: calc(30s / 8 * (8 - 2) * -1);
  }
  
  .item3 {
    animation-delay: calc(30s / 8 * (8 - 3) * -1);
  }
  
  .item4 {
    animation-delay: calc(30s / 8 * (8 - 4) * -1);
  }
  
  .item5 {
    animation-delay: calc(30s / 8 * (8 - 5) * -1);
  }
  
  .item6 {
    animation-delay: calc(30s / 8 * (8 - 6) * -1);
  }
  
  .item7 {
    animation-delay: calc(30s / 8 * (8 - 7) * -1);
  }
  
  .item8 {
    animation-delay: calc(30s / 8 * (8 - 8) * -1);
  }

  /* --------- Footer Styling -------- */
  footer {
    background-color: #424DC5;
    color: white;
    font-family: Aventa-Light;
    font-size: 1rem;
  }
  
  .footer-upper {
    padding: 2rem;
    display: flex;
    flex-direction: column;
    gap: 3rem;
    padding: 6rem;
  }
  
  .footer-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
  .footer-top .footer-logo{
    width: 9.8rem;
    height: auto;
    object-fit: contain;    
  }
  
  .social-icons {
    display: flex;
    gap: 0.5rem;
  }
  
  .social-icons img {
    width: 2.5rem;
    height: 2.5rem;
  }  
  .footer-second {
    width: 100%;
  }
  
  .footer-links {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 2rem;
    flex: 4;
  }
  
  .footer-links h4 {
    margin-bottom: 0.5rem;
  }
  
  .footer-links ul {
    list-style: none;
    padding: 0;
    margin: 0;
  }
  
  .footer-links ul li {
    margin-bottom: 0.5rem;
  }
  
  .footer-links ul li a {
    color: white;
    text-decoration: none;
  }
  .footer-links ul li a:hover{
    color: #ffffffa8;
  }
  .subscribe {
    flex: 1;
    width: 24rem;
    max-width: 100%;
    display: flex;
    flex-direction: column;
    gap: .8rem;
  }
  
  .subscribe h3 {
    font-family: Aventa-Bold;
    font-size: 1.8rem;
  }
  
  .subscribe form {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
  }
  
  .subscribe input {
    flex: 1;
    padding: 0.5rem;
    border-radius: 4px;
    border: none;
    outline: none;
    border-radius: 15rem;
    padding: .8rem 1rem;
    font-family: Aventa-Light;
  }
  
  .subscribe button {
    padding: .8rem 1rem;
    background-color: #0d1128;
    color: white;
    border: none;
    border-radius: 15rem;
    font-family: Aventa-Light;
    cursor: pointer;
  }
  
  .footer-lower {
    background-color: #0d1128; /* Adjust to match the bottom bar color */
    text-align: center;
    padding: 1rem;
  }
  
  .footer-lower p {
    margin: 0;
  }
  
  /* Responsive Styles */
  
  
/*---------Responsive------------*/
@media (min-width:2550px) {
    .section1 .content h1 {
        font-size: 6.7rem !important;
    }
}
@media (min-width:1850px) {
    .section1 .content h1 {
        font-size: 4.7rem !important;
    }
    .section6 .container .content h1{
        font-size: 4.5rem;
    }
    .section6 .container .content{
        gap: 3rem;
        padding: 2rem;
    }
}
@media(min-width:1740px){
    html{
        font-size: 120% !important;
    }
}
@media(min-width:1580px){
    html{
        font-size: 110%;
    }
}
@media(max-width:1200px){
    .section1 .content h1 {
        font-size: 5.5vw;
    }
    .section6 .container .content p {
        width: calc(100% - 10rem);
    }
    .section7 .heading p {
        width: calc(100% - 25rem);
    }
}
@media(max-width:1100px){
    .pricing-container {
        padding: 0rem;
    }
    .section5 .container .con:nth-child(1) .heading p {
        width: calc(100% - 6rem);
    }
    .section3 .container .top p {
        width: calc(100% - 2rem);
    }
}
@media(max-width:1034px){
    html{
        font-size: 95%;
    }
    .section3 .container .top h1 {
        font-size: 4vw;
    }
    .section4 .intro-text p {
        width: calc(100% - 20rem);
    }
    .section6 .container {
        background-size: cover;
    }
    .section7{
        margin-top: 2rem;
    }
}
@media(max-width:940px){
    html{
        font-size: 90%;
    }
    .section2 .container {
        height: 40rem;
    }
    .subscribe {
        width: 20rem;
    }
    .section5 .container .con:nth-child(1) .heading h1 {
        font-size: 4vw;
    }
}
@media(max-width:860px){
    .section1 .cursors {
        display: none;
    }
    .section1 .content h1 {
        font-size: 6.2vw;
    }
    .section4 .pricing-card {
        gap: 1rem;
    }
    .section4 .circle {
        width: 18rem;
        height: 18rem;
    }
    .subscribe {
        width: 15rem;
    }
}
@media(max-width:800px){
    html{
        font-size: 80%;
    }
}
@media(max-width:700px){
    html{
        font-size: 70%;
    }
    .navbar .nav_item:nth-child(2) {
        display: none;
    }
    .section1 {
        height: 60vh;
    }
    .section2 .container {
        height: 160vh;
        padding: 0rem 7vw;
    }
    .section2 .container .con {
        height: 100%;
        flex-direction: column;
    }
    .section2 .container .con:nth-child(1) .box:nth-child(1) {
        width: 100%;
    }
    .section2 .container .con:nth-child(1) .box:nth-child(2) {
        width: 100%;
    }
    .section2 .container .con:nth-child(2) .box:nth-child(1) {
        width: 100%;
    }
    .section2 .container .con:nth-child(2) .box:nth-child(2) {
        width: 100%;
    }
    .footer-upper {
        gap: 1rem;
      }
    
      .footer-second {
        flex-direction: column;
        gap: 1rem;
      }
    
      .footer-links {
        grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
      }
    
      .subscribe form {
        flex-direction: column;
        gap: 0.5rem;
      }
    
      .subscribe {
        width: 100%;
    }
}
@media(max-width:630px){
    .pricing-container {
        flex-direction: column;
        padding: 0rem 7vw;
    }
    .section4 .pricing-card {
        gap: 2.5rem;
    }
    .section5 .container{
        flex-direction: column;
    }
    .section5 .container .con {
        width: 100%;
    }    
}
@media(max-width:630px){
    .section1 .content h1{
        font-size: 8vw;
    }
    .section3{
        padding: 20vw 0rem;
    }
    .section3 .container .top {
        width: calc(100% - 15rem);
    }
    .section3 .container .center {
        width: calc(100% - 10rem);
    }
    .section6 .container .content p {
        width: calc(100% - 2rem);
    }
}
@media (max-width: 604px) {
    .footer-links {
        grid-template-columns: repeat(auto-fit, minmax(35vw, 1fr));
    }
    .section7 .heading p {
        width: calc(100% - 5rem);
    }
}
@media (max-width: 500px) {
    .navbar{
        padding: 1rem 2rem;
    }
    .section1{
        height: 45vh;
    }
    .section1 .content p{
        max-width: 70%;
    }
    .section3 .container .top h1 {
        font-size: 5vw;
    }
    .section3 .container .center {
        grid-template-columns: repeat(1, 1fr);
    }
    .section4 .intro-text p {
        width: calc(100% - 5rem);
    }
    footer{
        font-size: 1.3rem;
    }
    .footer-upper{
        gap: 2rem;
        padding: 2rem;
    }
    .footer-links{
        display: grid;
        grid-template-areas:
            "header header"
            "menu content"
            "footer footer";
        grid-template-columns: 1fr 3fr;
        gap: 3rem;
    }
    .footer-links > .subscribe {
        grid-area: header;
      }
      .footer-links > div:nth-child(2) {
        grid-area: menu;
      }
      .footer-links > div:nth-child(3) {
        grid-area: content;
      }
      .footer-links > div:nth-child(4) {
        grid-area: footer;
      }
    .subscribe{
        gap: 2rem;
    }
    .subscribe h3{
        font-size: 2.3rem;
    }
    .section4 .intro-text h1{
        text-align: center;
    }
    .section6 .container{
        background: #BECCEE;
    }
    .section6 .container .content {
        width: calc(100% - 7rem);
    }
}
@media (max-width: 420px) {
    .section2 .container {
        padding: 0rem;
    }
    .section3 .container .top {
        width: calc(100% - 7rem);
    }
    .pricing-container {
        padding: 0rem;
    }
    .section4 .intro-text h1 {
        font-size: 2.7rem;
    }
    .section5 .container .con:nth-child(1) .heading h1 {
        font-size: 7vw;
    }
    .section7 .heading {
        padding: 0rem 4vw;
    }
}
@media (max-width: 350px) {
    html{
        font-size: 65%;
    }
    .section4 .intro-text h1 {
        font-size: 6vw;
    }
    .section3 .container .top h1 {
        font-size: 6vw;
    }
}
@media (min-width: 768px) and (max-width: 1024px) {
    .section1{
        height: 50vh;
    }
  }
  


  /*Blog Page*/
  .main{
    background-color: #05030E;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .main .show_contianer{
    width: 60%;
  }
  .main .blog{
    display: flex;
    flex-direction: column;
    gap: 3.5rem;
    padding: 1rem 0rem;
  }
  .main .blog .header h1{
    text-align: center;
  }
  .main .main_img img{
    border-radius: .5rem;
  }
  .main  .cta a{
    color: #BECCEE;
  }
  .main h1,h2,h3,h4,h5{
    margin-bottom: 1rem !important;
  }
  @media (max-width: 586px) {
    .main .container {
        padding: 1rem;
        margin: 0rem 1rem;
        width: 90% !important;
    }
    .main .row{
        flex-direction: column;
        gap: 1rem;
    }
  }