.page-banner{
  background:
  linear-gradient(135deg, rgba(15,23,42,0.85), rgba(108,59,255,0.85)),
  url('/images/about.jpg');
  background-size:cover;
  background-position:center;
  padding:160px 0 90px;
  text-align:center;
  color:#fff;
}

.page-banner h1{
  font-size:54px;
}

.page-banner p{
  margin-top:15px;
  color:#e2e8f0;
}

/* GRID */

.about-page-grid{
  display:grid;
  grid-template-columns:1.2fr 1fr;
  gap:60px;
  align-items:center;
}

/* VISION */

.vision{
  background:#f8fafc;
}

.vision-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
  gap:30px;
}

.vision-card{
  background:#fff;
  padding:40px;
  border-radius:25px;
  box-shadow:0 10px 30px rgba(0,0,0,0.05);
  transition:0.4s;
}

.vision-card:hover{
  transform:translateY(-10px);
  box-shadow:0 20px 50px rgba(108,59,255,0.15);
}

.vision-card h3{
  margin-bottom:15px;
  color:#6C3BFF;
}

/* RESPONSIVE */

@media(max-width:768px){

.about-page-grid{
  grid-template-columns:1fr;
}

.page-banner h1{
  font-size:34px;
}

}