.hero{
  height: 300px;
}

.txt{
    padding: 5rem 15rem;
    display: flex;
    flex-direction: column;
    gap: 3rem;
    text-align: justify;
}
/* Responsive for phones and tablets */
/* Up to 900px width — same layout for phones and tablets */
@media (max-width: 900px) {
   .txt{
     padding: 3rem;
    font-size: 1rem;
   }
}

/* Tablet-specific styles: between 600px and 900px */
@media (min-width: 600px) and (max-width: 900px) {
   .txt{
    font-size: 1.4rem;
   }
}