Add orbit circles animation to hero section for enhanced visual effects

theme/blocks/index.php

@@ -1492,12 +1492,28 @@ function oribi_render_particles( $count = 12 ) {
     return $html;
 }
 
+/**
+ * Render decorative orbit circles that drift around the hero.
+ *
+ * @param  int    $count Number of circles (default 5).
+ * @return string        Rendered HTML.
+ */
+function oribi_render_orbit_circles( $count = 5 ) {
+    $html = '<div class="hero-orbit-circles" aria-hidden="true">';
+    for ( $i = 1; $i <= $count; $i++ ) {
+        $html .= '<div class="hero-orbit-circle hero-orbit-circle--' . $i . '"></div>';
+    }
+    $html .= '</div>';
+    return $html;
+}
+
 /* ── Animated Hero (homepage) ──────────────────────────────────────────────── */
 function oribi_render_hero_animated( $a ) {
     ob_start();
     ?>
 <section class="hero hero-animated">
     <?php echo oribi_render_particles( 12 ); ?>
+    <?php echo oribi_render_orbit_circles( 5 ); ?>
     <div class="hero-animated__glow"></div>
     <div class="container hero-animated__inner">
         <div class="hero-animated__content">
@@ -1538,6 +1554,7 @@ function oribi_render_page_hero_animated( $a ) {
     ob_start(); ?>
 <section class="page-hero page-hero-animated">
     <?php echo oribi_render_particles( 8 ); ?>
+    <?php echo oribi_render_orbit_circles( 4 ); ?>
     <div class="hero-animated__glow"></div>
     <div class="hero-overlay"></div>
     <div class="container">