
/* ================= CARD ================= */
.about-main-card{
  background:#fff;
  border-radius:20px;
  padding:50px;
  box-shadow:0 15px 40px rgba(0,0,0,0.08);
}

/* ================= TITLE ================= */
.about-block{
  margin-bottom:50px;
  position:relative;
}

.about-block:last-child{
  margin-bottom:0;
}

.about-block h1{
  color:var(--primary-blue);
  font-size:34px;
  font-weight:800;
  margin-bottom:25px;
  position:relative;
  padding-bottom:12px;
  text-transform:uppercase;
}

.about-block h1::after{
  content:"";
  position:absolute;
  left:0;
  bottom:0;
  width:80px;
  height:4px;
  background:var(--accent-red);
  border-radius:10px;
}

/* ================= TEXT ================= */
.about-block p{
  color:#444;
  line-height:1.9;
  font-size:16px;
  margin-bottom:18px;
  text-align:justify;
}

/* ================= SPECIAL BOX ================= */
.highlight-box{
  background:linear-gradient(135deg,#263489,#3346b3);
  padding:35px;
  border-radius:18px;
  margin:30px 0;
  color:#fff;
  position:relative;
  overflow:hidden;
}

.highlight-box::before{
  content:"";
  position:absolute;
  top:-40px;
  right:-40px;
  width:150px;
  height:150px;
  background:rgba(255,255,255,0.08);
  border-radius:50%;
}

.highlight-box p{
  color:#fff;
  margin-bottom:0;
}

/* ================= TWO COLUMN ================= */
.about-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:30px;
}

.info-box{
  background:#fff;
  border-left:5px solid var(--accent-red);
  padding:25px;
  border-radius:15px;
  box-shadow:0 8px 25px rgba(0,0,0,0.05);
  transition:0.3s ease;
}

.info-box:hover{
  transform:translateY(-5px);
}

.info-box h3{
  color:var(--primary-blue);
  font-weight:700;
  margin-bottom:15px;
}

.info-box p{
  margin-bottom:0;
}

/* ================= RESPONSIVE ================= */
@media(max-width:992px){

  .about-main-card{
    padding:35px;
  }

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

}

@media(max-width:768px){

  .about-main-card{
    padding:25px;
  }

  .about-block h1{
    font-size:26px;
  }

  .about-block p{
    font-size:15px;
    line-height:1.8;
  }

}