Recrea exactamente este pie de página de estudio creativo de una sola página. Es una tarea de fidelidad, no un rediseño. Implementa el contenido, los recursos, el CSS y las interacciones proporcionados tal cual. Construye solo esta página de pie de página. Mantén todo local; no lo publiques ni despliegues. No añadas encabezado, hero, tarjetas, formularios, secciones, botones, enlaces, animaciones ni textos extra. Las capturas de origen adjuntas abajo son la especificación autoritativa. Cópialas exactamente, adaptando solo rutas de import o la estructura del framework si es necesario. No sustituyas por tipografía aproximada, otro logo, vídeo de stock ni un efecto genérico de ojos que siguen. 1. Aspecto general: toda la página es un pie con una columna de información a la izquierda, un logo script centrado, una columna de texto de contacto a la derecha con tres iconos sociales y un vídeo de personaje lavanda. En anchos de escritorio el vídeo llena el viewport detrás de todo el contenido. En móvil el contenido se apila y el vídeo aparece después en el flujo normal. Composición espaciosa y minimalista, texto muy oscuro, sin tinte, scrim, degradado, desenfoque ni overlay sobre el vídeo. No hay enlaces externos ni destinos de contacto reales. Etiquetas de navegación, texto de contacto, iconos y logo son elementos estáticos, no anclas. No inventes destinos, correos, teléfonos, acciones de WhatsApp ni cuentas. No muestres Truus en ningún sitio. 2. Texto visible exacto: conserva ortografía, mayúsculas, puntuación, apóstrofos curvos, asteriscos y saltos de línea. Badge izquierdo: “have a fresh idea?”. Titular izquierdo: “imagination” / “meets craft”. Etiquetas: “Made”, “Story”, “In the lab”, “Say hey”. Badge derecho: “say hey”. Titular derecho: “let’s team up!” / “bring us your idea*”. Nota: “*good things start with one spark. let’s make yours.”. Iconos sociales en orden: LinkedIn, Instagram, TikTok, con los SVG exactos, sin etiquetas de texto ni enlaces. El logo central es el SVG script Logoipsum de BrandLogo con viewBox 169×40; fill en currentColor heredando #080909. No calques ni regeneres el logo. 3. Tipografía y colores exactos: titulares Epilogue Black 900; resto DM Sans Regular 400; fuentes reales y font-synthesis: none. Descarga DMSans-Regular.woff2 y Epilogue-Black.woff2 y sírvelas localmente con @font-face y font-display: swap. Texto y logo #080909; fondo escritorio de reserva #dfe4f2; badge #f7f8fa; fondo móvil #f0eefa. Sin sombras, bordes decorativos, tarjetas ni degradados. 4. Layout escritorio exacto (>700px): box-sizing border-box global; body sin margen, min-height 100vh. Footer position relative, min-height 100vh, padding-top 6.54vw, isolation isolate, overflow hidden. Bloque izquierdo: margin-left 8.65vw, width 25vw; badge pill 100px, alto 1.9vw, padding .39vw .61vw, fuente .88vw; titular margin-top 1.45vw, fuente 1.66vw peso 900; navegación columna flex gap .93vw, margin-top 1.3vw, fuente 1.075vw. Logo absoluto left 40.33vw top 7.7vw width 17vw. Bloque derecho absoluto left 74.3vw top 6.54vw; nota margin 1.05vw 0 0, fuente .733vw; fila social flex gap 1.43vw, iconos 1.71vw. Conserva estos valores vw y la colocación exacta de tres columnas. Capa de vídeo: wrapper absoluto inset 0 z-index -1 pointer-events none; vídeo object-fit cover center detrás del texto, sin canvas de pupila. 5. Layout móvil exacto (≤700px), solo dentro de @media(max-width:700px): fondo #f0eefa; footer columna flex gap 36px, min-height 100svh, padding 40px 24px 0; orden visual logo, izquierda, derecha, vídeo; logo estático width 210px max-width 75%; badges alto 30px fuente 14px; titulares clamp(22px,6.3vw,30px); navegación cuadrícula 2 columnas column-gap 24px, fuente 17px, cada etiqueta min-height 44px (fila 1 Made/Story, fila 2 In the lab/Say hey); nota max-width 34ch fuente 14px salto normal; fila social gap 18px, wrappers 44×44px con iconos 30×30px, primer wrapper margin-left -7px; wrapper de vídeo relative order 3 width calc(100%+48px) aspect-ratio 4/3 margin-top -16px, a sangre bajo el contenido. 6. Recurso de vídeo exacto: usa la URL literal completa de CloudFront sin sustituir clip, omitir segmentos, escapar guiones bajos ni alterar el nombre. Fuente 1920×1080, 24 fps, ~7.041667s: personaje lavanda peludo sosteniendo un corazón rosa sobre fondo lavanda pálido, ojos en círculos. Descarga como public/footer-background.mp4 y crea public/footer-scrub.mp4 con: ffmpeg -hide_banner -loglevel error -i public/footer-background.mp4 -an -c:v libx264 -preset fast -crf 20 -g 1 -pix_fmt yuv420p -movflags +faststart public/footer-scrub.mp4. Conserva dimensiones, fps, duración, colores y composición; codificación all-intra para búsqueda aleatoria. El elemento debe tener muted, playsInline y preload="auto", sin controles, audio, póster ni UI de carga. 7. Interacción exacta del ratón en escritorio: scrubbing de vídeo — el cursor selecciona un frame donde las pupilas grabadas apuntan hacia el cursor. No redibujes pupilas ni animes ojos en CSS. Usa la tabla gaze-frames.json. Punto medio de ojos (948,418) en frame 1920×1080; escala cover max(w/1920,h/1080); eyeX = rect.left + rect.width/2 + (948-960)*scale; eyeY = rect.top + rect.height/2 + (418-540)*scale; resta del puntero; ignora dentro de radio 8px; atan2(dy,dx) normalizado a [0,2π); busca la fila con menor diferencia angular circular; usa time + 1/240s; busca solo si diferencia > 1/48s, hay datos de frame y no hay búsqueda en curso; limita a duration - 1/24; coalesce vía requestAnimationFrame; no interpoles; el vídeo de escritorio inicia pausado en 0 y permanece en el frame elegido; recalcula en resize y scroll; listeners pasivos, elimina todo al desmontar. Cardinales: derecha 2.54167s, abajo 0.33333s, izquierda 1.0s, arriba 1.70833s. 8. Reproducción móvil: en ≤700px desactiva el seeking por puntero; el vídeo bajo el contenido reproduce normal, silenciado y en bucle; respeta prefers-reduced-motion pausando; si el autoplay no está disponible, deja el frame visible, sin error ni controles. Usa listeners matchMedia para conmutar correctamente en el breakpoint de 700px. 9. Semántica y metadatos: footer con aria-label="Footer"; wrapper de vídeo aria-hidden="true" y pointer-events:none; wrapper del logo role="img" aria-label="Studio logo" con SVG aria-hidden; wrappers sociales con etiquetas LinkedIn, Instagram, TikTok. Idioma en. Título: Studio — Footer. Descripción: Fresh ideas, imagination, and creative collaboration. Favicon: mismo logo /logo.svg con fill #080909. 10. Restricciones de implementación: React y TypeScript con CSS normal; referencia en app/page.tsx, app/layout.tsx y componente de vídeo del lado cliente. Conserva la fuente proporcionada cuando el entorno lo permita. Sin librería de animación, framework de UI ni canvas. Usa los archivos fuente exactos; obtén las dos fuentes y el vídeo; para public/logo.svg convierte fillRule/clipRule a fill-rule/clip-rule y fija #080909, conservando viewBox y path. Compila con éxito y verifica el mapeo de mirada cardinal, el apilado móvil, el salto de línea en 320px/390px y el layout de escritorio por encima de 700px. No cambies contenido al validar. Mantén todo local; no publiques ni despliegues.