/* ------ large and medium devices (dekstops and laptops, 992px and up) -----*/
@media (min-width: 992px) {
  html {
    font-size: 0.694vw;
  }

  .container {
    max-width: 128rem;
  }
}

/* ------ Medium devices (tablets, 991px and down) -----*/
@media (max-width: 991px) {
  html {
    font-size: 53%;
  }

  .menu_container {
    width: 735px;
  }

  .progress-wrap {
    width: 4.5rem;
    height: 4.5rem;
    right: 2rem;
    bottom: 2rem;
  }

  .arrow_top {
    width: 1.2rem;
  }

  br {
    display: none;
  }

  /* =========== Header area ========== */
  .primary_menu {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    display: flex !important;
    flex-direction: column;
    justify-content: space-between !important;
    padding: 0;
    pointer-events: none;
    overflow: auto;
    left: 50%;
    transform: translateX(-50%);
    z-index: 999999999;
    margin-top: 0;
    padding-top: 2rem;
  }

  .primary_menu::-webkit-scrollbar {
    scrollbar-width: 0;
    display: none;
  }

  .menu_active .primary_menu {
    pointer-events: all;
  }

  .main_menu {
    flex-direction: column;
    gap: 0;
    align-items: flex-start !important;
  }

  .main_menu li a,
  .menu_link_style {
    font-size: 2rem;
    line-height: 1;
  }

  body.menu_active {
    overflow: hidden !important;
  }

  .menu_overlay {
    width: 200vw;
    height: 200vh;
    content: "";
    background: rgb(255, 255, 255, 0.6);
    backdrop-filter: blur(1.5rem);
    position: fixed;
    left: -200vw;
    top: 50%;
    transform: translateY(-50%);
    border-radius: 0 50% 50% 0;
    transition: all 1.5s cubic-bezier(0.68, 0, 0.27, 1.55);
    /* elastic wave effect */
    z-index: 9999999;
  }

  .menu_active .menu_overlay {
    left: -50vw;
  }

  .menu_container {
    transition: 0.25s ease;
    transform: translateX(-2rem);
    opacity: 0;
    pointer-events: none;
  }

  .menu_active .menu_container {
    transform: translateX(0);
    opacity: 1;
    pointer-events: all;
    transition-delay: 1.05s;
  }

  /* ============== Hamburger ============= */
  .hamburger img {
    width: 2.8rem;
    position: absolute;
    transition: 0.35s ease;
  }

  .hamburger .close_icon {
    width: 1.8rem;
    opacity: 0;
    transform: scale(0.5);
  }

  .hamburger {
    width: 2.4rem;
    height: 2.4rem;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    z-index: 999;
  }

  .menu_active .hamburger .close_icon {
    opacity: 1;
    transform: scale(1);
    transition-delay: 1.05s;
  }

  .menu_active .hamburger .Hamburger_icon {
    opacity: 0;
    transform: scale(0.5);
  }

  /* header_btns */
  .header_btns a {
    width: 50%;
  }

  .header_btns {
    margin-right: 0;
    width: 100%;
    padding: 2rem 0;
    gap: 1.6rem;
  }

  .nav_link {
    width: 100%;
    height: 6rem;
    display: flex;
    align-items: center;
    border-bottom: 0.1rem solid #ddd;
  }

  .main_menu li {
    width: 100%;
  }

  .main_menu {
    margin-left: auto;
    display: block;
  }

  .primary_menu_sm .hamburger {
    margin-left: auto;
    margin-bottom: 1rem;
  }

  /* =============== hero_area ============== */
  .hero_bg_top,
  .hero_bg_bottom {
    position: absolute;
    width: 100vw;
    left: 0;
    pointer-events: none;
  }

  .hero_bg_top {
    top: -30%;
  }

  .hero_bg_bottom {
    bottom: -70%;
  }

  .hero_area .container {
    position: relative;
  }

  .section_bg {
    position: static;
    pointer-events: all;
  }

  .stat_boxes {
    position: static;
    transform: none;
    width: 100%;
    justify-content: center;
  }

  .stat_box.stat_box1 {
    margin-left: 0;
  }

  .stat_box.stat_box3 {
    margin-left: 0;
  }

  .stat_box.stat_box6 {
    margin-left: 0;
  }

  .stat_box.stat_box4 {
    margin-left: 0;
  }

  /* hero_area */
  .hero_area {
    padding: 14.5rem 0 10.7rem;
    overflow: hidden;
  }

  .hero_content {
    text-align: center;
  }

  .hero_badge {
    margin: 0 auto;
  }

  .section_bg {
    padding: 1rem 0 2rem;
  }

  .rating_box {
    max-width: 100%;
    padding: 0 5rem;
  }

  .button {
    padding: 0 3rem;
  }

  .hero_content .button {
    margin: 0 auto;
    margin-bottom: 4rem;
  }

  /* brand_logos */
  .brand_logos ul {
    gap: 2.5rem 5rem;
    justify-content: center;
  }

  .counter {
    font-size: 5rem;
  }

  .profit_content {
    gap: 1.6rem;
  }

  .industry_boxes.v2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
  }

  .review_content {
    gap: 4rem;
  }

  .review_logos {
    gap: 2.8rem;
  }

  .review_box {
    border-radius: 1.6rem;
    background: #fff;
    max-width: 40rem;
  }

  .service_area.v2 .row {
    --bs-gutter-y: 2.4rem;
  }

  .faq_content {
    max-width: 96rem;
  }

  .stat_boxes p br {
    display: block;
  }

  /* asib khan --------================================*/
  .out-why-content br {
    display: inline-block;
  }

  .our-why {
    padding: 5rem 0 8rem 0;
  }

  .container {
    z-index: 999;
    position: relative;
  }

  .out-why-shape-3.d-block.d-lg-none {
    top: 0;
  }

  .out-why-shape-4.d-block.d-lg-none {
    bottom: 0;
  }

  .out-why-shape-4,
  .out-why-shape-3 {
    position: absolute;
    width: 60rem;
    text-align: center;
    left: 50%;
    transform: translateX(-50%);
  }

  .our-how {
    padding-top: 10rem;
    padding-bottom: 10rem;
  }

  .principles-area {
    padding-top: 10rem;
    padding-bottom: 8rem;
  }

  .careers_inner_area {
    padding-top: 8rem;
    padding-bottom: 7rem;
  }

  .hero_inner_area {
    padding: 15rem 0 20rem;
  }

  .why-different-wrapper {
    padding: 4rem 2rem;
  }

  .why-different-wrapper .row {
    --bs-gutter-x: 3rem;
  }

  .works-investing-area .px_80 {
    padding: 0;
  }

  .works-investing-left-wrapper {
    padding-right: 0;
  }

  .works-investing-right-wrapper {
    margin-left: 0;
  }

  .works-investing-area {
    padding-bottom: 10rem;
  }

  .works-investing-area {
    padding-bottom: 10rem;
  }

  .why-choose {
    padding: 15rem 0 10rem;
  }

  .counterbg {
    bottom: 0;
    top: auto;
  }

  .service_area.v3 {
    padding: 15rem 0 10rem;
  }

  .works-investing-shape {
    top: auto;
  }

  .avatars img {
    width: 4.5rem;
  }

  .works-logo img {
    width: 21rem;
  }

  .circle-grid img {
    width: 13rem;
  }

  .flow-wrapper {
    gap: 2rem;
  }

  .works-container-castom .row {
    --bs-gutter-x: 3rem;
    --bs-gutter-y: 2rem;
  }

  .ready-to-strat-area {
    padding: 5rem 0 16rem;
  }

  .how-it-works {
    padding: 8rem 0 0;
  }

  .as-faq-area .faq-title {
    padding-bottom: 6rem;
  }
}

/*----- sm devices (tablets, 767px and down) -----*/
@media (max-width: 767px) {
  /* ============ default styles ============ */

  body {
    font-size: 1.6rem;
    letter-spacing: -0.02em;
  }

  html {
    font-size: 60%;
  }

  .container {
    padding: 0;
  }

  .container-fluid,
  .menu_container {
    width: 540px;
  }

  /* menu_bottom_main */
  .menu_bottom_main {
    height: auto;
    padding-top: 3.8rem;
    padding-bottom: 2.7rem;
    transition: 0.25s ease;
  }

  .site_header.sticky .menu_bottom_main {
    padding-top: 2rem;
    padding-bottom: 2rem;
  }

  .hero_bg_top {
    top: -10%;
  }

  .hero_bg_bottom {
    bottom: -40%;
  }

  /* brand_logos */
  .brand_logos ul {
    gap: 2.5rem 3rem;
    justify-content: center;
  }

  .brand_logos {
    padding: 6rem 7rem 0;
  }

  .numbers_area .container > h2 br {
    display: none;
  }

  .numbers_area .container {
    padding: 0 2rem;
  }

  .number_box svg {
    display: none;
  }

  .number_top {
    justify-content: center !important;
  }

  .counter {
    text-align: center;
  }

  .numbers_area {
    padding: 14rem 0;
  }

  .numbers_area h2.title_48.pb_50 {
    padding-bottom: 4rem;
  }

  .service_area:not(.v2) .section_top p {
    padding-left: 3rem;
    padding-right: 3rem;
  }

  .service_area .section_top span {
    color: #f3640f;
  }

  .profit_content {
    flex-direction: column;
    gap: 3.9rem;
  }

  .separator {
    width: 28rem;
  }

  .profit_content {
    flex-direction: column;
    gap: 3.9rem;
  }

  .separator {
    width: 28rem;
  }

  .industry_content {
    padding: 0 5rem 3.2rem 3.2rem;
  }

  .industry_boxes.v2 {
    grid-template-columns: 1fr;
  }

  .review_content {
    flex-direction: column;
    gap: 4.8rem;
  }

  .qoute_img {
    display: block;
    flex: 0 0 auto;
    margin-top: 0.6rem;
  }

  .faq_content {
    flex-direction: column;
    gap: 4.8rem;
    margin: 0;
  }

  .faq-title {
    text-align: center;
    display: block;
    margin: 0 auto;
    padding: 0;
  }

  .faq_area {
    padding-bottom: 8rem;
  }

  .cta_content .title_24 {
    line-height: 1.2;
    font-size: 2rem;
  }

  .footer_mid {
    padding: 0;
  }

  .footer_top {
    margin-bottom: 0;
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    gap: 2.4rem;
  }

  .footer_logo {
    width: 24.3rem;
  }

  .footer_section .container {
    display: grid;
    gap: 4rem;
  }

  .social_links a img {
    width: 2.4rem;
  }

  .footer_bottom > p {
    font-size: 1.4rem;
  }

  .footer_bottom {
    padding-top: 2.4rem;
  }

  .footer_box ul li a {
    font-size: 1.8rem;
    line-height: 2.2;
  }

  .stat_box p {
    text-align: left;
  }

  /* asib khan --------================================*/

  .out-why-content {
    max-width: 100%;
  }

  .hero_inner_area {
    padding: 15rem 0 13rem;
  }

  .our-how-box {
    text-align: center;
  }

  .principles-area {
    padding-top: 5rem;
    padding-bottom: 8rem;
  }

  .our-how {
    padding-top: 10rem;
    padding-bottom: 5rem;
  }

  .our-how-box h3 {
    font-size: 2rem;
  }

  .principles-area .container {
    padding: none;
  }

  .principles-area .container {
    padding: 1.5rem;
  }

  .different-content {
    margin-bottom: 4rem;
  }

  .out-why-shape-4,
  .out-why-shape-3 {
    position: absolute;
    width: 100%;
    text-align: center;
  }

  .as-faq-area {
    padding-bottom: 5rem;
  }

  .works-investing-shape {
    top: auto;
    bottom: 0;
  }

  .why-choose {
    padding: 10rem 0 8rem;
  }

  .service_area.v3 {
    padding: 10rem 0 0;
  }

  .ready-to-start-right-content-shape img {
    width: 70rem;
    position: inherit;
    transform: translateX(-20%);
  }

  .ready-to-start-right-content .main-img {
    width: 100%;
  }

  .ready-cs-container .button {
    margin-top: 0;
  }

  .ready-to-strat-area {
    padding: 10rem 0 0;
  }

  .flow-wrapper {
    flex-direction: column;
    gap: 2rem;
  }

  .arrow {
    transform: rotate(90deg);
  }

  .avatars {
    display: flex;
    justify-content: center;
  }

  .avatars img {
    width: 5rem;
    margin-right: -1rem;
  }

  .circle-grid img {
    width: 20rem;
  }

  .works-logo img {
    width: 25rem;
  }

  .how-it-works {
    padding: 6rem 0 0;
  }

  .signup-btn .button {
    margin: 0 0 !important;
  }

  .footer_mid p {
    font-size: 1.85rem;
  }

  .service_box {
    min-height: 28.8rem;
  }

  .service_box p {
    font-size: 2rem;
  }

  .faq_bg_sm {
    position: absolute;
    bottom: -70rem;
    left: 0;
    z-index: -1;
    pointer-events: none;
  }

  .review_bg_sm {
    position: absolute;
    top: -55rem;
    left: 0;
  }

  .number_bg_sm1 {
    position: absolute;
    top: -30rem;
    left: 0;
  }

  .number_bg_sm2 {
    position: absolute;
    left: 0;
    bottom: -27rem;
  }

  .works-investing-area .number_bg_sm1,
  .inner_hero_bg.number_bg_sm1 {
    top: auto;
    bottom: -45rem;
  }

  .terms-area .number_bg_sm1 {
    top: 50%;
    transform: translateY(-50%);
  }

  .howitworks_service .number_bg_sm1 {
    top: 70%;
    transform: translateY(-50%);
  }

  .hero_inner_area  .shadow_bg_sm {
    top: 100%;
}

  /* brand_icons */
  .brand_icon1 {
    width: 7rem;
  }

  .brand_icon2 {
    width: 13rem;
  }

  .brand_icon3 {
    width: 13rem;
  }

  .brand_icon4 {
    width: 13rem;
  }

  .brand_icon5 {
    width: 11rem;
  }

  .brand_icon6 {
    width: 13rem;
  }

  .brand_icon7 {
    width: 12rem;
  }

  .brand_logos ul a img {
    filter: saturate(0.5);
  }
}

/*----- xs devices (landscape phones, 575px and down) -----*/
@media (max-width: 575px) {
  html {
    font-size: 2.48vw;
  }

  /* menu */
  .primary_menu,
  .container-fluid {
    width: 100%;
  }

  .container {
    padding: 0 2rem !important;
  }

  .menu_container {
    width: 37rem;
  }

  /* hero_area */

  .hero_bg_top {
    top: 0;
  }

  .hero_bg_bottom {
    bottom: 0;
  }

  .stat_boxes {
    width: 100%;
    gap: 0.8rem 1.6rem;
    justify-content: flex-start;
  }

  .stat_box.stat_box1 {
    margin-left: 2.4rem;
  }

  .stat_box.stat_box3 {
    margin-left: 8.3rem;
  }

  .stat_box.stat_box6 {
    margin-left: 3rem;
  }

  .stat_box.stat_box4 {
    margin-left: 0.8rem;
  }

  .stat_box svg {
    width: 2.8rem;
  }

  .stat_box {
    height: 5.8rem;
    padding: 0 1.7rem;
    border-radius: 1.1rem;
    gap: 1rem;
  }

  .brand_logos ul {
    gap: 2.5rem 3rem;
    width: 8rem;
    margin: 0 auto;
  }

  .ready-to-start-right-content-shape img {
    width: 150%;
    position: inherit;
    transform: translateX(-20%);
  }
}
