/* extra media query */
@media (min-width: 1200px) and (max-width: 1380px) {}




/* XL Device :1200px. */
@media (min-width: 1200px) and (max-width: 1449px) {

    header {
        padding-block: 35px;
    }

    .hero__deskImage {
        right: -150px;
        width: 80.66%;
    }

    .section__black__overlay {
        bottom: 160px;
    }

    .service__yellow__overlay {
        width: 800px;
        height: 800px;
    }

    .featureSlider .swiper-slide.swiper-slide-next .single__feature h4 {
        font-size: 40px;
        margin-bottom: 15px;
    }

    .step__area {
        padding-block: 100px 0;
    }

    .step__image {
        width: 58%;
    }

    .step__list {
        width: 45%;
    }

    .security__image {
        top: 30px;
        width: 70%;
    }

    .testimonial__text {
        bottom: 0;
    }
}



/* LG Device :992px. */
@media (min-width: 992px) and (max-width: 1200px) {

    .featureSlider .swiper-slide.swiper-slide-next .single__feature h4 {
        font-size: 35px;
        margin-bottom: 10px;
    }

    .featureSlider .swiper-slide.swiper-slide-next .single__feature {
        padding: 25px 40px 25px 25px;
    }

    .featureSlider .swiper-slide.swiper-slide-next .single__feature .feature__text p {
        font-size: 20px;
        line-height: 28px;
    }

    .featureSlider .swiper-slide {
        transform: scale(0.9);
    }

    .featureSlider .swiper-slide.swiper-slide-next {
        transform: scale(1.1);
    }

    .step__content {
        padding-inline: 0;
    }

    .step__list {
        width: 100%;
    }

    .step__box {
        padding-bottom: 0;
    }

    .step__image {
        position: relative;
        margin-top: 50px;
        bottom: 0;
    }

    .service__area {
        height: 70vh;
    }

    .service__yellow__overlay {
        width: 500px;
        height: 500px;
    }

    .hero__deskImage {
        right: -180px;
        width: 100%;
    }

    .feature__area {
        padding-block: 60px 0;
    }

    .step__area {
        padding-block: 70px 0;
    }

    .feature__yellow__overlay {
        width: 400px;
        height: 400px;
    }

    .investor__yellow__overlay {
        width: 600px;
        height: 600px;
    }

    .investor__article__container {
        padding-block: 363px 60px;
    }

    .footer__area {
        padding-block: 60px;
    }

    .security__image {
        left: -280px;
        top: 0;
    }

    .security__area {
        padding-block: 300px;
    }

    .security__text {
        max-width: 670px;
    }

    .investor__article {
        margin-top: -320px;
    }

    .testimonial__text {
        bottom: 0;
    }

    .testimonial__black__overlay {
        bottom: 90px;
    }
}


/* MD Device :768px. */
@media (min-width: 768px) and (max-width: 991px) {


    .featureSlider .swiper-slide.swiper-slide-next .single__feature h4 {
        font-size: 35px;
        margin-bottom: 15px;
    }

    .featureSlider .swiper-slide.swiper-slide-next .single__feature .feature__text p {
        font-size: 20px;
        line-height: 30px;
    }

    .featureSlider .swiper-slide.swiper-slide-next .feature__icon {
        padding-bottom: 110px;
    }


    .step__content {
        padding-inline: 0;
    }

    .step__list {
        width: 100%;
    }

    .step__box {
        padding-bottom: 0;
    }

    .step__image {
        position: relative;
        margin-top: 50px;
        bottom: 0;
    }

    .footer__logo img {
        width: 160px;
    }

    .footer__area {
        padding-block: 100px 50px;
    }

    .free__account__btn {
        padding: 16px 40px;
    }

    .testimonial__text h4 {
        font-size: 50px;
        margin-bottom: 10px;
    }

    .testimonial__text p {
        font-size: 25px;
        margin-bottom: 35px;
    }

    .feature__yellow__overlay {
        width: 400px;
        height: 400px;
    }

    .investor__yellow__overlay {
        width: 400px;
        height: 400px;
        top: 0;
    }

    .service__yellow__overlay {
        width: 500px;
        height: 500px;
    }

    .hero__area {
        height: unset;
        padding-top: 220px;
    }

    header {
        padding-block: 30px;
    }

    .hero__deskImage {
        right: 0;
        width: 100%;
    }

    .service__area {
        height: unset;
        padding-block: 170px;
    }

    .service__text {
        max-width: 550px;
    }

    .feature__area {
        padding-block: 40px 20px;
    }

    .step__area {
        padding-block: 50px 0;
    }

    .security__image {
        left: 0;
        top: -120px;
        width: 100%;
    }

    .security__area {
        padding-block: 160px;
    }

    .investor__article {
        margin-top: -140px;
    }

    .investor__article__container {
        padding-block: 0;
        position: relative;
        margin-top: -120px;
    }

    .testimonial__area {
        padding-top: 100px;
        border: none;
    }

    .testimonial__text {
        bottom: 0;
    }

    .testimonial__black__overlay {
        bottom: 0;
    }
}



/* SM Small Device :320px. */
@media only screen and (min-width: 320px) and (max-width: 767px) {

    .swiper.featureSlider {
        height: unset;
    }

    .featureSlider .swiper-slide.swiper-slide-next .single__feature h4 {
        font-size: 27px;
        margin-bottom: 15px;
    }

    .featureSlider .swiper-slide.swiper-slide-next .single__feature .feature__text p {
        font-size: 18px;
        line-height: 24px;
    }

    .featureSlider .swiper-slide.swiper-slide-next img {
        width: 90px;
        height: 90px;
    }

    .feature__content {
        padding-bottom: 90px;
    }

    .featureSlider .swiper-slide.swiper-slide-next .single__feature {
        padding: 20px;
        height: 310px;
    }


    header {
        padding-block: 34px;
    }

    .header__logo img {
        width: 113px;
    }

    .theme__btn {
        font-size: 16px;
        padding: 14px 28px;
    }

    .hero__deskImage {
        display: none;
    }

    .hero__text h1 {
        font-size: 40px;
        line-height: 49px;
        margin-bottom: 15px;
    }

    .hero__text p {
        font-size: 18px;
        line-height: 26px;
        margin-bottom: 35px;
    }

    .hero__button__group a+a {
        font-size: 16px;
    }

    .hero__button__group {
        gap: 17px;
    }


    .hero__area {
        background-image: url("../img/herobg-mobile.svg");
        background-position: center;
        background-size: cover;
        align-items: end;
        padding-bottom: 55px;
    }

    .service__yellow__overlay {
        width: 300px;
        height: 300px;
    }

    .service__area {
        height: unset;
        background: none;
        padding-block: 91px 54px;
    }

    .service__text h4 {
        font-size: 27px;
        margin-bottom: 27px;
        line-height: 32px;
    }

    .service__text p {
        font-size: 18px;
        line-height: 20px;
        letter-spacing: 0px;
    }

    .feature__yellow__overlay {
        display: none;
    }

    .feature__area {
        padding-block: 56px 0;
    }

    .serviceFeature__bg {
        background-image: url("../img/bg2-mobile.svg");
        background-position: center;
        background-size: cover;
        background-repeat: no-repeat;
    }

    .service__area .section__black__overlay {
        display: none;
    }

    .feature__title h4 {
        font-size: 27px;
        line-height: 32px;
    }

    .feature__icon img {
        width: 82px;
        height: 82px;
    }

    .single__feature {
        padding: 26px;
        justify-content: start;
    }

    .feature__icon {
        padding-bottom: 42px;
    }

    .step__area {
        padding-block: 0;
    }

    .step__content {
        padding-inline: 0;
        margin-top: -50px;
    }

    .step__list {
        width: 100%;
    }

    .step__image {
        display: none;
    }

    .investor__yellow__overlay {
        width: 500px;
        height: 500px;
    }

    .step__image__mobile {
        margin-right: -50px;
        margin-top: -50px;
        position: relative;
    }

    .step__image__mobile::after {
        position: absolute;
        content: '';
        background: #fff300;
        background: -webkit-radial-gradient(circle, #fff300 0%, rgba(3, 20, 26, 0) 100%);
        background: radial-gradient(circle, #fff300 0%, rgba(3, 20, 26, 0) 100%);
        left: -50%;
        width: 300px;
        height: 300px;
        border-radius: 100%;
        z-index: 2;
        filter: blur(100px);
        top: -30px;
        opacity: .8;
        transform: translateX(50%);
    }

    .step__box {
        padding: 25px 20px;
    }

    .step__detail h5 {
        font-size: 27px;
        margin-bottom: 22px;
        line-height: 32px;
    }

    .step__list ul li span {
        background-color: var(--primary-color);
        height: 46px;
        width: 46px;
    }

    .step__list ul li {
        gap: 20px;
        padding: 14px;
    }

    .step__list ul li p {
        font-size: 18px;
        line-height: 19px;
    }

    .security__text h4 {
        font-size: 27px;
        margin-bottom: 11px;
        line-height: 32px;
    }

    .security__text p {
        font-size: 18px;
        line-height: 19px;
    }

    .investor__article {
        margin-top: 0;
    }


    .security__area {
        padding-block: 113px;
    }

    .investor__article__container {
        position: relative;
        padding-block: 0 72px;
    }

    .testimonial__text {
        position: relative;
        padding-bottom: 90px;
        bottom: 0;
    }

    .investor__article__text h4 {
        font-size: 27px;
        margin-bottom: 29px;
        line-height: 32px;
    }

    .investor__article__text p {
        font-size: 18px;
        line-height: 19px;
    }

    .footer__logo img {
        width: 100px;
        margin: auto;
    }

    .footer__area {
        padding-block: 34px;
    }

    .testimonial__text h4 {
        font-size: 27px;
        margin-bottom: 17px;
        line-height: 32px;
    }

    .testimonial__text p {
        font-size: 18px;
        line-height: 19px;
        margin-bottom: 53px;
    }

    .free__account__btn {
        padding: 12px 30px;
        font-size: 16px;
    }

    .feature__text h4 {
        margin-bottom: 11px;
    }

    .investor__image {
        transform: scale(1.5) !important;
    }

    .testimonial__black__overlay {
        display: none;
    }

    .testimonial__image__mobile {
        transform: scale(1.5);
    }

    .security__image {
        left: 0;
        top: -160px;
        width: 100%;
    }
}


/* SM Small Device :550px. */
@media only screen and (min-width: 576px) and (max-width: 767px) {

    .hero__area {
        background-size: 100% 100%;
    }


}