DESIGN.md — AutoArena (Demo)

Taste: PREMIUM-AUTOMOTIVE (soft-skill, dunkel, großflächige Fotografie, ein sportlicher Akzent). Distinkt zu VOLTA (cyan tech-lab): hier charcoal + RED, foto-getragen, Chrom/Glas, Showroom-Feeling.

Farben

• ink #0B0E12 (Basis) · surface #131820 · line rgba(255,255,255,.08)
• text #E7EAEE · muted #8A93A0
• red #E11D2A (Akzent, sparsam: CTA, aktive States, „live”-Badges) · red-dark #B8121E
• chrome #C8CDD4 (silberne Akzente)

Typo

• Display: “Space Grotesk Variable” (geometrisch-automotive), groß, tight tracking, teils uppercase
• Mono: “JetBrains Mono” für techn. Daten (PS, km, kW, Bj.)
• Body: “Inter”

Prinzip

Dunkler Showroom. Header mit Auto, das reinfährt + sich zur Maus neigt + Lichtstreifen (GPU, dezent). Fahrzeugmarkt (Listing wie mobile.de: Bild, Modell, Preis, km, Bj., PS, Kraftstoff, Getriebe). Services (Finanzierung, Inzahlungnahme, Ankauf, Werkstatt, Probefahrt). AutoScout24/mobile.de- Anbindung als Highlight: „einmal eintragen, überall live”. Mitarbeiter-Login + Händler-Dashboard.

Motion

Hero-Car: drive-in (translateX+scale) on load, mouse-tilt (rotateY/X klein), Licht-Streifen-Loop. Scroll-Reveals, zählende Zahlen. prefers-reduced-motion sauber.