fix(header): 1:1 zibll overlay icon cards for top multifunc component

Rebuild header-slider card DOM/CSS against zib_header_slide + zib_icon_cover_card so shared/individual backgrounds, flex gutters, and badge icons match the reference theme.

assets/css/frontend/zibll-utilities.css

@@ -25,6 +25,29 @@
 .flex1 { flex: 1 1 auto; min-width: 0; }
 .flex.column { flex-direction: column; }
 .flex.wrap { flex-wrap: wrap; }
+.flex.flex-row,
+.flex-row { flex-direction: row; }
+.flex.jse,
+.jse { justify-content: space-evenly; }
+.flex.jsa,
+.jsa { justify-content: space-around; }
+/* Nested flex1 (zibll .flex .flex1) — allow both direct and descendant */
+.flex > .flex1,
+.flex .flex1 { flex: 1; overflow: hidden; min-width: 0; }
+.relative-h { position: relative; height: 100%; }
+.padding-10 { padding: 10px; }
+.font-bold { font-weight: bold; }
+.mt6 { margin-top: 6px; }
+.gutters-5 { margin: -5px; }
+.gutters-5 > * { padding: 5px; }
+@media (max-width: 767px) {
+  .flex.flex-row.flex-col-sm-2 {
+    flex-wrap: wrap;
+  }
+  .flex.flex-row.flex-col-sm-2 > * {
+    flex-basis: 50%;
+  }
+}
 
 .clearfix::before,
 .clearfix::after {