Eres un diseñador web senior especializado en productos tech B2B del sector aeroespacial y defensa. Crea una landing page completa en un único archivo HTML autocontenido para un producto llamado "FlightWatch" — una plataforma SaaS de seguimiento de vuelos en tiempo real para aerolíneas comerciales, operadores de drones industriales y gestores de espacio aéreo. ## ESTRUCTURA DE LA PÁGINA 1. **Barra superior fija** - Logo "FlightWatch" con icono SVG de radar a la izquierda - Links de navegación: Producto, Clientes, Precios, API Docs - Botón CTA: "Solicitar demo" en cyan brillante - Banner justo encima de la navbar: "🔴 LIVE — 47.293 vuelos en seguimiento ahora mismo" con un contador JavaScript que sube lentamente de forma aleatoria 2. **Hero section** - Headline: "Cada avión. Cada segundo. En tiempo real." - Subtítulo: "FlightWatch procesa más de 2 millones de señales ADS-B al día para darte la imagen más precisa del espacio aéreo global." - Dos botones: "Iniciar prueba gratuita →" (cyan, prominente) y "Ver demo en vivo" (outline) - Mapa mundial oscuro SVG o canvas con entre 40 y 60 puntos de luz parpadeantes distribuidos sobre rutas reales (Europa, Atlántico Norte, Asia) que simulen posiciones de aviones - Sobre el mapa, 3 o 4 líneas de vuelo animadas entre pares de ciudades: Londres-Nueva York, Madrid-Dubai, Frankfurt-Tokio, París-São Paulo - Efecto de radar: círculos concéntricos que se expanden y desvanecen desde el centro del mapa 3. **Métricas en tiempo real** (barra horizontal entre hero y features) - 4 cifras con contadores animados que suben al hacer scroll: 2.1M señales/día | 99.98% uptime | 180 países cubiertos | <2s latencia media 4. **Sección de características** (3 columnas) - Cobertura global: red de 35.000 receptores ADS-B propios - API REST en tiempo real: latencia menor a 2 segundos, webhooks, WebSocket - Alertas inteligentes: detección de desvíos de ruta, entradas en espacio restringido, anomalías de altitud 5. **Sección "Cómo funciona"** — 3 pasos con línea conectora animada - Paso 1: Los receptores captan señales ADS-B de las aeronaves - Paso 2: FlightWatch procesa y normaliza los datos en tiempo real - Paso 3: Tu sistema recibe los datos vía API, webhook o dashboard 6. **Sección de clientes** — logos ficticios pero creíbles en escala de grises - Nombres: IberiaOps, AirControl GmbH, DroneFleet EU, SkyLogistics Inc, AeroNav Portugal, Mediterranean Air Services 7. **Pricing** — 3 tiers - Starter: €299/mes — hasta 500 vuelos simultáneos, API incluida - Professional: €899/mes — ilimitado, webhooks, soporte prioritario - Enterprise: precio personalizado — instalación on-premise, SLA 99.99% 8. **Footer** - Logo + tagline: "El espacio aéreo, en tus manos." - 4 columnas de links ficticios: Producto, Empresa, Legal, Desarrolladores - Copyright 2025 FlightWatch Technologies S.L. ## DISEÑO Y ESTÉTICA - **Paleta:** fondo #080c14 (azul noche casi negro), primario #0a84ff (azul eléctrico), acento #00e5cc (cyan), texto principal #e8edf5, texto secundario #6b7a99 - **Tipografía:** importar desde Google Fonts — "Orbitron" para headlines y el logo (futurista, aeroespacial), "IBM Plex Mono" para datos numéricos y métricas, "Inter" para el cuerpo de texto - **Estética general:** interfaz de control de tráfico aéreo. Bordes con sutil glow cyan. Cuadrículas finas semitransparentes como papel de ingeniería. Sombras de color (no negras). - **Animaciones:** - Fade-in con desplazamiento hacia arriba en todos los elementos al hacer scroll (IntersectionObserver) - Los puntos del mapa parpadean con delays distintos entre sí - Las líneas de ruta se dibujan con animación stroke-dashoffset - Los contadores de métricas se animan con easing ease-out al entrar en viewport - El radar pulsa continuamente con CSS keyframes - **Detalles de acabado:** - Scrollbar personalizada en cyan oscuro - Cursor personalizado: punto cyan con halo - Efecto noise/grain muy sutil sobre el fondo para dar textura - Hover en los botones con efecto de barrido de luz ## REQUISITOS TÉCNICOS - Un único archivo .html autocontenido (sin dependencias externas salvo Google Fonts) - Todo el CSS dentro de una etiqueta <style> - Todo el JS dentro de una etiqueta <script> - El mapa debe funcionar sin APIs externas — geometría SVG o canvas puro - Compatible con Chrome y Firefox modernos - No usar frameworks (no React, no Vue, no Bootstrap)