*{box-sizing:border-box}
body{margin:0;font-family:Inter,Arial;color:#1f2937;background:#fff}
h1,h2{font-weight:800}
/* ================= HEADER ================= */
section{
  scroll-margin-top: 90px; /* adjust to your header height */
}
.site-header{
  position:fixed;
  top:0;
  left:0;
  right:0;
  background:#ffffff;
  border-bottom:1px solid #e5e7eb;
  z-index:1000;
}

.header-wrap{
  max-width:1200px;
  margin:auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:5px 20px;
}

.logo img{
  height:38px;
  display:block;
}

/* MENU */
.nav{
  display:flex;
  gap:28px;
}

.nav a{
  text-decoration:none;
  color:#1f2937;
  font-weight:600;
  font-size:15px;
}

.nav a:hover{
  color:#0f2a44;
}

/* MOBILE MENU */
.menu-toggle{
  display:none;
  font-size:26px;
  cursor:pointer;
  user-select:none;
}

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

  .menu-toggle{
    display:block;
  }

  .nav{
    display:none;
    position:absolute;
    top:85px;
    left: 0;
    width: 97%;
    background:#ffffff;
    flex-direction:column;
    padding:15px 18px;
    gap:14px;
    box-shadow:0 10px 25px rgba(0,0,0,0.15);
  }
  .nav a {
    padding: 8px 7px;
    border-bottom: 1px solid #cccccc69;
}
  .nav.show{
    display:flex;
  }

}

.hero{
    min-height: 90vh;
    display: flex;
    align-items: center;
    padding: 80px;
    color: #fff;
    background: linear-gradient(rgba(15, 42, 68, 0.78), rgba(15, 42, 68, 0.78)), url(https://enggexpo.in/Admin__Console/uploads/images/May2022-22.jpg);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    
}
@media(max-width:768px){
  .hero{
    padding:40px;
    background-position:center top;
  }
}
.hero-content{max-width:900px}
.tagline{color:#fbbf24;font-weight:700}
.hero p{opacity:.9}
.cta{display:inline-block;margin-top:25px;background:#fbbf24;color:#000;padding:15px 30px;font-weight:700;text-decoration:none}
.meta{text-align:center;padding:20px;background:#f8fafc;font-weight:600}
.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));padding:60px;gap:20px;text-align:center}
.stat span{display:block;font-size:42px;color:#0f2a44}
.content, .why, .categories, .benefits{padding:80px;max-width:1100px;margin:auto}
.why ul, .benefits ul{line-height:2}
.categories .grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:15px}
.gallery{padding:80px;background:#f8fafc}
.masonry{column-count:3;column-gap:20px}
.masonry img{width:100%;margin-bottom:20px;border-radius:6px}
.videos{padding:80px}
.videos.light{background:#f8fafc}
.video-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px}
.video-grid iframe{width:100%;height:220px}
.enquiry{padding:80px;background:#0f2a44;color:#fff}
.enquiry form{max-width:600px;margin:auto;display:grid;gap:15px}
.enquiry input, .enquiry button{padding:15px;font-size:16px}
.enquiry button{background:#fbbf24;border:none;font-weight:700}
footer{text-align:center;padding:30px;background:#020617;color:#fff}
.whatsapp{position:fixed;right:20px;bottom:20px;background:#25d366;color:#fff;padding:15px 20px;font-weight:700;text-decoration:none}
@media(max-width:768px){
.hero{padding:40px}
.masonry{column-count:1}
}
/* ================= SECTION SPACING ================= */
.content,
.why,
.categories,
.stats,
.gallery,
.videos,
.benefits,
.enquiry{
  padding:60px 20px;
}

/* center content */
.content > *,
.why > *,
.categories > *,
.stats > *,
.gallery > *,
.videos > *,
.benefits > *,
.enquiry > *{
  max-width:1100px;
  margin-left:auto;
  margin-right:auto;
}

/* ================= SECTION DIVIDERS ================= */
.content::after,
.why::after,
.categories::after,
.gallery::after,
.videos::after,
.benefits::after{
  content:"";
  display:block;
  width:120px;
  height:2px;
  background:#e5e7eb;
  margin:50px auto 0;
}

/* ================= BACKGROUND VARIATION ================= */
.meta{background:#f1f5f9}
.why{background:#f8fafc}
.stats{background:#f8fafc}
.gallery{background:#f8fafc}
.videos.light{background:#f8fafc}

/* ================= CATEGORY CARDS ================= */
.categories .grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
  gap:22px;
}

.categories .grid div{
  background:#ffffff;
  border:1px solid #e5e7eb;
  padding:28px 22px;
  border-radius:14px;
  font-weight:600;
  text-align:center;
  transition:all .3s ease;
  box-shadow:0 10px 25px rgba(0,0,0,.05);
}

.categories .grid div:hover{
  transform:translateY(-6px);
  box-shadow:0 16px 40px rgba(0,0,0,.1);
  border-color:#0f2a44;
}

/* ================= STATS CARDS ================= */
.stat{
  background:#ffffff;
  padding:34px 20px;
  border-radius:16px;
  box-shadow:0 14px 35px rgba(0,0,0,.06);
  width:60%;
}

.stat span{
  font-size:48px;
  font-weight:800;
  color:#0f2a44;
}

/* ================= MOBILE ================= */
@media(max-width:768px){
  .content,
  .why,
  .categories,
  .stats,
  .gallery,
  .videos,
  .benefits,
  .enquiry{
    padding:45px 18px;
  }
}
/* ================= WHY SECTION LAYOUT ================= */
.why-grid{
  display:grid;
  grid-template-columns:1.1fr 0.9fr;
  gap:40px;
  align-items:center;
}

.why-text{
  width:100%;
}

/* ================= WHY VIDEO WITH PREVIEW ================= */

.why-video{
  position:relative;
  width:100%;
}

/* preview */
.yt-preview{
  position:relative;
  cursor:pointer;
}

.yt-preview img{
  width:100%;
  height:320px;
  object-fit:cover;
  border-radius:12px;
  display:block;
}

/* play button */
.play-btn{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:32px;
  color:#fff;
  background:rgba(0,0,0,0.35);
  border-radius:12px;
  transition:.3s ease;
}

.yt-preview:hover .play-btn{
  background:rgba(255,0,0,0.75);
}

/* iframe */
.yt-iframe{
  display:none;
  width:100%;
  height:320px;
  border-radius:12px;
}

/* mobile */
@media(max-width:768px){
  .yt-preview img,
  .yt-iframe{
    height:220px;
  }
}


/* ================= WHY MOBILE ================= */
@media(max-width:768px){
  .why-grid{
    grid-template-columns:1fr;
  }

  .why-video iframe{
    height:220px;
  }
}
/* ================= CATEGORY LEVEL-UP WITH ICONS ================= */

.categories{
  background:#ffffff;
}

.categories h2{
  margin-bottom:45px;
  text-align:center;
}

/* GRID */
.categories .grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
  gap:28px;
}

/* CARD */
.categories .grid div{
  position:relative;
  background:#ffffff;
  border:1px solid #e5e7eb;
  padding:75px 24px 32px;   /* extra top space for icon */
  border-radius:18px;
  font-weight:700;
  text-align:center;
  line-height:1.4;
  box-shadow:0 14px 30px rgba(0,0,0,0.06);
  transition:all .35s ease;
  overflow:hidden;
}

/* ICON (CSS ONLY) */
.categories .grid div::before{
  content:"⚙️"; /* default industrial icon */
  position:absolute;
  top:18px;
  left:50%;
  transform:translateX(-50%);
  font-size:34px;
  opacity:0.9;
  transition:transform .4s ease, color .4s ease;
}

/* DIFFERENT ICON FEEL (VARIATION BY POSITION) */
.categories .grid div:nth-child(2)::before{content:"🤖";}
.categories .grid div:nth-child(3)::before{content:"🏭";}
.categories .grid div:nth-child(4)::before{content:"📡";}
.categories .grid div:nth-child(5)::before{content:"🔌";}
.categories .grid div:nth-child(6)::before{content:"🛠️";}
.categories .grid div:nth-child(7)::before{content:"♻️";}
.categories .grid div:nth-child(8)::before{content:"🧪";}
.categories .grid div:nth-child(9)::before{content:"📦";}
.categories .grid div:nth-child(10)::before{content:"⚡";}

/* ACCENT BAR */
.categories .grid div::after{
  content:"";
  position:absolute;
  bottom:0;
  left:0;
  width:100%;
  height:4px;
  background:linear-gradient(90deg,#0f2a44,#fbbf24);
  transform:scaleX(0);
  transform-origin:left;
  transition:.35s ease;
}

/* HOVER EFFECT */
.categories .grid div:hover{
  transform:translateY(-10px);
  box-shadow:0 26px 55px rgba(0,0,0,0.12);
  border-color:#0f2a44;
}

.categories .grid div:hover::before{
  transform:translateX(-50%) rotate(20deg) scale(1.15);
}

.categories .grid div:hover::after{
  transform:scaleX(1);
}

/* ================= MOBILE ================= */
@media(max-width:768px){
  .categories .grid{
    gap:20px;
  }
  .categories .grid div{
    padding:75px 20px 28px;
  }
}
/* ================= STATS CLARITY & HEADING ================= */

.stats{
  position:relative;
  background:linear-gradient(180deg,#f8fafc,#ffffff);
  padding:105px 0px 70px;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:0px;
}

/* SECTION HEADING (CSS ONLY – NO CONTENT CHANGE) */
.stats::before{
  content:"Glimpse of M TECH EXPO 2025";
  position:absolute;
  top:30px;
  left:50%;
  transform:translateX(-50%);
  font-size:28px;
  font-weight:800;
  color:#0f2a44;
  letter-spacing:.5px;
  text-align:center;
}

/* sub divider under heading */
.stats::after{
  content:"";
  position:absolute;
  top:72px;
  left:50%;
  transform:translateX(-50%);
  width:90px;
  height:3px;
  background:linear-gradient(90deg,#0f2a44,#fbbf24);
  border-radius:2px;
}

/* ================= STAT CARD ================= */

.stat{
  background:#ffffff;
  padding:40px 22px;
  border-radius:18px;
  text-align:center;
  border:1px solid #e5e7eb;
  box-shadow:0 18px 40px rgba(0,0,0,0.08);
  position:relative;
  overflow:hidden;
  transition:all .35s ease;
}

/* subtle highlight */
.stat::before{
  content:"";
  position:absolute;
  inset:-40%;
  background:radial-gradient(circle,rgba(15,42,68,0.08),transparent 60%);
  opacity:0;
  transition:.35s ease;
}

/* number */
.stat span{
  font-size:48px;
  font-weight:800;
  color:#0f2a44;
  display:block;
  margin-bottom:8px;
}

/* label text (existing text below number) */
.stat{
  font-weight:600;
  color:#374151;
}

/* hover */
.stat:hover{
  transform:translateY(-10px);
  box-shadow:0 30px 70px rgba(0,0,0,0.15);
}

.stat:hover::before{
  opacity:1;
}

/* ================= MOBILE ================= */
@media(max-width:768px){
  .stats{
    padding:120px 18px 55px;
    gap:22px;
  }

  .stats::before{
    font-size:22px;
    top:25px;
    letter-spacing: normal;
    width:87%;
  }
  .stat span{
    font-size:44px;
  }
}
@media(max-width:375px){
  .stats::after{
    top:93px;
  }
}
/* ================= CREATIVE ENQUIRY FORM ================= */

.enquiry{
  background:linear-gradient(180deg,#0f2a44,#091d30);
  color:#ffffff;
}

.enquiry h2{
  text-align:center;
  margin-bottom:35px;
}

.enquiry form{
  background:#ffffff;
  color:#1f2937;
  padding:40px 35px;
  border-radius:20px;
  box-shadow:0 25px 60px rgba(0,0,0,0.25);
  max-width:620px;
}

.enquiry input,
.enquiry select{
  border:1px solid #d1d5db;
  border-radius:10px;
  padding:15px;
  font-size:15px;
}

.enquiry input:focus,
.enquiry select:focus{
  outline:none;
  border-color:#0f2a44;
  box-shadow:0 0 0 2px rgba(15,42,68,.15);
}

.enquiry button{
  background:linear-gradient(90deg,#fbbf24,#f59e0b);
  color:#000;
  border-radius:12px;
  font-size:16px;
  padding:16px;
  transition:.3s ease;
}

.enquiry button:hover{
  transform:translateY(-2px);
  box-shadow:0 10px 25px rgba(0,0,0,.25);
}

/* CAPTCHA */
.captcha-box{
  display:flex;
  gap:12px;
  align-items:center;
}

#captchaText{
  background:#0f2a44;
  color:#ffffff;
  font-weight:800;
  letter-spacing:3px;
  padding:14px 18px;
  border-radius:8px;
  user-select:none;
}

/* THANK YOU MESSAGE */
.thankyou-message{
  display:none;
  margin-top:40px;
  text-align:center;
  background:#ffffff;
  color:#0f2a44;
  padding:45px 30px;
  border-radius:20px;
  box-shadow:0 25px 60px rgba(0,0,0,.25);
}

.thankyou-message h3{
  font-size:24px;
  margin-bottom:10px;
}
/* ================= ENQUIRY TITLE MOBILE STACK ================= */

.enquiry-title{
  text-align:center;
  line-height:1.3;
}

/* desktop – inline */
.enquiry-title span{
  display:inline;
}

/* mobile – stacked */
@media(max-width:768px){
  .enquiry-title span{
    display:block;
  }

  .enquiry-title .line-1{
    font-size:20px;
    font-weight:600;
    margin-bottom:6px;
  }

  .enquiry-title .line-2{
    font-size:26px;
    font-weight:800;
    color:#fbbf24; /* brand highlight */
    margin-bottom:4px;
  }

  .enquiry-title .line-3{
    font-size:18px;
    font-weight:600;
    opacity:.9;
  }
}

@media(max-width:768px){
  .enquiry form{
    padding:30px 22px;
  }
  .captcha-box{
    flex-direction:column;
    align-items:stretch;
  }
  .enquiry h2{
      padding: 0px 30px;
  }
}
/* ================= ENQUIRY FORM LAYOUT ================= */

.enquiry-form{
  max-width:900px;
  margin:auto;
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:22px 28px;
}

/* form group */
.form-group{
  display:flex;
  flex-direction:column;
}

.form-group.full{
  grid-column:1 / -1;
}

/* labels */
.form-group label{
  font-weight:600;
  margin-bottom:6px;
  font-size:14px;
}

/* inputs */
.enquiry-form input,
.enquiry-form select{
  padding:14px 14px;
  font-size:15px;
  border-radius:8px;
}

/* captcha number */
.captcha-number{
  display:inline-block;
  background:#fbbf24;
  color:#000;
  font-weight:800;
  padding:12px 18px;
  border-radius:8px;
  font-size:18px;
  letter-spacing:2px;
}

/* submit button */
.enquiry-form button{
  padding:16px;
  background:#fbbf24;
  color:#000;
  font-size:16px;
  font-weight:800;
  border:none;
  border-radius:10px;
  cursor:pointer;
}

.enquiry-form button:hover{
  opacity:.9;
}

/* ================= MOBILE VIEW ================= */
@media(max-width:768px){
  .enquiry-form{
    grid-template-columns:1fr;
    gap:18px;
  }
}

/* ================= THANK YOU ANIMATION ================= */

.thankyou-message{
  display:none;
  opacity:0;
  transform:translateY(30px) scale(0.95);
  animation:thankYouFadeIn .7s ease forwards;
}

@keyframes thankYouFadeIn{
  0%{
    opacity:0;
    transform:translateY(30px) scale(0.95);
  }
  60%{
    opacity:1;
    transform:translateY(-5px) scale(1.02);
  }
  100%{
    opacity:1;
    transform:translateY(0) scale(1);
  }
}
/* ================= SOCIAL LINKS ================= */

.social-links{
  position:fixed;
  right:0;
  top:50%;
  transform:translateY(-50%);
  display:flex;
  flex-direction:column;
  z-index:999;
}

.social-links a{
  width:48px;
  height:48px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#ffffff;
  text-decoration:none;
  font-size:18px;
  transition:.3s ease;
}

.social-links a:hover{
  transform:translateX(-6px);
}

/* BRAND COLORS */
.social-links .facebook{background:#1877f2;}
.social-links .linkedin{background:#0a66c2;}
.social-links .youtube{background:#ff0000;}
.social-links .instagram{
  background:linear-gradient(45deg,#f58529,#dd2a7b,#8134af,#515bd4);
}
.social-links .whatsappp{background:#25d366;}

/* ================= MOBILE VIEW ================= */
@media(max-width:768px){

  /* REMOVE FLOATING ICONS ON MOBILE */
  .social-links{
    position:static;
    transform:none;
    flex-direction:row;
    justify-content:center;
    margin-top:25px;
  }

  .social-links a{
    width:44px;
    height:44px;
    font-size:18px;
  }

  .social-links a:hover{
    transform:none;
  }
}

/* ================= BENEFITS – CARD STYLE WITH ANIMATION ================= */



/* grid layout */
.benefits ul{
  max-width:1000px;
  margin:0 auto;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:24px;
  list-style:none;
  padding:0;
}

/* benefit card */
.benefits ul li{
  background:#ffffff;
  padding:28px 26px;
  border-radius:16px;
  box-shadow:0 12px 30px rgba(0,0,0,0.06);
  font-weight:500;
  position:relative;
  transition:transform .35s ease, box-shadow .35s ease;
  overflow:hidden;
}

/* left accent bar */
.benefits ul li::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  width:5px;
  height:100%;
  background:#fbbf24;
  border-radius:16px 0 0 16px;
}

/* subtle hover animation */
.benefits ul li:hover{
  transform:translateY(-6px);
  box-shadow:0 22px 50px rgba(0,0,0,0.12);
}

/* soft highlight sweep */
.benefits ul li::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(
    120deg,
    transparent 30%,
    rgba(251,191,36,0.12),
    transparent 70%
  );
  transform:translateX(-100%);
  transition:transform .6s ease;
}

.benefits ul li:hover::after{
  transform:translateX(100%);
}

/* ================= MOBILE ================= */
@media(max-width:768px){
  .benefits ul{
    gap:20px;
  }
}
/* ================= CONTACT UPGRADE ================= */

.contact-upgrade{
  background:linear-gradient(180deg,#0f2a44,#0b2238);
  padding:80px 20px 70px;
  color:#ffffff;
  text-align:center;
}

.contact-upgrade h2{
  font-size:32px;
  margin-bottom:50px;
  font-weight:800;
}

/* grid */
.contact-cards{
  max-width:1200px;
  margin:auto;
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:30px;
}

/* card */
.contact-card{
  background:rgba(255,255,255,0.04);
  border:1px solid rgba(255,255,255,0.15);
  padding:36px 28px;
  border-radius:20px;
  transition:all .35s ease;
  backdrop-filter:blur(6px);
}

.contact-card i{
  font-size:34px;
  color:#fbbf24;
  margin-bottom:18px;
}

.contact-card h4{
  font-size:18px;
  margin-bottom:10px;
  color: #fbbf24;
}

.contact-card p{
  font-size:14.5px;
  line-height:1.6;
  color:#e7e7e7;
  margin:0;
}

.contact-card a{
  color:#e6e6e6;
  text-decoration:none;
  font-weight:600;
}

.contact-card a:hover{
  text-decoration:underline;
}

/* hover animation */
.contact-card:hover{
  transform:translateY(-8px);
  box-shadow:0 28px 60px rgba(0,0,0,0.35);
  border-color:#fbbf24;
}

/* ================= MOBILE ================= */
@media(max-width:768px){
  .contact-upgrade{
    padding:60px 18px 55px;
  }

  .contact-upgrade h2{
    font-size:26px;
    margin-bottom:35px;
  }
}

/* ================= META TEXT ANIMATION (GUARANTEED) ================= */

.meta{
  text-align:center;
  padding:20px 16px;
  font-weight:600;
}

/* animated highlight on date */
.meta strong{
  background-image:linear-gradient(
    120deg,
    transparent 0%,
    #fbbf24 40%,
    transparent 80%
  );
  background-size:200% 100%;
  background-repeat:no-repeat;
  background-position:200% 0;
  padding:0 6px;
  animation:metaShine 2.5s ease infinite;
}

/* MOBILE STACK */
@media(max-width:768px){
  .meta{
    line-height:1.8;
    white-space:pre-line;
  }

  .meta strong{
    display:block;
    font-size:18px;
    margin-bottom:6px;
  }
}

/* KEYFRAMES */
@keyframes metaShine{
  0%{
    background-position:200% 0;
  }
  100%{
    background-position:-200% 0;
  }
}
/* ================= YOUTUBE CTA LINK ================= */

.more.highlight-link{
  margin-top:35px;
  text-align:center;
  font-size:17px;
  font-weight:600;
  color:#374151;
}

/* link styling */
.more.highlight-link a{
  display:inline-block;
  margin-right:8px;
  padding:10px 18px;
  background:linear-gradient(90deg,#ff0000,#cc0000);
  color:#ffffff;
  font-weight:800;
  border-radius:30px;
  text-decoration:none;
  letter-spacing:.3px;
  transition:all .3s ease;
  box-shadow:0 10px 25px rgba(255,0,0,0.25);
}

/* hover effect */
.more.highlight-link a:hover{
  transform:translateY(-3px) scale(1.03);
  box-shadow:0 18px 40px rgba(255,0,0,0.4);
}

/* subtle pulse animation */
.more.highlight-link a{
  animation:pulseYT 2.2s infinite;
}

/* animation */
@keyframes pulseYT{
  0%{box-shadow:0 0 0 0 rgba(255,0,0,0.6);}
  70%{box-shadow:0 0 0 14px rgba(255,0,0,0);}
  100%{box-shadow:0 0 0 0 rgba(255,0,0,0);}
}

/* mobile optimization */
@media(max-width:768px){
  .more.highlight-link{
    font-size:16px;
    line-height:1.6;
  }

  .more.highlight-link a{
    margin-bottom:8px;
  }
}
/* ================= CONTENT READABILITY ================= */

.content p{
  margin-top:20px;
  line-height:1.9;          
  font-size:16.5px;         
  letter-spacing:.2px;
}

/* mobile refinement */
@media(max-width:768px){
  .content p{
    font-size:16px;
    line-height:1.85;
    margin-top:18px;
  }
}
/* ================= EXPO MAPS SECTION ================= */

.expo-maps{
  padding:70px 20px 80px;
  text-align:center;
}

.expo-maps h2{
  font-size:32px;
  font-weight:800;
  margin-bottom:45px;
  color:#0f2a44;
}

/* grid */
.maps-grid{
  max-width:1100px;
  margin:auto;
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:60px;
}

/* card */
.map-card{
  background:#ffffff;
  padding:22px;
  border-radius:18px;
  box-shadow:0 18px 45px rgba(0,0,0,0.08);
  transition:transform .35s ease, box-shadow .35s ease;
}

/* image */
.map-card img{
  width:100%;
  height:auto;
  border-radius:14px;
}

/* caption */
.map-caption{
  margin-top:18px;
  font-weight:600;
  font-size:16px;
  color:#374151;
}

/* hover effect */
.map-card:hover{
  transform:translateY(-8px);
  box-shadow:0 30px 70px rgba(0,0,0,0.14);
}

/* ================= MOBILE ================= */
@media(max-width:768px){
  .maps-grid{
    grid-template-columns:1fr;
    gap:30px;
  }

  .expo-maps h2{
    font-size:26px;
    margin-bottom:35px;
  }
}
/* ================= SCROLL TO TOP ================= */

#scrollTopBtn{
  position:fixed;
  right:20px;
  bottom:40px; /* above WhatsApp if any */
  width:38px;
  height:38px;
  border-radius:50%;
  background:linear-gradient(135deg,#0f2a44,#1e3a5f);
  color:#ffffff;
  border:none;
  font-size:20px;
  font-weight:800;
  cursor:pointer;
  display:none;
  align-items:center;
  justify-content:center;
  box-shadow:0 12px 30px rgba(0,0,0,0.25);
  z-index:999;
  transition:all .35s ease;
}

#scrollTopBtn:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 45px rgba(0,0,0,0.35);
}

/* Mobile */
@media(max-width:768px){
  #scrollTopBtn{
    right:16px;
    bottom:80px;
    width:42px;
    height:42px;
    font-size:20px;
  }
}
.video-grid video{
  width:100%;
  height:290px;
  border-radius:12px;
  background:#000;
  box-shadow:0 14px 35px rgba(0,0,0,0.15);
}
/* ================= ENQUIRY POPUP – CREATIVE SLIDE + GLOW ================= */
/* ================= POPUP – FINAL CENTERED VERSION ================= */

.enquiry-popup{
  position:fixed;
  inset:0;
  background:rgba(0,0,0,0.6);
  display:none;

  /* BULLETPROOF CENTERING */

  place-items:center;

  z-index:2000;
  backdrop-filter:blur(6px);
  min-height:100svh; /* mobile viewport fix */
}

.popup-box{
  background:#ffffff;
  padding:44px 32px 38px;
  border-radius:22px;
  max-width:460px;
  width:92%;
  text-align:center;
  box-shadow:0 40px 90px rgba(0,0,0,0.45);
  border:4px solid #4CAF50;
}
.popup-box.animate{
  animation:popupScaleFade .45s ease forwards;
}

/* heading */
.popup-box h3{
  font-size:26px;
  color:#0f2a44;
  margin-bottom:12px;
  font-weight:800;
}

/* message */
.popup-box p{
  font-size:16px;
  line-height:1.6;
  color:#374151;
}
.popup-box strong{
    color: #4CAF50;
    font-size: large;
}
/* button */
.popup-box button{
  margin-top:24px;
  padding:14px 30px;
  border:none;
  border-radius:12px;
  background:linear-gradient(90deg,#fbbf24,#f59e0b);
  font-weight:800;
  cursor:pointer;
}

/* close icon */
.popup-close{
  position:absolute;
  top:14px;
  right:18px;
  font-size:22px;
  cursor:pointer;
  color:#6b7280;
}

/* animation */
@keyframes popupScaleFade{
  from{
    opacity:0;
    transform:scale(0.88);
  }
  to{
    opacity:1;
    transform:scale(1);
  }
}

/* MOBILE SAFETY */
@media(max-width:768px){
  .popup-box{
    max-height:90svh;
    overflow:auto;
  }
}

/* popup box */
.popup-box{
  background:#ffffff;
  padding:44px 32px 38px;
  border-radius:22px;
  max-width:460px;
  width:92%;
  text-align:center;
  box-shadow:0 40px 90px rgba(0,0,0,0.45);

  /* SAFE animation (no translate) */
  animation:popupScaleFade .45s ease forwards;
  border: 4px solid #4CAF50;
}

/* heading */
.popup-box h3{
  font-size:26px;
  color:#0f2a44;
  margin-bottom:12px;
  font-weight:800;
}

/* message */
.popup-box p{
  font-size:16px;
  line-height:1.6;
  color:#374151;
}
.popup-box strong{
    color: #4CAF50;
    font-size: large;
}
/* button */
.popup-box button{
  margin-top:24px;
  padding:14px 30px;
  border:none;
  border-radius:12px;
  background:linear-gradient(90deg,#fbbf24,#f59e0b);
  font-weight:800;
  cursor:pointer;
}

/* close icon */
.popup-close{
  position:absolute;
  top:14px;
  right:18px;
  font-size:22px;
  cursor:pointer;
  color:#6b7280;
}

/* animation */
@keyframes popupScaleFade{
  from{
    opacity:0;
    transform:scale(0.88);
  }
  to{
    opacity:1;
    transform:scale(1);
  }
}

/* MOBILE SAFETY */
@media(max-width:768px){
  .popup-box{
    max-height:90svh;
    overflow:auto;
  }
}

/*Anjali added*/
#toastBox {
  position: fixed;
  top: 20px;
  right: 20px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  z-index: 999999;
}

.toast {
  padding: 12px 18px;
  background: #333;
  color: #fff;
  font-size: 15px;
  border-radius: 4px;
  opacity: 0;
  transform: translateX(100px);
  animation: slideIn 0.3s forwards, fadeOut 0.5s forwards 2.5s;
}

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

@keyframes fadeOut {
  to {
    opacity: 0;
    transform: translateX(100px);
  }
}