/** @jsx React.createElement */ // Hero — cursor-tilted AR wordmark with layered depth const Hero = () => { const wrapRef = React.useRef(null); const p = useCursorInside(wrapRef); const scrollY = useScrollY(); const isMobile = useWindowWidth() < 768; // Smooth the cursor const [s, setS] = React.useState({ x: 0, y: 0 }); React.useEffect(() => { let raf; const tick = () => { setS(prev => ({ x: prev.x + (p.x - prev.x) * 0.08, y: prev.y + (p.y - prev.y) * 0.08 })); raf = requestAnimationFrame(tick); }; raf = requestAnimationFrame(tick); return () => cancelAnimationFrame(raf); }, [p.x, p.y]); const tiltX = s.y * 10; const tiltY = -s.x * 14; const parallax = scrollY * 0.35; return (
{/* Gradient atmosphere */}
{/* Scan line sweep */}
{/* Floating depth layers — simulate AR UI (hidden on mobile) */} {!isMobile && <>
FOV 62°
WORLD · LOCKED
LIVE · 4K
60 FPS · WEB AR
 } {/* Main wordmark */}
VELKOMMEN TIL

AUGMENTED
REALITY {/* RGB split echo */}

Vi bygger interaktive brandoplevelser, der fjerner grænsen mellem det fysiske og det digitale - direkte i browseren, uden app.

{/* Corner meta */}
LC/AR · 25.04
SCROLL ↓
WEB · AR NO · APP
); }; const cornerStyle = (corner) => { const base = { position: 'absolute', fontFamily: 'Space Mono, monospace', fontSize: 10, letterSpacing: '0.14em', color: 'rgba(255,255,255,0.7)', textTransform: 'uppercase', }; if (corner === 'bl') return { ...base, left: 32, bottom: 28 }; if (corner === 'br') return { ...base, right: 32, bottom: 28 }; if (corner === 'tr-meta') return { ...base, right: 32, top: '50%', transform: 'translateY(-50%) rotate(90deg)', transformOrigin: 'right center' }; return base; }; const FloatingLayer = ({ x, y, depth, style, children }) => (
{children}
); const Crosshair = ({ size, label }) => (
{label}
); window.Hero = Hero;