#about{
  padding:78px 0;
}

#about .container{
  position:relative;
}

#about h2{
  margin:0 0 18px;
  text-align:center;
  font-size:clamp(24px,3vw,42px);
  line-height:1.1;
  font-weight:800;
  color:#fff;
}

#about .section-lead{
  max-width:920px;
  margin:0 auto 28px;
  text-align:center;
  font-size:clamp(14px,1.4vw,18px);
  line-height:1.6;
  color:rgba(255,255,255,.0);
}

#about .grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:20px;
}

#about .card{
  position:relative;
  padding:24px 22px;
  border-radius:20px;
  background:rgba(0,0,0,.42);
  border:1px solid rgba(255,255,255,.14);
  box-shadow:0 14px 30px rgba(0,0,0,.35);
 
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

#about .card:hover{
  transform:translateY(-4px);
  border-color:rgba(255,255,255,.26);
  box-shadow:0 18px 36px rgba(0,0,0,.45);
}

#about .card h3{
  margin:0 0 10px;
  font-size:22px;
  line-height:1.2;
  color:#fff;
}

#about .card p{
  margin:0;
  font-size:15px;
  line-height:1.7;
  color:rgba(255,255,255,.9);
}