tesado .com

# Landing Page Specification

## 1. Theme & Aesthetic
Clean, professional, and data-driven. A sophisticated SaaS aesthetic with a focus on clarity and insightful visualization.

## 2. Color Palette
- **Primary**: #2C3E50 (Deep, premium shade of charcoal blue)
- **Secondary**: #ECF0F1
- **Accent**: #E67E22 (Vibrant orange for highlights)
- **Background**: #FFFFFF
- **Surface/Card**: #F8F9FA
- **Border**: #E0E0E0 (Subtle)

## 3. Typography
- **Headings**: Montserrat (Modern, strong, and readable for data titles)
- **Body**: Open Sans (Clear, highly legible, and friendly for detailed information)

## 4. UI Design System
- **Shadows**: 0 4px 10px rgba(0, 0, 0, 0.08) (Soft, professional lift)
- **Border Radius**: 8px (Modern, slightly rounded edges)
- **Spacing**: Liberal whitespace, 96px section padding (Ensures breathability and focus on content)

## 5. Layout Structure
- **Hero**: Full-width section with a striking headline, a brief value proposition, and a clear call-to-action button, accompanied by an abstract, stylized data visualization screenshot or animation.
- **Features**: A responsive 3-column grid displaying key features with concise descriptions and illustrative icons, emphasizing benefits.
- **CTA**: A prominent, centrally placed button with a compelling offer, contrasting against a clean background, encouraging immediate action.

## 6. Tech Stack
- Framework: Next.js 14
- Styling: Tailwind CSS
- Animation: Framer Motion