Trabajo: HTML + CSS

Cree una página de destino moderna en HTML + CSS puro (sin marcos) para un producto SaaS llamado "Job", una plataforma de entrevistas para reclutamiento impulsada por inteligencia artificial. Genera 3 archivos: index.html, estilos.css y opcionalmente script.js. **Estética general:** * Tema oscuro de estilo tecnológico de inicio premium (fondo #0b0c10, superficies #171922, bordes #23262f). * Acento principal degradado violeta/lila (#6c5ce7 → #a29bfe) y verde menta secundario (#00d4a3). * Inter tipografía (Google Fonts), pesos 400–800. Títulos grandes con espacio entre letras: -.02em y peso de fuente: 800. * Esquinas redondeadas (radio del borde: 14 px en tarjetas, 999 px en botones/píldoras). * Sutil brillo radial detrás del héroe (degradados radiales borrosos de color púrpura y verde). **Estructura (en este orden):** 1. Barra de navegación fija con desenfoque (filtro de fondo): logotipo "M" en un cuadrado degradado violeta + texto "Magzin Job", enlaces (Inicio, Búsqueda, Blog) y botón blanco redondeado "Iniciar sesión". Alternar hamburguesa en el móvil. 2. Héroe de 2 columnas: Izquierda: píldora "✦ Entrevistador con IA", título grande "Entrevistas impulsadas por IA para ayudarle a contratar". (la palabra "contratar" con degradado violeta → verde), párrafo descriptivo, dos CTA ("Comience ahora" degradado principal + "Solicitar una demostración →" fantasma). Derecha: maqueta de panel con barra superior tipo macOS (3 puntos rojos/amarillos/verdes + "Panel de entrevistas"), 4 filas con un avatar circular degradado + barra de progreso + puntuación (9,2, 8,1, 7,3, 6,4) y estadísticas inferiores en una cuadrícula de 3 (1284 entrevistas / 92 % de tasa de coincidencia / 4,8 millones de tiempo promedio). 3. Barra de confianza: "CONFIABLE POR EQUIPOS GLOBALES" + logos en texto (NASA, PORSCHE, NIKE, Nestlé, Deloitte.). 4. Sección de valor enfocado: H2 "Contratar es difícil. Magzin AI Interviewer está aquí para ayudar". + párrafo + enlace "Leer el caso de estudio →". 5. Beneficios en una cuadrícula de 4 tarjetas con un ícono emoji en un cuadrado violeta translúcido: ahorrar tiempo (⏱), mejorar la calidad (✦), impulsar la equidad (⚖), ver resultados (📊). Flotar: elevaciones y borde violeta. 6. Cómo funciona (fondo #11131a): título centrado + lista ordenada de 5 pasos en cuadrícula horizontal con el número "01–05" en morado y h4+descripción. 7. Soluciones industriales: cuadrícula 4×3 de 12 industrias (automotriz, banca y seguros, bienes de consumo, educación, gobierno, atención médica, hotelería, manufactura, energía y servicios públicos, farmacéutica y biotecnología, bienes raíces, venta minorista) + CTA "¿No ve su industria en la lista? Póngase en contacto". 8. Pie de página con logo + "© 2025 Magzin Job. Todos los derechos reservados." **Responsivo:** * <900px: héroe en 1 columna, los enlaces de navegación están ocultos y aparece una hamburguesa, cuadrículas en 2 columnas. * <520px: todas las cuadrículas con 1 columna. **Detalles técnicos:** * Ancho máximo del contenedor 1180 px, relleno lateral 24 px. * Botón principal con sombra de cuadro: 0 10px 30px -10px rgba(108,92,231,.6) y coloque el cursor en traducirY(-2px). * Variables CSS en :root para todos los colores y radios. * No hay dependencias de JS más allá de un interruptor opcional para el menú móvil. * Código limpio, semántico y accesible (etiqueta aria en botones de iconos).