@media all and (max-width: 30em) {
  h1 {
    font-size: 6.88rem;
  }

  h2 {
    font-size: 5.73rem;
  }

  .home-hero {
    .container {
      & .logo-bege {
        max-width: 40rem;
      }
    }
  }

  .aulas {
    & .container {
      & .sobre-aulas {
        flex-flow: column;
        text-align: center;

        & .video-aula {
          align-items: center;
          justify-content: center;

          & video {
            max-width: 100%;
          }
        }
      }
      & .investimento {
        & .cards {
          gap: 5rem;

          & .card {
            max-width: 45rem;
          }
        }
      }
    }
  }

  .contatos {
    .container {
      gap: 2rem;
      & .texto {
        margin-top: 2rem;
      }
      & .links-logo {
        & .contato {
          border-right: none;
          border-bottom: 2px solid rgba(0, 0, 0, 0.596);
          gap: 2rem;
        }
      }
    }
  }
}