'use client'; import React, { useState, useEffect, useRef } from 'react'; import { motion, useInView } from "framer-motion"; import type { Variants } from "framer-motion"; // Custom SVG Icons for the social buttons const FacebookIcon = ({ active }: { active: boolean }) => ( ); const LinkedInIcon = ({ active }: { active: boolean }) => ( ); const TwitterIcon = ({ active }: { active: boolean }) => ( ); // High-fidelity sunglasses SVG matching the design, with a sparkle/star on the top-right const SunglassIcon = () => ( ); export default function Vision({ className }: { className?: string }) { const [activeSocial, setActiveSocial] = useState('facebook'); const videoRef = useRef(null); const containerRef = useRef(null); const isAllInView = useInView(containerRef, { once: true, amount: 0.15 }); useEffect(() => { if (videoRef.current) { videoRef.current.playbackRate = 0.60; } }, []); const containerVariants: Variants = { hidden: {}, visible: { transition: { staggerChildren: 0.12, } } }; const itemVariants: Variants = { hidden: { opacity: 0, y: 30, filter: 'blur(4px)' }, visible: { opacity: 1, y: 0, filter: 'blur(0px)', transition: { type: 'spring' as const, stiffness: 70, damping: 18 } } }; const leftVideoVariants: Variants = { hidden: { opacity: 0, x: -60, filter: 'blur(8px)' }, visible: { opacity: 1, x: 0, filter: 'blur(0px)', transition: { duration: 1.2, ease: [0.16, 1, 0.3, 1] as const } } }; return ( <>

Future of Vision

Smart eyewear for the modern lifestyle

Redefining Everyday Vision with AI-Powered Wearables. Experience intelligent eyewear that combines immersive visuals, seamless connectivity, and all-day comfort to help you stay informed, connected, and productive wherever life takes you. Connect with Glimpse

); }