@media (max-width: 1024px) {
   .flags-title h2 {
      text-align: center;
   }

   .flags {
      flex-direction: column;
      text-align: center;
   }

   .flags img {
      width: 420px;
   }

   .flags .container-flags .flag-country {
      grid-template-columns: 1fr 1fr;
   }

   .benefits {
      flex-direction: column;
      gap: 1rem;
      padding: 0 1rem;
   }
}

@media (max-width: 450px) {
   header h1 {
      font-size: 1.5rem;
   }

   .logo img {
      width: 120px;
   }

   .logo .btn {
      font-size: 1.6rem;
      padding: 1rem;
   }

   .flags-title h2 {
      font-size: 2rem;
   }

   .flags {
      gap: 1rem;
   }

   .flags img {
      width: 60%;
      margin: auto;
   }

   .flags .container-flags .flag-country {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
   }

   .flags .container-flags .flag-country .flag-image img {
      width: 190px;
      height: 100px;
   }

   .benefits img {
      width: 100%;
   }

   .benefits h2 {
      font-size: 2.5rem;
      margin-top: 3rem;
   }

   .footer .footer-content p {
      font-size: 1.6rem;
   }

   .footer .footer-content a {
      font-size: 1.6rem;
   }
}