Add geometric triangle designs to enhance the platform's visual appeal

Integrate CSS styles for geometric triangle decorations on the header, home page, and footer, utilizing absolute positioning and rotations for visual depth.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: d7424866-83d1-4486-a212-ac12b4c7becf
Replit-Commit-Checkpoint-Type: full_checkpoint
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/8cc42625-c1f5-4e43-99bd-77f2c4dedee2/d7424866-83d1-4486-a212-ac12b4c7becf/T874Ib6

client/src/components/search-header.tsx

@@ -40,8 +40,12 @@ export default function SearchHeader({
   };
 
   return (
-    <div className="bunny-gray border-b border-white/20 sticky top-0 z-50 backdrop-blur-md">
-      <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
+    <div className="bunny-gray border-b border-white/20 sticky top-0 z-50 backdrop-blur-md relative overflow-hidden">
+      {/* Triangle decorations in header */}
+      <div className="triangle-decoration-2 opacity-30" style={{top: '10px', right: '15%'}}></div>
+      <div className="triangle-decoration-3 opacity-20" style={{top: '30px', left: '70%'}}></div>
+      
+      <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 relative z-10">
         <div className="flex items-center justify-between h-20">
           <div className="flex items-center space-x-4">
             <a href="/" className="flex items-center space-x-2 hover:opacity-80 transition-opacity">