feat: many design changes

packages/base/ContentBlocks/ContentElements/hero/templates/frontend.html

@@ -7,16 +7,16 @@
   <f:asset.css identifier="CBHero" href="{cb:assetPath()}/frontend.css" />
 
   <div class="hero-inner">
+    <!-- Inline style with f:uri.resource to ensure correct path -->
     <div class="hero">
-      <div class="hero-subheader">{data.subheader}</div>
-      <h2 class="hero-title">{data.header}</h2>
+      <h2 class="hero-subheader">{data.subheader}</h2>
+      <h1 class="hero-title">{data.header}</h1>
       <div class="hero-text">
         <f:format.html>{data.bodytext}</f:format.html>
       </div>
       <div class="hero-social-icons">
-        <a href="#" class="social-icon">X</a>
-        <a href="#" class="social-icon">Instagram</a>
-        <a href="#" class="social-icon">TikTok</a>
+            <a href="https://instagram.com" class="social-icon"><i class="ci ci-instagram"></i></a>
+            <a href="https://tiktok.com" class="social-icon"><i class="ci ci-tiktok"></i></a>
       </div>
       <div class="hero-image-wrapper">
         <f:if condition="{data.image}">