Scaling Platform

# Prompt: Recreate the Targo hero + about sections

Build a single-page site with exactly two sections. Font: **Quantico** (Google Fonts, weights 400 + 700), fallback 'Arial Narrow', sans-serif. Accent color: **#15BCDF** (hover #3fd0ef, border #0fa3c2). Page/body background: **#F2F1F0**. Text colors: headings #2b3033, nav links #3a3a3a, body gray #6b6f72. All headings uppercase, letter-spacing 0.01em, line-height 0.98.

## Section 1 — Hero (min-height: 100svh, background #F2F1F0, overflow hidden)

**Background video** (absolutely positioned, pointer-events none, no crop — objectFit: contain, height auto):
`https://d8j0ntlcm91z4.cloudfront.net/user_38xzZboKViGWJOttwIXH07lWA1P/hf_20260823_050407_500d0339-ab28-41c1-9688-132a74a3b5aa.mp4`
- Desktop: top 0, right -20%, width 99%.
- Mobile (≤700px): top 0, left -12%, width 119%.
- Attributes: autoplay, muted, loop, playsinline, preload auto. Robustness: retry `video.play()` every 1s and on first document click/touchstart (always set muted before play, swallow rejections).
- Desktop only: a scrim overlay on the left 70% of the section, `linear-gradient(90deg, #F2F1F0 0%, #F2F1F0 55%, rgba(242,241,240,0.85) 78%, rgba(242,241,240,0) 100%)`, no scrim on mobile.