import Link from 'next/link';

export default function HomePage() {
  return <>
    <section className="hero">
      <span className="eyebrow">Motorcycle telemetry, made useful</span>
      <h1>Know what your ride is doing.</h1>
      <p>MotorSignal turns every ride into clear, actionable insight: live telemetry on the road, performance history after the ride, and one secure place for your account.</p>
      <div className="hero-actions"><Link className="button" href="/register">Create your account</Link><Link className="button button-secondary" href="/features">Explore features</Link></div>
    </section>
    <section className="section-grid" aria-label="MotorSignal capabilities">
      <article className="panel"><h3>Live cockpit</h3><p>Speed, lean angle, G-force, GPS status, and ride state in one rider-first dashboard.</p></article>
      <article className="panel"><h3>Ride intelligence</h3><p>Review distance, speed, performance launches, route context, and telemetry summaries after every ride.</p></article>
      <article className="panel"><h3>Built for trust</h3><p>Your account, sessions, vehicles, and ride data stay behind authenticated HTTPS APIs.</p></article>
    </section>
  </>;
}