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


body.dark {
background:#111;
color:#eee;
}

.navbar {
display:flex;
justify-content:space-between;
align-items:center;
padding:15px 8%;
position:sticky;
top:0;
background:rgba(255,255,255,0.1);
backdrop-filter:blur(10px);
z-index:1000;
}

.nav-links {
display:flex;
list-style:none;
}

.nav-links li {
margin:0 15px;
}

.nav-links a {
color:white;
text-decoration:none;
transition:0.3s;
}

.nav-links a:hover {
color:#ffd700;
}

.hamburger {
display:none;
flex-direction:column;
cursor:pointer;
}

.hamburger span {
height:3px;
width:25px;
background:white;
margin:4px;
transition:0.4s;
}

.hero {
height:100vh;
background:url('https://source.unsplash.com/1600x900/?school-building') no-repeat center/cover;
display:flex;
justify-content:center;
align-items:center;
text-align:center;
}

.hero-content {
background:rgba(0,0,0,0.5);
padding:40px;
border-radius:20px;
animation:fadeIn 2s;
}

.btn {
display:inline-block;
padding:10px 20px;
background:#ffd700;
color:#000;
border-radius:30px;
transition:0.3s;
text-decoration:none;
margin-top:10px;
}

.btn:hover {
transform:scale(1.1);
}

.section {
padding:80px 10%;
text-align:center;
}

.card-container,.about-grid {
display:flex;
flex-wrap:wrap;
justify-content:center;
gap:20px;
margin-top:30px;
}

.card {
background:rgba(255,255,255,0.15);
backdrop-filter:blur(10px);
padding:20px;
border-radius:20px;
transition:0.4s;
min-width:200px;
}

.card:hover {
transform:translateY(-10px);
}

.slider {
position:relative;
width:100%;
max-width:800px;
margin:auto;
overflow:hidden;
}

.slider img {
width:100%;
display:none;
border-radius:20px;
}

.slider img.active {
display:block;
animation:fadeIn 1s;
}

footer {
background:#000;
padding:20px;
text-align:center;
}

#scrollTopBtn {
position:fixed;
bottom:20px;
right:20px;
padding:10px;
border:none;
border-radius:50%;
display:none;
cursor:pointer;
}

@keyframes fadeIn {
from {opacity:0;}
to {opacity:1;}
}

/* Responsive */
@media(max-width:768px){
.nav-links {
position:absolute;
top:70px;
right:-100%;
flex-direction:column;
background:#333;
width:200px;
transition:0.4s;
}

.nav-links.active {
right:0;
}

.hamburger {
display:flex;
}
}
.logo img{
height:90px;
width:90px;
object-fit:cover;
border-radius:50%;
border:3px solid #5a4b6b;
box-shadow:0 6px 15px rgba(0,0,0,0.25);
transition:0.3s ease;
}
.navbar{
padding:10px 8%;
}
@media(max-width:768px){
.logo img{
height:50px;
width:50px;
}
}
.logo img{
box-shadow:0 0 15px rgba(90,75,107,0.6);
}
/* THEME TOGGLE */
.theme-toggle {
position:relative;
display:flex;
align-items:center;
}

.theme-toggle input {
display:none;
}

.toggle-label {
width:90px;
height:40px;
background:#e5d59c;   /* light mode color */
border-radius:50px;
position:relative;
cursor:pointer;
display:flex;
align-items:center;
justify-content:space-between;
padding:0 10px;
transition:0.4s;
font-size:14px;
font-weight:600;
color:#333;
}

.toggle-ball {
position:absolute;
width:32px;
height:32px;
background:#f4b400;
border-radius:50%;
left:4px;
top:4px;
transition:0.4s ease;
box-shadow:0 3px 8px rgba(0,0,0,0.3);
}

/* Dark Mode Style */
.theme-toggle input:checked + .toggle-label {
background:#0f2d3a;
color:#fff;
}

.theme-toggle input:checked + .toggle-label .toggle-ball {
transform:translateX(48px);
background:#1e88e5;
}
/* Notification Bar */
.notification-bar {
width:100%;
background:linear-gradient(90deg,#5a4b6b,#7a6899);
color:#fff;
overflow:hidden;
position:relative;
cursor:pointer;
transition:0.4s ease;
}

/* Hover Effect on Bar */
.notification-bar:hover {
background:linear-gradient(90deg,#7a6899,#5a4b6b);
box-shadow:0 5px 20px rgba(0,0,0,0.3);
transform:scale(1.01);
}

/* Scrolling Text */
.notification-content {
display:inline-block;
white-space:nowrap;
padding:10px 0;
animation:scrollText 18s linear infinite;
font-weight:500;
letter-spacing:1px;
transition:0.3s;
}

/* Pause Animation on Hover */
.notification-bar:hover .notification-content{
animation-play-state:paused;
color:#ffd700;
}

/* Scroll Animation */
@keyframes scrollText {
0% { transform:translateX(100%); }
100% { transform:translateX(-100%); }
}
.showcase{
height:90vh;
background:url('https://source.unsplash.com/1600x900/?school-building') center/cover no-repeat;
position:relative;
display:flex;
justify-content:center;
align-items:center;
text-align:center;
color:white;
}

.overlay{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.6);
}

.showcase-content{
position:relative;
z-index:2;
}

.showcase h1{
font-size:45px;
margin-bottom:15px;
}

.showcase-cards{
display:flex;
gap:20px;
justify-content:center;
margin-top:30px;
flex-wrap:wrap;
}

.info-card{
background:rgba(255,255,255,0.2);
padding:15px 25px;
border-radius:15px;
backdrop-filter:blur(10px);
transition:0.3s;
}

.info-card:hover{
transform:translateY(-8px);
background:rgba(255,255,255,0.4);
}
.showcase h1{
animation:slideDown 1s ease;
}

.showcase p{
animation:fadeIn 2s ease;
}

.info-card{
animation:floatUp 1s ease forwards;
opacity:0;
}

.info-card:nth-child(1){ animation-delay:0.5s; }
.info-card:nth-child(2){ animation-delay:0.8s; }
.info-card:nth-child(3){ animation-delay:1.1s; }

@keyframes slideDown{
from{transform:translateY(-50px); opacity:0;}
to{transform:translateY(0); opacity:1;}
}

@keyframes fadeIn{
from{opacity:0;}
to{opacity:1;}
}

@keyframes floatUp{
from{transform:translateY(40px); opacity:0;}
to{transform:translateY(0); opacity:1;}
}
.about-section{
position:relative;
padding:120px 8%;
color:#ffffff;
background:url('https://source.unsplash.com/1600x900/?school-building') center/cover no-repeat;
display:flex;
align-items:center;
}

/* Dark overlay for readability */
.about-section::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.65);   /* Adjust darkness here */
z-index:0;
}

.about-wrapper{
position:relative;
z-index:1;
display:flex;
align-items:center;
justify-content:space-between;
gap:70px;
flex-wrap:wrap;
}
.highlight-card{
background:rgba(255,255,255,0.12);
backdrop-filter:blur(12px);
padding:30px;
border-radius:20px;
flex:1;
min-width:260px;
transition:0.4s ease;
border:1px solid rgba(255,255,255,0.2);
color:white;
}

.highlight-card:hover{
transform:translateY(-12px);
background:rgba(255,255,255,0.2);
}

/* ===============================
   PRINCIPAL MESSAGE ANIMATION
================================= */

.principal-box{
margin-top:50px;
padding:45px;
border-left:6px solid #d0ccd0;
background:rgba(255,255,255,0.15);
backdrop-filter:blur(12px);
border-radius:20px;
box-shadow:0 20px 50px rgba(0,0,0,0.3);
opacity:0;
transform:translateY(60px);
animation:principalReveal 1.5s ease forwards;
animation-delay:0.5s;
transition:0.4s ease;
}

/* Hover Glow Effect */
.principal-box:hover{
transform:translateY(-8px) scale(1.02);
box-shadow:0 25px 60px rgba(0,0,0,0.4);
}

/* Title Animation */
.principal-box h3{
font-size:26px;
margin-bottom:20px;
position:relative;
animation:textSlide 1.2s ease forwards;
}

/* Paragraph Styling */
.principal-box p{
font-size:17px;
line-height:1.9;
margin-bottom:15px;
animation:fadeInText 2s ease forwards;
}

/* Main Box Animation */
@keyframes principalReveal{
to{
opacity:1;
transform:translateY(0);
}
}

/* Heading Slide Effect */
@keyframes textSlide{
from{
opacity:0;
transform:translateX(-30px);
}
to{
opacity:1;
transform:translateX(0);
}
}

/* Paragraph Fade Effect */
@keyframes fadeInText{
from{opacity:0;}
to{opacity:1;}
}


.about-container{
display:flex;
align-items:center;
gap:50px;
flex-wrap:wrap;
}

.about-image img{
width:100%;
max-width:500px;
border-radius:20px;
box-shadow:0 10px 30px rgba(0,0,0,0.2);
transition:0.4s;
}

.about-image img:hover{
transform:scale(1.05);
}

.about-content{
flex:1;
}

.about-content h2{
font-size:32px;
margin-bottom:20px;
}

.about-cards{
display:flex;
gap:20px;
margin:20px 0;
flex-wrap:wrap;
}

.about-card{
background:white;
padding:20px;
border-radius:15px;
box-shadow:0 5px 15px rgba(0,0,0,0.1);
transition:0.3s;
flex:1;
min-width:200px;
}

.about-card:hover{
transform:translateY(-8px);
}

.principal-message{
background:#5a4b6b;
color:white;
padding:20px;
border-radius:15px;
margin-top:20px;
}
@media(max-width:768px){
.about-container{
flex-direction:column;
text-align:center;
}
}
/* ===== RESET ===== */
*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family:'Poppins',sans-serif;
}

/* ===== TOP BAR ===== */
.top-bar{
    background:#f2f2f2;
    padding:10px 0;
}

.top-container{
    width:90%;
    margin:auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
}


.contact-info span{
    margin-left:25px;
    font-size:14px;
    color:#333;
}

/* ===== MENU BAR ===== */
.navbar{
    background:#b3b12a;
    padding:12px 0;
}

.nav-container{
    width:90%;
    margin:auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
}

.nav-links{
    list-style:none;
    display:flex;
    gap:30px;
}

.nav-links li a{
    text-decoration:none;
    color:white;
    font-weight:500;
    transition:0.3s;
}

.nav-links li a:hover{
    color:#ffd700;
}

.social-icons a{
    color:white;
    font-size:18px;
    margin-left:15px;
    transition:0.3s;
}

.social-icons a:hover{
    color:#ffd700;
}

/* ===== HAMBURGER ===== */
.hamburger{
    display:none;
    flex-direction:column;
    cursor:pointer;
}

.hamburger span{
    height:3px;
    width:25px;
    background:white;
    margin:4px 0;
}

/* ===== NOTIFICATION BAR ===== */
.notification-bar{
    background:#ffcc00;
    padding:8px 0;
    overflow:hidden;
}

.notification-content{
    white-space:nowrap;
    animation:scroll 15s linear infinite;
}

@keyframes scroll{
    from {transform:translateX(100%);}
    to {transform:translateX(-100%);}
}

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

    .contact-info{
        display:flex;
        flex-direction:column;
        align-items:flex-end;
        gap:5px;
        font-size:12px;
    }

    .nav-links{
        position:absolute;
        top:140px;
        right:0;
        background:#2aa7b3;
        width:100%;
        flex-direction:column;
        align-items:center;
        display:none;
        padding:20px 0;
    }

    .nav-links.active{
        display:flex;
    }

    .hamburger{
        display:flex;
    }

    .social-icons{
        display:none;
    }
}
/* ===== TOP BAR ===== */
.top-bar{
    background:#62b484;
    padding:8px 0;
}

.top-container{
    width:95%;
    margin:auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
}

/* Left Section */
.top-left{
    display:flex;
    align-items:center;
    gap:15px;
}

/* ===== CIRCULAR LOGO ===== */
.logo-circle{
    width:200px;      /* pehle 80px tha */
    height:200px;     /* pehle 80px tha */
    border-radius:50%;
    overflow:hidden;
}

.logo-circle img{
    width:100%;
    height:100%;
    object-fit:cover;
}

/* Smooth Fade Animation */
@keyframes logoFade{
    0%{
        transform:scale(1);
        opacity:1;
    }
    50%{
        transform:scale(1.05);
        opacity:0.85;
    }
    100%{
        transform:scale(1);
        opacity:1;
    }
}

/* ===== SIDE BANNER ===== */
.side-banner img{
    height:70px;
    object-fit:contain;
}

/* Contact Info */
.contact-info{
    margin-right:25px;
    font-size:25px;
    color:#333;
}
.navbar{
  background:#05bbe9;
  box-shadow:0 4px 15px rgba(0,0,0,0.08);
  position:sticky;
  top:0;
  z-index:1000;
}

.nav-container{
  display:flex;
  align-items:center;
  gap:25px;
  padding:12px 40px;
}

.home-icon{
  font-size:37px;
  text-decoration:none;
}

.brand-text{
  font-weight:700;
  font-size:40px;
  color:#ffffff;
  letter-spacing:2px;
  text-decoration: underline;
}

.nav-menu{
  list-style:none;
  display:flex;
  gap:25px;
  margin-left:auto;
}

.nav-menu li{
  position:relative;
}

.nav-menu a{
  text-decoration:none;
  color:#333;
  font-weight:600;
  padding:8px 0;
  display:block;
}

/* Dropdown */
.dropdown-menu{
  position:absolute;
  top:40px;
  left:0;
  background:#fff;
  width:280px;
  display:none;
  box-shadow:0 10px 25px rgba(0,0,0,0.15);
  border-radius:6px;
  overflow:hidden;
}

.dropdown-menu li{
  border-bottom:1px solid #eee;
}

.dropdown-menu li:last-child{
  border-bottom:none;
}

.dropdown-menu a{
  padding:10px 15px;
  font-size:14px;
}

.dropdown-menu a:hover{
  background:#f5f5f5;
}

.dropdown:hover .dropdown-menu{
  display:block;
}
.premium-slider{
  position:relative;
  width:100%;
  height:100vh;
  overflow:hidden;
}

.slider-track{
  display:flex;
  width:100%;
  height:100%;
  transition:transform 0.7s ease-in-out;
}

.slide{
  min-width:100%;
  height:100%;
}

.slide img{
  width:100%;
  height:100%;
  object-fit:contain;   /* ye important change hai */
  background:#999898;      /* empty space black dikhega */
}

.arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  background:rgba(0,0,0,0.4);
  color:white;
  border:none;
  font-size:30px;
  padding:12px 18px;
  cursor:pointer;
  border-radius:50%;
  z-index:10;
}

.prev{ left:20px; }
.next{ right:20px; }

.dots{
  position:absolute;
  bottom:20px;
  left:50%;
  transform:translateX(-50%);
  display:flex;
  gap:8px;
}

.dots span{
  width:12px;
  height:12px;
  background:white;
  opacity:0.5;
  border-radius:50%;
  cursor:pointer;
}

.dots span.active{
  opacity:1;
  background:#0d6b3c;
}
.about-premium{
  padding:80px 8%;
  background:linear-gradient(135deg,#f8f9fa,#e9f5ee);
  overflow:hidden;
}

.about-container{
  display:flex;
  align-items:center;
  gap:60px;
}

/* Image Styling */
.about-image{
  flex:1;
  transform:translateX(-80px);
  opacity:0;
  animation:slideInLeft 1s ease forwards;
}

.about-image img{
  width:100%;
  border-radius:20px;
  box-shadow:0 25px 60px rgba(0,0,0,0.2);
  transition:0.4s ease;
}

.about-image img:hover{
  transform:scale(1.05);
}

/* Content Styling */
.about-content{
  flex:1;
  transform:translateX(80px);
  opacity:0;
  animation:slideInRight 1s ease forwards;
}

.about-content h2{
  font-size:36px;
  margin-bottom:20px;
  color:#2e6f55;
}

.about-content p{
  font-size:17px;
  line-height:1.8;
  color:#555;
  margin-bottom:15px;
}

/* Stats */
.about-stats{
  display:flex;
  gap:20px;
  margin:30px 0;
}

.stat-box{
  background:#ffffff;
  padding:20px;
  border-radius:15px;
  text-align:center;
  flex:1;
  box-shadow:0 10px 25px rgba(0,0,0,0.08);
  transition:0.3s;
}

.stat-box:hover{
  transform:translateY(-10px);
}

.stat-box h3{
  font-size:28px;
  color:#69AF88;
}

.stat-box span{
  font-size:14px;
  color:#666;
}

/* Button */
.about-btn{
  padding:12px 30px;
  background:#69AF88;
  color:white;
  border:none;
  border-radius:30px;
  font-size:15px;
  cursor:pointer;
  transition:0.3s;
}

.about-btn:hover{
  background:#4e8f6d;
  transform:scale(1.05);
}

/* Animations */
@keyframes slideInLeft{
  to{
    transform:translateX(0);
    opacity:1;
  }
}

@keyframes slideInRight{
  to{
    transform:translateX(0);
    opacity:1;
  }
}

/* Responsive */
@media(max-width:992px){
  .about-container{
    flex-direction:column;
  }

  .about-stats{
    flex-direction:column;
  }
}
.management-section{
  padding:100px 6%;
  background:linear-gradient(135deg,#f8f9fa,#e9f5ee);
}

.container{
  max-width:1300px;   /* pehle 1100px tha – ab bada */
  margin:auto;
}

.main-heading{
  font-size:40px;   /* heading thoda bada */
  color:#2e6f55;
  margin-bottom:25px;
}

.sub-heading{
  font-size:26px;
  margin:35px 0 20px;
  color:#4e8f6d;
}

.space-top{
  margin-top:80px;
}

/* Table Styling */
.table-wrapper{
  overflow-x:auto;
  margin-bottom:40px;
}

table{
  width:100%;
  border-collapse:collapse;
  background:white;
  color:#333;
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 20px 50px rgba(0,0,0,0.1);
}

/* Header */
thead{
  background:#69AF88;
}

thead th{
  color:white;
  font-size:18px;
  padding:18px 25px;   /* bada padding */
  text-align:left;
}

/* Body */
tbody td{
  font-size:17px;
  padding:18px 25px;   /* bada padding */
}

tbody tr{
  border-bottom:1px solid #eee;
  transition:0.3s;
}

tbody tr:hover{
  background:#f1f9f5;
}

/* Rounded top corners */
thead tr:first-child th:first-child{
  border-top-left-radius:18px;
}

thead tr:first-child th:last-child{
  border-top-right-radius:18px;
}

/* Responsive */
@media(max-width:768px){
  .main-heading{
    font-size:32px;
  }

  .sub-heading{
    font-size:20px;
  }

  thead th,
  tbody td{
    padding:14px;
    font-size:15px;
  }
}
.president-section{
  padding:80px 8%;
  background:linear-gradient(135deg,#f8f9fa,#e9f5ee); /* Same theme */
}

.president-container{
  display:flex;
  align-items:center;
  gap:50px;
  background:white;
  padding:50px;
  border-radius:20px;
  box-shadow:0 20px 50px rgba(0,0,0,0.08);
  transition:0.4s ease;
}

.president-container:hover{
  transform:translateY(-5px);
}

.president-image img{
  width:300px;
  height:350px;
  object-fit:cover;
  border-radius:15px;
  box-shadow:0 10px 25px rgba(0,0,0,0.15);
}

.president-content{
  flex:1;
}

.president-name{
  font-size:30px;
  color:#2e6f55;
  margin-bottom:15px;
}

.president-title{
  font-size:22px;
  color:#4e8f6d;
  margin-bottom:20px;
}

.president-message{
  font-size:16px;
  line-height:1.8;
  color:#444;
}

/* Responsive */
@media(max-width:900px){
  .president-container{
    flex-direction:column;
    text-align:center;
  }

  .president-image img{
    width:220px;
    height:280px;
  }
}
/* ============================= */
/* PRINCIPAL MESSAGE SECTION */
/* ============================= */

.principal-message-section{
  padding:80px 8%;
  background: linear-gradient(135deg,#f8f9fa,#e9f5ee);
}

.principal-card{
  margin:auto;
  display:flex;
  align-items:center;
  gap:50px;
  background:#ffffff;
  padding:50px;
  border-radius:20px;
  box-shadow:0 20px 50px rgba(0,0,0,0.08);
  transition:0.4s ease;
}

.principal-card:hover{
  transform:translateY(-6px);
}

.principal-photo img{
  width:300px;
  height:360px;
  object-fit:cover;
  border-radius:15px;
  box-shadow:0 12px 30px rgba(0,0,0,0.15);
}

.principal-info{
  flex:1;
}

.principal-heading{
  font-size:30px;
  color:#2e6f55;
  margin-bottom:15px;
}

.principal-subheading{
  font-size:22px;
  color:#4e8f6d;
  margin-bottom:20px;
  position:relative;
}

.principal-subheading::after{
  content:"";
  display:block;
  width:80px;
  height:3px;
  background:#69AF88;
  margin-top:8px;
}

.principal-text{
  font-size:16px;
  line-height:1.8;
  color:#444;
}

/* Responsive */
@media(max-width:900px){
  .principal-card{
    flex-direction:column;
    text-align:center;
  }

  .principal-photo img{
    width:220px;
    height:280px;
  }
}
/* ============================= */
/* OBJECTIVES SECTION */
/* ============================= */

.objectives-section{
  padding:90px 8%;
  background:linear-gradient(135deg,#f8f9fa,#e9f5ee);
}

.objectives-container{

  margin:auto;
  display:flex;
  align-items:center;
  gap:60px;
  background:white;
  padding:50px;
  border-radius:20px;
  box-shadow:0 20px 50px rgba(0,0,0,0.08);
  transition:0.4s ease;
}

.objectives-container:hover{
  transform:translateY(-5px);
}

.objectives-image img{
  width:350px;
  height:350px;
  object-fit:cover;
  border-radius:15px;
  box-shadow:0 12px 30px rgba(0,0,0,0.15);
}

.objectives-content{
  flex:1;
}

.objectives-heading{
  font-size:34px;
  color:#2e6f55;
  margin-bottom:25px;
}

.objectives-list{
  list-style:none;
  padding:0;
}

.objectives-list li{
  font-size:17px;
  margin-bottom:15px;
  padding-left:30px;
  position:relative;
  color:#444;
  line-height:1.7;
}

.objectives-list li::before{
  content:"✔";
  position:absolute;
  left:0;
  color:#69AF88;
  font-weight:bold;
}

/* Responsive */
@media(max-width:900px){
  .objectives-container{
    flex-direction:column;
    text-align:center;
  }

  .objectives-image img{
    width:250px;
    height:250px;
  }

  .objectives-list li{
    padding-left:0;
  }

  .objectives-list li::before{
    display:none;
  }
}
/* ============================= */
/* OUR MOTTO WITH IMAGE */
/* ============================= */

.motto-section{
  padding:90px 8%;
  background:linear-gradient(135deg,#f8f9fa,#e9f5ee);
}

.motto-container{
  margin:auto;
  display:flex;
  align-items:center;
  gap:60px;
  background:white;
  padding:50px;
  border-radius:20px;
  box-shadow:0 20px 50px rgba(0,0,0,0.08);
  transition:0.4s ease;
}

.motto-container:hover{
  transform:translateY(-6px);
}

/* Image */
.motto-image img{
  width:350px;
  height:350px;
  object-fit:cover;
  border-radius:15px;
  box-shadow:0 15px 35px rgba(0,0,0,0.15);
}

/* Content */
.motto-content{
  flex:1;
}

.motto-heading{
  font-size:34px;
  color:#2e6f55;
  margin-bottom:20px;
}

.motto-quote{
  font-size:28px;
  font-weight:600;
  font-style:italic;
  margin-bottom:20px;
  color:#69AF88;
}

.motto-desc{
  font-size:17px;
  line-height:1.8;
  color:#444;
}

/* Responsive */
@media(max-width:900px){
  .motto-container{
    flex-direction:column;
    text-align:center;
  }

  .motto-image img{
    width:250px;
    height:250px;
  }
}
/* ============================= */
/* CAMPUS LOCATION SECTION */
/* ============================= */

.location-section{
  padding:110px 8%;
  background:linear-gradient(135deg,#2e6f55,#69AF88);
  color:white;
}

.location-container{
  max-width:1300px;
  margin:auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:70px;
}

/* Left Content */
.location-content{
  flex:1;
  animation:slideLeft 1s ease forwards;
}

.location-heading{
  font-size:40px;
  margin-bottom:25px;
}

.location-text{
  font-size:18px;
  line-height:1.8;
  margin-bottom:25px;
}

.location-details p{
  margin-bottom:12px;
  font-size:16px;
}

.location-btn{
  display:inline-block;
  margin-top:25px;
  padding:14px 32px;
  background:white;
  color:#2e6f55;
  font-weight:600;
  text-decoration:none;
  border-radius:30px;
  transition:0.3s ease;
}

.location-btn:hover{
  background:#e9f5ee;
  transform:translateY(-4px);
}

/* Right Map */
.location-map{
  flex:1;
  animation:slideRight 1s ease forwards;
}

.location-map iframe{
  width:100%;
  height:450px;
  border:none;
  border-radius:20px;
  box-shadow:0 20px 50px rgba(0,0,0,0.3);
}

/* Animations */
@keyframes slideLeft{
  from{
    opacity:0;
    transform:translateX(-60px);
  }
  to{
    opacity:1;
    transform:translateX(0);
  }
}

@keyframes slideRight{
  from{
    opacity:0;
    transform:translateX(60px);
  }
  to{
    opacity:1;
    transform:translateX(0);
  }
}

/* Responsive */
@media(max-width:900px){
  .location-container{
    flex-direction:column;
    text-align:center;
  }

  .location-map iframe{
    height:350px;
  }
}
.location-highlights{
  list-style:none;
  padding:0;
  margin:25px 0;
}

.location-highlights li{
  font-size:17px;
  margin-bottom:12px;
}
/* ============================= */
/* FOOTER SECTION */
/* ============================= */

.footer-section{
  background:#1f4f3c;
  color:#ffffff;
  padding:70px 8% 20px;
}

.footer-container{
  max-width:1300px;
  margin:auto;
  display:flex;
  justify-content:space-between;
  gap:60px;
  flex-wrap:wrap;
}

.footer-column{
  flex:1;
  min-width:250px;
}

.footer-column h3{
  font-size:22px;
  margin-bottom:20px;
  position:relative;
}

.footer-column h3::after{
  content:"";
  display:block;
  width:50px;
  height:3px;
  background:#69AF88;
  margin-top:8px;
}

.footer-column p{
  font-size:15px;
  line-height:1.8;
  margin-bottom:10px;
}

.footer-links{
  list-style:none;
  padding:0;
}

.footer-links li{
  margin-bottom:10px;
}

.footer-links a{
  text-decoration:none;
  color:#d7f3e5;
  transition:0.3s;
}

.footer-links a:hover{
  color:#69AF88;
  padding-left:5px;
}

/* Bottom Bar */
.footer-bottom{
  margin-top:50px;
  padding-top:20px;
  text-align:center;
  font-size:14px;
  border-top:1px solid rgba(255,255,255,0.2);
}

/* Responsive */
@media(max-width:900px){
  .footer-container{
    flex-direction:column;
    gap:40px;
  }
}
.school-name{
  font-size:38px;
  font-weight:900;
  letter-spacing:3px;
  color:#ffffff;          /* clear white */
  text-align:center;
  line-height:1.3;
  margin:10px 0;

  /* remove gradient */
  background:none;
  -webkit-text-fill-color:#ffffff;

  animation:fadeSlide 1.2s ease forwards;
}

/* animation */
@keyframes fadeSlide{
  0%{
    opacity:0;
    transform:translateY(30px);
  }
  100%{
    opacity:1;
    transform:translateY(0);
  }
}

/* hover effect */
.school-name:hover{
  transform:scale(1.04);
  transition:0.3s ease;
}
/* ===== FORCE MOBILE NAVBAR FIX ===== */
@media (max-width: 768px) {

  .top-container {
    flex-direction: column !important;
    align-items: center !important;
    text-align: center !important;
  }

  .logo-circle {
    width: 90px !important;
    height: 90px !important;
  }

  .school-name {
    font-size: 20px !important;
  }

  .nav-container {
    flex-direction: column !important;
    align-items: center !important;
    padding: 10px !important;
  }

  .brand-text {
    font-size: 22px !important;
    text-align: center !important;
  }

  .nav-menu {
  display: none !important;
}

.nav-menu.active {
  display: flex !important;
}

}
/* ===== TOP BAR FIX ===== */
@media (max-width: 768px) {

  .top-container {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    gap: 8px;
  }

  .top-left {
    flex-direction: column !important;
    align-items: center !important;
  }

  /* Logo size control */
  .logo-circle {
    width: 80px !important;
    height: 80px !important;
  }

  /* Sanstha name (yellow text) */
  .sanstha-name {
    font-size: 14px !important;
    letter-spacing: 1px !important;
  }

  /* School name */
  .school-name {
    font-size: 18px !important;
    line-height: 1.3 !important;
  }

  /* CBSE line */
  h2 {
    font-size: 14px !important;
  }

}
/* ===== FINAL HAMBURGER FIX ===== */
@media (max-width: 768px) {

  .hamburger {
    display: flex !important;
    flex-direction: column;
    cursor: pointer;
    position: absolute;
    right: 20px;
    top: 15px;
    z-index: 2000;
  }

  .hamburger span {
    height: 3px;
    width: 25px;
    background: white;
    margin: 4px 0;
  }

  .nav-menu {
    position: absolute !important;
    top: 60px;
    left: 0;
    width: 100%;
    background: #05bbe9;
    flex-direction: column !important;
    align-items: center;
    display: none !important;
    padding: 15px 0;
    z-index: 1500;
  }

  .nav-menu.active {
    display: flex !important;
  }

}
/* ===== MOBILE DROPDOWN FIX ===== */
@media (max-width: 768px) {

  .dropdown-menu {
    position: static !important;   /* overlap band */
    width: 100% !important;
    box-shadow: none !important;
    display: none;                /* default hidden */
    background: #ffffff;
  }

  .dropdown.active .dropdown-menu {
    display: block !important;    /* click pe show */
  }

}
/* ===== PERFECT 3-SECTION NAVBAR ===== */
.nav-container {
  display: grid !important;
  grid-template-columns: auto 1fr auto;
  align-items: center;
}

/* Home (left) */
.home-icon {
  justify-self: start;
  font-size: 20px;
}

/* Center text */
.brand-text {
  justify-self: start;
  font-size: 18px !important;
}

/* Hamburger (right) */
.hamburger {
  justify-self: end;
}
/* ===== Admission Section ===== */
.admission-section {
  padding: 60px 20px;
  background: #f0f8ff;
  display: flex;
  justify-content: center;
  align-items: center;
}

.admission-container {
  display: flex;
  flex-wrap: wrap;
  max-width: 1200px;
  background: #ffffff;
  border-radius: 15px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.1);
  overflow: hidden;
}

.admission-image {
  flex: 1 1 400px;
  min-width: 300px;
}

.admission-image img {
  width: 100%;
  height: auto;
  object-fit: cover;
}

.admission-content {
  flex: 1 1 400px;
  padding: 40px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.admission-heading {
  font-size: 2.2rem;
  color: #1f8f6a;
  margin-bottom: 20px;
}

.admission-quote {
  font-style: italic;
  font-size: 1.2rem;
  color: #555;
  margin-bottom: 20px;
}

.admission-desc {
  font-size: 1rem;
  line-height: 1.6;
  color: #333;
  margin-bottom: 30px;
}

/* Button */
.admission-btn {
  text-decoration: none;
  background: #1f8f6a;
  color: #fff;
  padding: 15px 30px;
  font-size: 1.1rem;
  font-weight: 600;
  border-radius: 50px;
  text-align: center;
  transition: all 0.3s ease;
}

.admission-btn:hover {
  background: #155d3f;
  transform: scale(1.05);
}

/* Responsive */
@media (max-width: 900px) {
  .admission-container {
    flex-direction: column;
  }

  .admission-content {
    padding: 30px 20px;
    text-align: center;
  }
}