*{margin:0;padding:0;box-sizing:border-box}
body{font-family:Montserrat,sans-serif;color:#222}

.container{width:90%;max-width:1200px;margin:auto}

/* HEADER */
.header{
  position:fixed;
  top:0;width:100%;
  background:#fff;
  box-shadow:0 2px 10px rgba(0,0,0,.08);
  z-index:1000;
}
.header-wrap{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:18px 0;
}
.logo{font-weight:700;color:#0b4da2}
.nav a{margin-left:25px;text-decoration:none;color:#222;font-weight:500}

.btn-primary{
  background:#0b4da2;
  color:#fff;
  padding:10px 22px;
  border-radius:4px;
}

/* HERO */
.hero{margin-top:80px}
.hero-slide{
  height:88vh;
  background-size:cover;
  background-position:center;
  position:relative;
}
.hero-overlay{
  position:absolute;inset:0;
  background:rgba(0,0,0,.6);
}
.hero-content{
  position:absolute;inset:0;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  color:#fff;
  text-align:center;
}
.hero-content h1{font-size:46px;margin-bottom:10px}

/* STATS */
.stats{
  background:#0b4da2;
  color:#fff;
  padding:50px 0;
}
.stats-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  text-align:center;
}
.stat h3{font-size:34px}

/* SECTIONS */
.section{padding:90px 0}
.section.light{background:#f5f7fa}
.center{text-align:center}

/* ABOUT */
.about-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:50px;
}
.about-image{
  background:#ddd;
  height:300px;
}

/* ONLINE */
.online-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:50px;
}
.online-image{
  background:#ccc;
  height:320px;
}

/* PROGRAMS */
.programs-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:30px;
}
.program-card{
  background:#fff;
  padding:30px;
  box-shadow:0 10px 30px rgba(0,0,0,.08);
  border-radius:8px;
}

/* TESTIMONY */
.testimony-card{
  background:#fff;
  padding:30px;
  border-left:4px solid #0b4da2;
}

/* FOOTER */
.footer{
  background:#0b4da2;
  color:#fff;
  padding:50px 0;
}
.footer-grid{
  display:grid;
  grid-template-columns:2fr 1fr;
}

@media(max-width:768px){
  .about-grid,.online-grid,.programs-grid,.stats-grid,.footer-grid{
    grid-template-columns:1fr
  }
  .hero-content h1{font-size:30px}
}