/* ==========================================================
   POR QUE CIVITAS (#por-que, página inicial): urbs e civitas
   ========================================================== */
.por-que-grade { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); grid-template-areas: "rotulo rotulo" "titulo texto"; gap: var(--espaco-4) clamp(32px, 6vw, 96px); align-items: start; }
.por-que .rotulo { grid-area: rotulo; }
.por-que h2 { grid-area: titulo; }
.por-que .destaque { grid-area: texto; max-width: 44ch; }
@media (max-width: 900px) {
  .por-que-grade { grid-template-columns: minmax(0, 1fr); grid-template-areas: "rotulo" "titulo" "texto"; }
}