/* Apply font globally */
   body {
     font-family: 'Poppins', 'Nunito', 'Sansita Swashed', sans-serif;
     margin: 0;
     padding: 0;
   }

   /* Paragraphs and other text */
   p,
   span,
   a,
   li,
   button {
     font-family: 'Poppins', 'Nunito', sans-serif;
   }

   /* Optional: monospace for code blocks */
   code,
   pre {
     font-family: 'Courier New', Courier, monospace;
   }
 

   .innerHeading-wrap {
     position: relative;
     padding: 105px 0 5px;
     overflow: hidden;
     text-align: center;
     color: #fff;
     border-radius: 0 0 45px 45px;
     background-size: 400% 400%;
     animation: gradientFlow 12s ease infinite;
     margin-top: -95px;
   }

   /* Gradient motion */
   @keyframes gradientFlow {
     0% {
       background-position: 0% 50%;
     }

     50% {
       background-position: 100% 50%;
     }

     100% {
       background-position: 0% 50%;
     }
   }

   .innerHeading-wrap {
     position: relative;
     overflow: hidden;
   }

   /* Dark soft glow */
   .dark-glow {
     position: absolute;
     inset: -40%;
     background: radial-gradient(circle, rgba(0, 255, 150, .05), transparent 60%);
     animation: glowMove 16s linear infinite;
   }

   @keyframes glowMove {
     0% {
       transform: translateX(-30%)
     }

     100% {
       transform: translateX(30%)
     }
   }

   /* Ultra subtle particles */
   .particle {
     position: absolute;
     bottom: -15px;
     width: 3px;
     height: 3px;
     background: rgba(0, 255, 140, .18);
     border-radius: 50%;
     animation: floatUp 9s linear infinite;
   }

   @keyframes floatUp {
     0% {
       transform: translateY(0);
       opacity: 0
     }

     30% {
       opacity: .35
     }

     100% {
       transform: translateY(-160px);
       opacity: 0
     }
   }

   /* Text */
   .innerHeading-wrap h1 {
     font-size: 42px;
     font-weight: 800;
     letter-spacing: .5px;
     text-shadow: 0 4px 18px rgba(0, 0, 0, .5);
     position: relative;
     z-index: 5;
     font-family: 'Poppins', sans-serif;
   }

   .innerHeading-wrap::before,
.innerHeading-wrap::after {
  content: "";
  position: absolute;
  width: 280px;
  height: 280px;
  border-radius: 50%;
  filter: blur(60px);
  opacity: .35;
  animation: floatGlow 12s linear infinite alternate;
}

.innerHeading-wrap::before {
  background: radial-gradient(circle, #00ff9c, #02140d);
  top: -120px;
  left: -120px;
}

.innerHeading-wrap::after {
  background: radial-gradient(circle, #00ff9c, #02140d);
  bottom: -120px;
  right: -120px;
  animation-delay: 6s;
}

.innerHeading-wrap span.light {
  background: linear-gradient(120deg, transparent, rgba(0,255,156,.18), transparent);
}

.particle {
  background: rgba(0,255,156,.55);
}

   @keyframes floatGlow {
     0% {
       transform: translateY(0);
     }

     100% {
       transform: translateY(120px);
     }
   }

   /* Moving light streak */
   .innerHeading-wrap span.light {
     position: absolute;
     inset: 0;
     background: linear-gradient(120deg, transparent, rgba(255, 255, 255, .35), transparent);
     animation: shineMove 4s infinite;
     z-index: 2;
   }

   @keyframes shineMove {
     0% {
       transform: translateX(-100%);
     }

     100% {
       transform: translateX(100%);
     }
   }

   /* Floating particles */
   .particle {
     position: absolute;
     width: 6px;
     height: 6px;
     background: rgba(255, 255, 255, .7);
     border-radius: 50%;
     animation: particleFloat 6s linear infinite;
     z-index: 3;
   }

   @keyframes particleFloat {
     0% {
       transform: translateY(0);
       opacity: 0;
     }

     30% {
       opacity: 1;
     }

     100% {
       transform: translateY(-140px);
       opacity: 0;
     }
   }

   body {
     background-color: #ffffff;
     background-image: linear-gradient(rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.88)), url(https://static.vecteezy.com/system/resources/previews/008/041/547/non_2x/school-stuff-pattern-free-vector.jpg);
     background-repeat: repeat;
     background-size: 420px;
   }
 

   /* Header bar background */
   .header-bar {
     background: #004d00;
     padding: 6px 0;
   }

   /* List styling */
   .header-menu {
     list-style: none;
     margin: 0;
     padding: 0;
     display: flex;
     flex-wrap: wrap;
     justify-content: center;
     align-items: center;
     gap: 15px;
     font-family: Arial, sans-serif;
   }

   .header-menu li {
     display: flex;
     align-items: center;
     font-size: 16px;
   }

   /* Futuristic 3D Buttons - Dark Green Theme */
   .animated-btn {
     display: inline-block;
     padding: 6px 38px;
     border-radius: 18px;
     background: linear-gradient(145deg, #ffffff, #ffffff);
     color: #000000;
     font-weight: 700;
     font-size: 16px;
     text-decoration: none;
     position: relative;
     overflow: hidden;
     cursor: pointer;
     transition: all 0.3s ease;
     box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4), 0 0 6px rgba(255, 255, 255, 0.05) inset;
     transform-style: preserve-3d;
   }

   .animated-btn::before {
     content: '';
     position: absolute;
     top: -50%;
     left: -50%;
     width: 200%;
     height: 200%;
     background: linear-gradient(55deg, rgb(255, 214, 90), rgb(116 221 21 / 65%), #004d00);
     filter: blur(20px);
     opacity: 0.6;
     animation: glowMove 4s linear infinite;
     pointer-events: none;
   }

   /* Hover 3D lift + soft glow */
   .animated-btn:hover {
     transform: translateY(-5px) scale(1.06);
     box-shadow:
       0 12px 22px rgba(0, 0, 0, 0.5),
       0 0 12px rgba(200, 255, 150, 0.3) inset;
   }

   /* Floating animation */
   .animated-btn {
     animation: floatUnique 3s ease-in-out infinite;
   }

   /* Glow/light movement keyframes */
   @keyframes glowMove {
     0% {
       transform: rotate(0deg) translateX(0) translateY(0);
     }

     50% {
       transform: rotate(180deg) translateX(3%) translateY(3%);
     }

     100% {
       transform: rotate(360deg) translateX(0) translateY(0);
     }
   }

   /* Floating pulse keyframes */
   @keyframes floatUnique {

     0%,
     100% {
       transform: translateY(0) scale(1);
     }

     50% {
       transform: translateY(-4px) scale(1.02);
     }
   }

   /* Special Register Button - slightly lighter green for emphasis */
   .register-btn {
     background: red;
     color: #fff!important;
     box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5),
       0 0 12px rgba(200, 255, 150, 0.3),
       inset 0 -3px 6px rgba(255, 255, 255, 0.05);
     animation: floatRegisterUnique 3s ease-in-out infinite;
   }

   .register-btn::before {
     background: linear-gradient(45deg,
         rgba(255, 255, 255, 0.05),
         rgba(200, 255, 150, 0.2),
         rgba(255, 255, 255, 0.05));
     filter: blur(25px);
   }

   /* Register button float animation */
   @keyframes floatRegisterUnique {

     0%,
     100% {
       transform: translateY(0) scale(1);
       box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5), 0 0 12px rgba(200, 255, 150, 0.3);
     }

     50% {
       transform: translateY(-5px) scale(1.07);
       box-shadow: 0 14px 28px rgba(0, 0, 0, 0.55), 0 0 20px rgba(200, 255, 150, 0.35);
     }
   }

   /* Responsive */
   @media(max-width:768px) {
     .header-menu {
       flex-direction: column;
       gap: 12px;
     }
   }

   /* Header wrapper */
   /* Header wrapper */
   .header-modern {
     position: relative;
     background: #fff;
     border-bottom-left-radius: 50px;
     border-bottom-right-radius: 50px;
     box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15),
       0 12px 40px rgba(0, 0, 0, 0.1);
     z-index: 999;
     font-family: 'Inter', 'Poppins', sans-serif;
     /* modern clean font */
   }

   /* Container */
   .header-modern .container {
     max-width: 1200px;
     margin: 0 auto;
     padding: 0 20px;
   }

   /* Navbar layout */
   .navbar-wrap {
     display: flex;
     align-items: center;
     justify-content: space-between;
     flex-wrap: wrap;
   }

   /* Logo */
   .logo {
     margin-right: 30px;
   }

   .logo-img {
     height: 95px;
     max-width: 313px;
     object-fit: contain;
   }

   /* Navbar toggler for mobile */
   .navbar-toggler {
     display: none;
     border: none;
     background: transparent;
     cursor: pointer;
   }

   .navbar-toggler-icon {
     width: 28px;
     height: 3px;
     background: #1f633c;
     position: relative;
   }

   .navbar-toggler-icon::before,
   .navbar-toggler-icon::after {
     content: '';
     position: absolute;
     width: 28px;
     height: 3px;
     background: #1f633c;
     left: 0;
     transition: 0.3s;
   }

   .navbar-toggler-icon::before {
     top: -8px;
   }

   .navbar-toggler-icon::after {
     bottom: -8px;
   }

   .wave-slider {
     position: relative;
     width: 100%;
     height: 650px !important;
     overflow: hidden;
   }

   /* Menu */
   .nav-menu {
     list-style: none;
     display: flex;
     margin: 0;
     padding: 0;
     align-items: center;
     gap: 25px;
   }

   /* Menu items */
   .nav-menu li {
     position: relative;
   }

   .nav-menu li a {
     text-decoration: none;
     color: #1f633c;
     font-weight: 500;
     padding: 10px 0;
     font-size: 16px;
     transition: color 0.3s, transform 0.2s;
     font-family: 'Montserrat';
     font-weight: 600;
   }

   .nav-menu li a:hover {
     color: #339966;
     transform: translateY(-2px);
   }

   /* Dropdown */
   .has-dropdown:hover .dropdown {
     display: block;
   }

   .dropdown {
     display: none;
     position: absolute;
     top: 110%;
     left: 0;
     background: #fff;
     min-width: 200px;
     box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
     border-radius: 12px;
     padding: 8px 0;
     z-index: 999;
     transition: all 0.3s ease;
   }

   .dropdown li {
     margin: 0;
     list-style: none;
   }

   .dropdown li a {
     padding: 10px 20px;
     display: block;
     color: #1f633c;
     font-size: 15px;
     transition: all 0.2s;
   }

   .dropdown li a:hover {
     background: #ffffff;
     color: #004c00;
     border-radius: 43px;
     transform: translateX(5px);
   }

   /* Responsive */
   @media (max-width: 991px) {
     .navbar-toggler {
       display: block;
     }

     .nav-menu {
       flex-direction: column;
       width: 100%;
       max-height: 0;
       overflow: hidden;
       transition: max-height 0.4s ease;
     }

     .nav-menu.active {
       max-height: 1000px;
     }

     .nav-menu li {
       width: 100%;
     }

     .dropdown {
       position: static;
       box-shadow: none;
       padding-left: 15px;
       border-radius: 0;
     }

     .has-dropdown>a::after {
       content: '\f0d7';
       font-family: "Font Awesome 5 Free";
       font-weight: 900;
       float: right;
     }
   }

   .header-wrap .logo {
     margin-top: 0px;
   }

   .logo {
     margin-right: 0px;
   }

   /* Modern Dark Dropdown */
   .has-dropdown {
     position: relative;
   }

   .dropdown {
     display: block;
     opacity: 0;
     visibility: hidden;
     position: absolute;
     top: 120%;
     left: 0;
     background: #004d00;
     min-width: 220px;
     border-radius: 12px;
     padding: 12px 0;
     box-shadow: 0 12px 25px rgba(0, 0, 0, 0.25);
     transform: translateY(-15px);
     transition: all 0.35s ease;
     z-index: 999;
   }

   /* Show dropdown on hover */
   .has-dropdown:hover .dropdown {
     opacity: 1;
     visibility: visible;
     transform: translateY(0);
   }

   /* Dropdown items */
   .dropdown li a {
     display: block;
     padding: 10px 25px;
     color: #fff;
     font-size: 15px;
     transition: all 0.25s;
   }

   .dropdown li a:hover {
     background: #339966;
     color: #fff;
     border-radius: 43px;
     transform: translateX(5px);
   }

   /* Caret rotation on hover */
   .has-dropdown>a i {
     margin-left: 5px;
     transition: transform 0.3s;
   }

   .has-dropdown:hover>a i {
     transform: rotate(180deg);
   }

   /* Responsive adjustments */
   @media (max-width: 991px) {
     .dropdown {
       position: static;
       transform: translateY(0);
       opacity: 1;
       visibility: visible;
       box-shadow: none;
       background: #1f633c;
       border-radius: 0;
       padding-left: 15px;
     }

     .dropdown li a:hover {
       background: #339966;
     }
   }

   .header-wrap .logo {
     margin-top: 0px;
   }

   .logo {
     margin-right: 0px;
   }

   .tp-banner-container {
     position: relative;
     z-index: 1;
     padding: 0;
     width: 100%;
     margin-top: -95px;
   }

   /* Hide mobile marquee on desktop */
.mobile-menu {
  display: none;
}

/* Show desktop menu only on large screens */
.desktop-menu {
  display: flex;
  gap: 15px;
  list-style: none;
  padding: 0;
  margin: 0;
}

/* Mobile/Tablet */
@media (max-width: 991px) {
  .desktop-menu {
    display: none; /* hide static menu */
  }
 
  .mobile-menu {
    display: block; /* show marquee */
  }
  .mobile-menu a {
    display: inline-block;
    margin-right: 20px;
  }

  /* Marquee button styles */
.mobile-menu a.btn-marquee {
         display: inline-block;
        background-color: white;
        color: #333;
        padding: 2px 20px;
        margin-right: 15px;
        border-radius: 8px;
        text-decoration: none;
        font-weight: 600;
        font-size: 14px;
        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
}

.mobile-menu a.btn-marquee:hover {
  background-color: #f0f0f0;
  color: #000;
  transform: translateY(-2px);
}

/* Optional: specific classes for different button types */
.register-btn {
  border: 2px solid #007bff;
  color: #007bff;
}

.enquiry-btn {
  border: 2px solid #28a745;
  color: #28a745;
}

.parent-login {
  border: 2px solid #ffc107;
  color: #ffc107;
}
.tp-banner-container {
   
     margin-top: 0px!important; 
}
/* Responsive: show marquee only on mobile/tablet */
.header-modern {
    position: relative;
    background: #fff;
    /* border-bottom-left-radius: 50px; */
    /* border-bottom-right-radius: 50px; */
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15), 0 12px 40px rgba(0, 0, 0, 0.1);
    z-index: 999;
    font-family: 'Inter', 'Poppins', sans-serif;
}


.logo-img {
    height: 70px;
    max-width: 240px;
    object-fit: contain;
}


.feature-card {
    background: #fff;
    width: 352px!important;
    padding: 40px 39px!important;
    color: #222;
    position: relative;
    z-index: 1;
    overflow: hidden;
    cursor: pointer;
    transition: transform 0.3s, box-shadow 0.3s;
    clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}

}

/* Responsive: Side Slide Menu */
@media (max-width: 991px) {


  .nav-menu {
    position: fixed;
    top: 0;
    left: 0px; /* Shuruat mein screen se bahar (left side) */
    width: 280px; /* Menu ki chaudai */
    height: 100vh;
    background: #004d00; /* Dark green background */
    flex-direction: column;
    padding: 80px 20px 20px 20px;
    transition: 0.4s ease-in-out;
    max-height: none; /* Purana max-height hata diya */
    display: flex;
    z-index: 1000;
    box-shadow: 5px 0 15px rgba(0,0,0,0.3);
    overflow-y: auto;
  }

  /* Jab menu active ho to screen par aa jaye */
  .nav-menu.active {
    left: 0;
  }

  .nav-menu li {
    width: 100%;
    border-bottom: 1px solid rgba(255,255,255,0.1);
  }

  .nav-menu li a {
    color: #fff !important;
    display: block;
    padding: 15px 0;
  }

  .dropdown {
    position: static;
    opacity: 1;
    visibility: visible;
    transform: none;
    background: rgba(0,0,0,0.2);
    display: none; /* Click par khulne ke liye */
  }

  /* Dropdown toggle class for mobile */
  .nav-menu li.open .dropdown {
    display: block;
  }
}

/* Purana dropdown style update karein */
@media (max-width: 991px) {

    /* Mobile par hover effect ko band karein taaki JS animation clash na ho */
    .has-dropdown:hover .dropdown {
        display: none; /* Hover par dropdown nahi khulega */
        opacity: 1;
        visibility: visible;
        transform: none;
    }

   
    .dropdown {
        position: static !important;
        display: none; /* Default hidden for JS slideToggle */
        width: 100% !important;
        box-shadow: none !important;
        transform: none !important;
        opacity: 1 !important;
        visibility: visible !important;
        background: rgba(0, 0, 0, 0.2) !important; /* Darker background for sub-menu */
    }
    .has-dropdown > a i {
        display: none !important;
    }

    /* Pehle se maujood font-awesome icon ko hatayein agar double hai */
    .has-dropdown > a::after {
        content: '\f0d7'; /* Single arrow icon */
        font-family: "Font Awesome 5 Free";
        font-weight: 900;
        float: right;
        margin-right: 10px;
        transition: transform 0.3s;
    }

    /* Jab menu open ho to arrow rotate ho jaye */
    .has-dropdown.open > a::after {
        transform: rotate(180deg);
    }
}
.dropdown{
   display:none;
}

@media (max-width: 991px) {
  /* Mobile dropdown default hidden */
  .nav-menu .has-dropdown > .dropdown {
      display: none; /* Only show via JS */
      opacity: 1 !important;
      visibility: visible !important;
      position: static;
      transform: none;
      box-shadow: none !important;
      background: rgba(0,0,0,0.2);
      width: 100%;
  }


 

  /* Caret rotation */
  .has-dropdown > a::after {
      content: '\f0d7';
      font-family: "Font Awesome 5 Free";
      font-weight: 900;
      float: right;
      margin-right: 10px;
      transition: transform 0.3s;
  }

  .has-dropdown.open > a::after {
      transform: rotate(180deg);
  }
}
 
    .choice-wrap p {
        padding: 0px
    }

    .students_box {
        display: flow-root;
        text-align: center;
    }

    .link {
        font-size: 20px;
        font-family: cursive;
        font-weight: bold;
        color: blue;
    }

    .link:hover {
        color: #b30029;
        text-decoration: none;
    }

    .enroll-wrap {
        /*background: url(images/bg.jpg) !important;*/
        padding: 43px 0;
        background-attachment: fixed !important;
    }

    .circle {
        width: 130px;
        height: 130px;
        border-radius: 100%;
        border: solid 3px white;
        background: #1e633b;
        box-shadow: 1px 8px 16px 1px #ffffff;
        text-align: center;
    }

    .circle a {
        color: white;
        margin-top: 36px;
        display: inline-block;
        font-size: 18px;
    }

    .circle:hover {
        background: black;
    }

    .circle a:hover {
        text-decoration: none;
        color: #b30029;
    }

    .categories-course {
        border-radius: 118px !important;
    }

    .coure-icon-inner {
        line-height: 77px !important;
    }

    .class-wrap {
        background: none !important;
    }

    .coure-icon-inner {
        width: 103px !important;
        height: 91px !important;
    }

    .flight-wrap .path_box {
        min-height: 0px !important;
        text-align: center;
    }

    .enroll-wrap {
        background: #000000 !important;
    }

    .path_box {
        background: #1e633b;
    }

    .btn-primary {
        color: #fff;
        background-color: #000000 !important;
        border-color: #000000 !important;
    }

    .item {
        list-style: none !important;
    }

    .testimonials-wrap .title {
        margin-bottom: 0px !important;
        background: #000000 !important;
    }

    .testimonials-wrap .title h1 {
        color: #ffffff;
    }


    .marquee {
        top: 6em;
        position: relative;
        box-sizing: border-box;
        animation: marquee 15s linear infinite;
    }

    .marquee:hover {
        animation-play-state: paused;
    }

    /* Make it move! */
    @keyframes marquee {
        0% {
            top: 8em
        }

        100% {
            top: -11em
        }
    }

    /* Make it look pretty */
    .microsoft .marquee {
        margin: 0;
        padding: 0 1em;
        line-height: 1.5em;
        font: 1em 'Segoe UI', Tahoma, Helvetica, Sans-Serif;
    }

    .microsoft:before,
    .microsoft::before,
    .microsoft:after,
    .microsoft::after {
        left: 0;
        z-index: 1;
        content: '';
        position: absolute;
        pointer-events: none;
        width: 100px;
        height: 2em;
        background-image: linear-gradient(top, #FFF, rgba(255, 255, 255, 0));
    }

    .microsoft:after,
    .microsoft::after {
        bottom: 0;
        transform: rotate(180deg);
    }

    .microsoft:before,
    .microsoft::before {
        top: 0;
    }

    /* Style the links */
    .vanity {
        color: #333;
        text-align: center;
        font: .75em 'Segoe UI', Tahoma, Helvetica, Sans-Serif;
    }

    .vanity a,
    .microsoft a {
        color: #1570A6;
        transition: color .5s;
        text-decoration: none;
    }

    .vanity a:hover,
    .microsoft a:hover {
        color: #F65314;
    }

    /* Style toggle button */
    .toggle {
        display: block;
        margin: 2em auto;
    }

    .section-padding {
        padding: 5px 0;
    }

    .wrapper {
        width: 100%;
        overflow: hidden;
    }

    .photobanner {
        position: relative;
        height: 233px;
        margin-bottom: 30px;
        display: flex;
        width: 100%;
    }

    .photobanner img {
        margin: 0px 25px;
        box-shadow: 2px 2px 8px #8a8a8a;
    }

    .photobanner {
        animation: bannermove 30s linear infinite alternate-reverse;
    }

    @keyframes bannermove {
        from {
            left: 0px;
        }

        to {
            left: -1000px;
        }
    }


    .account-form {
        background: #ffffff none repeat scroll 0 0;
        border-radius: 4px;
        position: relative;
        z-index: 9;
    }

    .register-title {
        background: #f5b120 none repeat scroll 0 0;
        border-radius: 3px 3px 0 0;
        padding-bottom: 7px;
        padding-top: 11px;
    }

    .register-title>h4 {
        color: #ffffff;
        display: inline-block;
        font-size: 18px;
        font-weight: 400;
        position: relative;
        top: -2px;
    }

    .fade,
    .slide {
        color: #FFFFFF;
        font-size: 13px;
        padding: 10px;
    }



    .birthday-card {
        width: 320px;
        margin: auto;
        background: none;
        border-radius: 16px;
        padding: 0px 15px 0px 15px;
        /* border: 1px solid #e6e6e6; */

        text-align: center;
        position: relative;
        animation: popCard 1.2s ease;
        justify-items: anchor-center;
    }

    .birthday-card::before {
        content: "";
        position: absolute;
        inset: -3px;
        border-radius: 18px;
        background: none;
        z-index: -1;
        filter: blur(10px);
        opacity: .5;
    }

    .photo-wrap {
        width: 250px;
        height: 250px;

        border-radius: 16px;
        padding: 3px;
        background: linear-gradient(135deg, #004d00, #618d33);
        animation: pulseGlow 6s infinite;
    }

    .photo-wrap img {
        width: 100%;
        height: 100%;
        border-radius: 12px;
        object-fit: fill;
        background: #fff;
    }
    

    .student-info {
        /* background: #004d00; */
        border-radius: 12px;
        padding: 12px 10px;
        color: #fff;
        /* box-shadow: 0 6px 15px rgba(0, 0, 0, .25); */
        width: 100%;
    }

    .student-info h3 {
        font-size: 22px;
        font-weight: 700;
        margin: 0 0 0px;
        color: #004d00;
        font-family: 'poppins', sans-serif;
    }

    .student-info p {
        margin: 0;
        font-size: 16px;
        color: black;
    }

    .student-info span {
        display: block;
        /* margin-top: 3px; */
        font-size: 16px;
        color: #3f7931;
    }

    /* Card pop animation - smooth */
    @keyframes popCard {
        0% {
            transform: scale(.9);
            opacity: 0
        }

        100% {
            transform: scale(1);
            opacity: 1
        }
    }

    /* Glow pulse - slow */
    @keyframes pulseGlow {

        0%,
        100% {
            box-shadow: 0 0 8px rgba(10, 97, 71, 0.6)
        }

        50% {
            box-shadow: 0 0 18px rgba(35, 167, 116, 0.8)
        }
    }

    /* Mobile responsive */
    @media(max-width:768px) {
        .birthday-card {
            width: 260px
        }

        .photo-wrap {
            width: 190px;
            height: 190px
        }
    }

    /* Topper Card Wrapper */
.topper-card {
    width: 320px;
    margin: auto;
    background: none;
    border-radius: 16px;
    padding: 0px 15px 0px 20px;
    text-align: center;
    position: relative;
    animation: popCard 1.2s ease;
    justify-items: center;
}
/* Golden glow frame */
.topper-card::before{
    content:"";
    position:absolute;
    inset:-3px;
    border-radius:18px;
  
    z-index:-1;
    filter:blur(10px);
    opacity:.6;
}

/* Photo Frame */
.topper-photo {
    width: 250px;
    height: 250px;
   
    border-radius: 16px;
    padding: 4px;
    background: linear-gradient(135deg, #63913e, #1f3620);
    animation: pulseGlowGold 6s infinite;
}
.topper-photo img{
    width:100%;
    height:100%;
    border-radius:12px;
    object-fit:fill;
    background:#fff;
}

.topper-info {
   
    border-radius: 12px;
    padding: -1px 10px;
    color: #fff;
   
 font-family: 'poppins', sans-serif;
}

.topper-info h3 {
    font-size: 24px;
    font-weight: 800;
    margin: 0 0 4px;
    color: #1a301e;
    font-family: 'poppins', sans-serif;
    margin: 0px;
}

.topper-info p{
    margin:0;
    font-size:16px;
    color:black;
    margin-bottom:0px

}

.topper-info span {
    display: block;
    /* margin-top: 3px; */
    font-size: 16px;
    color: #223b24;
    text-transform: uppercase;
}

/* Gold glow */
@keyframes pulseGlowGold{
    0%,100%{box-shadow:0 0 8px rgba(212,175,55,.6)}
    50%{box-shadow:0 0 18px rgba(255,215,0,.9)}
}



    /* Close button at top-right */
    .modal-close-btn {
        position: absolute;
        top: 10px;
        right: 15px;
        font-size: 28px;
        font-weight: bold;
        color: #333;
        background: rgba(255, 255, 255, 0.8);
        border: none;
        border-radius: 50%;
        width: 38px;
        height: 38px;
        line-height: 28px;
        text-align: center;
        cursor: pointer;
        z-index: 1050;
        transition: 0.2s;
    }

    .modal-close-btn:hover {
        background: rgba(255, 255, 255, 1);
        color: #000;
    }


  
        /* ----------- Background Zoom ----------- */
        .wave-slider {
            position: relative;
            width: 100%;
            height: 600px;
            overflow: hidden;
        }

        .wave-slider img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            animation: zoomPan 20s ease-in-out infinite alternate;
        }

        @keyframes zoomPan {
            0% {
                transform: scale(1) translateX(0);
            }

            50% {
                transform: scale(1.1) translateX(2%);
            }

            100% {
                transform: scale(1) translateX(0);
            }
        }

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

        /* ----------- Centered Container ----------- */
        .wave-text-container {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            z-index: 2;
            display: flex;
            justify-content: center;
            width: 100%;
        }

        /* ----------- Letter Animation ----------- */
        .wave-text {
            display: flex;
            flex-wrap: nowrap;
            justify-content: center;
            font-size: 80px;
            font-weight: 900;
            font-family: "Sansita Swashed", system-ui;
            font-optical-sizing: auto;
            font-weight: 600;
            font-style: normal;
        }

        .wave-text span {
            display: inline-block;
            margin: 0 2px;
            animation: jumpWave 1.5s ease-in-out infinite;
            /* White fill */
            color: #fff;
            /* Dark green border around letters */
            -webkit-text-stroke: 2px darkgreen;
            /* Chrome, Safari, Edge */
            text-stroke: 2px darkgreen;
            /* Future standard */
            /* Optional: subtle shadow for depth */
            text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
        }

        .wave-text span.space {
            margin: 0 8px;
        }

        @font-face {
            font-family: 'EngraversOldEnglish';
            src: url('../fonts/OPTIEngraversOldEnglish.otf') format('opentype');
            font-weight: normal;
            font-style: normal;
        }

        /* First letters with thinner stroke */
        .wave-text span.first-letter {
            font-family: 'EngraversOldEnglish', serif !important;
            font-size: 1.1em;
            /* slightly bigger if you want */
            -webkit-text-stroke: 1px darkgreen;
            /* thinner stroke */
            text-stroke: 1px darkgreen;
            text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.3);
        }

        /* Jumping wave animation */
        @keyframes jumpWave {

            0%,
            100% {
                transform: translateY(0);
            }

            25% {
                transform: translateY(-15px) rotate(-5deg);
            }

            50% {
                transform: translateY(0) rotate(0deg);
            }

            75% {
                transform: translateY(-10px) rotate(3deg);
            }
        }

        /* ----------- Responsive ----------- */
        @media screen and (max-width:768px) {
            .wave-text {
                font-size: 50px;
            }
            .heroSwiper {
   
    margin-top: 0px!important; 
}
.header-modern {
    
    border-bottom-left-radius: 0px!important; 
    border-bottom-right-radius: 0px!important;
   
}
        }
.navbar-wrap{
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 12px;
}

.logo{
    display: flex;
    align-items: center;
}

.logo-img{
    max-height: 45px;
}

.navbar-toggler{
    background: none;
    border: none;
    font-size: 26px;
    cursor: pointer;
    display: none;
}

/* Mobile View */
@media (max-width: 991px){
    .navbar-toggler{
        display: block;
    }

    .navbar{
        display: none;
    }
}
        @media screen and (max-width:480px) {
            .wave-text {
                font-size: 30px;
            }
        }

        .tp-arr-iwrapper {
            color: #ffffff;
            text-align: center;
            font-size: 30px;
            font-family: 'Font Awesome 5 Free';
            font-weight: bold;
            line-height: 60px;
            background: #004d00;
            /* border-radius: 17px; */
        }
    

        
        /* Section and background remain same */
        .features-section {
            position: relative;
            padding: 80px 20px;
            background: linear-gradient(135deg, #1e633b, #1b311b, #222b26, #1b311b, #203328, #1b311b, #1e633b, #1b311b, #343f39, #1b311b, #08180f, #1b311b, #1e633b, #1b311b);
            text-align: center;
            overflow: hidden;
         
        }

        .features-section .section-title {
            font-size: 36px;
            font-weight: 700;
            margin-bottom: 50px;
            color: #fff;
        }

        .features-grid {
            display: flex;
            flex-wrap: wrap;
            gap: 30px;
            justify-content: center;
        }

        /* ---------- Animated Background Balls ---------- */
        .animated-bg {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            z-index: 0;
            pointer-events: none;
        }

        .animated-bg div {
            position: absolute;
            width: 15px;
            height: 15px;
            background: rgba(255, 255, 255, 0.2);
            border-radius: 50%;
            animation: float 20s linear infinite;
        }

        @keyframes float {
            0% {
                transform: translate(0, 0) scale(1);
                opacity: 0.3;
            }

            50% {
                transform: translate(100px, -200px) scale(1.5);
                opacity: 0.6;
            }

            100% {
                transform: translate(-50px, 100px) scale(1);
                opacity: 0.3;
            }
        }

        /* ---------- Feature Card Hexagon ---------- */
        .feature-card {
            background: #fff;
            width: 400px;
            padding: 40px 50px;
            color: #222;
            position: relative;
            z-index: 1;
            overflow: hidden;
            cursor: pointer;
            transition: transform 0.3s, box-shadow 0.3s;
            clip-path: polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%);
            display: flex;
            flex-direction: column;
            align-items: center;
            justify-content: flex-start;
            box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
        }

        .feature-card::before {
            content: '';
            position: absolute;
            top: -50%;
            left: -50%;
            width: 200%;
            height: 200%;
            background: rgba(255, 255, 255, 0.05);
            transform: rotate(0deg);
            animation: glowAnim 10s linear infinite;
            z-index: 0;
            clip-path: inherit;
        }

        @keyframes glowAnim {
            0% {
                transform: rotate(0deg);
            }

            100% {
                transform: rotate(360deg);
            }
        }

        /* ---------- Floating particles inside card ---------- */
        .card-particles {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            pointer-events: none;
            z-index: 0;
        }

        .card-particles div {
            position: absolute;
            font-size: 16px;
            opacity: 0.1;
            animation: moveParticle 10s linear infinite;
        }

        @keyframes moveParticle {
            0% {
                transform: translate(0, 0) rotate(0deg);
                opacity: 0.1;
            }

            50% {
                transform: translate(50px, -50px) rotate(180deg);
                opacity: 0.3;
            }

            100% {
                transform: translate(-30px, 30px) rotate(360deg);
                opacity: 0.1;
            }
        }

        /* Card content above particles */
        .feature-card>*:not(.card-particles) {
            position: relative;
            z-index: 1;
        }

        /* Hover 3D lift */
        .feature-card:hover {
            transform: translateY(-10px) scale(1.05);
            box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
        }

        /* Hexagon Icon */
        .feature-icon {
            width: 80px;
            height: 80px;
            margin: 0 auto 20px;
            display: flex;
            align-items: center;
            justify-content: center;
            background: linear-gradient(135deg, #004400, #008800);
            clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%);
            transition: transform 0.3s;
        }

        .feature-icon img {
            width: 40px;
            height: 40px;
            filter: brightness(0) invert(1);
        }

        .feature-card:hover .feature-icon {
            transform: scale(1.1);
        }

        /* Card text */
        .feature-card h3 {
            font-size: 22px;
            margin-bottom: 15px;
        }

        .feature-card p {
            font-size: 15px;
            line-height: 1.6;
            color: #333;
        }

        /* Responsive */
        @media (max-width: 992px) {
            .features-grid {
                flex-direction: column;
                align-items: center;
            }
        }
    

      
        /* Section styling */
        .unique-slider-section {
            padding: 105px 0 2px;
            background: #fefefe;
            font-family: 'Arial', sans-serif;
        }

      .unique-slider .slider-item {
    padding: 10px;
    list-style: none;
}

     .slider-box {
    background: #1e633b;
    border-radius: 20px;
    overflow: hidden;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.25);
    transition: transform 0.5s ease, box-shadow 0.5s ease;
    transform-style: preserve-3d;
    position: relative;
    background: radial-gradient(circle at top left, #004d00, #004d00);
    list-style: none;
}
        /* Hover 3D pop */
        .slider-box:hover {
            transform: rotateY(5deg) scale(1.05);
            box-shadow: 0 25px 50px rgba(0, 0, 0, 0.35);
        }

        /* Image styling */
        .slider-img {
            position: relative;
            overflow: hidden;
            height: 240px;
        }

        .slider-img img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            border-bottom-left-radius: 30px;
            border-bottom-right-radius: 30px;
            transition: transform 1.5s ease;
        }

        .slider-img img:hover {
            transform: scale(1.1) rotate(1deg);
        }

        /* Content */
        .slider-content {
            padding: 15px;
            color: #fff;
            position: relative;
            overflow: hidden;
        }

        /* Animated heading and description */
        .slider-content h3 a {
            display: inline-block;
            background: #fff;
            color: #1e633b;
            padding: 8px 15px;
            border-radius: 10px;
            text-decoration: none;
            margin-bottom: 15px;
            font-size: 22px;
            transition: all 0.3s ease;
            animation: slideIn 1s ease forwards;
            margin-bottom: 0px;
        }

        .slider-content h3 a:hover {
            background: #1e633b;
            color: #fff;
        }

        .slider-desc {
            font-size: 16px;
            line-height: 1.6;
            margin-bottom: 20px;
            opacity: 0;
            transform: translateY(20px);
            animation: fadeUp 1s ease forwards;
            animation-delay: 0.3s;
            color: white;
            text-align: justify;
        }

        .btn-slider {
            display: inline-block;
            padding: 10px 25px;
            font-weight: bold;
            font-size: 15px;
            color: #000000;
            background-color: #ffffff;
            border-radius: 8px;
            text-decoration: none;
            position: relative;
            overflow: hidden;
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
            transition: all 0.3s ease;
        }

        p,
        span,
        a,
        li,
        button {
            font-family: 'Poppins', 'Nunito', sans-serif;
        }

        .btn-slider:hover {
            display: inline-block;
            padding: 10px 25px;
            font-weight: bold;
            font-size: 15px;
            color: #000000;
            background-color: #ffffff !important;
            border-radius: 8px;
            text-decoration: none;
            position: relative;
            overflow: hidden;
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
            transition: all 0.3s ease;
        }

        .btn-slider::before {
            content: '';
            position: absolute;
            top: -50%;
            left: -50%;
            width: 200%;
            height: 200%;
            background: linear-gradient(45deg, rgba(26, 82, 29, 0.1), rgba(29, 92, 32, 0.2), rgb(19, 82, 22));
            transform: rotate(45deg);
            animation: shine 3s linear infinite;
        }

        @keyframes shine {
            0% {
                transform: translate(-100%, -100%) rotate(45deg);
            }

            50% {
                transform: translate(100%, 100%) rotate(45deg);
            }

            100% {
                transform: translate(-100%, -100%) rotate(45deg);
            }
        }

        .btn-slider:hover {
            background-color: #1e633b;
            box-shadow: 0 8px 25px rgba(0, 0, 0, 0.4);
        }

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

        /* Heading slideIn animation */
        @keyframes slideIn {
            from {
                opacity: 0;
                transform: translateX(-50px);
            }

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

        /* Owl Carousel arrows & dots */
        .unique-slider .owl-nav button.owl-prev,
        .unique-slider .owl-nav button.owl-next {
            position: absolute;
            top: 50%;
            transform: translateY(-50%);
            background-color: #1e633b;
            color: #fff;
            border-radius: 50%;
            padding: 10px 15px;
            font-size: 20px;
            box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
            transition: all 0.3s ease;
        }

        .unique-slider .owl-nav button.owl-prev:hover,
        .unique-slider .owl-nav button.owl-next:hover {
            background-color: #1e633b;
        }

        .unique-slider .owl-nav button.owl-prev {
            left: -25px;
        }

        .unique-slider .owl-nav button.owl-next {
            right: -25px;
        }

        .unique-slider .owl-dots {
            text-align: center;
            margin-top: 20px;
        }

        .unique-slider .owl-dot {
            display: inline-block;
            width: 14px;
            height: 14px;
            margin: 5px;
            background: #1e633b;
            border-radius: 50%;
            transition: all 0.3s ease;
        }

        .unique-slider .owl-dot.active {
            background: #1e633b;
        }

        /* Responsive */
        @media(max-width: 991px) {
            .slider-box {
                transform: none !important;
            }

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

            .innerHeading-wrap {
           padding: 75px 0 0px 0px !important;
    text-align: center;
    background: #fff;
    position: relative;
    margin-top: -70px;
}
        }

        .slider-box {
            display: flex;
            flex-direction: column;
            height: 500px;
            /* fixed height for all cards */
        }

        .slider-img {
            flex-shrink: 0;
        }

        .slider-content {
            flex-grow: 1;
            display: flex;
            flex-direction: column;
        }
    

      
                            .btn-animated {
                                position: relative;
                                display: inline-block;
                                padding: 4px 28px;
                                background-color: #1e633b;
                                color: #fff;
                                font-weight: bold;
                                font-size: 16px;
                                text-decoration: none;
                                border-radius: 10px;
                                overflow: hidden;
                                box-shadow: 0 5px 15px rgba(0, 0, 0, 0.2);
                                transition: all 0.3s ease;
                                text-align: justify;
                            }

                            /* Animated overlay effect */
                            .btn-animated::before {
                                content: '';
                                position: absolute;
                                top: -50%;
                                left: -50%;
                                width: 200%;
                                height: 200%;
                                background: linear-gradient(45deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0.1));
                                transform: rotate(45deg);
                                animation: shine 3s linear infinite;
                            }

                            /* Keyframes for continuous animation */
                            @keyframes shine {
                                0% {
                                    transform: translate(-100%, -100%) rotate(45deg);
                                }

                                50% {
                                    transform: translate(100%, 100%) rotate(45deg);
                                }

                                100% {
                                    transform: translate(-100%, -100%) rotate(45deg);
                                }
                            }

                            /* Optional hover effect */
                            .btn-animated:hover {
                                background-color: #1e633b;
                                box-shadow: 0 8px 25px rgba(0, 0, 0, 0.3);
                            }
                        

                         
        #about {
            background-color: #ffffff;
            background-image: linear-gradient(rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.88)), url(https://static.vecteezy.com/system/resources/previews/008/041/547/non_2x/school-stuff-pattern-free-vector.jpg);
            background-repeat: repeat;
            background-size: 420px;
            padding: 50px 0px;
        }

        /* 3D Look for the main box */
        .about-section::before {
            content: '';
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: linear-gradient(145deg, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.1));
            box-shadow: 8px 8px 20px rgba(0, 0, 0, 0.2), -8px -8px 20px rgba(255, 255, 255, 0.5);
            z-index: -1;
            border-radius: 15px;
        }

        .about-title {
            font-size: 48px;
            font-weight: bold;
            color: darkgreen;
            text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.3);
            margin-bottom: 20px;
        }

        .about-text {
            font-size: 18px;
            line-height: 32px;
            color: #000;
            font-weight: 500;
            text-align: justify;
        }

        .read-more {
            display: inline-block;
            margin-top: 15px;
            color: darkgreen;
            font-weight: bold;
            text-decoration: none;
            border-bottom: 2px solid darkgreen;
            transition: all 0.3s ease;
        }

        .read-more:hover {
            color: black;
            border-color: black;
        }

        /* Notice box styling */
        .notice-box {
            background: darkgreen;
            padding: 15px;
            border-radius: 15px;
            box-shadow: 4px 4px 15px rgba(0, 0, 0, 0.2);
            overflow: hidden;
        }

        .notice-scroll marquee {
            color: white;
            font-weight: bold;
            line-height: 1.8;
        }

        @media (max-width: 991px) {
            .about-title {
                font-size: 36px;
            }

            .about-text {
                font-size: 16px;
            }
            .wa-card-bg{
display:none;

            }
        }
    


      
       
        .wa-activity-card {
            position: relative;
            /* Needed for absolute bg card */
            overflow: visible;
            /* Allow background card to peek */
            background: #fff;
            border-radius: 20px;
            box-shadow: 0 25px 50px rgba(0, 0, 0, 0.25);
            transition: transform 0.5s ease, box-shadow 0.5s ease;
            display: flex;
            flex-direction: column;
            justify-content: flex-start;
            height: 350px;
        }

        .wa-card-bg {
            position: absolute;
            top: 15px;
            left: 15px;
            width: 100%;
            height: 100%;
            background: #fff;
            border-radius: 20px;

            z-index: 0;
            animation: wa-peek 6s ease-in-out infinite;
            box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;
        }

        *

        /* Move background card behind image */
        .wa-activity-img {
            position: relative;
            z-index: 1;
           
            height: 100%;
            overflow: hidden;
            border-radius: 20px;
        }

        @keyframes wa-peek {

            0%,
            100% {
                transform: translate(0, 0) rotate(0deg);
            }

            25% {
                transform: translate(-10px, -5px) rotate(-2deg);
            }

            50% {
                transform: translate(10px, -10px) rotate(2deg);
            }

            75% {
                transform: translate(-5px, -5px) rotate(-1deg);
            }
        }
    
    
       
        .weekly-activities-section {
            position: relative;
            padding: 40px 0;
            background: #1e633b;
            font-family: 'Verdana', sans-serif;
            overflow: hidden;
        }

      
        .wa-bg-balls span {
            position: absolute;
            border-radius: 50%;
            background: rgba(255, 255, 255, 0.1);
            animation: wa-float 25s linear infinite;
            bottom: -150px;
        }

        .wa-bg-balls span:nth-child(1) {
            width: 50px;
            height: 50px;
            left: 5%;
            animation-delay: 0s;
        }

        .wa-bg-balls span:nth-child(2) {
            width: 60px;
            height: 60px;
            left: 15%;
            animation-delay: 2s;
        }

        .wa-bg-balls span:nth-child(3) {
            width: 40px;
            height: 40px;
            left: 25%;
            animation-delay: 4s;
        }

        .wa-bg-balls span:nth-child(4) {
            width: 70px;
            height: 70px;
            left: 35%;
            animation-delay: 6s;
        }

        .wa-bg-balls span:nth-child(5) {
            width: 30px;
            height: 30px;
            left: 45%;
            animation-delay: 8s;
        }

        .wa-bg-balls span:nth-child(6) {
            width: 55px;
            height: 55px;
            left: 55%;
            animation-delay: 10s;
        }

        .wa-bg-balls span:nth-child(7) {
            width: 50px;
            height: 50px;
            left: 65%;
            animation-delay: 12s;
        }

        .wa-bg-balls span:nth-child(8) {
            width: 60px;
            height: 60px;
            left: 75%;
            animation-delay: 14s;
        }

        .wa-bg-balls span:nth-child(9) {
            width: 35px;
            height: 35px;
            left: 85%;
            animation-delay: 16s;
        }

        .wa-bg-balls span:nth-child(10) {
            width: 45px;
            height: 45px;
            left: 90%;
            animation-delay: 18s;
        }

        @keyframes wa-float {
            0% {
                transform: translateY(0) rotate(0deg);
                opacity: 0.3;
            }

            50% {
                opacity: 0.7;
            }

            100% {
                transform: translateY(-1000px) rotate(360deg);
                opacity: 0.3;
            }
        }

        /* Section title */
        .wa-section-title h2 {
            color: #fff;
            font-size: 34px;
            font-weight: bold;
            margin-bottom: 10px;
        }

        .wa-section-title p {
            color: #e0f2f1;
            font-size: 16px;
        }

        /* Activities list */
        .wa-activities-list {
            list-style: none;
            padding: 0;
            margin: 0 -15px;
            display: flex;
            flex-wrap: wrap;
        }

        .wa-activities-list li {
            padding: 15px;
        }

        .wa-activity-card:hover {
            transform: translateY(-15px) rotateY(4deg);
            box-shadow: 0 40px 80px rgba(0, 0, 0, 0.35);
        }

        /* Image */
        .wa-activity-img img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform 1.5s ease;
        }

        .wa-activity-card:hover .wa-activity-img img {
            transform: scale(1.1) rotate(1deg);
        }

        /* Overlay heading */
        .wa-overlay {
            position: absolute;
            bottom: 0;
            width: 100%;
            padding: 15px;
            background: rgba(0, 0, 0, 0.5);
            color: #fff;
            text-align: center;
            transition: background 0.3s ease;
        }

        .wa-activity-card:hover .wa-overlay {
            background: rgba(0, 0, 0, 0.7);
        }

        /* Responsive */
        @media(max-width:991px) {
            .wa-activity-card {
                height: auto;
            }

            .wa-activity-img {
                height: 250px;
            }
        }

        .sg-school-gallery {
            background-color: #ffffff;
            background-image: linear-gradient(rgba(255, 255, 255, 0.78), rgba(255, 255, 255, 0.78)), url(https://img.freepik.com/free-vector/flat-small-flowers-pattern_23-2149664322.jpg?semt=ais_user_personalization&w=740&q=80);
            background-repeat: repeat;
            background-size: 420px;
            padding: 50px 0px;
        }
    

     
        .sg-school-gallery {
            position: relative;
            padding: 40px 0;
            font-family: 'Verdana', sans-serif;
            overflow: hidden;
        }

        /* FLOATING BALLS */
        .sg-bg-balls span {
            position: absolute;
            border-radius: 50%;
            background: rgba(6, 78, 59, 0.08);
            animation: sg-float 22s linear infinite;
            bottom: -100px;
        }

        .sg-bg-balls span:nth-child(1) {
            width: 60px;
            height: 60px;
            left: 5%;
            animation-delay: 0s;
        }

        .sg-bg-balls span:nth-child(2) {
            width: 40px;
            height: 40px;
            left: 20%;
            animation-delay: 2s;
        }

        .sg-bg-balls span:nth-child(3) {
            width: 50px;
            height: 50px;
            left: 35%;
            animation-delay: 4s;
        }

        .sg-bg-balls span:nth-child(4) {
            width: 70px;
            height: 70px;
            left: 50%;
            animation-delay: 6s;
        }

        .sg-bg-balls span:nth-child(5) {
            width: 30px;
            height: 30px;
            left: 65%;
            animation-delay: 8s;
        }

        .sg-bg-balls span:nth-child(6) {
            width: 45px;
            height: 45px;
            left: 80%;
            animation-delay: 10s;
        }

        .sg-bg-balls span:nth-child(7) {
            width: 55px;
            height: 55px;
            left: 90%;
            animation-delay: 12s;
        }

        @keyframes sg-float {
            0% {
                transform: translateY(0) rotate(0deg);
                opacity: 0.2;
            }

            50% {
                opacity: 0.6;
            }

            100% {
                transform: translateY(-900px) rotate(360deg);
                opacity: 0.2;
            }
        }

        /* SECTION TITLE */
        .sg-title h2 {
            font-size: 34px;
            font-weight: bold;
            color: #1e633b;
            margin-bottom: 8px;
        }

        .sg-title p {
            font-size: 16px;
            color: #1e633b;
        }

        /* GALLERY ROW */
        .sg-gallery-row {
            display: flex;
            flex-wrap: wrap;
            margin: 0 -15px;
        }

        .sg-gallery-col {
            padding: 15px;
        }

        /* 3D CARD */
        .sg-gallery-card {
            background: #fff;
            border-radius: 20px;
            overflow: hidden;
            box-shadow: 0 20px 45px rgba(0, 0, 0, 0.15);
            transition: transform 0.8s ease, box-shadow 0.5s ease;
            perspective: 1000px;
            position: relative;
            transform-style: preserve-3d;
            animation: sg-tilt 10s infinite alternate ease-in-out;
        }

        .sg-gallery-card:hover {
            transform: rotateY(6deg) rotateX(3deg) scale(1.05);
            box-shadow: 0 35px 70px rgba(0, 0, 0, 0.25);
        }

        /* RANDOM TILT ANIMATION */
        @keyframes sg-tilt {
            0% {
                transform: rotateY(-2deg) rotateX(-1deg);
            }

            25% {
                transform: rotateY(1deg) rotateX(2deg);
            }

            50% {
                transform: rotateY(-1deg) rotateX(1deg);
            }

            75% {
                transform: rotateY(2deg) rotateX(-1deg);
            }

            100% {
                transform: rotateY(-2deg) rotateX(0deg);
            }
        }

        /* IMAGE */
        .sg-card-img {
            position: relative;
            height: 200px;
            overflow: hidden;
            border-bottom-left-radius: 20px;
            border-bottom-right-radius: 20px;
        }

        .sg-card-img img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform 1.2s ease;
        }

        .sg-gallery-card:hover .sg-card-img img {
            transform: scale(1.1) rotate(1deg);
        }

        /* OVERLAY */
        .sg-card-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(6, 78, 59, 0.25);
            display: flex;
            justify-content: center;
            align-items: center;
            opacity: 0;
            transition: opacity 0.4s ease;
        }

        .sg-gallery-card:hover .sg-card-overlay {
            opacity: 1;
        }

        .sg-card-overlay a {
            color: #fff;
            font-size: 24px;
            background: #1e633b;
            padding: 12px;
            border-radius: 50%;
            transition: background 0.3s ease;
        }

        .sg-card-overlay a:hover {
            background: #1e633b;
        }

        .sg-card-title {
            text-align: center;
            font-size: 18px;
            font-weight: 600;
            color: #1e633b;
            padding: 15px 10px;
            font-family: 'poppins';
        }

        /* RESPONSIVE */
        @media(max-width:991px) {
            .sg-card-img {
                height: 180px;
            }
        }

        @media(max-width:767px) {
            .sg-card-img {
                height: 160px;
            }
        }

        .sg-gallery-card {
            background: #fff;
            border-radius: 20px;
            overflow: hidden;
            box-shadow: 0 20px 45px rgba(0, 12, 17, 0.15);
            transition: transform 0.8s ease, box-shadow 0.5s ease;
            perspective: 1000px;
            position: relative;
            transform-style: preserve-3d;
            animation: sg-tilt 10s infinite alternate ease-in-out;
            border-bottom: 6px solid #1e633b;
            min-height: 281px;
            border-right: 6px solid #1e633b;
        }

        /* Hide arrows initially */
        .carousel .fancy-arrow {
            width: 54px;
            height: 54px;
            top: 50%;
            transform: translateY(-50%) scale(.6);
            border-radius: 50%;
            background: rgba(0, 0, 0, .45);
            backdrop-filter: blur(6px);
            display: flex;
            align-items: center;
            justify-content: center;
            opacity: 0;
            transition: .4s ease;
            z-index: 50;
        }

        /* Show on hover */
        .carousel:hover .fancy-arrow {
            opacity: 1;
            transform: translateY(-50%) scale(1);
            animation: floatArrow 2s infinite ease-in-out;
        }

        /* Arrow icon */
        .fancy-arrow .arrow-icon {
            font-size: 30px;
            font-weight: 900;
            color: #fff;
            transition: .3s;
        }

        /* Hover glow */
        .fancy-arrow:hover {}

        .fancy-arrow:hover .arrow-icon {
            transform: scale(1.25);
        }

        /* Position */
        .carousel-control-prev {
            left: 15px;
        }

        .carousel-control-next {
            right: 15px;
        }

        /* Floating animation */
        @keyframes floatArrow {

            0%,
            100% {
                transform: translateY(-50%) scale(1);
            }

            50% {
                transform: translateY(-55%) scale(1.05);
            }
        }

        /* ===================== COMMON FX LAYERS ===================== */

        .birthday-bg,
        .toppers-bg {
            position: absolute;
            inset: 0;
            overflow: hidden;
            pointer-events: none;
            z-index: 1;
        }

        /* ===================== BIRTHDAY EFFECTS ===================== */

        /* Balloons */
        .balloon {
            position: absolute;
            bottom: -120px;
            width: 30px;
            height: 40px;
            border-radius: 50%;
            animation: floatUp 8s linear infinite;
            opacity: .9;
        }

        .balloon::after {
            content: "";
            position: absolute;
            bottom: -8px;
            left: 50%;
            width: 2px;
            height: 12px;
            background: #fff;
            transform: translateX(-50%);
        }

        .balloon.red {
            background: #ff4d6d;
        }

        .balloon.yellow {
            background: #ffcc00;
        }

        .balloon.blue {
            background: #33ccff;
        }

        .balloon.purple {
            background: #a64dff;
        }

        .balloon.green {
            background: #32d27a;
        }

        /* Confetti */
        .confetti {
            position: absolute;
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: radial-gradient(circle, #ffcc00, #ff4d6d);
            animation: confettiFall 6s linear infinite;
        }

        /* Bubbles */
        .bubble {
            width: 14px;
            height: 14px;
            border-radius: 50%;
            background: rgba(255, 255, 255, .5);
            animation: bubbleFloat 8s linear infinite;
        }

        /* Birthday Animations */
        @keyframes floatUp {
            0% {
                transform: translateY(0) scale(.8);
                opacity: 0;
            }

            20% {
                opacity: 1;
            }

            100% {
                transform: translateY(-750px) scale(1.1);
                opacity: 0;
            }
        }

        @keyframes confettiFall {
            0% {
                transform: translateY(-40px) rotate(0);
                opacity: 0;
            }

            30% {
                opacity: 1;
            }

            100% {
                transform: translateY(650px) rotate(360deg);
                opacity: 0;
            }
        }

        @keyframes bubbleFloat {
            0% {
                transform: translateY(40px);
                opacity: 0;
            }

            50% {
                opacity: .6;
            }

            100% {
                transform: translateY(-350px);
                opacity: 0;
            }
        }

        /* ===================== TOPPERS EFFECTS ===================== */

        .star {
            position: absolute;
            width: 18px;
            height: 18px;
            background: gold;
            clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%,
                    50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
            animation: topperFall 6s linear infinite;
        }

        .ribbon {
            position: absolute;
            width: 14px;
            height: 45px;
            background: #ff4d6d;
            clip-path: polygon(0 0, 100% 0, 100% 85%, 50% 100%, 0 85%);
            animation: topperFall 5s linear infinite;
        }

        .spark {
            position: absolute;
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: gold;
            box-shadow: 0 0 10px gold;
            animation: topperFall 4s linear infinite;
        }

        @keyframes topperFall {
            0% {
                transform: translateY(-50px) rotate(0);
                opacity: 0;
            }

            30% {
                opacity: 1;
            }

            100% {
                transform: translateY(650px) rotate(360deg);
                opacity: 0;
            }
        }
    

     
        .sg-school-gallery {
            position: relative;
            padding: 40px 0;
            font-family: 'Verdana', sans-serif;
            overflow: hidden;
        }

        /* FLOATING BALLS */
        .sg-bg-balls span {
            position: absolute;
            border-radius: 50%;
            background: rgba(6, 78, 59, 0.08);
            animation: sg-float 22s linear infinite;
            bottom: -100px;
        }

        .sg-bg-balls span:nth-child(1) {
            width: 60px;
            height: 60px;
            left: 5%;
            animation-delay: 0s;
        }

        .sg-bg-balls span:nth-child(2) {
            width: 40px;
            height: 40px;
            left: 20%;
            animation-delay: 2s;
        }

        .sg-bg-balls span:nth-child(3) {
            width: 50px;
            height: 50px;
            left: 35%;
            animation-delay: 4s;
        }

        .sg-bg-balls span:nth-child(4) {
            width: 70px;
            height: 70px;
            left: 50%;
            animation-delay: 6s;
        }

        .sg-bg-balls span:nth-child(5) {
            width: 30px;
            height: 30px;
            left: 65%;
            animation-delay: 8s;
        }

        .sg-bg-balls span:nth-child(6) {
            width: 45px;
            height: 45px;
            left: 80%;
            animation-delay: 10s;
        }

        .sg-bg-balls span:nth-child(7) {
            width: 55px;
            height: 55px;
            left: 90%;
            animation-delay: 12s;
        }

        @keyframes sg-float {
            0% {
                transform: translateY(0) rotate(0deg);
                opacity: 0.2;
            }

            50% {
                opacity: 0.6;
            }

            100% {
                transform: translateY(-900px) rotate(360deg);
                opacity: 0.2;
            }
        }

        /* SECTION TITLE */
        .sg-title h2 {
            font-size: 34px;
            font-weight: bold;
            color: #1e633b;
            margin-bottom: 8px;
        }

        .sg-title p {
            font-size: 16px;
            color: #1e633b;
        }

        /* GALLERY ROW */
        .sg-gallery-row {
            display: flex;
            flex-wrap: wrap;
            margin: 0 -15px;
        }

        .sg-gallery-col {
            padding: 15px;
        }

        /* 3D CARD */
        .sg-gallery-card {
            background: #fff;
            border-radius: 20px;
            overflow: hidden;
            box-shadow: 0 20px 45px rgba(0, 0, 0, 0.15);
            transition: transform 0.8s ease, box-shadow 0.5s ease;
            perspective: 1000px;
            position: relative;
            transform-style: preserve-3d;
            animation: sg-tilt 10s infinite alternate ease-in-out;
        }

        .sg-gallery-card:hover {
            transform: rotateY(6deg) rotateX(3deg) scale(1.05);
            box-shadow: 0 35px 70px rgba(0, 0, 0, 0.25);
        }

        /* RANDOM TILT ANIMATION */
        @keyframes sg-tilt {
            0% {
                transform: rotateY(-2deg) rotateX(-1deg);
            }

            25% {
                transform: rotateY(1deg) rotateX(2deg);
            }

            50% {
                transform: rotateY(-1deg) rotateX(1deg);
            }

            75% {
                transform: rotateY(2deg) rotateX(-1deg);
            }

            100% {
                transform: rotateY(-2deg) rotateX(0deg);
            }
        }

        /* IMAGE */
        .sg-card-img {
            position: relative;
            height: 200px;
            overflow: hidden;
            border-bottom-left-radius: 20px;
            border-bottom-right-radius: 20px;
        }

        .sg-card-img img {
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform 1.2s ease;
        }

        .sg-gallery-card:hover .sg-card-img img {
            transform: scale(1.1) rotate(1deg);
        }

        /* OVERLAY */
        .sg-card-overlay {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background: rgba(6, 78, 59, 0.25);
            display: flex;
            justify-content: center;
            align-items: center;
            opacity: 0;
            transition: opacity 0.4s ease;
        }

        .sg-gallery-card:hover .sg-card-overlay {
            opacity: 1;
        }

        .sg-card-overlay a {
            color: #fff;
            font-size: 24px;
            background: #1e633b;
            padding: 12px;
            border-radius: 50%;
            transition: background 0.3s ease;
        }

        .sg-card-overlay a:hover {
            background: #1e633b;
        }

        .sg-card-title {
            text-align: center;
            font-size: 18px;
            font-weight: 600;
            color: #1e633b;
            padding: 15px 10px;
            font-family: 'poppins';
        }

        /* RESPONSIVE */
        @media(max-width:991px) {
            .sg-card-img {
                height: 180px;
            }
        }

        @media(max-width:767px) {
            .sg-card-img {
                height: 160px;
            }
        }

        .sg-gallery-card {
            background: #fff;
            border-radius: 20px;
            overflow: hidden;
            box-shadow: 0 20px 45px rgba(0, 12, 17, 0.15);
            transition: transform 0.8s ease, box-shadow 0.5s ease;
            perspective: 1000px;
            position: relative;
            transform-style: preserve-3d;
            animation: sg-tilt 10s infinite alternate ease-in-out;
            border-bottom: 6px solid #1e633b;
            min-height: 281px;
            border-right: 6px solid #1e633b;
        }

        /* Hide arrows initially */
        .carousel .fancy-arrow {
            width: 54px;
            height: 54px;
            top: 50%;
            transform: translateY(-50%) scale(.6);
            border-radius: 50%;
            background: rgba(0, 0, 0, .45);
            backdrop-filter: blur(6px);
            display: flex;
            align-items: center;
            justify-content: center;
            opacity: 0;
            transition: .4s ease;
            z-index: 50;
        }

        /* Show on hover */
        .carousel:hover .fancy-arrow {
            opacity: 1;
            transform: translateY(-50%) scale(1);
            animation: floatArrow 2s infinite ease-in-out;
        }

        /* Arrow icon */
        .fancy-arrow .arrow-icon {
            font-size: 30px;
            font-weight: 900;
            color: #fff;
            transition: .3s;
        }

        /* Hover glow */
        .fancy-arrow:hover {}

        .fancy-arrow:hover .arrow-icon {
            transform: scale(1.25);
        }

        /* Position */
        .carousel-control-prev {
            left: 15px;
        }

        .carousel-control-next {
            right: 15px;
        }

        /* Floating animation */
        @keyframes floatArrow {

            0%,
            100% {
                transform: translateY(-50%) scale(1);
            }

            50% {
                transform: translateY(-55%) scale(1.05);
            }
        }

        /* ===================== COMMON FX LAYERS ===================== */

        .birthday-bg,
        .toppers-bg {
            position: absolute;
            inset: 0;
            overflow: hidden;
            pointer-events: none;
            z-index: 1;
        }

        /* ===================== BIRTHDAY EFFECTS ===================== */

        /* Balloons */
        .balloon {
            position: absolute;
            bottom: -120px;
            width: 30px;
            height: 40px;
            border-radius: 50%;
            animation: floatUp 8s linear infinite;
            opacity: .9;
        }

        .balloon::after {
            content: "";
            position: absolute;
            bottom: -8px;
            left: 50%;
            width: 2px;
            height: 12px;
            background: #fff;
            transform: translateX(-50%);
        }

        .balloon.red {
            background: #ff4d6d;
        }

        .balloon.yellow {
            background: #ffcc00;
        }

        .balloon.blue {
            background: #33ccff;
        }

        .balloon.purple {
            background: #a64dff;
        }

        .balloon.green {
            background: #32d27a;
        }

        /* Confetti */
        .confetti {
            position: absolute;
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: radial-gradient(circle, #ffcc00, #ff4d6d);
            animation: confettiFall 6s linear infinite;
        }

        /* Bubbles */
        .bubble {
            width: 14px;
            height: 14px;
            border-radius: 50%;
            background: rgba(255, 255, 255, .5);
            animation: bubbleFloat 8s linear infinite;
        }

        /* Birthday Animations */
        @keyframes floatUp {
            0% {
                transform: translateY(0) scale(.8);
                opacity: 0;
            }

            20% {
                opacity: 1;
            }

            100% {
                transform: translateY(-750px) scale(1.1);
                opacity: 0;
            }
        }

        @keyframes confettiFall {
            0% {
                transform: translateY(-40px) rotate(0);
                opacity: 0;
            }

            30% {
                opacity: 1;
            }

            100% {
                transform: translateY(650px) rotate(360deg);
                opacity: 0;
            }
        }

        @keyframes bubbleFloat {
            0% {
                transform: translateY(40px);
                opacity: 0;
            }

            50% {
                opacity: .6;
            }

            100% {
                transform: translateY(-350px);
                opacity: 0;
            }
        }

        /* ===================== TOPPERS EFFECTS ===================== */

        .star {
            position: absolute;
            width: 18px;
            height: 18px;
            background: gold;
            clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%,
                    50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
            animation: topperFall 6s linear infinite;
        }

        .ribbon {
            position: absolute;
            width: 14px;
            height: 45px;
            background: #ff4d6d;
            clip-path: polygon(0 0, 100% 0, 100% 85%, 50% 100%, 0 85%);
            animation: topperFall 5s linear infinite;
        }

        .spark {
            position: absolute;
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: gold;
            box-shadow: 0 0 10px gold;
            animation: topperFall 4s linear infinite;
        }

        @keyframes topperFall {
            0% {
                transform: translateY(-50px) rotate(0);
                opacity: 0;
            }

            30% {
                opacity: 1;
            }

            100% {
                transform: translateY(650px) rotate(360deg);
                opacity: 0;
            }
        }
    

      
        /* Clean Premium Title Bar */
        .top-title {
            display: flex;
            justify-content: center;
            margin-bottom: 15px;
        }

        /* Ribbon Bar */
        .ribbon-title {
            padding: 10px 35px;
            border-radius: 50px;
            font-size: 26px;
            font-weight: 800;
            letter-spacing: 1px;
            text-transform: uppercase;
            color: #fff;
            position: relative;
            overflow: hidden;
            animation: popIn .6s ease;
        }

        .birthday-ribbon {
            background: linear-gradient(135deg, #172b1d, #004d00);
            box-shadow: 0 6px 15px rgba(255, 77, 109, .4);
        }

        /* Toppers Ribbon */
        .topper-ribbon {
            background: linear-gradient(135deg, #172b1d, #004d00);
            color: #ffffff;

        }

        /* Soft shine effect */
        .ribbon-title::after {
            content: "";
            position: absolute;
            top: 0;
            left: -120%;
            width: 120%;
            height: 100%;
            background: linear-gradient(120deg, transparent, rgba(255, 255, 255, .6), transparent);
            animation: shineMove 3s infinite;
        }

        @keyframes shineMove {
            0% {
                left: -120%
            }

            60% {
                left: 120%
            }

            100% {
                left: 120%
            }
        }

        /* Pop animation */
        @keyframes popIn {
            0% {
                transform: scale(.7);
                opacity: 0
            }

            100% {
                transform: scale(1);
                opacity: 1
            }
        }

        /* Frame always behind */
        .birthday-section::before,
        .toppers-section::before {
            z-index: 0;
        }

        .birthday-section::before,
        .toppers-section::before {
            background-size: contain;
            background-position: center center;
        }

        .birthday-section,
        .toppers-section {
            padding: 0px 40px 40px;
            min-height: 600px;
            display: flex;
            align-items: center;
            justify-content: center;
        }

        /* Frame content */
        .birthday-section,
        .toppers-section {
            position: relative;
            z-index: 1;
        }


        /* Birthday Background */
        .birthday-section {
            position: relative;
            overflow: hidden;
        }

        .birthday-section,
        .toppers-section {
            position: relative;
            z-index: 1;
        }

        .carousel {
            position: relative;
            z-index: 2;
        }

        .toppers-section::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            min-height: 600px;
            background: url('../images/toppersjaitu.png') no-repeat center center;
            background-size: 100% 100%;
            z-index: -1;
            /* behind everything */
        }

        /* Birthday frame image */
        .birthday-section::before {
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            min-height: 600px;
            background: url('../images/birthdayjaito.png') no-repeat center center;
            background-size: 100% 100%;
            /* or contain depending on your frame */
            z-index: -1;
            /* behind everything */
        }

        /* Birthday balloons/confetti */
        .birthday-bg {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            pointer-events: none;
            z-index: 0;
        }

        /* Birthday FX Layer */
        .birthday-bg {
            position: absolute;
            inset: 0;
            overflow: hidden;
            pointer-events: none;
            z-index: 1;
        }

        /* Balloons */
        .balloon {
            position: absolute;
            bottom: -120px;
            width: 32px;
            height: 42px;
            border-radius: 50%;
            animation: floatUp 8s linear infinite;
            opacity: .85;
        }

        /* Balloon Colors */
        .balloon.green {
            background: #0f4d1f;
        }

        .balloon.lgreen {
            background: #8aff9e;
        }

        .balloon.white {
            background: #ffffff;
        }

        .balloon.black {
            background: #000;
        }

        .balloon.trans {
            background: rgba(255, 255, 255, .25);
        }

        /* Gift Box - Ab colorful aur realistic */
        .gift {
            position: absolute;
            top: -50px;
            /* Upar se shuru hoga */
            width: 35px;
            height: 35px;
            border-radius: 4px;
            box-shadow: inset 0 0 10px rgba(0, 0, 0, 0.2);
            animation: giftFall 7s linear infinite;
            z-index: 1;
        }

        /* Gift Ribbon Look */
        .gift::before {
            content: "";
            position: absolute;
            left: 45%;
            top: 0;
            width: 10%;
            height: 100%;
            background: rgba(255, 255, 255, 0.8);
        }

        .gift::after {
            content: "";
            position: absolute;
            top: 45%;
            left: 0;
            width: 100%;
            height: 10%;
            background: rgba(255, 255, 255, 0.8);
        }

        /* Gift Colors */
        .gift.red {
            background: #ff4d4d;
        }

        .gift.blue {
            background: #3498db;
        }

        .gift.gold {
            background: #f1c40f;
        }

        .gift.purple {
            background: #9b59b6;
        }

        /* Balloons - Colorful aur Bottom se Up */
        .balloon {
            position: absolute;
            bottom: -100px;
            width: 30px;
            height: 40px;
            border-radius: 50%;
            opacity: 0.8;
            animation: floatUp 8s linear infinite;
        }

        /* Balloon String */
        .balloon::after {
            content: "";
            position: absolute;
            bottom: -15px;
            left: 50%;
            width: 1px;
            height: 15px;
            background: rgba(255, 255, 255, 0.5);
        }

        /* Balloon Colors */
        .balloon.b-red {
            background: #ff5e5e;
        }

        .balloon.b-blue {
            background: #5eb5ff;
        }

        .balloon.b-yellow {
            background: #ffe05e;
        }

        .balloon.b-green {
            background: #5eff8e;
        }

        /* Animations */
        @keyframes giftFall {
            0% {
                transform: translateY(0) rotate(0deg);
                opacity: 0;
            }

            10% {
                opacity: 1;
            }

            90% {
                opacity: 1;
            }

            100% {
                transform: translateY(650px) rotate(360deg);
                opacity: 0;
            }
        }

        @keyframes floatUp {
            0% {
                transform: translateY(0) scale(0.8);
                opacity: 0;
            }

            10% {
                opacity: 1;
            }

            100% {
                transform: translateY(-700px) scale(1.1);
                opacity: 0;
            }
        }

        /* Confetti */
        .confetti {
            position: absolute;
            width: 6px;
            height: 6px;
            border-radius: 50%;
            background: #8aff9e;
            animation: confettiFall 6s linear infinite;
        }

        /* Animations */
        @keyframes floatUp {
            0% {
                transform: translateY(0) scale(.8);
                opacity: 0;
            }

            20% {
                opacity: 1;
            }

            100% {
                transform: translateY(-700px) scale(1.1);
                opacity: 0;
            }
        }

        @keyframes floatUpGift {
            0% {
                transform: translateY(0) rotate(0deg);
                opacity: 0;
            }

            20% {
                opacity: 1;
            }

            100% {
                transform: translateY(-650px) rotate(360deg);
                opacity: 0;
            }
        }

        @keyframes confettiFall {
            0% {
                transform: translateY(-50px) rotate(0);
                opacity: 0;
            }

            30% {
                opacity: 1;
            }

            100% {
                transform: translateY(600px) rotate(360deg);
                opacity: 0;
            }
        }


        /* Falling animation */
        @keyframes fall {
            0% {
                transform: translateY(-100px) rotate(0deg);
                opacity: 0;
            }

            50% {
                opacity: 1;
            }

            100% {
                transform: translateY(500px) rotate(360deg);
                opacity: 0;
            }
        }

        /* Confetti shapes */
        .birthday-bg .confetti {
            width: 10px;
            height: 10px;
            background: yellow;
            clip-path: polygon(0 0, 100% 0, 50% 100%);
            animation: confettiFall 4s linear infinite;
        }

        @keyframes confettiFall {
            0% {
                transform: translateY(-50px) rotate(0deg);
                opacity: 0;
            }

            50% {
                opacity: 1;
            }

            100% {
                transform: translateY(500px) rotate(360deg);
                opacity: 0;
            }
        }

        .toppers-section {
            position: relative;
            overflow: hidden;
        }

        .toppers-bg {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            pointer-events: none;
            z-index: 0;
        }

        .toppers-bg .ribbon,
        .toppers-bg .star {
            position: absolute;
            opacity: 0.8;
            animation: ribbonFall 5s linear infinite;
        }

        .toppers-bg .ribbon {
            width: 7px;
            height: 40px;
            background: #07a82f;
            clip-path: polygon(0 0, 100% 0, 100% 80%, 50% 100%, 0 80%);
        }

        .testimonials-wrap .title {
            margin-bottom: 24px !important;
            background: none !important;
        }

        .toppers-bg .star {
            width: 20px;
            height: 20px;
            background: yellow;
            clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%,
                    50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
        }

        /* Ribbon/Star falling animation */
        @keyframes ribbonFall {
            0% {
                transform: translateY(-50px) rotate(0deg);
                opacity: 0;
            }

            50% {
                opacity: 1;
            }

            100% {
                transform: translateY(450px) rotate(360deg);
                opacity: 0;
            }
        }



        .toppers-bg .spark {
            width: 6px;
            height: 6px;
            background: gold;
            border-radius: 50%;
            box-shadow: 0 0 10px gold;
            animation: sparkFall 4s linear infinite;
        }

        @keyframes sparkFall {
            0% {
                transform: translateY(-30px) scale(.5);
                opacity: 0
            }

            50% {
                opacity: 1
            }

            100% {
                transform: translateY(450px) scale(1.2);
                opacity: 0
            }
        }

        /* TOPPERS FX LAYER */
        .toppers-bg {
            position: absolute;
            inset: 0;
            overflow: hidden;
            pointer-events: none;
            z-index: 1;
        }

        /* Medal */
        .medal {
            position: absolute;
            width: 22px;
            height: 22px;
            border-radius: 50%;
            background: radial-gradient(circle, #ffd700, #ffb800);
            box-shadow: 0 0 12px rgba(255, 215, 0, .9);
            animation: topperFall 6s linear infinite;
        }

        /* Trophy */
        .trophy {
            position: absolute;
            width: 22px;
            height: 22px;
            background: linear-gradient(135deg, #ffcc00, #ff9800);
            clip-path: polygon(20% 0, 80% 0, 100% 40%, 70% 100%, 30% 100%, 0 40%);
            animation: topperFall 7s linear infinite;
        }

        /* Graduation Cap */
        .cap {
            position: absolute;
            width: 22px;
            height: 12px;
            background: #111;
            clip-path: polygon(0 40%, 50% 0, 100% 40%, 50% 80%);
            animation: topperFall 5s linear infinite;
        }

        /* Book */
        .book {
            position: absolute;
            width: 16px;
            height: 22px;
            background: linear-gradient(135deg, #4fc3f7, #0288d1);
            border-radius: 3px;
            animation: topperFall 6s linear infinite;
        }

        /* Soft Spark */
        .spark {
            position: absolute;
            width: 5px;
            height: 5px;
            border-radius: 50%;
            background: gold;
            box-shadow: 0 0 10px gold;
            animation: topperFall 4s linear infinite;
        }

        /* Animation */
        @keyframes topperFall {
            0% {
                transform: translateY(-60px) rotate(0);
                opacity: 0;
            }

            25% {
                opacity: 1;
            }

            100% {
                transform: translateY(650px) rotate(360deg);
                opacity: 0;
            }
        }

        /* FX Layer */
        .birthday-bg {
            position: absolute;
            inset: 0;
            overflow: hidden;
            pointer-events: none;
            z-index: 1;
        }

        /* Balloons */
        .balloon {
            position: absolute;
            bottom: -120px;
            width: 28px;
            height: 38px;
            border-radius: 50%;
            animation: floatUp 8s linear infinite;
            opacity: .85;
        }

        /* Confetti */
        .confetti {
            position: absolute;
            width: 7px;
            height: 7px;
            border-radius: 50%;
            background: radial-gradient(circle, #ffcc00, #ff4d6d);
            animation: confettiFall 5s linear infinite;
        }

        /* Bubble */
        .bubble {
            width: 14px;
            height: 14px;
            border-radius: 50%;
            background: rgba(255, 255, 255, .5);
            animation: bubbleFloat 8s linear infinite;
        }

        /* Animations */
        @keyframes floatUp {
            0% {
                transform: translateY(0) scale(.8);
                opacity: 0;
            }

            20% {
                opacity: 1;
            }

            100% {
                transform: translateY(-700px) scale(1.1);
                opacity: 0;
            }
        }

        @keyframes confettiFall {
            0% {
                transform: translateY(-50px) rotate(0);
                opacity: 0;
            }

            30% {
                opacity: 1;
            }

            100% {
                transform: translateY(600px) rotate(360deg);
                opacity: 0;
            }
        }

        @keyframes bubbleFloat {
            0% {
                transform: translateY(40px);
                opacity: 0;
            }

            50% {
                opacity: .6;
            }

            100% {
                transform: translateY(-350px);
                opacity: 0;
            }
        }
    /* Swiper Navigation Buttons - Premium Dark Green Circular */
.swiper-button-next, .swiper-button-prev {
    width: 73px !important;
    height: 69px !important;
    border-radius: 50%;
    background: radial-gradient(circle at top left, #004d00, #297a00);
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.4), inset 0 0 8px rgba(255, 255, 255, 0.2);
    transition: all 0.3s ease;
}
.swiper-button-next:after,
.swiper-button-prev:after {
    font-size: 22px;
    font-weight: bold;
    color: #fff;
}

.swiper-button-next:hover,
.swiper-button-prev:hover {
    transform: scale(1.08);
    box-shadow: 0 10px 25px rgba(0,0,0,0.5), inset 0 0 10px rgba(255,255,255,0.3);
}

/* Position fine tune */
.swiper-button-prev {
    left: 20px;
}

.swiper-button-next {
    right: 20px;
}

.heroSwiper {
    width: 100%;
    height: 100vh;
    position: relative;
    margin-top: -96px;
}

/* Swiper Pagination Dots - Premium Dark Green */
.swiper-pagination-bullet {
    width: 12px;
    height: 12px;
    background: rgba(20, 90, 55, 0.5);
    opacity: 1;
    border-radius: 50%;
    transition: all 0.35s ease;
    margin: 0 6px !important;
    position: relative;
}

/* Active Dot */
.swiper-pagination-bullet-active {
    width: 34px;
    border-radius: 20px;
    background: linear-gradient(135deg, #22b573, #0b4d2c);
    box-shadow: 0 0 12px rgba(34,181,115,.8);
}

/* Glow Ring Effect */
.swiper-pagination-bullet-active::after {
    content: '';
    position: absolute;
    inset: -4px;
    border-radius: 20px;
    border: 2px solid rgba(34,181,115,.5);
    animation: dotGlow 1.5s infinite alternate;
}

@keyframes dotGlow {
    from { transform: scale(0.9); opacity: .5; }
    to   { transform: scale(1.1); opacity: 1; }
}

/* Hover Effect */
.swiper-pagination-bullet:hover {
    transform: scale(1.2);
    background: #22b573;
}

@media (max-width: 768px) {
.footer-3d {
    position: relative;
    background: linear-gradient(135deg, #1e633b, #1b311b, #222b26, #1b311b, #203328, #1b311b, #1e633b, #1b311b, #343f39, #1b311b, #08180f, #1b311b, #1e633b, #1b311b);
    color: #fff;
    overflow: hidden;
    padding: 40px 17px 0px!important;
    font-family: 'Poppins', sans-serif;
}
.footer-col{
  margin-bottom:0px!important;
}

.footer-col {
    flex: 0 1 142px!important;
}
.footer-row {
    display: flex;
    flex-wrap: wrap;
    gap: 0px!important;
}
.footer-3d a {
    color: #ffffff;
    text-decoration: none;
}
.footer-3d a:hover {
  color: #a8ff60;
}

}

/* Default Desktop / Tablet: horizontal layout */
.contact-row {
    flex-wrap: nowrap;
    overflow-x: auto;
    gap: 30px;
}

/* Mobile view: vertical stack, no scroll */
@media (max-width: 768px) {
    .contact-row {
        flex-wrap: wrap !important;
        overflow-x: hidden !important;
    }

    .contact-row .col-auto {
        width: 100%;
        display: flex;
        justify-content: center;
    }

    .address-item {
        width: 90%;
        max-width: 360px;
        height: auto;
    }
}

/* Mobile Map Height Control */
@media (max-width: 768px) {
    .map-section {
        height: 320px !important;   /* perfect mobile height */
        border-radius: 16px;
        overflow: hidden;
    }
}