/* Hero Section Styles */
.heroSection::before {
    content: "";
    position: absolute;
    top: 0px;
    left: 0;
    right: 0;
    bottom: 0;
    background-image:
        linear-gradient(182.04deg, rgba(0, 0, 0, 0) 1.72%, rgba(0, 0, 0, 0.391442) 33.8%, rgba(0, 0, 0, 0.444519) 38.15%, rgba(0, 0, 0, 0.530769) 45.22%, rgba(0, 0, 0, 0.69) 58.27%),
        url(../imgs/heroImage.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    z-index: -1;
}

.heroSection {
    position: relative;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding: 18.669rem 0 12.669rem;
}

.heroSection h1 {
    width: 750px;
}

.heroSection p {
    width: 500px;
}

.heroSection p.position-absolute {
    width: 558px;
}

@media (max-width:768px) {
    .heroSection {
        padding: 12.669rem 0 8.669rem 0px
    }

    .heroSection h1 {
        width: 450px;
    }
    .heroSection p {
        width: 440px;
    }

    .heroSection p.position-absolute {
        width: 490px;
        font-size: 10px !important;
    }
}

@media (max-width:576px) {

    .heroSection h1 {
        width: 320px;
    }
    .heroSection p {
        width: 320px;
    }

    .heroSection p.position-absolute {
        width: 350px;
    }
}

@media (max-width: 350px) {

    .heroSection h1 {
        width: 308px;
    }

    .heroSection p {
        width: 308px;
    }

    .heroSection p.position-absolute {
        width: 276px;
    }
}

/* What's happening */
@media (max-width:992px) {
    .whatsHappening .svgContainer svg{
        width: 177px;
        height: auto;
    }
    .whatsHappening .pxy-62px {
    padding: 32px;
    }
}
@media (max-width:768px) {
    .whatsHappening .svgContainer svg{
        width: 70px;
        height: auto;
    }
}
/* Free trail */
.freeTrail::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 25%;
    height: 100%;
    background-image: url(../imgs/Background-Pattern.svg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    z-index: 0;
}
@media (max-width:992px) {
    .freeTrail::before{
        display: none;
    }
    
}
/* Pricing */
.growthCard{
    box-shadow: 0px 42px 34px 0px #0B273D;
    position: relative;
    overflow: hidden;
}
.growthCard::after{
    content: "";
    position: absolute;
    top: -50px;
    right: -92px;
    width: 67%;
    height: 100%;
    background-image: url(../imgs/Background-Shape.svg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    z-index: 0;
}
.mostPopular{
    left: 28px;
}
@media (max-width:992px) {
    .growthCard{
        box-shadow: 0px 12px 24px 0px #0B273D;
    }
    .mostPopular{
        left: 0px;
    }
    .pricingCard .fs-40px {
    font-size: clamp(2rem, 2.5vw, 2.5rem);
}
}
/* Contact us */
.contactUs{
    background: linear-gradient(181.78deg, rgba(0, 0, 0, 0) 1.51%, rgba(0, 0, 0, 0.78) 45.24%), url(../imgs/contact-us.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    
}
.contactUs .formContainer{
    box-shadow: 0px 2px 4px 0px #00000014;
    backdrop-filter: blur(6.699999809265137px);
    background: #FFFFFFB2;
}