Fix home page responsiveness on small screens

- Make Hero height responsive (350px mobile, 400px tablet, 500px desktop)
- Remove overflow-hidden and flex-1 from ChecksOverview to allow
  content to flow naturally and enable scrolling
- Add responsive padding to ChecksOverview for better mobile spacing

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>

frontend/components/ChecksOverview.tsx

@@ -42,7 +42,7 @@ const specialistAgents: CheckDetail[] = [
 
 export const ChecksOverview: React.FC = () => {
     return (
-        <div className="relative bg-gradient-to-br from-emerald-50 via-white to-emerald-50/30 py-16 overflow-hidden flex-1 w-full">
+        <div className="relative bg-gradient-to-br from-emerald-50 via-white to-emerald-50/30 py-12 sm:py-16 w-full">
             {/* Decorative Background */}
             <div className="absolute inset-0 pointer-events-none">
                  <div className="absolute top-0 left-1/4 w-[800px] h-[800px] bg-emerald-200/30 rounded-full blur-3xl -translate-y-1/2 mix-blend-multiply"></div>

frontend/components/Hero.tsx

@@ -14,7 +14,7 @@ const ArrowRightIcon: React.FC<React.SVGProps<SVGSVGElement>> = (props) => (
 
 export const Hero: React.FC<HeroProps> = ({ onGetStarted }) => {
   return (
-    <div className="relative overflow-hidden bg-slate-900 min-h-[500px] flex items-center">
+    <div className="relative overflow-hidden bg-slate-900 min-h-[350px] sm:min-h-[400px] md:min-h-[500px] flex items-center">
         {/* Abstract background elements */}
         <div className="absolute top-[-20%] right-[-10%] w-[600px] h-[600px] rounded-full bg-brand-accent/20 blur-3xl pointer-events-none"></div>
         <div className="absolute bottom-[-20%] left-[-10%] w-[500px] h-[500px] rounded-full bg-brand-dark-blue/40 blur-3xl pointer-events-none"></div>