school_compare/nextjs-app/components/Footer.tsx

/**
 * Footer Component
 * Site footer with links and info
 */

import styles from './Footer.module.css';

export function Footer() {
  const currentYear = new Date().getFullYear();

  return (
    <footer className={styles.footer}>
      <div className={styles.container}>
        <div className={styles.content}>
          <div className={styles.section}>
            <h3 className={styles.title}>SchoolCompare</h3>
            <p className={styles.description}>
              Compare primary and secondary schools across England. Free, independent, built on public data.
            </p>
          </div>

          <div className={styles.section}>
            <h4 className={styles.sectionTitle}>Product</h4>
            <ul className={styles.links}>
              <li><a href="/" className={styles.link}>Search schools</a></li>
              <li><a href="/rankings" className={styles.link}>Rankings</a></li>
              <li><a href="/compare" className={styles.link}>Compare shortlist</a></li>
              <li><a href="/admissions" className={styles.link}>Admissions guide</a></li>
            </ul>
          </div>

          <div className={styles.section}>
            <h4 className={styles.sectionTitle}>Resources</h4>
            <ul className={styles.links}>
              <li>
                <a
                  href="https://www.gov.uk/school-performance-tables"
                  target="_blank"
                  rel="noopener noreferrer"
                  className={styles.link}
                >
                  School Performance Tables
                </a>
              </li>
              <li>
                <a
                  href="https://reports.ofsted.gov.uk/"
                  target="_blank"
                  rel="noopener noreferrer"
                  className={styles.link}
                >
                  Ofsted reports
                </a>
              </li>
            </ul>
          </div>
        </div>

        <div className={styles.bottom}>
          <p className={styles.copyright}>
            © {currentYear} SchoolCompare.co.uk
          </p>
        </div>
      </div>
    </footer>
  );
}