*{box-sizing:border-box;}
body{
  margin:0;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  background:#f0f2f5;
  overflow-x:hidden;
}

/* ===== HEADER STYLES ===== */
.top{
  background: linear-gradient(to bottom, #1e293b, #0f172a);
  color:#fff;
  padding:0px 20px;
  position: relative;
  border-bottom: 3px solid #ffd700;
  box-shadow: 0 0 12px rgba(76, 201, 240, 0.12);
  overflow: visible;
  z-index: 1000;
}

.top-line{display:flex;justify-content:space-between;align-items:center;max-width:1100px;margin:0 auto; position: relative; padding-top: 20px; padding-bottom: 10px;}
.top-left{display:flex;align-items:center;gap:5px;}
.top-left img{width:60px;height:60px;border-radius:50%;}
.top-left h1{margin:0 0 0 4px;font-size:42px;color:#ffd700; text-shadow: 0 1px 2px rgba(0,0,0,0.35); font-weight:700; letter-spacing: 0.5px;}
.top-right{display:flex;align-items:center;gap:5px;}
.top-right img{width:130px;height:60px;object-fit:cover}
.top-right span{font-size:42px;font-weight:700; color: #fff;}

/* ===== NAVBAR ===== */
.navbar{
  display:flex;
  justify-content:center;
  gap:5px;
  margin-top:5px;
  align-items:center;
  flex-wrap:wrap;
  background: rgba(255, 255, 255, 0.05);
  padding: 6px 10px;
  border-radius: 25px;
  border: 1px solid rgba(255, 255, 255, 0.1);
  max-width: 90%;
  margin-left: auto;
  margin-right: auto;
}

.navbar a{
  color:#e2e8f0;
  text-decoration:none;
  padding:6px 12px;
  white-space:nowrap;
  font-size: 13px;
  font-weight: 600;
  transition: all 0.25s ease;
  border-radius: 20px;
  cursor: pointer;
}

.navbar a:hover{
  color:#fff;
  background: linear-gradient(90deg, #1b75bc, #0d6efd);
  box-shadow: 0 4px 15px rgba(13, 110, 253, 0.4);
  transform: translateY(-2px);
}

.nav-arrow {
    display: inline-block;
    margin-left: 5px;
    font-size: 12px;
    transition: transform 0.3s ease;
}
.dropdown:hover > a .nav-arrow {
    transform: rotate(180deg);
}

/* ===== DROPDOWN ===== */
.dropdown{position:relative;}
.dropdown-content {
  display:none;
  position:absolute;
  top:145%;
  left:0;
  background:#1e293b;
  min-width:240px;
  box-shadow:0 10px 25px rgba(0,0,0,0.3);
  border-radius: 10px;
  padding: 15px 0;
  z-index:1001;
  border: 1px solid rgba(255,255,255,0.1);
  animation: fadeIn 0.3s;
}
.dropdown-content::before {
  content: "";
  position: absolute;
  top: -20px;
  left: 0;
  width: 100%;
  height: 20px;
  background: transparent;
}
.dropdown-content:hover { display: block; }
.dropdown:hover > .dropdown-content { display: block; }
.dropdown-content a{
  color:#cbd5e1;
  display:block;
  padding:10px 20px;
  font-size: 13px;
  transition: 0.2s;
}
.dropdown-content a:hover{
  background:rgba(255,255,255,0.1);
  color:#ffd700;
  padding-left: 25px;
}

/* ===== SUBMENU ===== */
.submenu{position:relative;}
.submenu-content{
  display:none;
  position:absolute;
  top:0;
  left:105%;
  background:#1e293b;
  min-width:240px;
  box-shadow:0 10px 25px rgba(0,0,0,0.3);
  border-radius: 10px;
  padding: 15px 0;
  z-index:1002;
  border: 1px solid rgba(255,255,255,0.1);
}
.submenu-content::before {
  content: "";
  position: absolute;
  top: 0;
  left: -20px;
  width: 20px;
  height: 100%;
  background: transparent;
}
.submenu-content:hover { display: block; }
.submenu:hover > .submenu-content { display: block; }
.submenu-content a{
  color:#cbd5e1;
  display:block;
  padding:10px 20px;
  font-size: 13px;
}
.submenu-content a:hover{
  background:rgba(255,255,255,0.1);
  color:#ffd700;
  padding-left: 25px;
}

/* ===== CAROUSEL ===== */
.carousel-wrap{
  width:100%;
  max-width:1100px;
  height:280px; 
  margin: 20px auto; 
  position: relative;
}
.carousel{
  width:100%;
  height:100%;
  margin:0 auto;
  position:relative;
  overflow: hidden;
  border-radius: 20px;
  box-shadow:0 20px 50px rgba(0,0,0,0.2);
  background: linear-gradient(135deg, rgba(30,41,59,0.25) 0%, rgba(15,23,42,0.25) 100%);
  z-index: 2;
}
.carousel-bg{
  position: absolute;
  top: -100px; 
  left: 50%;
  transform: translateX(-50%);
  width: calc(100vw + 200px);
  height: calc(100% + 120px); 
  background-image: url('images/1crousel.jpg'); 
  background-size: cover;
  background-position: center top;
  background-repeat: no-repeat;
  z-index: 1;
  pointer-events: none;
  filter: saturate(90%) contrast(90%);
}
.slides img{ z-index: 3; position: relative; }
.arrow{ z-index: 4; position: relative; }
.dots{ z-index: 4; position: relative; }

.slides img{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position: top; 
  opacity:0;
  transition:opacity 1s ease;
  z-index: 10;
}
.slides img.active{opacity:1;}

.arrow{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  font-size:40px;
  color:#fff;
  background:rgba(13, 110, 253, 0.6);
  padding:10px 18px;
  cursor:pointer;
  border-radius:50%;
  user-select:none;
  z-index: 20;
  transition: 0.3s;
}
.arrow:hover{ background: #ffd700; color: #000; }
.arrow.left{left:20px;}
.arrow.right{right:20px;}

.dots{
  position:absolute;
  bottom:20px;
  width:100%;
  text-align:center;
  z-index: 20;
}
.dots span{
  display:inline-block;
  width:14px;
  height:14px;
  margin:0 5px;
  background:rgba(255,255,255,0.3);
  border-radius:50%;
  cursor:pointer;
  transition: 0.3s;
}
.dots span.active{background:#ffd700; transform: scale(1.2); box-shadow: 0 0 10px #ffd700;}

/* ===== MARQUEE (DOWN 20PX, ALL COURSES) ===== */
.marquee-container {
    width: 100%;
    background: linear-gradient(90deg, #1b75bc, #0d6efd); 
    padding: 10px 0;
    margin-bottom: 20px; 
    box-shadow: 0 5px 15px rgba(27, 117, 188, 0.2);
    overflow: hidden;
    white-space: nowrap;
    position: relative;
    border-radius: 0; 
}

.marquee-content {
    display: inline-block;
    animation: marquee-scroll 80s linear infinite; /* SPEED CHANGED TO 80s */
    padding-left: 100%;
}

.marquee-text {
    font-family: 'Segoe UI', sans-serif;
    font-weight: 700;
    font-size: 15px;
    color: #fff;
    text-transform: uppercase;
}

@keyframes marquee-scroll {
  0% { transform: translateX(0); }
  100% { transform: translateX(-100%); }
}

/* ===== MAIN CONTENT ===== */
.main{
  width:95%;
  max-width:1100px;
  margin:10px auto;
  background:#fff;
  padding:20px;
  border-radius: 20px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.05);
}
.main h2{text-align:center;color:#1b75bc; font-size:32px; margin-bottom:5px; text-transform: uppercase; letter-spacing: 1px;}
.underline{height:4px;width: 80px;background: linear-gradient(90deg, #1b75bc, #ffd700); margin:0 auto 20px auto; border-radius: 2px;}

.row{display:flex;gap:15px;margin-bottom:15px;flex-wrap:wrap;}

.box{
  flex:1;
  background:#fff;
  color:#333;
  text-align:center;
  padding:12px;
  border-radius: 10px;
  border: 1px solid #e2e8f0;
  box-shadow: 0 5px 15px rgba(0,0,0,0.05);
  position: relative;
  overflow: visible;
  animation: none;
}
.box:hover{
  transform: scale(1.05); 
  border-color: #1b75bc;
}
.box b{display:block;font-size: 15px; margin-bottom:10px; color:#1e293b; font-weight:700;}
.box a{
  display:inline-flex;
  align-items:center;
  gap:5px;
  background: linear-gradient(90deg, #1b75bc, #0d6efd);
  color:#fff;
  padding:8px 20px;
  text-decoration:none;
  border-radius:20px;
  font-size:13px;
  font-weight:600;
}
.box a:hover{ background: linear-gradient(90deg, #1b75bc, #0d6efd); color:#fff; }
.full{width:100%;}

/* ===== BIG IMAGE ===== */
.big-selection{
  width:100%;
  max-width:1100px;
  margin:40px auto;
  display: block;
}
.big-selection img{
  width:100%;
  height:auto;
  border-radius: 15px;
  box-shadow:0 20px 40px rgba(0,0,0,0.2);
  display: block;
}

/* ===== FOOTER ===== */
.footer{
  background: linear-gradient(to top, #0f172a, #1e293b);
  color:#fff;
  margin-top:30px;
  border-top: 5px solid #ffd700;
  padding-top: 40px;
}
.footer-wrap{
  max-width:1100px;
  margin:auto;
  padding:0 20px 20px 20px;
  display:flex;
  flex-wrap:wrap;
  gap:20px;
  align-items: flex-start;
}

/* ===== FOOTER BOX ALIGNMENT FIX ===== */
.footer-box{
  flex:1;
  min-width:280px;
  /* ADDED ALIGNMENT PROPERTIES */
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  text-align: center;
}
.footer-box h3{color:#ffd700; margin-bottom:15px; font-size:20px; text-align:center;}
.footer-box p{color:#cbd5e1; line-height: 1.4; text-align:center; font-size:14px;}

/* ===== FIXED FOOTER ALIGNMENT ===== */
.footer-box.center {
    flex: 1;
    min-width: 280px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.footer-box iframe{
  width:100%;
  height:350px;
  border:2px solid rgba(255,255,255,0.1);
  border-radius:20px;
  box-shadow: 0 0 20px rgba(0,0,0,0.3);
}

/* ===== SOCIAL LINKS ===== */
.footer-box .social-container {
    display: flex;
    flex-wrap: wrap;
    gap: 15px;
    justify-content: center;
    margin-bottom: 20px;
    margin-top: 10px;
}
.footer-box a{
  display:inline-flex;
  align-items:center;
  gap:10px;
  color:#fff;
  text-decoration:none;
  padding:10px 20px;
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 50px;
  transition:all .3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  box-shadow: 0 0 10px rgba(0,0,0,0.1);
}
.footer-box a img{
  width:24px;
  transition: transform 0.6s linear;
}
.footer-box a span{font-weight:600; font-size:14px;}

/* HOVER EFFECTS */
.footer-box a:hover{
  background: linear-gradient(45deg, #ff0055, #ff00aa);
  border-color: #ff0055;
  transform: scale(1.1) translateY(-3px);
  box-shadow: 0 0 20px rgba(255, 0, 85, 0.6);
}
/* TWITTER BOUNCE ANIMATION */
.twitter-link:hover img {
    animation: twitter-bounce 1s infinite ease-in-out !important; 
    transform: none !important; 
}

@keyframes twitter-bounce {
  0% { transform: translateY(0); }
  50% { transform: translateY(-8px); }
  100% { transform: translateY(0); }
}

/* Different Neon Colors */
.footer-box a:nth-child(1):hover { background: linear-gradient(45deg, #25D366, #25D366); box-shadow: 0 0 20px rgba(37, 211, 102, 0.6); border-color: #25D366; }
.footer-box a:nth-child(2):hover { background: linear-gradient(45deg, #833AB4, #833AB4); box-shadow: 0 0 20px rgba(131, 58, 180, 0.6); border-color: #833AB4; }
.footer-box a:nth-child(3):hover { background: linear-gradient(45deg, #1877F2, #1877F2); box-shadow: 0 0 20px rgba(24, 119, 242, 0.6); border-color: #1877F2; }


/* ===== GALLERIES (FIXED ALIGNMENT) ===== */
.gallery-wrapper{
  position:relative;
  width:280px; /* FIXED WIDTH */
  height:280px; /* FIXED HEIGHT */
  border-radius:8px;
  overflow:hidden;
  background: #fff;
  border: 1px solid #e2e8f0;
  display:flex;
  justify-content:center;
  align-items:center;
  margin: 20px auto 0 auto; /* FIXED MARGIN FOR ALIGNMENT */
}

.gallery-img{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  object-fit: cover;
  opacity:0;
  transition:opacity 0.5s ease;
}
.gallery-img.active{opacity:1;}

.gallery-btn-prev,
.gallery-btn-next{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  background: rgba(13, 110, 253, 0.9);
  color:#fff;
  border: 2px solid #fff;
  border-radius:50%;
  padding:6px;
  cursor:pointer;
  font-size:16px;
  z-index: 20;
  transition: 0.3s;
  width: 32px;
  height: 32px;
  display:flex;
  align-items:center;
  justify-content:center;
  box-shadow: 0 4px 6px rgba(0,0,0,0.3);
}
.gallery-btn-prev{left:5px;}
.gallery-btn-next{right:5px;}
.gallery-btn-prev:hover,
.gallery-btn-next:hover{ background: #ffd700; color: #000; border-color: #ffd700; transform: scale(1.1); }

/* ===== FOOTER BOTTOM ===== */
.footer-bottom{
  background:#000;
  text-align:center;
  padding:15px;
  font-size:14px;
  color: #fff !important;
}

/* ===== ENQUIRY FORM ===== */
.enquiry-box{
  max-width:550px;
  margin:40px auto;
  padding:20px;
  background:#fff;
  border-radius:15px;
  box-shadow:0 15px 40px rgba(0,0,0,.1);
  border-top: 5px solid #1b75bc;
}
.enquiry-box h2{text-align:center;color:#1b75bc; margin-bottom:15px;font-size:24px;}
.enquiry-box input,
.enquiry-box select,
.enquiry-box textarea{
  width:100%;
  padding:10px;
  margin-bottom:10px;
  border:2px solid #e2e8f0;
  border-radius:8px;
  font-size:14px;
  transition: 0.3s;
}
.enquiry-box input:focus, .enquiry-box select:focus, .enquiry-box textarea:focus{
  border-color: #1b75bc;
  outline: none;
  box-shadow: 0 0 0 3px rgba(27, 117, 188, 0.1);
}
.enquiry-box textarea{height:80px;resize:none;}
.enquiry-box button{
  width:100%;
  padding:10px;
  background: linear-gradient(90deg, #1b75bc, #0d6efd);
  color:#fff;
  border:none;
  border-radius:8px;
  font-size:16px;
  font-weight:bold;
  cursor:pointer;
  transition: 0.3s;
}
.enquiry-box button:hover{ background: #ffd700; color:#000; }

/* ===== SEPARATOR DIVIDER ===== */
.section-separator {
    width: 100%;
    border-bottom: 1px solid #e2e8f0;
    margin: 30px 0;
    position: relative;
}

/* ===== ENQUIRY DIVIDER ===== */
.enquiry-divider { text-align:center; margin:25px 0; position: relative; }
.enquiry-divider::before, .enquiry-divider::after { content: ''; position: absolute; top:50%; width:34%; height:1px; background: #e2e8f0; }
.enquiry-divider::before { left:0; transform: translateY(-50%); }
.enquiry-divider::after { right:0; transform: translateY(-50%); }
.enquiry-divider span{ display:inline-block; background: #fff; padding:4px 15px; color:#1b75bc; font-weight:800; border-radius:15px; border:1px solid #e2e8f0; }

/* ===== MOBILE ===== */
@media(max-width:768px){
  .top-line{flex-direction:column; text-align:center; padding-top: 20px;}
  .top-left h1,.top-right span{font-size:30px;}
  .carousel-wrap{height:250px;}
  .row{flex-direction:column;}
  .navbar{border-radius: 10px; flex-direction: column; align-items: center; padding: 10px;}
  .navbar a{ width: 100%; padding: 10px; text-align:center;}
  .footer-wrap { flex-direction: column; align-items: center; }
  .footer-box { width: 100%; text-align: center; margin-bottom: 20px; }
  .footer-box.center iframe { height: 200px; }
  .gallery-wrapper { width: 100%; height: 220px; }
}

/* ===== ROBOT ANIMATIONS ===== */
@keyframes fadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }