/* =========================================
   INNER HERO
========================================= */

.inner-hero {

  position: relative;

  padding: 220px 0 120px;

  background:
    linear-gradient(
      rgba(8,20,38,0.82),
      rgba(8,20,38,0.88)
    ),
    url('../images/hero/scbanner2.png');

  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;

  overflow: hidden;

}

.inner-hero-content {

  max-width: 850px;

  color: #fff;

}

.inner-tag {

  display: inline-block;

  padding: 10px 18px;

  border-radius: 50px;

  background: rgba(255,255,255,0.08);

  border: 1px solid rgba(255,255,255,0.08);

  backdrop-filter: blur(10px);

  font-size: 13px;

  margin-bottom: 25px;

  letter-spacing: 1px;

}

.inner-hero h1 {

  font-size: 68px;

  line-height: 1.08;

  margin-bottom: 22px;

}

.inner-hero p {

  max-width: 650px;

  color: rgba(255,255,255,0.75);

  font-size: 17px;

}



/* =========================================
   ABOUT PAGE
========================================= */

.about-page-grid {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 70px;

  align-items: center;

}

.about-page-image {

 
  height: 560px;

  border-radius: 30px;

  overflow: hidden;



}

.about-page-image img {

  width: 100%;
  height: 100%;

  object-fit: cover;

}

.about-page-content h2 {

  font-size: 52px;

  line-height: 1.1;

  margin: 20px 0 28px;

}

.about-page-content p {

  margin-bottom: 20px;

  color: #5f6b7a;

  line-height: 1.9;

}

.about-highlights {

  margin-top: 35px;

  display: flex;

  flex-direction: column;

  gap: 18px;

}

.highlight-item {

  display: flex;

  align-items: center;

  gap: 14px;

}

.highlight-item i {

  color: #c62828;

}

/* =========================================
   ABOUT IMPROVEMENTS
========================================= */

.about-page-content {

  max-width: 620px;

}

.about-intro {

  font-size: 17px;

  line-height: 1.9;

  color: #5f6b7a;

}

.about-divider {

  width: 80px;
  height: 3px;

  background: #c62828;

  margin: 30px 0;

  border-radius: 10px;

}

.about-highlights {

  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 18px;

  margin-top: 10px;

}

.highlight-item {

  background: #fff;

  padding: 18px 20px;

  border-radius: 14px;

  border: 1px solid rgba(0,0,0,0.06);

  transition: 0.3s ease;

}

.highlight-item:hover {

  transform: translateY(-4px);

  box-shadow: 0 10px 25px rgba(0,0,0,0.08);

}

.highlight-item i {

  color: #c62828;

  margin-right: 10px;

}

.about-stats-row {

  display: flex;

  gap: 35px;

  margin-top: 40px;

  padding-top: 30px;

  border-top: 1px solid rgba(0,0,0,0.08);

}

.about-stat h3 {

  font-size: 38px;

  color: #0f2e57;

  margin-bottom: 6px;

  font-family: 'Playfair Display', serif;

}

.about-stat span {

  color: #666;

  font-size: 14px;

}



/* =========================================
   VISION & MISSION
========================================= */

.vision-mission{

  background:#f8fafc;

}

.vision-grid{

  display:grid;

  grid-template-columns:repeat(2,1fr);

  gap:30px;

  margin-top:60px;

}

.vision-card{

  background:#fff;

  padding:50px;

  border-radius:24px;

  transition:.4s ease;

  border:1px solid rgba(0,0,0,.05);

  box-shadow:
  0 10px 35px rgba(0,0,0,.05);

}

.vision-card:hover{

  transform:translateY(-8px);

}

.vision-icon{

  width:70px;
  height:70px;

  border-radius:18px;

  display:flex;
  align-items:center;
  justify-content:center;

  background:#0f2e57;

  color:#fff;

  font-size:28px;

  margin-bottom:25px;

}

.vision-card h3{

  font-size:30px;

  margin-bottom:18px;

}

.vision-card p{

  color:#5f6b7a;

  line-height:1.9;

}


/* =========================================
   WHY MAXLAW
========================================= */

.why-grid{

  display:grid;

  grid-template-columns:repeat(4,1fr);

  gap:25px;

  margin-top:60px;

}

.why-box{

  background:#fff;

  padding:40px 30px;

  border-radius:22px;

  text-align:center;

  border:1px solid rgba(0,0,0,.05);

  transition:.4s ease;

}

.why-box:hover{

  transform:translateY(-8px);

  box-shadow:
  0 15px 40px rgba(0,0,0,.08);

}

.why-box i{

  font-size:42px;

  color:#c62828;

  margin-bottom:22px;

}

.why-box h3{

  font-size:22px;

  margin-bottom:15px;

}

.why-box p{

  color:#5f6b7a;

  line-height:1.8;

}

@media(max-width:991px){

  .vision-grid{

    grid-template-columns:1fr;

  }

  .why-grid{

    grid-template-columns:repeat(2,1fr);

  }

}

@media(max-width:767px){

  .why-grid{

    grid-template-columns:1fr;

  }

  .vision-card{

    padding:35px;

  }

}

@media (max-width: 991px) {

  .about-page-grid {

    grid-template-columns: 1fr;

  }

  .about-page-image {

    height: 520px;

  }

  .inner-hero h1 {

    font-size: 52px;

  }

}

@media (max-width: 767px) {

  .inner-hero {

    padding: 170px 0 90px;

  }

  .inner-hero h1 {

    font-size: 40px;

  }

  .about-page-content h2 {

    font-size: 38px;

  }

}