refactor(styles): move component-specific CSS into Astro components

- relocate header, footer, nav, hero, and page-hero styles into their owning components
- move blog index, blog post, team, video, insurance, CTA, and home-section styles out of the global sheet
- keep  focused on shared primitives such as buttons, cards, links, and list styling
- preserve existing layout and responsive behavior while reducing global CSS scope

www/src/components/MainNav.astro

@@ -22,3 +22,19 @@ const aboutLinks = lang === 'es'
     ))}
   </ul>
 </nav>
+
+<style>
+  .main-nav { margin-inline: auto; }
+  .main-nav ul { display: flex; gap: 1.4rem; list-style: none; margin: 0; padding: 0; }
+  .main-nav li { position: relative; }
+  .main-nav a { color: var(--color-primary); font-size: .9rem; text-decoration: none; }
+  .main-nav a:hover { color: var(--color-accent-strong); }
+  .main-nav .submenu { background: white; box-shadow: var(--shadow-md); display: none; gap: 0; left: -1rem; min-width: 180px; padding: .75rem 0; position: absolute; top: 100%; }
+  .main-nav .submenu a { display: block; padding: .45rem 1rem; }
+  .main-nav li:hover > .submenu, .main-nav li:focus-within > .submenu { display: block; }
+  @media (max-width: 950px) {
+    .main-nav { display: none; }
+    :global(.mobile-nav) .main-nav { display: block; }
+    :global(.mobile-nav) .main-nav ul { align-items: flex-start; flex-direction: column; padding: var(--space-md); }
+  }
+</style>