made overall layout as figma

fix card stacking layout
enable stacking animation in mobile device
2025-11-05 19:34:57 +05:30 · 2025-11-05 12:17:58 +05:30 · 2025-11-05 11:26:46 +05:30 · 2025-11-04 19:52:34 +05:30 · 2025-11-04 18:49:58 +05:30 · 2025-11-04 18:45:38 +05:30
12 changed files with 1738 additions and 775 deletions
--- a/assests/images/ask-adv-card-bg.svg
+++ b/assests/images/ask-adv-card-bg.svg
@@ -0,0 +1,27 @@
+<svg width="268" height="355" viewBox="0 0 268 355" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_213_910)">
+<rect width="268" height="356" transform="translate(0 -0.985596)" fill="#004A5D"/>
+<path d="M-27.5364 305.791L-413.859 -68.6042H391.279L390.626 218.921L-28.1892 719.963L-27.5364 305.791Z" stroke="#B18C4A" stroke-width="0.540441" stroke-miterlimit="10"/>
+<path d="M368.46 210.835L-11.1865 664.783L-10.6227 290.119L-359.557 -48.0422H369.053L368.46 210.835Z" stroke="#B18C4A" stroke-width="0.540441" stroke-miterlimit="10"/>
+<path d="M346.295 202.711L5.78801 609.606L6.32216 274.448L-305.282 -27.5168H346.829L346.295 202.711Z" stroke="#B18C4A" stroke-width="0.540441" stroke-miterlimit="10"/>
+<path d="M324.129 194.622L22.7918 554.424L23.2369 258.774L-250.979 -6.95728H324.574L324.129 194.622Z" stroke="#B18C4A" stroke-width="0.540441" stroke-miterlimit="10"/>
+<path d="M301.962 186.5L39.7649 499.247L40.1506 243.104L-196.676 13.6077H302.348L301.962 186.5Z" stroke="#B18C4A" stroke-width="0.540441" stroke-miterlimit="10"/>
+<path d="M279.797 178.374L56.7686 444.105L57.095 227.431L-142.372 34.1301H280.123L279.797 178.374Z" stroke="#B18C4A" stroke-width="0.540441" stroke-miterlimit="10"/>
+<path d="M257.599 170.288L73.7402 388.926L74.0073 211.759L-88.1006 54.6921H257.866L257.599 170.288Z" stroke="#B18C4A" stroke-width="0.540441" stroke-miterlimit="10"/>
+<path d="M235.432 162.163L90.743 333.746L90.921 196.086L-33.7979 75.2542H235.64L235.432 162.163Z" stroke="#B18C4A" stroke-width="0.540441" stroke-miterlimit="10"/>
+<path d="M213.267 154.075L107.717 278.566L107.836 180.452L20.5059 95.7771H213.415L213.267 154.075Z" stroke="#B18C4A" stroke-width="0.540441" stroke-miterlimit="10"/>
+<path d="M191.1 145.953L124.69 223.389L124.779 164.783L74.8086 116.342H191.159L191.1 145.953Z" stroke="#B18C4A" stroke-width="0.540441" stroke-miterlimit="10"/>
+<path d="M141.692 168.245V149.108L129.081 136.901H168.933V137.825L141.692 168.245Z" stroke="#B18C4A" stroke-width="0.540441" stroke-miterlimit="10"/>
+<rect x="-306.667" y="-103.544" width="575.029" height="693.926" fill="url(#paint0_linear_213_910)"/>
+</g>
+<defs>
+<linearGradient id="paint0_linear_213_910" x1="0.999762" y1="378.015" x2="367.062" y2="192.736" gradientUnits="userSpaceOnUse">
+<stop stop-color="#004A5D"/>
+<stop offset="0.489094" stop-color="#004A5D" stop-opacity="0.9"/>
+<stop offset="1" stop-color="#004A5D" stop-opacity="0.3"/>
+</linearGradient>
+<clipPath id="clip0_213_910">
+<rect width="268" height="356" fill="white" transform="translate(0 -0.985596)"/>
+</clipPath>
+</defs>
+</svg>
--- a/components/footer.html
+++ b/components/footer.html
@@ -4,23 +4,35 @@
      <!-- Left Section -->
      <div class="col-lg-4 col-md-6">
        <div class="footer-logo mb-3 d-flex align-items-center">
-          <a href="#"><img src="./assests/images/footer-logo.svg" alt="ASK Logo" height="40" class="me-2"></a>
-         
+          <a href="#"
+            ><img
+              src="./assests/images/footer-logo.svg"
+              alt="ASK Logo"
+              height="40"
+              class="me-2"
+          /></a>
        </div>
        <p class="footer-desc mb-5">
-          We offer tailored investment solutions focused on your goals and objectives.
-          Our mutual funds help enhance seamless wealth transfer between generations for families.
+          We offer tailored investment solutions focused on your goals and
+          objectives. Our mutual funds help enhance seamless wealth transfer
+          between generations for families.
        </p>
        <div class="social-links mb-4">
-          <a href="#" class="me-3"><img src="./assests/images/youtube.svg" alt=""></a>
-          <a href="#" class="me-3"><img src="./assests/images/twitter.svg" alt=""></a>
-          <a href="#" class="me-3"><img src="./assests/images/facebook.svg" alt=""></a>
-          <a href="#"><img src="./assests/images/lin.svg" alt=""></a>
+          <a href="#" class="me-3"
+            ><img src="./assests/images/youtube.svg" alt=""
+          /></a>
+          <a href="#" class="me-3"
+            ><img src="./assests/images/twitter.svg" alt=""
+          /></a>
+          <a href="#" class="me-3"
+            ><img src="./assests/images/facebook.svg" alt=""
+          /></a>
+          <a href="#"><img src="./assests/images/lin.svg" alt="" /></a>
        </div>
-        <div class="d-flex gap-2">
+        <!-- <div class="d-flex gap-2">
          <a href="#"><img src="https://upload.wikimedia.org/wikipedia/commons/7/78/Google_Play_Store_badge_EN.svg" height="40" alt="Google Play"></a>
          <a href="#"><img src="https://developer.apple.com/assets/elements/badges/download-on-the-app-store.svg" height="40" alt="App Store"></a>
-        </div>
+        </div> -->
      </div>

      <!-- Quick Links -->
@@ -53,22 +65,30 @@
          <li><a href="#">Careers</a></li>
          <li><a href="#">Our Locations</a></li>
          <li><a href="#">Log In</a></li>
-          <li><a href="#">Contact Us</a></li>
+          <li><a href="#/contact">Contact Us</a></li>
        </ul>
      </div>
    </div>

-    <hr class="footer-line mt-5 mb-4">
+    <hr class="footer-line mt-5 mb-4" />

    <!-- Bottom Bar -->
-    <div class="d-flex flex-wrap justify-content-between align-items-center text-white-50 small">
+    <div
+      class="d-flex flex-wrap justify-content-between align-items-center text-white-50 small"
+    >
      <div class="footer-bottom-links">
        <a href="#" class="size-footer">Disclosures</a>
        <a href="#" class="size-footer">Privacy Policy</a>
        <a href="#" class="size-footer">Disclaimer</a>
      </div>
      <div class="text-adjust">
-        © 2025 ASK Investment Managers. All rights reserved.
+        <p class="d-lg-none mb-2 ">© 2025 ASK Investment Managers.</p>
+        <p class="d-lg-none">All rights reserved.</p>
+
+        <!-- Large screen (single line) -->
+        <h2 class="d-none d-lg-block">
+          © 2025 ASK Investment Managers. All rights reserved.
+        </h2>
      </div>
    </div>
  </div>
--- a/components/header.html
+++ b/components/header.html
@@ -24,7 +24,7 @@
        <!-- Center Links -->
        <ul class="navbar-nav gap-menu mx-auto text-center">
          <li class="nav-item">
-            <a class="nav-link" href="#/our-fund">Our Fund</a>
+            <a class="nav-link" href="#/our-fund">Our Funds</a>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="#/our-team">Our Team</a>
@@ -35,6 +35,12 @@
          <li class="nav-item">
            <a class="nav-link" href="#/contact">Contact Us</a>
          </li>
+          <li class="nav-item d-lg-none">
+            <a class="nav-link" href="#/contact">Carrer</a>
+          </li>
+          <li class="nav-item d-lg-none">
+            <a class="nav-link" href="#/contact">Login</a>
+          </li>
        </ul>

        <!-- Right Buttons -->
@@ -42,8 +48,17 @@
          <li class="nav-item me-3">
            <a href="#" class="invest-btn px-3 py-2">Invest Now</a>
          </li>
-          <li class="nav-item d-flex align-items-center">
-            <span class="text-white">Login</span>
+          <li class="nav-item d-flex align-items-center login-btn">
+            <span class="">Login</span>
+            <i
+              class="bi bi-chevron-down"
+              style="
+                font-size: 13px;
+                color: #b18c4a;
+                margin-left: 8px;
+                display: none;
+              "
+            ></i>
          </li>
        </ul>

--- a/css/contact.css
+++ b/css/contact.css
@@ -9,12 +9,11 @@
 }

 .contact-banner {
-  background-image: url("../assests/images/contact-banner.svg");
-  background-repeat: no-repeat;
-  background-size: cover;
-  background-position: center;
-  height: 400px;
-  /* height: 70vh; */
+    background-image: url("../assests/images/contact-banner.svg");
+    background-repeat: no-repeat;
+    background-size: cover;
+    background-position: center;
+    height: 400px;
 }

 /* .contact-banner .container{
@@ -26,12 +25,12 @@
 }

 .contact-aling {
-  align-items: end;
-  height: 100%;
-  display: flex;
-  justify-content: flex-start;
-  width: 100%;
-  padding-bottom: 72px;
+    align-items: end;
+    height: 100%;
+    display: flex;
+    justify-content: flex-start;
+    width: 100%;
+    padding-bottom: 72px;
 }

 .contact-tittle-banner {
@@ -82,23 +81,24 @@ p.contact-text-banner {
 }

 .contact-cards {
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: space-between;
-  gap: 32px;
-  margin-bottom: 65px;
+    display: flex;
+
+    margin-bottom: 65px;
+    
 }

 .contact-card {
-  background: #fff;
-  box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.05);
-  /* padding: 25px 35px; */
-  padding: 36px 40px;
-  flex: 1 1 30%;
-  border-bottom: 6px solid #b89c58;
-  transition: all 0.3s ease;
-  /* box-sizing: border-box;
-  height: 225px; */
+    background: #fff;
+
+    box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.05);
+    padding: 25px 35px;
+    flex: 1 1 30%;
+    border-bottom: 5px solid #b89c58;
+    /* gold underline */
+    transition: all 0.3s ease;
+    width: 368px;
+    height: 225px;
+    margin-right: 32px;
 }

 .contact-card h4 {
@@ -218,9 +218,16 @@ p.contact-text-banner {
    flex-direction: column;
  }

-  .map-section {
-    flex-direction: column;
-  }
+    .map-section {
+        flex-direction: column;
+    }
+    .contact-card {
+   
+    width: 100%;
+    height: 135px;
+    margin-right: 0px;
+    margin-bottom: 32px;
+}

  .location-info.none-desktop {
    display: block;
@@ -303,11 +310,12 @@ p.contact-text-banner {
 }

@media (max-width: 991px) {
-  .contact-banner {
-    background-image: url("../assests/images/mobile-contact.svg");
-    background-repeat: no-repeat;
-    background-size: cover;
-    background-position: -33px center;
-    padding: 0px 20px;
-  }
+    .contact-banner {
+        background-image: url("../assests/images/mobile-contact.svg");
+        background-repeat: no-repeat;
+        background-size: cover;
+        background-position: -33px center;
+        padding: 0px 20px;
+        height: 70vh;
+    }
 }
--- a/css/style.css
+++ b/css/style.css
--- a/css/testing.css
+++ b/css/testing.css
@@ -1,119 +1,100 @@
 /* Base setup */
 :root {
-    --font-primary: 'Open Sans', sans-serif;
-    /* default body font */
-    --font-secondary: 'Larken', serif;
-    /* decorative font */
-    --font-tertiary: 'Inter', sans-serif;
-    /* for headings or special text */
+  --font-primary: "Open Sans", sans-serif;
+  --font-secondary: "Larken", serif;
+  --font-tertiary: "Inter", sans-serif;
 }

-section.ask-advantage-scroll {
-    padding: 60px 0 0 0;
+.ask-advantage-scroll h2 {
+  font-family: var(--font-secondary);
+  font-weight: 400;
+  font-style: Regular;
+  font-size: 40px;
+  line-height: 100%;
+  letter-spacing: 0%;
+  color: #033a49;
 }

-.ask-advantage-scroll h2
-
- {
-    font-family: var(--font-secondary);
-    font-weight: 400;
-    font-style: Regular;
-    font-size: 40px;
-    line-height: 100%;
-    letter-spacing: 0%;
-    color: #033A49;
-}
 .ask-advantage-scroll p.lead {
-    font-family: var(--font-primary);
-    font-weight: 400;
-    font-size: 18px;
-    line-height: 100%;
-    letter-spacing: 0%;
-    color: #3E3F3F;
-    margin-bottom: 40px;
-    margin-top: 15px;
+  font-family: var(--font-primary);
+  font-weight: 400;
+  font-size: 18px;
+  line-height: 100%;
+  letter-spacing: 0%;
+  color: #3e3f3f;
+  margin-bottom: 40px;
+  margin-top: 15px;
 }

-
+/* Mobile & Tablet View (default - stacked layout) */
 .cards-wrapper {
  display: flex;
-  gap: 20px;
-  flex-wrap: wrap;
-  justify-content: center;
-  margin-top: 60px;
-  
+  flex-direction: column;
+  gap: 30px;
+  width: 100%;
 }

-
 .card-scroll {
  background-image: url("../assests/images/desbackcard-scroll.svg");
  background-repeat: no-repeat;
-      background-size: cover;
-  
- 
-  background-position: center center; /* centers it horizontally and vertically */
-
+  background-size: cover;
+  background-position: center center;
  border-radius: 30px;
-  width: 100%;
  overflow: hidden;
-
  display: flex;
  flex-direction: row;
-  border: 1px solid #E6E7E8;
-  box-shadow: 0px 5px 14px 0px #0000000D;
-
-  /* reduce side padding so image aligns better */
-  padding: 50px 80px 0px 80px; 
+  border: 1px solid #e6e7e8;
+  box-shadow: 0px 5px 14px 0px #0000000d;
+  padding: 50px 80px 0px 80px;
  gap: 60px;
-   transition: transform 0.3s ease;
+  width: 100%;
+  position: relative;
+  opacity: 1;
+  transform: none;
 }

 .card-content {
-    width: 60%;
-    margin-bottom: 50px;
+  width: 60%;
+  margin-bottom: 50px;
 }
+
 .card-image {
-    width: 40%;
-    display: flex;
-    align-items: end;
+  width: 40%;
+  display: flex;
+  align-items: end;
 }

-
-
-
 .card-label span {
- color: #B18C4A;
-    font-family: var(--font-primary);
-    font-weight: 400;
-    font-size: 24px;
-    line-height: 21.9px;
-    letter-spacing: 0px;
-    vertical-align: middle;
-    text-transform: capitalize;
+  color: #b18c4a;
+  font-family: var(--font-primary);
+  font-weight: 400;
+  font-size: 24px;
+  line-height: 21.9px;
+  letter-spacing: 0px;
+  vertical-align: middle;
+  text-transform: capitalize;
 }

 .scroll-tiile {
-     margin: 20px 0 10px 0;
-    color: #033A49;
-    font-family: var(--font-secondary);
-    font-weight: 400;
-    font-size: 32px;
-    line-height: 100%;
-    letter-spacing: 2px;
+  margin: 20px 0 10px 0;
+  color: #033a49;
+  font-family: var(--font-secondary);
+  font-weight: 400;
+  font-size: 32px;
+  line-height: 100%;
+  letter-spacing: 2px;
 }
-.scroll-desc{
-font-family: var(--font-primary);
-font-weight: 400;
-
-font-size: 18px;
-line-height: 100%;
-color: #3E3F3F;
-

+.scroll-desc {
+  font-family: var(--font-primary);
+  font-weight: 400;
+  font-size: 18px;
+  line-height: 100%;
+  color: #3e3f3f;
 }

 .scroll-ul {
- margin-left: 15px;
+  margin-left: 15px;
  padding-left: 20px;
  font-size: 14px;
  color: #555;
@@ -121,118 +102,111 @@ color: #3E3F3F;
 }

 .scroll-ul .scroll-li {
-      
-    font-family: var(--font-primary);
-    font-weight: 400;
-    font-size: 16px;
-    line-height: 32px;
+  font-family: var(--font-primary);
+  font-weight: 400;
+  font-size: 16px;
+  line-height: 32px;
 }

-
-
 .card-image img {
  width: 316px;
  display: block;
 }

-@media (max-width: 768px) {
- .card-scroll {
-  background-image: url("../assests/images/mobilebackcard-scroll.svg") ;
-  background-repeat: no-repeat;
-  background-size: cover; /* fills card area */
-  background-position: center center; /* show from top */
+/* Desktop View (Animation Layout) */
+@media (min-width: 1024px) {
+  .cards-wrapper {
+    position: relative;
+    height: 530px;
+    overflow: hidden;
+    display: block;
+    gap: 0;
+  }

-  border-radius: 30px;
-  width: 100%;
-  overflow: hidden;
+  .card-scroll {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    opacity: 0;
+    transform: translateY(100%);
+    transition: none;
+  }

-  display: flex;
-  flex-direction: column;
-  border: 1px solid #E6E7E8;
-  box-shadow: 0px 0px 14px 0px #0000000D;
-  padding: 30px 20px 0px 20px;
-  gap: 30px;
+  .card-scroll.active {
+    opacity: 1;
+    transform: translateY(0);
+    z-index: 2;
+  }
 }

-.card-content {
+/* Mobile & Tablet Styles */
+@media (max-width: 1023px) {
+  .card-scroll {
+    background-image: url("../assests/images/mobilebackcard-scroll.svg");
+    flex-direction: column;
+    padding: 30px 20px 0px 20px;
+    gap: 30px;
+  }
+
+  .card-content {
    width: 100%;
    margin-bottom: 0px;
-}
-.card-image {
+  }
+
+  .card-image {
    width: 100%;
    text-align: center;
    justify-content: center;
    display: flex;
-}
-.card-image img {
+  }
+
+  .card-image img {
    width: 220px;
    display: block;
-}
-.card-label span {
-    
+  }
+
+  .card-label span {
    font-size: 18px;
-   
-}
-.scroll-tiile {
-   
+  }
+
+  .scroll-tiile {
    font-size: 18px;
    letter-spacing: 0.5px;
-}
-.cards-wrapper {
+  }

-    margin-top: 30px;
-}
-.scroll-desc {
-   
+  .scroll-desc {
    font-size: 13px;
-   
-}
-.scroll-ul {
-   
+  }
+
+  .scroll-ul {
    display: none;
-}
-.ask-advantage-scroll h2
+  }

- {
-   
-    font-size: 24px;
-  
-}
-.ask-advantage-scroll p.lead {
-   
-  
-    font-size: 14px;
+  .ask-advantage-scroll h2 {
+    font-size: 26px;
+    line-height: 36px;
+  }
+
+  .ask-advantage-scroll p.lead {
+    font-size: 15px;
    line-height: 22px;
-   
-   
-}
+  }
 }

-
-.cards-wrapper {
-  position: relative;
-  height: 530px;   /* ya jitna aapko chahiye ho */
-  overflow: hidden;
-}
-
-.card-scroll {
-  position: absolute;
-  top: 0;
-  left: 0;
-  width: 100%;
-  opacity: 0;
-  transform: translateY(100%);
-}
-
-.card-scroll.active {
-  opacity: 1;
-  transform: translateY(0);
-  z-index: 2;
+@media (max-width: 768px) {
+  .cards-wrapper {
+    gap: 20px;
+  }
+  
+  .card-scroll {
+    padding: 25px 15px 0px 15px;
+    gap: 20px;
+  }
 }

@media (max-width: 991px) {
-     section.ask-advantage-scroll.container {
-    padding: 60px 25px 0 25px !important;
-}
-}
-
+  section.ask-advantage-scroll.container {
+    padding: 40px 25px 0 25px !important;
+  }
+}
--- a/js/main.js
+++ b/js/main.js
@@ -329,28 +329,94 @@ window.openDrawer = function (name, role, img, desc) {
 let cards = [];
 let currentIndex = 0;
 let animating = false;
-let isInsideSection = false;
+let isSectionPinned = false;
+let scrollTrigger;
+let allowNormalScroll = false;

+// ===============================
+// ✅ GSAP Stack Scroll with Section Pinning (Fixed Scroll Lock Only)
+// ===============================
 function initGsapStackScroll() {
-  const section = document.querySelector(".cards-wrapper");
+  // Check if device is desktop/laptop (min-width: 1024px)
+  const isDesktop = window.matchMedia("(min-width: 1024px)").matches;
+  
+  if (!isDesktop) {
+    console.log("GSAP stack scroll disabled for mobile/tablet devices");
+    return;
+  }
+
+  const section = document.querySelector(".ask-advantage-scroll");
  if (!section) return;

-  cards = Array.from(section.querySelectorAll(".card-scroll"));
+  const cardsWrapper = document.querySelector(".cards-wrapper");
+  if (!cardsWrapper) return;
+
+  cards = Array.from(cardsWrapper.querySelectorAll(".card-scroll"));
  if (!cards.length) return;

-  // Hide all cards initially, show the first one
+  // Initial setup
  gsap.set(cards, { opacity: 0, y: "100%", zIndex: 0 });
-  gsap.set(cards[0], { opacity: 1, y: "0px", zIndex: 4 });
+  gsap.set(cards[0], { opacity: 1, y: "60px", zIndex: 5 });
  currentIndex = 0;
+  allowNormalScroll = false;

-  section.addEventListener("mouseenter", () => (isInsideSection = true));
-  section.addEventListener("mouseleave", () => (isInsideSection = false));
+  // Calculate exact pinning distance
+  const cardHeight = cardsWrapper.offsetHeight;
+  const totalCards = cards.length;
+  const pinningDistance = cardHeight * totalCards * 0.4;

-  window.removeEventListener("wheel", window._gsapStackHandler);
+  // Scroll pinning logic
+  scrollTrigger = ScrollTrigger.create({
+    trigger: cardsWrapper,
+    start: "top top",
+    end: `+=${pinningDistance}`,
+    pin: true,
+    anticipatePin: 1,
+    pinSpacing: true,
+    onEnter: () => {
+      isSectionPinned = true;
+      allowNormalScroll = false;
+      if (currentIndex !== 0) {
+        resetToFirstCard();
+      }
+    },
+    onLeave: () => {
+      isSectionPinned = false;
+      allowNormalScroll = true;
+    },
+    onEnterBack: () => {
+      isSectionPinned = true;
+      allowNormalScroll = false;
+    },
+    onLeaveBack: () => {
+      isSectionPinned = false;
+      allowNormalScroll = true;
+    },
+  });
+
+  // ✅ Wheel handler with scroll block fix
  window._gsapStackHandler = function (e) {
-    if (!isInsideSection) return;
+    if (!isSectionPinned) return;
+
+    // Completely block scroll while animating
+    if (animating) {
+      e.preventDefault();
+      e.stopPropagation();
+      return;
+    }
+
+    // Boundaries check
+    if (
+      (e.deltaY > 0 && currentIndex >= cards.length - 1) ||
+      (e.deltaY < 0 && currentIndex <= 0)
+    ) {
+      allowNormalScroll = true;
+      return;
+    }
+
+    // Start animation & block scroll during it
    e.preventDefault();
-    if (animating) return;
+    e.stopPropagation();

    if (e.deltaY > 0) {
      showNextGsapCard();
@@ -359,88 +425,135 @@ function initGsapStackScroll() {
    }
  };

+  // ✅ Keyboard handler
+  window._gsapKeyHandler = function (e) {
+    if (!isSectionPinned || animating) return;
+
+    if (
+      (e.key === "ArrowDown" && currentIndex >= cards.length - 1) ||
+      (e.key === "ArrowUp" && currentIndex <= 0)
+    ) {
+      return; // Allow normal scroll at boundaries
+    }
+
+    if (e.key === "ArrowDown") {
+      e.preventDefault();
+      showNextGsapCard();
+    } else if (e.key === "ArrowUp") {
+      e.preventDefault();
+      showPrevGsapCard();
+    }
+  };
+
  window.addEventListener("wheel", window._gsapStackHandler, {
    passive: false,
  });
+  window.addEventListener("keydown", window._gsapKeyHandler);
 }

-function showNextGsapCard() {
-  if (currentIndex >= cards.length - 1) return;
+// ✅ Reset to first card
+function resetToFirstCard() {
  animating = true;
+  allowNormalScroll = false;
+
+  gsap.set(cards, { opacity: 0, y: "100%", zIndex: 0 });
+
+  gsap.set(cards[0], {
+    opacity: 1,
+    y: "60px",
+    zIndex: 5,
+    onComplete: () => {
+      currentIndex = 0;
+      animating = false;
+    },
+  });
+}
+
+// ✅ Show next card
+function showNextGsapCard() {
+  if (currentIndex >= cards.length - 1 || animating) return;
+
+  animating = true;
+  allowNormalScroll = false;

  const current = cards[currentIndex];
  const next = cards[currentIndex + 1];

-  // Animate current card (move it to previous stack position)
  gsap.to(current, {
    y: "40px",
    scale: 0.95,
    opacity: 1,
    duration: 0.8,
    ease: "power2.inOut",
-    onComplete: () => current.classList.add("previous"),
  });

-  // Animate next card (slide in from below and become active)
-  gsap.set(next, { zIndex: 5 }); // Active card gets highest z-index
+  gsap.set(next, { zIndex: 5 });
  gsap.fromTo(
    next,
    { y: "100%", opacity: 0, scale: 1 },
    {
-      y: "60px", // Active card position
+      y: "60px",
      opacity: 1,
      scale: 1,
      duration: 0.8,
      ease: "power2.inOut",
      onComplete: () => {
-        adjustPreviousCards();
+        currentIndex++;
+        adjustVisibleCards();
        animating = false;
+
+        // ✅ Allow normal scroll only after last card animation completes
+        if (currentIndex >= cards.length - 1) {
+          allowNormalScroll = true;
+          ScrollTrigger.refresh(true);
+        } else {
+          allowNormalScroll = false;
+        }
      },
    }
  );
-
-  currentIndex++;
 }

+// ✅ Show previous card
 function showPrevGsapCard() {
-  if (currentIndex <= 0) return;
+  if (currentIndex <= 0 || animating) return;
+
  animating = true;
+  allowNormalScroll = false;

  const current = cards[currentIndex];
  const prev = cards[currentIndex - 1];
-
-  // Hide current card (slide it down)
  gsap.to(current, {
    y: "100%",
    opacity: 0,
    duration: 0.8,
    ease: "power2.inOut",
-    onComplete: () => current.classList.remove("previous"),
  });

-  // Bring back previous card as active
-  gsap.set(prev, { zIndex: 5 }); // Active card gets highest z-index
+  gsap.set(prev, { zIndex: 5 });
  gsap.to(prev, {
-    y: "60px", // Active card position
+    y: "60px",
    opacity: 1,
    scale: 1,
    duration: 0.8,
    ease: "power2.inOut",
    onComplete: () => {
-      adjustPreviousCards();
+      currentIndex--;
+      adjustVisibleCards();
      animating = false;
+
+      if (currentIndex <= 0) {
+        allowNormalScroll = false;
+      }
    },
  });
-
-  currentIndex--;
 }

-// 🪄 Adjust visible cards (up to 4-layer stack including active card)
-function adjustPreviousCards() {
-  // Reset all cards to default state
+// ✅ Adjust visible cards stack
+function adjustVisibleCards() {
  gsap.set(cards, { opacity: 0, y: "100%", zIndex: 0 });

-  // Always show the current active card
+  // Active card
  if (cards[currentIndex]) {
    gsap.set(cards[currentIndex], {
      y: "60px",
@@ -450,13 +563,13 @@ function adjustPreviousCards() {
    });
  }

-  // Show up to 3 previous cards in the stack
-  for (let i = 1; i <= 3; i++) {
+  // Show only 2 previous cards
+  for (let i = 1; i <= 2; i++) {
    const prevIndex = currentIndex - i;
    if (prevIndex >= 0) {
-      const yOffset = 60 - i * 30; // 60px, 40px, 20px, 0px
-      const scale = 1 - i * 0.05; // 1, 0.95, 0.9, 0.85
-      const zIndex = 5 - i; // 5, 4, 3, 2
+      const yOffset = 60 - i * 25;
+      const scale = 1 - i * 0.05;
+      const zIndex = 5 - i;

      gsap.set(cards[prevIndex], {
        y: `${yOffset}px`,
@@ -466,9 +579,35 @@ function adjustPreviousCards() {
      });
    }
  }
+
+  // Hide older cards
+  const hideIndex = currentIndex - 3;
+  if (hideIndex >= 0 && cards[hideIndex]) {
+    gsap.to(cards[hideIndex], {
+      opacity: 0,
+      y: "100%",
+      duration: 0.6,
+      ease: "power2.inOut",
+    });
+  }
 }

+// ✅ Cleanup function
+function cleanupGsapStackScroll() {
+  if (window._gsapStackHandler) {
+    window.removeEventListener("wheel", window._gsapStackHandler);
+  }
+  if (window._gsapKeyHandler) {
+    window.removeEventListener("keydown", window._gsapKeyHandler);
+  }
+  if (scrollTrigger) {
+    scrollTrigger.kill();
+  }
+}
+
+// Initialize after DOM load
 document.addEventListener("DOMContentLoaded", initGsapStackScroll);
+window.addEventListener("beforeunload", cleanupGsapStackScroll);

 // ===============================
 // ✅ Load Page Content Dynamically
--- a/pages/about.html
+++ b/pages/about.html
@@ -66,8 +66,8 @@
        </div>
      </div>
    </div>
-    <div class="mt-4">
-      <span class="about-as-of-date">As of July 2025</span>
+    <div class="mt-4 date-container">
+      <span class="as-of-date">As of July 2025</span>
    </div>
  </div>
 </section>
--- a/pages/blog.html
+++ b/pages/blog.html
@@ -14,10 +14,10 @@
 </section>


-<section class="ask-advantage container">
+<section class="ask-advantage-blog container">
   <div class="row">
  <div class="col-md-12">
-    <div class="blog-card d-flex align-items-center">
+    <div class="blog-page-card d-flex align-items-center">
      <!-- Left Image -->
      <div class="blog-image">
        <img src="./assests/images/row-blog.svg" alt="Understanding SIPs" class="img-fluid rounded-3">
@@ -41,7 +41,7 @@
  

 </section>
-<section class="ask-advantage2 container">
+<section class="ask-advantage-blog2 container">
  <h2>Top Picks</h2>

   <div class="row g-4 mt-3">
--- a/pages/contact.html
+++ b/pages/contact.html
@@ -118,42 +118,61 @@


 </section>
-<section class="ask-advantage2 container " style="margin-top: 60px;">
+
+<section class="ask-advantage2 container" style="margin-top: 60px;">
  <h2>New to Mutual Funds?</h2>
  <p class="lead">Here are answers to some common questions we often get</p>
  <div class="accordion" id="accordionExample">
    <div class="accordion" id="accordionExample">
-
      <div class="accordion-item">
        <h2 class="accordion-header" id="headingOne">
-          <button class="accordion-button" type="button" data-bs-toggle="collapse" data-bs-target="#collapseOne"
-            aria-expanded="true" aria-controls="collapseOne">
-            Is it safe to invest in mutual funds?
+          <button
+            class="accordion-button"
+            type="button"
+            data-bs-toggle="collapse"
+            data-bs-target="#collapseOne"
+            aria-expanded="true"
+            aria-controls="collapseOne"
+          >
+            How do mutual fund works?
          </button>
        </h2>
-        <div id="collapseOne" class="accordion-collapse collapse show" aria-labelledby="headingOne"
-          data-bs-parent="#accordionExample">
+        <div
+          id="collapseOne"
+          class="accordion-collapse collapse show"
+          aria-labelledby="headingOne"
+          data-bs-parent="#accordionExample"
+        >
          <div class="accordion-body">
-            <span class="textaccor">
-              Mutual funds are regulated by SEBI and offer risk diversification, but returns are not guaranteed and
-              depend on market performance.
+            <span class="textaccor">Mutual funds pool money from multiple investors and invest in a diversified mix of stocks, bonds, or other securities. Professional fund managers manage the investments, helping reduce risk while aiming for long-term returns.
            </span>
          </div>
        </div>
      </div>

-      <div class="accordion-item">
+            <div class="accordion-item">
        <h2 class="accordion-header" id="headingTwo">
-          <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
-            data-bs-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
-            How much money do I need to start?
+          <button
+            class="accordion-button collapsed"
+            type="button"
+            data-bs-toggle="collapse"
+            data-bs-target="#collapseTwo"
+            aria-expanded="false"
+            aria-controls="collapseTwo"
+          >
+            Is it safe to invest in mutual funds?
          </button>
        </h2>
-        <div id="collapseTwo" class="accordion-collapse collapse" aria-labelledby="headingTwo"
-          data-bs-parent="#accordionExample">
+        <div
+          id="collapseTwo"
+          class="accordion-collapse collapse"
+          aria-labelledby="headingTwo"
+          data-bs-parent="#accordionExample"
+        >
          <div class="accordion-body">
            <span class="textaccor">
-              You can begin investing in most mutual funds with as little as ₹500 via SIP or lump sum.
+              Mutual funds are regulated by SEBI and offer risk diversification,
+              but returns are not guaranteed and depend on market performance.
            </span>
          </div>
        </div>
@@ -161,17 +180,27 @@

      <div class="accordion-item">
        <h2 class="accordion-header" id="headingThree">
-          <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
-            data-bs-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
-            Can I withdraw my money anytime?
+          <button
+            class="accordion-button collapsed"
+            type="button"
+            data-bs-toggle="collapse"
+            data-bs-target="#collapseThree"
+            aria-expanded="false"
+            aria-controls="collapseThree"
+          >
+            How much money do I need to start?
          </button>
        </h2>
-        <div id="collapseThree" class="accordion-collapse collapse" aria-labelledby="headingThree"
-          data-bs-parent="#accordionExample">
+        <div
+          id="collapseThree"
+          class="accordion-collapse collapse"
+          aria-labelledby="headingThree"
+          data-bs-parent="#accordionExample"
+        >
          <div class="accordion-body">
            <span class="textaccor">
-              Yes, most open-ended mutual funds allow withdrawals anytime, though some may have exit loads or specific
-              lock-in periods.
+              You can begin investing in most mutual funds with as little as
+              ₹500 via SIP or lump sum.
            </span>
          </div>
        </div>
@@ -179,17 +208,27 @@

      <div class="accordion-item">
        <h2 class="accordion-header" id="headingFour">
-          <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
-            data-bs-target="#collapseFour" aria-expanded="false" aria-controls="collapseFour">
-            How are mutual funds taxed?
+          <button
+            class="accordion-button collapsed"
+            type="button"
+            data-bs-toggle="collapse"
+            data-bs-target="#collapseFour"
+            aria-expanded="false"
+            aria-controls="collapseFour"
+          >
+            Can I withdraw my money anytime?
          </button>
        </h2>
-        <div id="collapseFour" class="accordion-collapse collapse" aria-labelledby="headingFour"
-          data-bs-parent="#accordionExample">
+        <div
+          id="collapseFour"
+          class="accordion-collapse collapse"
+          aria-labelledby="headingFour"
+          data-bs-parent="#accordionExample"
+        >
          <div class="accordion-body">
            <span class="textaccor">
-              Tax is based on the type of fund and holding period, with separate rules for equity and debt funds as per
-              prevailing tax laws.
+              Yes, most open-ended mutual funds allow withdrawals anytime,
+              though some may have exit loads or specific lock-in periods.
            </span>
          </div>
        </div>
@@ -197,16 +236,27 @@

      <div class="accordion-item">
        <h2 class="accordion-header" id="headingFive">
-          <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
-            data-bs-target="#collapseFive" aria-expanded="false" aria-controls="collapseFive">
-            Do mutual funds guarantee returns?
+          <button
+            class="accordion-button collapsed"
+            type="button"
+            data-bs-toggle="collapse"
+            data-bs-target="#collapseFive"
+            aria-expanded="false"
+            aria-controls="collapseFive"
+          >
+            How are mutual funds taxed?
          </button>
        </h2>
-        <div id="collapseFive" class="accordion-collapse collapse" aria-labelledby="headingFive"
-          data-bs-parent="#accordionExample">
+        <div
+          id="collapseFive"
+          class="accordion-collapse collapse"
+          aria-labelledby="headingFive"
+          data-bs-parent="#accordionExample"
+        >
          <div class="accordion-body">
            <span class="textaccor">
-              No, mutual funds do not guarantee returns; their value fluctuates according to market movements.
+              Tax is based on the type of fund and holding period, with separate
+              rules for equity and debt funds as per prevailing tax laws.
            </span>
          </div>
        </div>
@@ -214,24 +264,59 @@

      <div class="accordion-item">
        <h2 class="accordion-header" id="headingSix">
-          <button class="accordion-button collapsed" type="button" data-bs-toggle="collapse"
-            data-bs-target="#collapseSix" aria-expanded="false" aria-controls="collapseSix">
-            What is NAV in mutual funds?
+          <button
+            class="accordion-button collapsed"
+            type="button"
+            data-bs-toggle="collapse"
+            data-bs-target="#collapseSix"
+            aria-expanded="false"
+            aria-controls="collapseSix"
+          >
+            Do mutual funds guarantee returns?
          </button>
        </h2>
-        <div id="collapseSix" class="accordion-collapse collapse" aria-labelledby="headingSix"
-          data-bs-parent="#accordionExample">
+        <div
+          id="collapseSix"
+          class="accordion-collapse collapse"
+          aria-labelledby="headingSix"
+          data-bs-parent="#accordionExample"
+        >
          <div class="accordion-body">
            <span class="textaccor">
-              NAV (Net Asset Value) is the per-unit price of a mutual fund, calculated daily after accounting for fund
-              assets and liabilities.
+              No, mutual funds do not guarantee returns; their value fluctuates
+              according to market movements.
            </span>
          </div>
        </div>
      </div>

+      <div class="accordion-item">
+        <h2 class="accordion-header" id="headingSeven">
+          <button
+            class="accordion-button collapsed"
+            type="button"
+            data-bs-toggle="collapse"
+            data-bs-target="#collapseSeven"
+            aria-expanded="false"
+            aria-controls="collapseSeven"
+          >
+            What is NAV in mutual funds?
+          </button>
+        </h2>
+        <div
+          id="collapseSeven"
+          class="accordion-collapse collapse"
+          aria-labelledby="headingSeven"
+          data-bs-parent="#accordionExample"
+        >
+          <div class="accordion-body">
+            <span class="textaccor">
+              NAV (Net Asset Value) is the per-unit price of a mutual fund,
+              calculated daily after accounting for fund assets and liabilities.
+            </span>
+          </div>
+        </div>
+      </div>
    </div>
-
  </div>
-
 </section>
--- a/pages/home.html
+++ b/pages/home.html
--- a/pages/our-team.html
+++ b/pages/our-team.html
@@ -26,16 +26,17 @@
    <div class="tab-content" id="teamTabsContent">
      <!-- Leadership Tab -->
      <div class="tab-pane fade show active" id="leadership" role="tabpanel">
-        
-        <div class="row g-4 mt-2">
-          <div class="col-lg-4 col-md-4 col-sm-4 col-6">
-        <div class="card team-card"
-                      onclick="openDrawer('Sameer Koticha', 'Co-founder, CEO, ASK Asset & Wealth Management Group', './assests/images/team1-d.svg',
-          'Mr. Himanshoo Bohara, is the group Chief Financial Officer and was appointed on February 1, 2011. He holds a bachelor\'s degree in science from the Mohanlal Sukhadia University, Udaipur. He is also a member of the Institute of Chartered Accountants of India and is a member of the Institute of Company Secretaries of India.<br><br>He has 19 years of experience. Before joining ASK, he was holding position of group chief financial officer at Centrum Capital Limited. He has also worked with DSP Merrill Lynch Limited, The Hong Kong and Shanghai Banking Corporation Limited and Accenture India Private Limited.')">      <img src="./assests/images/team1.svg" alt="Bharat Shah">
+
+        <div class="row g-4  ">
+          <div class="col-lg-4 col-md-4 col-sm-4 col-6 team-spac">
+            <div class="card team-card"
+              onclick="openDrawer('Sameer Koticha', 'Co-founder, CEO, ASK Asset & Wealth Management Group', './assests/images/team1.svg',
+              'Mr. Himanshoo Bohara, is the group Chief Financial Officer and was appointed on February 1, 2011. He holds a bachelor\'s degree in science from the Mohanlal Sukhadia University, Udaipur. He is also a member of the Institute of Chartered Accountants of India and is a member of the Institute of Company Secretaries of India.<br><br>He has 19 years of experience. Before joining ASK, he was holding position of group chief financial officer at Centrum Capital Limited. He has also worked with DSP Merrill Lynch Limited, The Hong Kong and Shanghai Banking Corporation Limited and Accenture India Private Limited.')">
+              <img src="./assests/images/team1.svg" alt="Bharat Shah" class="team-img">
              <div class="team-info">
                <div class="text-height">
                  <h5>Bharat Shah <img class="arrow" src="./assests/images/rightArrow.svg" alt="Arrow"></h5>
-                  <p>Chief Investment Officer</p>
+                  <p>Chief Investment Officer & Chief Executive Officer</p>
                </div>
                <div class="arrow-m-right">
                  <img class="arrow-m" src="./assests/images/rightArrow.svg" alt="Arrow">
@@ -44,10 +45,11 @@
            </div>
          </div>

-          <div class="col-lg-4 col-md-4 col-sm-4 col-6">
-        <div class="card team-card"
-                        onclick="openDrawer('Sunil Rohokale', 'Chief Business Officer', './assests/images/team1-d.svg',
-            'Mr. Himanshoo Bohara, is the group Chief Financial Officer and was appointed on February 1, 2011. He holds a bachelor\'s degree in science from the Mohanlal Sukhadia University, Udaipur. He is also a member of the Institute of Chartered Accountants of India and is a member of the Institute of Company Secretaries of India.<br><br>He has 19 years of experience. Before joining ASK, he was holding position of group chief financial officer at Centrum Capital Limited. He has also worked with DSP Merrill Lynch Limited, The Hong Kong and Shanghai Banking Corporation Limited and Accenture India Private Limited.')">      <img src="./assests/images/team2.svg" alt="Sunil Rohokale">
+          <div class="col-lg-4 col-md-4 col-sm-4 col-6 team-spac">
+            <div class="card team-card"
+              onclick="openDrawer('Sunil Rohokale', 'Chief Business Officer', './assests/images/team2.svg',
+            'Mr. Himanshoo Bohara, is the group Chief Financial Officer and was appointed on February 1, 2011. He holds a bachelor\'s degree in science from the Mohanlal Sukhadia University, Udaipur. He is also a member of the Institute of Chartered Accountants of India and is a member of the Institute of Company Secretaries of India.<br><br>He has 19 years of experience. Before joining ASK, he was holding position of group chief financial officer at Centrum Capital Limited. He has also worked with DSP Merrill Lynch Limited, The Hong Kong and Shanghai Banking Corporation Limited and Accenture India Private Limited.')">
+              <img src="./assests/images/team2.svg" alt="Sunil Rohokale" class="team-img">
              <div class="team-info">
                <div class="text-height">
                  <h5>Sunil Rohokale <img class="arrow" src="./assests/images/rightArrow.svg" alt="Arrow"></h5>
@@ -60,10 +62,11 @@
            </div>
          </div>

-          <div class="col-lg-4 col-md-4 col-sm-4 col-6">
-        <div class="card team-card" 
-                    onclick="openDrawer('Bhavana Shah', 'Chief Business Officer', './assests/images/team1-d.svg',
-          'Mr. Himanshoo Bohara, is the group Chief Financial Officer and was appointed on February 1, 2011. He holds a bachelor\'s degree in science from the Mohanlal Sukhadia University, Udaipur. He is also a member of the Institute of Chartered Accountants of India and is a member of the Institute of Company Secretaries of India.<br><br>He has 19 years of experience. Before joining ASK, he was holding position of group chief financial officer at Centrum Capital Limited. He has also worked with DSP Merrill Lynch Limited, The Hong Kong and Shanghai Banking Corporation Limited and Accenture India Private Limited.')">      <img src="./assests/images/team3.svg" alt="Bhavana Shah">
+          <div class="col-lg-4 col-md-4 col-sm-4 col-6 team-spac">
+            <div class="card team-card"
+              onclick="openDrawer('Bhavana Shah', 'Chief Business Officer', './assests/images/team3.svg',
+          'Mr. Himanshoo Bohara, is the group Chief Financial Officer and was appointed on February 1, 2011. He holds a bachelor\'s degree in science from the Mohanlal Sukhadia University, Udaipur. He is also a member of the Institute of Chartered Accountants of India and is a member of the Institute of Company Secretaries of India.<br><br>He has 19 years of experience. Before joining ASK, he was holding position of group chief financial officer at Centrum Capital Limited. He has also worked with DSP Merrill Lynch Limited, The Hong Kong and Shanghai Banking Corporation Limited and Accenture India Private Limited.')">
+              <img src="./assests/images/team3.svg" alt="Bhavana Shah" class="team-img">
              <div class="team-info">
                <div class="text-height">
                  <h5>Bhavana Shah <img class="arrow" src="./assests/images/rightArrow.svg" alt="Arrow"></h5>
@@ -75,16 +78,16 @@
              </div>
            </div>
          </div>
-        </div>
-        <div class="row g-4 mt-2">
-          <div class="col-lg-4 col-md-4 col-sm-4 col-6">
-        <div class="card team-card"
-                      onclick="openDrawer('Sameer Koticha', 'Co-founder, CEO, ASK Asset & Wealth Management Group', './assests/images/team1-d.svg',
-          'Mr. Himanshoo Bohara, is the group Chief Financial Officer and was appointed on February 1, 2011. He holds a bachelor\'s degree in science from the Mohanlal Sukhadia University, Udaipur. He is also a member of the Institute of Chartered Accountants of India and is a member of the Institute of Company Secretaries of India.<br><br>He has 19 years of experience. Before joining ASK, he was holding position of group chief financial officer at Centrum Capital Limited. He has also worked with DSP Merrill Lynch Limited, The Hong Kong and Shanghai Banking Corporation Limited and Accenture India Private Limited.')">      <img src="./assests/images/team1.svg" alt="Bharat Shah">
+
+                    <div class="col-lg-4 col-md-4 col-sm-4 col-6 team-spac">
+            <div class="card team-card"
+              onclick="openDrawer('Sameer Koticha', 'Co-founder, CEO, ASK Asset & Wealth Management Group', './assests/images/team1.svg',
+              'Mr. Himanshoo Bohara, is the group Chief Financial Officer and was appointed on February 1, 2011. He holds a bachelor\'s degree in science from the Mohanlal Sukhadia University, Udaipur. He is also a member of the Institute of Chartered Accountants of India and is a member of the Institute of Company Secretaries of India.<br><br>He has 19 years of experience. Before joining ASK, he was holding position of group chief financial officer at Centrum Capital Limited. He has also worked with DSP Merrill Lynch Limited, The Hong Kong and Shanghai Banking Corporation Limited and Accenture India Private Limited.')">
+              <img src="./assests/images/team1.svg" alt="Bharat Shah" class="team-img">
              <div class="team-info">
                <div class="text-height">
                  <h5>Bharat Shah <img class="arrow" src="./assests/images/rightArrow.svg" alt="Arrow"></h5>
-                  <p>Chief Investment Officer</p>
+                  <p>Chief Investment Officer & Chief Executive Officer</p>
                </div>
                <div class="arrow-m-right">
                  <img class="arrow-m" src="./assests/images/rightArrow.svg" alt="Arrow">
@@ -93,10 +96,11 @@
            </div>
          </div>

-          <div class="col-lg-4 col-md-4 col-sm-4 col-6">
-        <div class="card team-card"
-                        onclick="openDrawer('Sunil Rohokale', 'Chief Business Officer', './assests/images/team1-d.svg',
-            'Mr. Himanshoo Bohara, is the group Chief Financial Officer and was appointed on February 1, 2011. He holds a bachelor\'s degree in science from the Mohanlal Sukhadia University, Udaipur. He is also a member of the Institute of Chartered Accountants of India and is a member of the Institute of Company Secretaries of India.<br><br>He has 19 years of experience. Before joining ASK, he was holding position of group chief financial officer at Centrum Capital Limited. He has also worked with DSP Merrill Lynch Limited, The Hong Kong and Shanghai Banking Corporation Limited and Accenture India Private Limited.')">      <img src="./assests/images/team2.svg" alt="Sunil Rohokale">
+          <div class="col-lg-4 col-md-4 col-sm-4 col-6 team-spac">
+            <div class="card team-card"
+              onclick="openDrawer('Sunil Rohokale', 'Chief Business Officer', './assests/images/team2.svg',
+            'Mr. Himanshoo Bohara, is the group Chief Financial Officer and was appointed on February 1, 2011. He holds a bachelor\'s degree in science from the Mohanlal Sukhadia University, Udaipur. He is also a member of the Institute of Chartered Accountants of India and is a member of the Institute of Company Secretaries of India.<br><br>He has 19 years of experience. Before joining ASK, he was holding position of group chief financial officer at Centrum Capital Limited. He has also worked with DSP Merrill Lynch Limited, The Hong Kong and Shanghai Banking Corporation Limited and Accenture India Private Limited.')">
+              <img src="./assests/images/team2.svg" alt="Sunil Rohokale" class="team-img">
              <div class="team-info">
                <div class="text-height">
                  <h5>Sunil Rohokale <img class="arrow" src="./assests/images/rightArrow.svg" alt="Arrow"></h5>
@@ -109,10 +113,11 @@
            </div>
          </div>

-          <div class="col-lg-4 col-md-4 col-sm-4 col-6">
-        <div class="card team-card" 
-                    onclick="openDrawer('Bhavana Shah', 'Chief Business Officer', './assests/images/team1-d.svg',
-          'Mr. Himanshoo Bohara, is the group Chief Financial Officer and was appointed on February 1, 2011. He holds a bachelor\'s degree in science from the Mohanlal Sukhadia University, Udaipur. He is also a member of the Institute of Chartered Accountants of India and is a member of the Institute of Company Secretaries of India.<br><br>He has 19 years of experience. Before joining ASK, he was holding position of group chief financial officer at Centrum Capital Limited. He has also worked with DSP Merrill Lynch Limited, The Hong Kong and Shanghai Banking Corporation Limited and Accenture India Private Limited.')">      <img src="./assests/images/team3.svg" alt="Bhavana Shah">
+          <div class="col-lg-4 col-md-4 col-sm-4 col-6 team-spac">
+            <div class="card team-card"
+              onclick="openDrawer('Bhavana Shah', 'Chief Business Officer', './assests/images/team3.svg',
+          'Mr. Himanshoo Bohara, is the group Chief Financial Officer and was appointed on February 1, 2011. He holds a bachelor\'s degree in science from the Mohanlal Sukhadia University, Udaipur. He is also a member of the Institute of Chartered Accountants of India and is a member of the Institute of Company Secretaries of India.<br><br>He has 19 years of experience. Before joining ASK, he was holding position of group chief financial officer at Centrum Capital Limited. He has also worked with DSP Merrill Lynch Limited, The Hong Kong and Shanghai Banking Corporation Limited and Accenture India Private Limited.')">
+              <img src="./assests/images/team3.svg" alt="Bhavana Shah" class="team-img">
              <div class="team-info">
                <div class="text-height">
                  <h5>Bhavana Shah <img class="arrow" src="./assests/images/rightArrow.svg" alt="Arrow"></h5>
@@ -124,16 +129,16 @@
              </div>
            </div>
          </div>
-        </div>
-        <div class="row g-4 mt-2">
-          <div class="col-lg-4 col-md-4 col-sm-4 col-6">
-        <div class="card team-card"
-                      onclick="openDrawer('Sameer Koticha', 'Co-founder, CEO, ASK Asset & Wealth Management Group', './assests/images/team1-d.svg',
-          'Mr. Himanshoo Bohara, is the group Chief Financial Officer and was appointed on February 1, 2011. He holds a bachelor\'s degree in science from the Mohanlal Sukhadia University, Udaipur. He is also a member of the Institute of Chartered Accountants of India and is a member of the Institute of Company Secretaries of India.<br><br>He has 19 years of experience. Before joining ASK, he was holding position of group chief financial officer at Centrum Capital Limited. He has also worked with DSP Merrill Lynch Limited, The Hong Kong and Shanghai Banking Corporation Limited and Accenture India Private Limited.')">      <img src="./assests/images/team1.svg" alt="Bharat Shah">
+
+                    <div class="col-lg-4 col-md-4 col-sm-4 col-6 team-spac">
+            <div class="card team-card"
+              onclick="openDrawer('Sameer Koticha', 'Co-founder, CEO, ASK Asset & Wealth Management Group', './assests/images/team1.svg',
+              'Mr. Himanshoo Bohara, is the group Chief Financial Officer and was appointed on February 1, 2011. He holds a bachelor\'s degree in science from the Mohanlal Sukhadia University, Udaipur. He is also a member of the Institute of Chartered Accountants of India and is a member of the Institute of Company Secretaries of India.<br><br>He has 19 years of experience. Before joining ASK, he was holding position of group chief financial officer at Centrum Capital Limited. He has also worked with DSP Merrill Lynch Limited, The Hong Kong and Shanghai Banking Corporation Limited and Accenture India Private Limited.')">
+              <img src="./assests/images/team1.svg" alt="Bharat Shah" class="team-img">
              <div class="team-info">
                <div class="text-height">
                  <h5>Bharat Shah <img class="arrow" src="./assests/images/rightArrow.svg" alt="Arrow"></h5>
-                  <p>Chief Investment Officer</p>
+                  <p>Chief Investment Officer & Chief Executive Officer</p>
                </div>
                <div class="arrow-m-right">
                  <img class="arrow-m" src="./assests/images/rightArrow.svg" alt="Arrow">
@@ -142,10 +147,11 @@
            </div>
          </div>

-          <div class="col-lg-4 col-md-4 col-sm-4 col-6">
-        <div class="card team-card"
-                        onclick="openDrawer('Sunil Rohokale', 'Chief Business Officer', './assests/images/team1-d.svg',
-            'Mr. Himanshoo Bohara, is the group Chief Financial Officer and was appointed on February 1, 2011. He holds a bachelor\'s degree in science from the Mohanlal Sukhadia University, Udaipur. He is also a member of the Institute of Chartered Accountants of India and is a member of the Institute of Company Secretaries of India.<br><br>He has 19 years of experience. Before joining ASK, he was holding position of group chief financial officer at Centrum Capital Limited. He has also worked with DSP Merrill Lynch Limited, The Hong Kong and Shanghai Banking Corporation Limited and Accenture India Private Limited.')">      <img src="./assests/images/team2.svg" alt="Sunil Rohokale">
+          <div class="col-lg-4 col-md-4 col-sm-4 col-6 team-spac">
+            <div class="card team-card"
+              onclick="openDrawer('Sunil Rohokale', 'Chief Business Officer', './assests/images/team2.svg',
+            'Mr. Himanshoo Bohara, is the group Chief Financial Officer and was appointed on February 1, 2011. He holds a bachelor\'s degree in science from the Mohanlal Sukhadia University, Udaipur. He is also a member of the Institute of Chartered Accountants of India and is a member of the Institute of Company Secretaries of India.<br><br>He has 19 years of experience. Before joining ASK, he was holding position of group chief financial officer at Centrum Capital Limited. He has also worked with DSP Merrill Lynch Limited, The Hong Kong and Shanghai Banking Corporation Limited and Accenture India Private Limited.')">
+              <img src="./assests/images/team2.svg" alt="Sunil Rohokale" class="team-img">
              <div class="team-info">
                <div class="text-height">
                  <h5>Sunil Rohokale <img class="arrow" src="./assests/images/rightArrow.svg" alt="Arrow"></h5>
@@ -158,10 +164,11 @@
            </div>
          </div>

-          <div class="col-lg-4 col-md-4 col-sm-4 col-6">
-        <div class="card team-card" 
-                    onclick="openDrawer('Bhavana Shah', 'Chief Business Officer', './assests/images/team1-d.svg',
-          'Mr. Himanshoo Bohara, is the group Chief Financial Officer and was appointed on February 1, 2011. He holds a bachelor\'s degree in science from the Mohanlal Sukhadia University, Udaipur. He is also a member of the Institute of Chartered Accountants of India and is a member of the Institute of Company Secretaries of India.<br><br>He has 19 years of experience. Before joining ASK, he was holding position of group chief financial officer at Centrum Capital Limited. He has also worked with DSP Merrill Lynch Limited, The Hong Kong and Shanghai Banking Corporation Limited and Accenture India Private Limited.')">      <img src="./assests/images/team3.svg" alt="Bhavana Shah">
+          <div class="col-lg-4 col-md-4 col-sm-4 col-6 team-spac">
+            <div class="card team-card"
+              onclick="openDrawer('Bhavana Shah', 'Chief Business Officer', './assests/images/team3.svg',
+          'Mr. Himanshoo Bohara, is the group Chief Financial Officer and was appointed on February 1, 2011. He holds a bachelor\'s degree in science from the Mohanlal Sukhadia University, Udaipur. He is also a member of the Institute of Chartered Accountants of India and is a member of the Institute of Company Secretaries of India.<br><br>He has 19 years of experience. Before joining ASK, he was holding position of group chief financial officer at Centrum Capital Limited. He has also worked with DSP Merrill Lynch Limited, The Hong Kong and Shanghai Banking Corporation Limited and Accenture India Private Limited.')">
+              <img src="./assests/images/team3.svg" alt="Bhavana Shah" class="team-img">
              <div class="team-info">
                <div class="text-height">
                  <h5>Bhavana Shah <img class="arrow" src="./assests/images/rightArrow.svg" alt="Arrow"></h5>
@@ -173,7 +180,10 @@
              </div>
            </div>
          </div>
+
+          
        </div>
+      

      </div>

@@ -217,7 +227,7 @@


    <h5 style="padding-top: 5px; padding-left: 10px;" id="drawerName"></h5>
-    <p style="width: 250px; border-bottom: 1px solid #033A49; padding-bottom: 4px; margin-left: 10px;" class="role"
+    <p style="width: 250px; border-bottom: 1px solid #033A49; padding-bottom: 15px; margin-left: 10px;" class="role"
      id="drawerRole"></p>
    <p class="desc" id="drawerDesc" style="padding-left: 10px;"></p>
  </div>
Author	SHA1	Message	Date
unknown	289eaf8ed4	made overall layout as figma All checks were successful ask-mutual-fund Actions Workflow / test (push) Successful in 16s Details	2025-11-05 19:34:57 +05:30
unknown	2a7c51da33	fix card stacking layout All checks were successful ask-mutual-fund Actions Workflow / test (push) Successful in 16s Details	2025-11-05 12:17:58 +05:30
unknown	dcb32d0e42	enable stacking animation in mobile device All checks were successful ask-mutual-fund Actions Workflow / test (push) Successful in 16s Details	2025-11-05 11:26:46 +05:30
unknown	a2cc409bc3	made homepage same as figma All checks were successful ask-mutual-fund Actions Workflow / test (push) Successful in 17s Details	2025-11-04 19:52:34 +05:30
unknown	98ccbf52d7	correct image type All checks were successful ask-mutual-fund Actions Workflow / test (push) Successful in 16s Details	2025-11-04 18:49:58 +05:30
unknown	ab688231a0	made homepage feedback changes All checks were successful ask-mutual-fund Actions Workflow / test (push) Successful in 21s Details	2025-11-04 18:45:38 +05:30
unknown	3e458f486b	made homepage feedback changes	2025-11-04 18:41:08 +05:30
unknown	a87171cd6e	fix mobile goal card width All checks were successful ask-mutual-fund Actions Workflow / test (push) Successful in 17s Details	2025-10-30 15:52:42 +05:30
unknown	d58c9c5059	scroll animation and card width All checks were successful ask-mutual-fund Actions Workflow / test (push) Successful in 17s Details	2025-10-30 15:39:16 +05:30
unknown	96dcb4a26d	fixed card stacking animation All checks were successful ask-mutual-fund Actions Workflow / test (push) Successful in 15s Details	2025-10-30 14:44:13 +05:30
unknown	a0034abfb1	fix card bg and scroll animation of home page All checks were successful ask-mutual-fund Actions Workflow / test (push) Successful in 16s Details	2025-10-29 14:52:24 +05:30
AnsariTufail	21ffad2a9a	bug fixed	2025-10-29 10:15:45 +05:30