@media only screen and (max-width: 450px) {
   .contact-icons {
      display: flex;
      flex-direction: column;
      align-items: center;
   }
}

@media only screen and (max-width: 600px) {
   .try-section,
   .newsletter {
      flex-direction: column;
   }

   .try-texts,
   .newsletter-form {
      text-align: center;
   }

   .newsletter-image,
   .newsletter-form,
   .pricing-texts {
      width: 100%;
   }

   .footer-text {
      column-count: 1;
   }
}

@media only screen and (max-width: 768px) {
   .nav li {
      margin-left: 2rem;
   }

   .nav {
      display: none;
   }

   .navbar svg {
      display: unset;
   }

   .heading-primary {
      font-size: 5rem;
      font-weight: 600;
      line-height: 1.1;
   }
   .intro-text {
      font-size: 1.8rem;
   }

   .heading-secondary {
      font-size: 3.5rem;
      color: var(--color-text-light);
   }

   .intro {
      width: 90%;
   }
   .features-texts {
      width: 100%;
   }

   .feature-boxes {
      width: 100%;
      flex-direction: column;
      align-items: center;
   }

   .feature {
      width: 50%;
   }

   .newsletter-form input {
      width: 100%;
      margin-bottom: 1rem;
   }

   .newsletter-btn {
      display: block;
      width: 100%;
   }

   .pricing-cards {
      display: flex;
      flex-direction: column;
      gap: 3rem;
   }

   .contatct-content {
      display: flex;
      flex-direction: column;
   }
}

@media only screen and (max-width: 992px) {
   html {
      font-size: 55%;
   }

   .newsletter-form input {
      width: 100%;
      margin-bottom: 1rem;
   }

   .newsletter-btn {
      display: block;
      width: 100%;
   }
}