:root {
  --mx-width: 1320px;
  --color-text-body: #525260;
  --color-primary: #5956e9;
  --color-secondary: #fff;
  --color-banner: #2522ba;
  --color-text-btn: #0d6efd;
  --color-bg-btn: #ffdc60;
  --color-subtitle: #c75c6f;
  --color-title: #292930;
  --color-bg-services: #f8f8f8;
  --color-bg-projects: #ecf2f6;
  --color-bg-dark: #27272e;
  --color-text-description: #99a1aa;
  --color-hover-dark: #303025;
  --color-borders: #e3efe9;
}

@media screen and (min-width: 1921px) and (max-width: 2560px) {
  .layout__menu {
    padding-right: 15rem;
    margin-right: 5rem;
    font-size: 3rem;
  }

  .submenu__title {
    font-size: 2.2rem;
  }

  .nav__icon {
    font-size: 1.4rem;
  }

  .navbar__logo {
    width: 15%;
  }

  .banner__btn {
    font-size: 2rem;
  }

  .service-shapes--shape1 {
    top: -8%;
    left: 50%;
  }

  .project-shapes--shape3 {
    top: 38%;
    left: 22.5%;
    animation: rodeo 30s infinite ease;
  }
}

@media (min-width: 1600px) {
  .layout {
    min-width: 1600px;
  }

  .layout__menu {
    padding: 5rem 9.5rem;
  }

  .layout__banner {
    height: 75rem;
    margin: 0 3rem;
    padding-left: 20rem;
    padding-top: 25rem;
    padding-bottom: 30rem;
  }

  .services__service {
    padding: 7rem 5rem;
  }
}

@media (max-width: 1440px) {
  .project-shapes--shape3 {
    top: 38%;
    left: 4.5%;
    animation: rodeo 30s infinite ease;
  }
}

@media (min-width: 1190px) and (max-width: 1400px) {
  .clients__container,
  .reviews__container,
  .news__container,
  .footer__container {
    max-width: 100%;
    padding-left: 3rem;
    padding-right: 3rem;
  }

  .projects__all {
    gap: 3rem;
  }
}

@media (max-width: 1200px) {
  .layout {
    min-width: 992px;
  }

  .nav__item {
    margin: 0 2rem;
  }

  .banner__title {
    font-size: 6rem;
  }

  .layout__services {
    margin: 10rem 4rem;
    margin-bottom: 0;
  }

  .clients__container,
  .reviews__container,
  .news__container,
  .footer__container {
    max-width: 96%;
    padding-left: 2rem;
  }

  .services__service {
    padding: 4rem 1.5rem;
  }

  .service__container-img {
    max-width: 6rem;
  }

  .projects__all {
    gap: 3rem;
  }

  .layout__stats,
  .layout__clients {
    padding: 10rem 7rem;
  }

  .clients__title,
  .clients__description {
    width: 70%;
  }

  .layout__news {
    padding: 10rem 0;
  }

  .news__list {
    flex-direction: column;
  }

  .news__new:last-child {
    border-left: none;
    padding-left: 0;
  }

  .layout__contact {
    padding-top: 14rem;
    padding-bottom: 7rem;
  }
}

@media (max-width: 1024px) {
  .project-shapes--shape3 {
    top: 36%;
    left: 7%;
    animation: rodeo 25s infinite linear;
  }
  @keyframes rodeo {
    0% {
      transform: translate(0);
    }
    20% {
      transform: translateY(-260px);
    }
    40% {
      transform: translateX(340px) translateY(-260px);
    }
    60% {
      transform: translateY(130px) translateX(340px);
    }
    80% {
      transform: translateX(0px) translateY(130px);
    }
    100% {
      transform: translate(0);
    }
  }

  
}

@media (max-width: 1000px) {
  .layout {
    min-width: auto;
  }

  .navbar_nav {
    display: none;
  }

  .navbar__mobile-btn {
    display: block;    
  }

  .layout__banner {
    min-height: 100%;
    margin: 0 3rem;
  }

  .banner__content {
    width: 65%;
  }

  .banner__title {
    font-size: 5rem;
  }

  .banner__btn {
    padding: 2rem 3.5rem;
  }

  .shapes__item {
    width: 50%;
  }

  .shapes__item--shape7 {
    top: 0;
    right: 4rem;
    z-index: 1;
    animation: showTop 1s forwards; /* Utiliza 'forwards' para mantener el estado final de la animación */
  }

  @keyframes runLateral {
    0% {
      transform: translateX(0);
    }
    50% {
      transform: translateX(-140%);
    }
    100% {
      transform: translateX(0);
    }
  }

  .clients__container,
  .reviews__grid,
  .news__container,
  .footer__container {
    max-width: 72rem;
  }

  .layout__services {
    padding-bottom: 4rem;
  }

  .services__subtitle,
  .projects__subtitle,
  .stats__subtitle,
  .reviews__subtitle,
  .clients__subtitle,
  .news__subtitle,
  .contact__subtitle {
    font-size: 1.8rem;
  }

  .services__title,
  .projects__title,
  .stats__title,
  .reviews__title,
  .news__title,
  .contact__title {
    font-size: 5rem;
  }

  .services__list {
    flex-direction: column;
  }

  .services__service {
    width: 95%;
    margin-bottom: 1rem;
    padding: 4rem 2.5rem;
    margin-top: 1rem;
  }

  .service-shapes--shape2 {
    display: none;
  }

  .layout__projects {
    padding: 8rem 4rem;
  }

  .project-shapes--shape2 {
    display: none;
  }

  .layout__stats,
  .layout__clients {
    padding: 8rem 5rem;
  }

  .stats__description,
  .clients__description {
    font-size: 1.7rem;
    width: 100%;
  }

  .stats__progress {
    flex-wrap: wrap;
  }

  .stats__stat {
    width: calc(50% - 1.5rem);
  }

  .layout__reviews {
    padding-top: 8rem;
    padding-bottom: 5rem;
    margin: 3rem;
  }

  .reviews__description,
  .news__description {
    margin: 3rem 0;
    width: 100%;
    font-size: 1.7rem;
  }

  .reviews__container {
    flex-direction: column;
  }
  .reviews__review {
    background-color: var(--color-borders);
    border-radius: 20px;
    padding: 2rem 4rem;
  }
  .clients__title {
    width: 100%;
    font-size: 5rem;
  }

  .clients__logos {
    flex-wrap: wrap;
  }

  .clients__item {
    width: calc(50% - 3rem);
  }

  .layout__news {
    padding: 6rem 0;
  }

  .layout__contact {
    padding-top: 6rem;
    padding-bottom: 4rem;
  }

  .layout__contact::before {
    height: 60rem;
  }

  .contact__title {
    width: 100%;
  }

  .contact__btn {
    padding: 1.8rem 3.5rem;
  }

  .contact__thumb-chat {
    margin-right: -13rem;
    margin-bottom: -0.8rem;
    width: 70%;
  }

  .contact__img {
    width: 100%;
  }

  .contact__thumb-laptop {
    bottom: 0;
    left: 0;
  }

  .contact__thumb-movile {
    bottom: 0;
    right: -8rem;
  }

  .contact__img {
    width: 70%;
  }

  .social__icon {
    font-size: 2rem;
  }

  .footer__main {
    flex-direction: column;
  }

  .footer__fleft {
    width: 100%;
  }

  .fleft__container {
    border: none;
  }

  .footer__fright {
    width: 100%;
  }

  .footer_bottom {
    flex-direction: column;
  }

  .footer__copyright {
    flex-basis: auto;
    text-align: center;
    display: block;
    margin-bottom: 1rem;
  }

  .footer__links {
    flex-basis: auto;
    text-align: center;
  }

  .footer__flinks {
    justify-content: center;
  }
}

@media (max-width: 768px) {
  .layout__banner {
    padding: 8rem 3rem;
  }

  .banner__title {
    font-size: 4rem;
  }

  .layout__services {
    margin: 7rem 7rem;
  }

  .clients__container,
  .reviews__grid,
  .news__container,
  .footer__container {
    max-width: 54rem;
  }

  .services__subtitle,
  .projects__subtitle,
  .stats__subtitle,
  .reviews__subtitle,
  .clients__subtitle,
  .news__subtitle,
  .contact__subtitle {
    font-size: 1.6rem;
  }

  .services__title,
  .projects__title,
  .stats__title,
  .reviews__title,
  .news__title,
  .contact__title {
    font-size: 5rem;
  }

  .layout__projects {
    padding: 6rem 5rem;
  }

  .projects__all {
    flex-direction: column;
  }

  .projects__project {
    width: 100%;
  }

  .layout__stats,
  .layout__clients {
    padding: 6rem 3rem;
  }

  .stat__count {
    font-size: 4.4rem;
  }

  .layout__reviews {
    padding-top: 6rem;
    padding-bottom: 3rem;
  }

  .reviews__review {
    padding-top: 2rem;
    padding-bottom: 3rem;
  }

  .layout__news {
    padding: 6rem 0;
  }

  .news__new {
    display: flex;
    flex-direction: column;
  }

  .new__container-img {
    width: 100%;
  }

  .new__img {
    width: 100%;
  }

  .new__title {
    font-size: 2rem;
  }

  .layout__contact {
    padding-top: 6rem;
    padding-bottom: 4rem;
  }

  .layout__contact::before {
    height: 46rem;
  }

  .contact__thumb-chat {
    margin-right: -40rem;
    margin-bottom: -0.8rem;
    width: 70%;
  }

  .contact__thumb-laptop {
    bottom: 0;
    left: 12rem;
  }

  .contact__thumb-movile {
    bottom: 0;
    right: -8rem;
  }

  .contact__img {
    width: 35%;
  }

  .fleft__container {
    padding-right: 0;
    margin-right: 0;
  }

  .project-shapes--shape3 {
    top: 19%;
    left: 3%;
    animation: rodeo 25s infinite linear;
  }
  @keyframes rodeo {
    0% {
      transform: translate(0);
    }
    20% {
      transform: translateY(-440px);
    }
    40% {
      transform: translateX(560px) translateY(-440px);
    }
    60% {
      transform: translateY(130px) translateX(560px);
    }
    80% {
      transform: translateX(0px) translateY(130px);
    }
    100% {
      transform: translate(0);
    }
  }
}

@media (max-width: 640px) {
    
    .layout__projects,
  .stats__container,
  .contact__container,
  .clients__container,
  .reviews__grid,
  .news__container,
  .footer__container {
    padding-left: 3rem;
    padding-right: 3rem;
  }

  .layout__services {
    margin-left: 3rem;
    margin-right: 1rem;
  }

  .news__new {
    margin-right: 3rem;
  }

  .contact__thumb-chat {
    margin-right: -43rem;
    width: 140%;
}

  .contact__thumb-laptop {
    bottom: 0;
    left: 0rem;
  }

  .contact__thumb-movile {
    bottom: 0;
    right: -21rem;
  }

  .contact__img {
    width: 35%;
  }
  
  .footer__widget--50 {
      flex-basis: auto;
    }
    
    .footer__fright {
        display: flex;
        flex-direction: row;
        flex-basis: 100%;
        gap: 4rem;
  }
}