.infrastructure{
  width:100%;
  padding:100px 0;
  background:#ffffff;
  position:relative;
  overflow:hidden;
}

.infrastructure-inner{
  width:100%;
  max-width:80%;
  margin:0 auto;
}

/* ===============================
   TOPO
================================ */

.infrastructure-top{
  max-width:820px; /* 🔥 AJUSTE PARA 2 LINHAS */
  margin-bottom:50px;
}

.infrastructure-top span{
  color:#0d6efd;
  font-weight:700;
  letter-spacing:2px;
  display:block;
  margin-bottom:14px;
}

.infrastructure-top h2{
  font-size:44px;
  font-weight:900;
  color:#252525;
  margin-bottom:20px;
  line-height:1.15; /* melhora leitura em 2 linhas */
}

.infrastructure-top p{
  font-size:17px;
  color:#555;
  line-height:1.6;
}

/* ===============================
   GRID
================================ */

.infrastructure-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:30px;
}

/* ===============================
   CARD
================================ */

.infra-card{
  background:#fff;
  border:1px solid #e5e7eb;
  border-radius:18px;
  padding:40px 36px;
  transition:
    transform .35s ease,
    box-shadow .35s ease,
    border-color .35s ease;

  opacity:0;
  transform:translateY(40px);
}

.infra-card.show{
  opacity:1;
  transform:translateY(0);
}

.infra-card:hover{
  border-color:#0d6efd;
  transform:translateY(-8px);
  box-shadow:0 20px 50px rgba(0,0,0,.08);
}

/* ÍCONE */
.infra-card i{
  font-size:30px;
  color:#0d6efd;
  margin-bottom:22px;
}

/* TEXTO */
.infra-card h3{
  font-size:19px;
  font-weight:800;
  margin-bottom:14px;
  color:#252525;
}

.infra-card p{
  font-size:14px;
  color:#666;
  line-height:1.7;
}

/* ===============================
   MOBILE
================================ */

@media(max-width:900px){
  .infrastructure-grid{
    grid-template-columns:1fr;
  }

  .infrastructure-top h2{
    font-size:34px;
  }
}