/* GLOBAL */
body{
  font-family: 'Poppins', sans-serif;
  font-size:18px;
  line-height:1.6;
  margin:0;
  padding: 0;
  padding-top:70px; /* 🔥 இன்னும் reduce */
  color:#333;
}

/* HEADINGS */
h1{
  font-size:clamp(28px, 4vw, 48px);
  font-weight:500;
}

h2{
  font-size:clamp(22px, 3vw, 32px);
  font-weight:600;
}

p{
  font-size:18px;
}

/* LOGO */
.logo{
  width:44px;   /* 🔥 small adjust */
  height:auto;
}

/* NAVBAR (UPDATED SMALL) */
.navbar{
  width:78%;              /* 🔥 reduce */
  margin:5px auto;        /* 🔥 reduce gap */
  border-radius:8px;
  padding:2px 8px;        /* 🔥 reduce height */
  background:#fff;
  box-shadow:0 3px 8px rgba(0,0,0,0.06);
}

/* NAVBAR FONT */
.nav-link{
  font-size:11.5px;       /* 🔥 small */
  font-weight:500;
  color:#1a1a1a;
  padding:2px 5px;        /* 🔥 tight */
}

.nav-link:hover{
  color:#040267;
}

/* HERO */
.hero{
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:120px 20px 60px;
  color:#fff;
  background:url("images/f88156f31156b06f29a77cd1845b8b6f6a5e2876 (1).png") center/cover no-repeat;
  position:relative;
}

.hero::after{
  content:"";
  position:absolute;
  inset:0;
  background:rgba(0,0,0,0.6);
}

.hero-content{
  position:relative;
  z-index:2;
}

/* CARD */
.card-hover{
  transition:0.3s;
  border:none;
  box-shadow:0 4px 15px rgba(0,0,0,0.08);
}

.card-hover:hover{
  transform:translateY(-5px);
}

/* BENEFITS */
.benefit-card{
  background:#040267;
  color:#fff;
  border-radius:12px;
  padding:25px;
  text-align:center;
  height:100%;
}

.benefit-img{
  width:100%;
  max-width:180px;
  margin-bottom:15px;
}

/* CHAPTER */
.chapter-card{
  width:100%;
}

.chapter-img{
  width:100%;
  height:200px;
  object-fit:cover;
}

/* LOCATION */
.location-box{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:14px;
  color:#555;
}

/* VIDEO */
.video-box{
  width:100%;
  max-width:450px;
  height:280px;
  background:#000;
  border-radius:12px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.play-btn{
  font-size:50px;
  color:#fff;
}

/* FOOTER */
footer{
  background:#0b1320;
  color:#fff;
  padding:40px 0;
  text-align:center;
}

footer a{
  color:#aaa;
  text-decoration:none;
  display:block;
  margin-bottom:5px;
}

/* MOBILE */
@media(max-width:768px){

  body{
    font-size:16px;
  }

  .navbar{
    width:95%;
    border-radius:8px;
    padding:2px 6px;   /* 🔥 mobile small */
  }

  .hero{
    padding:100px 15px 40px;
  }

  .video-box{
    height:220px;
  }

}