Feature/implement hero section

[ahmedalsanadi]

Pull Request :

Add Hero Section Component with Background Image and Responsive Design

Pull Request Description:

• Implemented the HeroSection component to serve as a prominent introduction on the landing page.
• Background Image: Utilized a cover image (coverBG.jpg) that covers the entire section, providing a visually appealing backdrop.
• Overlay Effects:
  • Added a dark overlay with a blur effect to enhance text readability against the background.
  • Included a radial gradient inset shadow effect to create depth and focus on the content.
• Responsive Typography:
  • Configured headings with varying font sizes for different screen sizes using Tailwind CSS classes, ensuring optimal readability across devices.
  • Adjusted word spacing for a more cohesive look in the headings.
• Content Structure:
  • Added text content that highlights the service offering, including a call to action encouraging users to enter their email for membership.
  • Provided a user-friendly input field for email entry paired with a prominent "Get Started" button.
• Styling Enhancements:
  • Implemented a gradient border at the bottom for a visually striking finish.
  • Created a curved overlay that visually separates the hero section from the content below, adding aesthetic appeal.

This pull request enhances the landing page's visual hierarchy and user engagement, creating a compelling introduction to the service offered.