fix(hero): align header slider title/search stack with zibll

Put hero main title/subtitle in search before_html (document flow),
move the search overlay outside the swiper as a sibling, and reset
search/slide-text positioning to zibll tops so title and search no
longer overlap.

assets/css/frontend/zibll-utilities.css

@@ -42,17 +42,50 @@
   top: 0;
 }
 
+/* zibll .abs-center: full-width vertical center (translateY only).
+ * Header search and slide-text rely on this model. Point-center
+ * (left:50% + translate(-50%,-50%)) is NOT used for these layers. */
 .abs-center {
   position: absolute;
-  left: 50%;
+  left: 0;
+  width: 100%;
   top: 50%;
-  transform: translate(-50%, -50%);
+  right: 0.7em;
+  transform: translateY(-50%);
+  z-index: 1;
 }
 
 /* Zibll abs-center position variants (main.css) */
-.abs-center.left-bottom,
+.abs-center.left-top,
+.abs-center.right-top {
+  transform: unset;
+  top: 0;
+}
+
+.abs-center.right-top {
+  left: auto;
+  width: auto;
+  text-align: right;
+}
+
+.abs-center.left-top {
+  text-align: left;
+}
+
+.abs-center.conter-bottom,
+.abs-center.conter-conter {
+  text-align: center;
+}
+
+.abs-center.right-top,
 .abs-center.right-bottom,
-.abs-center.conter-bottom {
+.abs-center.right-conter {
+  text-align: right;
+}
+
+.abs-center.conter-bottom,
+.abs-center.right-bottom,
+.abs-center.left-bottom {
   top: auto;
   transform: unset;
   bottom: 0;