/* ====== Page Hero (Sobre Nós) ====== */
.page-hero{
  background: radial-gradient(80% 120% at 50% 0%, rgba(37,99,235,.16), transparent 55%),
              linear-gradient(180deg, #1a2334, #202a3f);
  color:#eaf1ff;
  padding: 70px 0 40px;
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.page-hero__inner{ text-align:center; max-width:920px }
.page-hero__title{
  margin:0 0 8px 0;
  font: 800 clamp(1.8rem, 1.2rem + 2.2vw, 2.6rem) Manrope, Inter, system-ui, sans-serif;
}
.page-hero__lead{ color:#c6d3eb; margin:0 }

/* ====== Prose (texto central mais confortável) ====== */
.prose{
  max-width: 900px;
  text-align: left;
  color:#475569;
  display: grid;
  gap: 12px;
}

/* ====== Values (cards suaves) ====== */
.values{
  margin-top: 18px;
  display:grid; gap: 18px;
  grid-template-columns: repeat(4, 1fr);
}
.card-soft{
  background:#ffffff;
  border:1px solid #e6e9f0;
  border-radius: 16px;
  padding: 18px;
  text-align: left;
  box-shadow: 0 8px 18px rgba(15,23,42,.05);
}
.card-soft__icon{
  width:42px; height:42px; border-radius:12px;
  display:grid; place-items:center; margin-bottom:10px;
  background:#eef4ff; color:#1d4ed8; font-size:20px; font-weight:700;
}
.card-soft__title{ 
  color: #000;
  margin:.2rem 0 .2rem; 
  font-weight:800;
}
.card-soft__text{ color:#55657b; margin:0 }

/* ====== Stats ====== */
.stats{
  display:grid; gap: 16px; margin-top: 14px;
  grid-template-columns: repeat(4, 1fr);
}
.stat{
  background:#fff; border:1px solid #e6e9f0;
  border-radius: 16px; padding: 18px; text-align:center;
  box-shadow: 0 8px 18px rgba(15,23,42,.05);
}
.stat__num{
  font: 800 1.8rem Manrope, Inter, system-ui, sans-serif;
  color:#0b1220;
}
.stat__label{ color:#64748b }

/* ====== Steps (processo) ====== */
.steps{
  list-style: none; padding:0; margin: 16px auto 0;
  display:grid; gap:18px; max-width: 980px;
  grid-template-columns: repeat(4, 1fr);
}
.steps li{
  background:#ffffff; border:1px solid #e6e9f0; border-radius:16px;
  padding:16px; text-align:left; box-shadow: 0 8px 18px rgba(15,23,42,.05);
}
.steps h4{ margin:.2rem 0 .3rem; font-weight:800; color:#0b1220 }
.steps p{ margin:0; color:#55657b }

/* Responsive */
@media (max-width: 1024px){
  .values{ grid-template-columns: 1fr 1fr }
  .stats{ grid-template-columns: 1fr 1fr }
  .steps{ grid-template-columns: 1fr 1fr }
}
@media (max-width: 640px){
  .values, .stats, .steps{ grid-template-columns: 1fr }

}