body {
  background-color: #AF714A;
  margin: 0;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}

.wrapper {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
}

.container-sobre {
  flex: 1;
  display: flex;
  justify-content: space-between;
  padding: 20px;
  gap: 20px;
}

.lado-direito {
  width: 70%;
  text-align: justify;
  font-size: 16px;
  line-height: 1.6;
}

.lado-esquerdo {
  width: 25%;
  text-align: center;
  background-color: #AF714A;
}

.titulo-sobre {
  background-color: #7b3f1f;
  padding: 10px;
  font-size: 24px;
  text-transform: uppercase;
  margin-bottom: 20px;
  color: black;
}

.logo-sobre {
  width: 150px;
  height: auto;
  margin-top: 20px;
}

footer {
  background-color: #5a3a25;
  color: white;
  padding: 20px;
  text-align: center;
}

/* ------------------ */
/* RESPONSIVIDADE */
/* ------------------ */

/* Tablets */
@media (max-width: 1024px) {
  .container-sobre {
    flex-direction: column; /* colunas empilham */
  }

  .lado-direito,
  .lado-esquerdo {
    width: 100%; /* ocupam toda a largura */
  }

  .titulo-sobre {
    font-size: 22px;
  }

  .lado-direito {
    font-size: 15px;
  }
}

/* Celulares */
@media (max-width: 768px) {
  .container-sobre {
    padding: 15px;
  }

  .titulo-sobre {
    font-size: 20px;
  }

  .lado-direito {
    font-size: 14px;
  }

  .logo-sobre {
    width: 120px;
    margin-top: 15px;
  }
}

/* Smartphones pequenos */
@media (max-width: 480px) {
  .titulo-sobre {
    font-size: 18px;
  }

  .lado-direito {
    font-size: 13px;
    line-height: 1.4;
  }

  .logo-sobre {
    width: 100px;
  }
}