*{margin:0;padding:0;box-sizing:border-box;font-family:'Poppins',sans-serif;}

.academics-page{
  width:92%;
  max-width:1200px;
  margin:0 auto;
  padding-bottom:40px;
}

/* HERO SECTION */
.hero {
  position: relative;
  width: 100%;
  height: 80vh;
  overflow: hidden;
  margin: 0;
  padding: 0;
}

/* Video Background */
.hero-video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Dark Overlay */
.hero-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.45);
}

/* Text Content */
.hero-content {
  position: relative;
  z-index: 2;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  color: white;
  text-align: center;
  padding: 0 20px;
}

.hero-content h1 {
  font-size: 48px;
  font-weight: 700;
}

.hero-content p {
  font-size: 20px;
  margin-top: 10px;
}

/* Mobile */
@media (max-width: 768px) {
  .hero {
    height: 50vh;
  }

  .hero-content h1 {
    font-size: 28px;
  }

  .hero-content p {
    font-size: 15px;
  }
}

/* Block Sections */
.block{margin:22px 0;}
.block h2{color:#4a63d4;font-size:20px;margin-bottom:6px;text-align:left;}
.tag{font-size:13px;color:#777;margin-bottom:12px;}

/* Pre-primary cards */
.levels{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
}
.level-card{
  background:#fff7d6;
  padding:14px;
  border-radius:14px;
  flex:1 1 260px;
  min-width:240px;
  box-shadow:0 4px 12px rgba(0,0,0,0.06);
}
.level-card h3{color:#d35400;margin-bottom:6px;font-size:16px;}
.level-card p{font-size:13px;color:#555;margin-bottom:8px;}
.level-card ul{list-style:none;font-size:13px;color:#444;}
.level-card li{margin:4px 0;}

/* Grades */
.grade-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:12px;
}
.grade-card{
  background:#e6f3ff;
  padding:14px;
  border-radius:14px;
  text-align:center;
  box-shadow:0 4px 12px rgba(0,0,0,0.05);
}
.grade-card h3{color:#006bb3;font-size:15px;margin-bottom:6px;}
.grade-card p{font-size:13px;color:#555;}

/* Skills */
.skills{text-align:center;margin:26px 0;}
.skills h2{color:#5b1aa0;font-size:20px;margin-bottom:12px;}
.skill-row{
  display:flex;gap:8px;flex-wrap:wrap;justify-content:center;
}
.skill{
  background:#f3e8ff;
  padding:8px 14px;
  border-radius:20px;
  font-size:13px;
  color:#7a2abf;
}

/* Activities */
.activities{
  list-style:disc;
  padding-left:22px;
  font-size:14px;
  color:#444;
  line-height:1.6;
}

/* Responsive */
@media(max-width:600px){
  .hero h1{font-size:22px;}
  .level-card, .grade-card{min-width:100%;}
}