novarix.uk/app/cookies/page.tsx

// =============================================================================
//  Cookie & Privacy Policy
// =============================================================================
//
//  A plain, honest policy page describing exactly what (very little) is
//  stored in the visitor's browser. Update the `lastUpdated` field below
//  whenever the policy changes.
//
//  The wording is deliberately written in first-person plain English rather
//  than legalese — Novarix is small enough to be transparent and brief.
// =============================================================================

import type { Metadata } from "next";
import Link from "next/link";
import { site } from "@/content";

const lastUpdated = "2 May 2026";

export const metadata: Metadata = {
  title: "Cookie & Privacy Policy",
  description:
    "How Novarix Networks uses cookies and browser storage on this website.",
};

export default function CookiePolicyPage() {
  return (
    <main className="site-shell min-h-screen">
      {/* Ambient background, matching the homepage */}
      <div
        className="pointer-events-none fixed inset-0 -z-10 overflow-hidden"
        aria-hidden="true"
      >
        <div className="ambient-orb ambient-orb-a" />
        <div className="ambient-orb ambient-orb-b" />
        <div className="ambient-grid" />
      </div>

      {/* Lightweight header — just a back-link */}
      <header className="border-b border-[var(--border)]">
        <div className="mx-auto flex h-20 w-full max-w-3xl items-center px-6 sm:px-8">
          <Link
            href="/"
            className="inline-flex items-center gap-2 text-sm text-[var(--text-soft)] transition-colors hover:text-[var(--text)]"
          >
            <span aria-hidden="true">←</span>
            Back to Novarix Networks
          </Link>
        </div>
      </header>

      <article className="mx-auto w-full max-w-3xl px-6 py-16 sm:px-8 sm:py-24">
        <p className="text-xs font-semibold tracking-[0.18em] text-[var(--accent)] uppercase">
          Legal
        </p>
        <h1 className="mt-3 text-[clamp(2rem,4vw,3rem)] leading-[1.05] font-semibold tracking-[-0.03em]">
          Cookie &amp; Privacy Policy
        </h1>
        <p className="mt-4 text-sm text-[var(--text-soft)]">
          Last updated {lastUpdated}
        </p>

        <div className="mt-12 space-y-10 text-base leading-relaxed text-[var(--text-soft)]">
          <section>
            <h2 className="text-xl font-semibold tracking-tight text-[var(--text)]">
              In short
            </h2>
            <p className="mt-3">
              This website does not run analytics, advertising, or any
              third-party tracking. We do not sell, share, or transfer
              personal data to anyone. The only things we store in your
              browser are listed below — and you can decline them using the
              banner that appears on your first visit.
            </p>
          </section>

          <section>
            <h2 className="text-xl font-semibold tracking-tight text-[var(--text)]">
              What we store
            </h2>
            <p className="mt-3">
              We use one small browser storage entry. It is first-party,
              confined to your browser, and never shared with anyone:
            </p>

            <div className="mt-6 space-y-4">
              <div className="rounded-2xl border border-[var(--border)] bg-[var(--surface)] p-5 backdrop-blur sm:p-6">
                <p className="font-mono text-sm font-semibold text-[var(--text)]">
                  novarix-cookie-consent
                </p>
                <p className="mt-2 text-sm">
                  <span className="font-semibold text-[var(--text)]">
                    Strictly necessary.
                  </span>{" "}
                  Stored in <code>localStorage</code>. Records your choice
                  from the cookie banner so we don&apos;t ask you again on
                  every page. Persists until you clear your browser data.
                </p>
              </div>
            </div>
          </section>

          <section>
            <h2 className="text-xl font-semibold tracking-tight text-[var(--text)]">
              What we don&apos;t do
            </h2>
            <p className="mt-3">
              We don&apos;t set tracking cookies. We don&apos;t run Google
              Analytics, Plausible, Fathom, Matomo, or any equivalent. We
              don&apos;t serve advertising. We don&apos;t embed third-party
              scripts that profile you across websites. We don&apos;t use
              session-replay tools.
            </p>
          </section>

          <section>
            <h2 className="text-xl font-semibold tracking-tight text-[var(--text)]">
              Server logs
            </h2>
            <p className="mt-3">
              Our web server keeps short-lived access logs (IP address,
              request path, timestamp, user agent) for the operational
              purposes of running the site — diagnosing errors, blocking
              abuse, and basic capacity planning. Logs are retained for no
              longer than 30 days and are not used to build profiles of
              individual visitors.
            </p>
          </section>

          <section>
            <h2 className="text-xl font-semibold tracking-tight text-[var(--text)]">
              Changing your mind
            </h2>
            <p className="mt-3">
              Use the{" "}
              <span className="font-semibold text-[var(--text)]">
                Cookie preferences
              </span>{" "}
              link in the footer of any page to re-open the banner and
              change your decision. Or clear this site&apos;s storage in
              your browser settings to be asked again from scratch.
            </p>
          </section>

          <section>
            <h2 className="text-xl font-semibold tracking-tight text-[var(--text)]">
              Who we are
            </h2>
            <p className="mt-3">
              {site.footer.company}, {site.footer.registered.toLowerCase()}.
              For privacy questions or to exercise your rights under UK GDPR
              (access, correction, deletion, portability, objection), email
              us at{" "}
              <a
                href={`mailto:${site.footer.email}`}
                className="font-medium text-[var(--text)] underline-offset-4 hover:underline"
              >
                {site.footer.email}
              </a>
              .
            </p>
          </section>

          <section>
            <h2 className="text-xl font-semibold tracking-tight text-[var(--text)]">
              Complaints
            </h2>
            <p className="mt-3">
              If you believe we&apos;ve mishandled your personal data, you
              have the right to complain to the UK&apos;s data protection
              authority, the Information Commissioner&apos;s Office (ICO),
              at{" "}
              <a
                href="https://ico.org.uk/make-a-complaint/"
                className="font-medium text-[var(--text)] underline-offset-4 hover:underline"
                target="_blank"
                rel="noreferrer"
              >
                ico.org.uk
              </a>
              .
            </p>
          </section>
        </div>
      </article>

      <footer className="border-t border-[var(--border)] py-12">
        <div className="mx-auto flex w-full max-w-3xl flex-col gap-2 px-6 text-sm text-[var(--text-soft)] sm:flex-row sm:items-center sm:justify-between sm:px-8">
          <span>
            © {new Date().getFullYear()} {site.footer.company}
          </span>
          <Link
            href="/"
            className="transition-colors hover:text-[var(--accent)]"
          >
            ← Back to home
          </Link>
        </div>
      </footer>
    </main>
  );
}