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

body{
background:#f5f7fb;
color:#333;
}

/* HEADER */
header{display:flex;justify-content:space-between;align-items:center;padding: 0px 33px;background: #d90000;box-shadow:0 2px 10px rgba(0,0,0,0.05);}

.logo{
font-size:22px;
font-weight:700;
color:#1a73e8;
}

/* HERO */
.hero{display:flex;flex-wrap:wrap;padding: 50px 19px;background:linear-gradient(135deg,#1a73e8,#004aad);color:#fff;align-items:center;}

.hero-left{
flex:1;
min-width:300px;
}

.hero-left h1{font-size: 22px;margin-bottom: 3px;}

.hero-left p{font-size:16px;margin: 0 0 -6px 0;}

.hero-form{
flex:1;
min-width:300px;
background:#fff;
padding:30px;
border-radius:10px;
box-shadow:0 10px 30px rgba(0,0,0,0.1);
}

.hero{

position:relative;

display:flex;

flex-wrap:wrap;

padding: 40px 13px;

align-items:center;

color:#fff;

/* PARALLAX EFFECT */

background-image:url('bg.jpg'); /* apni image yaha daalo */

background-size:cover;

background-position:center;

background-attachment:fixed;
}

/* DARK OVERLAY (readability ke liye) */
.hero::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.6);
z-index:0;
}

/* Content above overlay */
.hero-left,
.hero-form{
position:relative;
z-index:1;
}

.hero-form h3{
margin-bottom:15px;
color:#000;
}

.hero-form input{
width:100%;
padding:12px;
margin-bottom:10px;
border:1px solid #ddd;
border-radius:6px;
}

.hero-form button{
width:100%;
padding:12px;
background:#1a73e8;
color:#fff;
border:none;
border-radius:6px;
font-weight:600;
cursor:pointer;
}

/* TRUST */
.trust{
display:flex;
justify-content:center;
gap:30px;
padding:20px;
background:#fff;
flex-wrap:wrap;
}

.trust div{
font-weight:500;
}

/* COURSES */
.courses{
padding:50px 20px;
text-align:center;
}

.courses h2{
margin-bottom:30px;
}

.course-grid{
display:flex;
flex-wrap:wrap;
gap:20px;
justify-content:center;
}

.course{
background:#fff;
padding:20px;
border-radius:10px;
width:300px;
box-shadow:0 5px 20px rgba(0,0,0,0.08);
}

.course h3{
margin-bottom:10px;
}

.course p{
font-size:14px;
}

/* WHY US */
.why{
background:#1a73e8;
color:#fff;
padding:50px 20px;
text-align:center;
}

.why-grid{
display:flex;
flex-wrap:wrap;
gap:20px;
justify-content:center;
margin-top:20px;
}

.why-box{
background:rgba(255,255,255,0.1);
padding:20px;
border-radius:10px;
width:250px;
}

/* FORM CTA */
.cta{padding: 20px 20px;text-align:center;}

.cta form{
max-width:400px;
margin:auto;
}

.cta input{
width:100%;
padding:12px;
margin-bottom:10px;
border:1px solid #ddd;
border-radius:6px;
}

.cta button{
width:100%;
padding:12px;
background:#28a745;
color:#fff;
border:none;
border-radius:6px;
}

/* FOOTER */
footer{
background:#000;
color:#fff;
text-align:center;
padding:20px;
font-size:14px;
}

/* GALLERY */
.gallery{
padding:50px 20px;
text-align:center;
background:#fff;
}

.gallery-grid{
display:flex;
flex-wrap:wrap;
gap:15px;
justify-content:center;
margin-top:20px;
}

.gallery-grid img{
width:250px;
height:180px;
object-fit:cover;
border-radius:10px;
cursor:pointer;
transition:0.3s;
}

.gallery-grid img:hover{
transform:scale(1.05);
}

/* TESTIMONIALS */
.testimonials{padding: 20px 20px;background:#f5f7fb;text-align:center;}

.testimonial-grid{
display:flex;
flex-wrap:wrap;
gap:20px;
justify-content:center;
margin-top:20px;
}

.testimonial{
background:#fff;
padding:20px;
border-radius:10px;
width:300px;
box-shadow:0 5px 20px rgba(0,0,0,0.08);
}

.testimonial p{
font-size:14px;
margin-bottom:10px;
}

.stars{
color:#ffb400;
font-size:18px;
}

/* FLOAT */
.float-btn{
position:fixed;
bottom:20px;
right:20px;
display:flex;
flex-direction:column;
gap:10px;
z-index:9999;
}

.float-btn a{
width:55px;
height:55px;
display:flex;
align-items:center;
justify-content:center;
font-size:24px;
color:#fff;
border-radius:50%;
text-decoration:none;
box-shadow:0 5px 15px rgba(0,0,0,0.2);
}

.call{
background:#28a745;
}

.whatsapp{
background:#25d366;
}

img{
max-width:100%;
height:auto;
display:block;
}

.gallery-grid img{/* width:100%; */height:200px;object-fit:cover;border-radius:10px;}
.footer{
background:#111;
color:#fff;
padding:40px 20px 10px;
}

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

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

.footer-col h3,
.footer-col h4{
margin-bottom:15px;
color:#fff;
}

.footer-col p{
font-size:14px;
line-height:1.6;
}

.footer-col a{
color:#1a73e8;
text-decoration:none;
}

.footer-bottom{
text-align:center;
margin-top:20px;
border-top:1px solid rgba(255,255,255,0.1);
padding-top:10px;
font-size:13px;
}


/* SECTION 1 */
.new-highlights{padding: 20px 10px;text-align:center;background:#f5f7fb;}

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

.highlight-card{
background:#fff;
padding:25px;
width:220px;
border-radius:12px;
box-shadow:0 5px 20px rgba(0,0,0,0.08);
transition:0.3s;
}

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

.highlight-card .icon{
font-size:30px;
margin-bottom:10px;
}


/* SECTION 2 */
.course-info{display:flex;flex-wrap:wrap;gap:20px;padding: 10px 20px;justify-content:center;}

.info-box{
flex:1;
min-width:300px;
max-width:500px;
background:#fff;
padding:30px;
border-radius:12px;
box-shadow:0 5px 20px rgba(0,0,0,0.08);
}

.info-box h3{
margin-bottom:15px;
color:#1a73e8;
}

.info-box ul{
list-style:none;
padding:0;
}

.info-box li{
margin-bottom:10px;
font-size:14px;
}


/* MOBILE */
@media(max-width:768px){
.highlight-card{
width:100%;
}
}

/* BUTTON */
.admission-btn{padding: 9px 25px;background:linear-gradient(135deg,#ff7a18,#ff3d00);color:#fff;border:none;border-radius:50px;font-size: 15px;font-weight:600;cursor:pointer;box-shadow:0 5px 20px rgba(0,0,0,0.2);transition:0.3s;margin: 10px 0 0 0;}

.admission-btn:hover{
transform:scale(1.05);
}

/* POPUP */
.popup-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background: rgb(0 0 0 / 96%);display:flex;justify-content:center;align-items:center;opacity:0;visibility:hidden;transition:0.4s;z-index:9999;}

.popup-overlay.active{
opacity:1;
visibility:visible;
}

/* POPUP BOX */
.popup-box{
background:#fff;
padding:30px;
border-radius:12px;
width:90%;
max-width:400px;
text-align:center;
transform:scale(0.7);
transition:0.4s;
}

.popup-overlay.active .popup-box{
transform:scale(1);
}

/* CLOSE BUTTON */
.close-btn{
position:absolute;
top:15px;
right:20px;
font-size:25px;
cursor:pointer;
}

/* FORM */
.popup-box input{
width:100%;
padding:12px;
margin:10px 0;
border:1px solid #ddd;
border-radius:6px;
}

.popup-box button{
width:100%;
padding:12px;
background:#1a73e8;
color:#fff;
border:none;
border-radius:6px;
}

.hero-form{
flex:1;
min-width:300px;
background:#fff;
padding:30px;
border-radius:12px;
box-shadow:0 10px 40px rgba(0,0,0,0.15);
animation:fadeUp 0.8s ease;
}

.form-top h2{font-size:22px;margin-bottom:5px;color: #000;text-align: center;}

.form-top p{font-size:14px;color:#666;margin-bottom:15px;text-align: center;}

.hero-form input,
.hero-form select{
width:100%;
padding:12px;
margin-bottom:10px;
border:1px solid #ddd;
border-radius:6px;
font-size:14px;
}

.hero-form button{
width:100%;
padding:14px;
background:linear-gradient(135deg,#ff7a18,#ff3d00);
color:#fff;
border:none;
border-radius:50px;
font-size:16px;
font-weight:600;
cursor:pointer;
transition:0.3s;
}

.hero-form button:hover{
transform:scale(1.03);
}

.form-note{
font-size:12px;
color:#888;
text-align:center;
margin-top:8px;
}

.form-trust{
display:flex;
justify-content:space-between;
font-size:12px;
margin-top:10px;
color:#555;
}

/* animation */
@keyframes fadeUp{
from{
opacity:0;
transform:translateY(30px);
}
to{
opacity:1;
transform:translateY(0);
}
}

.hero-left{
flex:1;
min-width:300px;
display:flex;
flex-direction:column;
justify-content:center;
gap:15px;
}

.hero-left h1{font-size: 33px;line-height:1.2;}

.hero-left p{font-size:16px;}

/* badge */
.badge{
display:inline-block;
background:#ffcc00;
color:#000;
padding:5px 12px;
border-radius:20px;
font-size:12px;
font-weight:600;
width:max-content;
}

/* points */
.hero-points p{font-size:14px;margin:3px 0;}

/* button spacing */
.hero-left .admission-btn{margin-top: 0px;width:fit-content;margin-bottom: 21px;}

.privacy-policy{
max-width:900px;
margin:40px auto;
padding:20px;
background:#fff;
border-radius:10px;
box-shadow:0 5px 20px rgba(0,0,0,0.08);
line-height:1.7;
}

.privacy-policy h1{
margin-bottom:10px;
}

.privacy-policy h2{
margin-top:20px;
color:#1a73e8;
}

.privacy-policy ul{
padding-left:20px;
}