Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a web application designed as a comprehensive hub for Euríbor data, focusing on delivering an interactive user experience while providing essential information about Euríbor rates and their impact on mortgage payments. The application aims to transform the existing static content into a dynamic resource that includes tools for users to calculate and compare mortgage costs based on current Euríbor values.

## CORE FEATURES
1. **Current Euríbor Rate Display**: Prominently display the current Euríbor rate in a large, bold format, along with contextual information about its recent changes.
2. **Mortgage Impact Calculator**: An interactive widget where users can input their mortgage details (capital pending, differential, etc.) to see how the current Euríbor affects their monthly payments.
3. **Euríbor Evolution Graph**: A visually engaging graph that compares the current Euríbor rate with historical data and the average mortgage rate, allowing users to understand trends.
4. **Simplified Historical Data Table**: A user-friendly table that presents the last 12 months and 5 years of Euríbor data with an easy-to-use selector for quick reference.
5. **Informational Cards**: Cards that provide tailored advice depending on the user’s mortgage situation (e.g., variable mortgage holders, those seeking new mortgages).
6. **Mortgage Review Calculator**: A tool where users can estimate how changes in the Euríbor will impact their mortgage payments, offering inputs for previous and current rates.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist - Clean, simple design with plenty of white space, minimal color palette, and focus on typography.
- **Color Mode**: Light theme with dark text on light backgrounds to enhance readability.
- **Layout**: 
  - **Hero Section**: Prominent display for the current Euríbor rate and subcopy with trend indicators.
  - **Block Sections**: Each feature (calculator, graph, historical data, etc.) is presented in well-defined sections with ample spacing.
  - **Call to Action**: Positioned at the bottom, encouraging users to analyze their mortgage.
- **Typography**: Use a sans-serif font for a modern look. Headings should be bold and larger for impact, while body text remains clear and legible.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript for strong typing and component structure.
- **Styling**: Tailwind CSS for utility-first styling, allowing rapid design iterations.
- **UI Components**: Utilize shadcn/ui for pre-built UI components that are customizable and responsive.
- **State Management**: Consider using React Context or Zustand for managing application state across different components.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript and install Tailwind CSS and shadcn/ui.
2. **Create Components**: Develop individual components for each feature: Hero, Calculator, Graph, Historical Data Table, Informational Cards, and CTA.
3. **Implement State Management**: Set up state management for user inputs in the calculators and historical data.
4. **Design Layout**: Structure the layout as per the design specifications, ensuring mobile responsiveness.
5. **Add Interactivity**: Implement event handlers for user inputs and calculations in the widgets.
6. **SEO Optimization**: Ensure all components are SEO-friendly with appropriate metadata and heading structures.
7. **Testing**: Perform thorough testing for usability, responsiveness, and functionality across devices.

## USER EXPERIENCE
Users will land on the application and immediately see the current Euríbor rate in a large format, along with indications of its recent changes. They can interact with the mortgage impact calculator to see how the current rate affects their payments, view an engaging graph to understand historical trends, and use simplified tables for quick data access. Informational cards will guide them based on their specific mortgage scenarios, enhancing engagement and conversion potential. Finally, a clear call to action will invite users to analyze their mortgage, driving further interaction with the site.