commit 20260703

assets/css/index.css

@@ -1597,6 +1597,11 @@
   z-index: 1;
 }
 
+#homepage #block-1 {
+  height: auto;
+  min-height: 0;
+}
+
 .main {
   position: relative;
   z-index: 1;
@@ -1617,14 +1622,29 @@
   --hero-nav-gap: 76px;
   --hero-coach-dots-gap: 35px;
   --hero-dots-height: 10px;
-  /* left column: badge top → AI Coach bottom */
-  --hero-slide1-content-height: 486px;
-  /* viewport height (fits right visual + left column) */
-  --hero-slide1-viewport-height: 580px;
+  /* measured by home-hero-carousel.js from data-hero-layout-reference slide */
+  --hero-reference-content-bottom-fallback: 486px;
+  --hero-reference-viewport-height-fallback: calc(
+    var(--hero-reference-content-bottom-fallback) + var(--hero-coach-dots-gap)
+  );
+  --hero-reference-dots-top-fallback: calc(
+    var(--hero-nav-gap) + var(--hero-reference-content-bottom-fallback) + var(--hero-coach-dots-gap)
+  );
   --hero-inner-padding-bottom: 40px;
+  --hero-inner-max-width: 1280px;
+  --hero-content-max-width: 680px;
+  --hero-visual-image-scale: 1.06;
+  --hero-mobile-visual-dots-gap: 24px;
+  --hero-mobile-fixed-dots-bottom: 16px;
+  /* slide top → dots top (visual vertical zone) */
+  --hero-visual-zone-height: var(
+    --hero-reference-viewport-height,
+    var(--hero-reference-viewport-height-fallback)
+  );
   /* Mobile: arc ~30px below dots (height-limited cover) */
   --hero-arc-gap: 30px;
-  --hero-dots-y: calc(48px + 720px + 56px - 32px + 10px);
+  --hero-bg-height-adjust: -120px;
+  --hero-dots-y: calc(48px + 720px + 56px - 32px + var(--hero-dots-height));
 }
 
 #homepage .hero-bg {
@@ -1636,6 +1656,7 @@
   height: calc(
     (var(--hero-dots-y) + var(--hero-arc-gap)) * var(--hero-img-height)
     / (var(--hero-img-height) - var(--hero-img-arc-offset))
+    + var(--hero-bg-height-adjust, 0px)
   );
   object-fit: cover;
   object-position: center bottom;
@@ -1647,7 +1668,7 @@
 
 @media (min-width: 768px) and (max-width: 991.98px) {
   #homepage {
-    --hero-dots-y: calc(80px + 720px + 64px - 40px + 10px);
+    --hero-dots-y: calc(76px + 720px + 64px - 40px + var(--hero-dots-height));
   }
 }
 
@@ -1656,8 +1677,8 @@
     --hero-arc-gap: 8px;
     --hero-bg-height-adjust: -15px;
     --hero-dots-y: calc(
-      var(--hero-nav-gap) + var(--hero-slide1-content-height)
-      + var(--hero-coach-dots-gap) + var(--hero-dots-height)
+      var(--hero-reference-dots-top, var(--hero-reference-dots-top-fallback))
+      + var(--hero-dots-height)
       + var(--hero-inner-padding-bottom)
     );
   }
@@ -1687,17 +1708,6 @@
   pointer-events: none;
 }
 
-#block-1 .hero-buttons {
-  margin-top: 5rem;
-}
-#block-1 #section-2 {
-  padding-top: 0r !important;
-  position: absolute;
-  bottom: 100px;
-  width: 100%;
-  padding: top;
-}
-
 #section-5 table tbody tr:first {
   background: #000;
 }
@@ -1977,12 +1987,6 @@
   }
   /* section-2 end */
   /* home page */
-  #homepage #block-1 {
-    height: unset;
-  }
-  #homepage #block-1 .hero-buttons {
-    margin-top: 5rem;
-  }
   #homepage #block-1 #section-3 .slice-lg {
     padding-top: 1.5rem;
     padding-bottom: 3.5rem;
@@ -5721,10 +5725,6 @@
 
 @media(max-width:768px){
   .banner-desc br,#block-1{height:62.9375rem;position:relative;min-height:42vh;min-height:42svh}
-  #homepage #block-1{
-    height:auto;
-    min-height:0;
-  }
   .funded-trading-hero .d-flex .img-fluid-r{right:-13px}
   .hero-img{top:7px}
   .funded-trading-hero .d-flex .img-fluid-l{left:-3px}