website refactor

apps/website/components/mockups/CareerProgressionMockup.tsx

@@ -1,9 +1,9 @@
 'use client';
 
-import { motion, useReducedMotion } from 'framer-motion';
-import { useState, useEffect } from 'react';
-import { Stack } from '@/ui/Stack';
+import { Stack } from '@/ui/primitives/Stack';
 import { Text } from '@/ui/Text';
+import { motion, useReducedMotion } from 'framer-motion';
+import { useEffect, useState } from 'react';
 
 export function CareerProgressionMockup() {
   const shouldReduceMotion = useReducedMotion();

apps/website/components/mockups/CompanionAutomationMockup.tsx

@@ -1,10 +1,10 @@
 'use client';
 
-import { motion, useReducedMotion } from 'framer-motion';
-import { useState, useEffect } from 'react';
-import { Stack } from '@/ui/Stack';
-import { Text } from '@/ui/Text';
 import { Heading } from '@/ui/Heading';
+import { Stack } from '@/ui/primitives/Stack';
+import { Text } from '@/ui/Text';
+import { motion, useReducedMotion } from 'framer-motion';
+import { useEffect, useState } from 'react';
 
 export function CompanionAutomationMockup() {
   const shouldReduceMotion = useReducedMotion();

apps/website/components/mockups/DriverProfileMockup.tsx

@@ -1,9 +1,9 @@
 'use client';
 
-import { motion, useReducedMotion, useMotionValue, useSpring, useTransform } from 'framer-motion';
-import { useEffect, useState } from 'react';
-import { Stack } from '@/ui/Stack';
+import { Stack } from '@/ui/primitives/Stack';
 import { Text } from '@/ui/Text';
+import { motion, useMotionValue, useReducedMotion, useSpring, useTransform } from 'framer-motion';
+import { useEffect, useState } from 'react';
 
 export function DriverProfileMockup() {
   const shouldReduceMotion = useReducedMotion();

apps/website/components/mockups/LeagueDiscoveryMockup.tsx

@@ -1,13 +1,13 @@
 'use client';
 
-import { motion, useReducedMotion } from 'framer-motion';
-import { useState, useEffect } from 'react';
-import { Stack } from '@/ui/Stack';
+import { Stack } from '@/ui/primitives/Stack';
 import { Text } from '@/ui/Text';
+import { motion, useReducedMotion } from 'framer-motion';
+import { useEffect, useState } from 'react';
 
 export function LeagueDiscoveryMockup() {
   const shouldReduceMotion = useReducedMotion();
-  const [hoveredIndex, setHoveredIndex] = useState<number | null>(null);
+  const [, setHoveredIndex] = useState<number | null>(null);
   const [isMobile, setIsMobile] = useState(false);
 
   useEffect(() => {

apps/website/components/mockups/LeagueHomeMockup.tsx

@@ -1,10 +1,10 @@
 'use client';
 
-import { motion, useReducedMotion } from 'framer-motion';
-import { useState, useEffect } from 'react';
-import { Stack } from '@/ui/Stack';
-import { Text } from '@/ui/Text';
 import { Heading } from '@/ui/Heading';
+import { Stack } from '@/ui/primitives/Stack';
+import { Text } from '@/ui/Text';
+import { motion, useReducedMotion } from 'framer-motion';
+import { useEffect, useState } from 'react';
 
 export function LeagueHomeMockup() {
   const shouldReduceMotion = useReducedMotion();

apps/website/components/mockups/ProtestWorkflowMockup.tsx

@@ -1,9 +1,9 @@
 'use client';
 
-import { motion, useReducedMotion } from 'framer-motion';
-import { useState, useEffect } from 'react';
-import { Box } from '@/ui/Box';
+import { Box } from '@/ui/primitives/Box';
 import { Text } from '@/ui/Text';
+import { motion, useReducedMotion } from 'framer-motion';
+import { useEffect, useState } from 'react';
 
 export function ProtestWorkflowMockup() {
   const shouldReduceMotion = useReducedMotion();

apps/website/components/mockups/RaceHistoryMockup.tsx

@@ -1,10 +1,10 @@
 'use client';
 
-import { motion, useReducedMotion } from 'framer-motion';
-import { useState, useEffect } from 'react';
-import { Stack } from '@/ui/Stack';
-import { Text } from '@/ui/Text';
 import { Heading } from '@/ui/Heading';
+import { Stack } from '@/ui/primitives/Stack';
+import { Text } from '@/ui/Text';
+import { motion, useReducedMotion } from 'framer-motion';
+import { useEffect, useState } from 'react';
 
 export function RaceHistoryMockup() {
   const shouldReduceMotion = useReducedMotion();

apps/website/components/mockups/SimPlatformMockup.tsx

@@ -1,8 +1,8 @@
 'use client';
 
-import { useState, useEffect } from 'react';
-import { Stack } from '@/ui/Stack';
+import { Stack } from '@/ui/primitives/Stack';
 import { Text } from '@/ui/Text';
+import { useEffect, useState } from 'react';
 
 export function SimPlatformMockup() {
   const [isMobile, setIsMobile] = useState(false);

apps/website/components/mockups/StandingsTableMockup.tsx

@@ -1,13 +1,13 @@
 'use client';
 
-import { motion, useReducedMotion, useMotionValue, useSpring } from 'framer-motion';
-import { useEffect, useState } from 'react';
-import { Stack } from '@/ui/Stack';
+import { Stack } from '@/ui/primitives/Stack';
 import { Text } from '@/ui/Text';
+import { motion, useMotionValue, useReducedMotion, useSpring } from 'framer-motion';
+import { useEffect, useState } from 'react';
 
 export function StandingsTableMockup() {
   const shouldReduceMotion = useReducedMotion();
-  const [hoveredRow, setHoveredRow] = useState<number | null>(null);
+  const [, setHoveredRow] = useState<number | null>(null);
   const [isMobile, setIsMobile] = useState(false);
 
   useEffect(() => {

apps/website/components/mockups/TeamCompetitionMockup.tsx

@@ -1,9 +1,9 @@
 'use client';
 
-import { motion, useReducedMotion } from 'framer-motion';
-import { useState, useEffect } from 'react';
-import { Stack } from '@/ui/Stack';
+import { Stack } from '@/ui/primitives/Stack';
 import { Text } from '@/ui/Text';
+import { motion, useReducedMotion } from 'framer-motion';
+import { useEffect, useState } from 'react';
 
 export function TeamCompetitionMockup() {
   const shouldReduceMotion = useReducedMotion();

apps/website/components/mockups/WorkflowMockup.tsx

@@ -1,12 +1,12 @@
 'use client';
 
+import { Icon } from '@/ui/Icon';
+import { Stack } from '@/ui/primitives/Stack';
+import { Surface } from '@/ui/primitives/Surface';
+import { Text } from '@/ui/Text';
 import { AnimatePresence, motion, useReducedMotion } from 'framer-motion';
 import { CheckCircle2, LucideIcon } from 'lucide-react';
 import { useEffect, useState } from 'react';
-import { Stack } from '@/ui/Stack';
-import { Icon } from '@/ui/Icon';
-import { Surface } from '@/ui/Surface';
-import { Text } from '@/ui/Text';
 
 export interface WorkflowStep {
   id: number;