/**************************/
/* BELOW 1600px (Ultra Wide Screens) */
/**************************/

@media (max-width: 100em) {
  .about-us-description {
    font-size: 1.6rem;
    line-height: 1.5;
  }

  .e-catalog-description {
    font-size: 1.6rem;
  }
}

/**************************/
/* BELOW 1408px (Large desktops) */
/**************************/

@media (max-width: 88em) {
  .about-us-description {
    font-size: 1.6rem;
    line-height: 1.5;
  }

  .e-catalog-description {
    font-size: 1.6rem;
  }
}

/**************************/
/* BELOW 1200px (laptops & Desktops) */
/**************************/

@media (max-width: 75em) {
  .text-banner-content {
    font-size: 1.7rem;
  }

  .intro-logo {
    width: 30%;
  }
}

/**************************/
/* BELOW 992px (laptops & Desktops) */
/**************************/

@media (max-width: 62em) {
  .text-banner-content {
    font-size: 1.6rem;
  }

  .responsive-nav-item {
    display: none;
  }

  .responsive-lang-item {
    display: block;
  }

  .btn-mobile-nav {
    display: block;
    z-index: 9999999;
  }

  .second-nav-list {
    width: 100%;
    height: 100vh;
    display: none;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease-in;
  }

  .second-nav-list.nav-open {
    display: flex;
  }

  .second-nav-link,
  .second-nav-link:link,
  .second-nav-link:visited {
    font-size: 1.6rem;
  }

  .intro-logo {
    width: 35%;
  }
}

/**************************/
/* BELOW 768px (Larger phones & Small tablets) */
/**************************/

@media (max-width: 48em) {
  .heading-primary {
    font-size: 3rem;
  }

  .carousel {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2.4rem;
  }

  .carousel-btn {
    display: none;
  }

  .grid--2-cols {
    grid-template-columns: 1fr;
  }
  .grid--4-cols {
    grid-template-columns: 1fr;
  }

  .social-media {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1.8rem;
  }

  .lang-popup {
    padding: 3rem 4rem;
  }

  .intro-logo {
    width: 45%;
  }
}

/**************************/
/* BELOW 576px (Mobile devices) */
/**************************/

@media (max-width: 36em) {
  .heading-primary {
    font-size: 2.4rem;
  }

  .lang-popup {
    padding: 1rem;
  }

  .intro-logo {
    width: 50%;
  }
}