import type { Metadata } from "next";
import PageHero from "@/components/PageHero";
import { site } from "@/lib/site";

export const metadata: Metadata = { title: "Terms & Conditions" };

const sections = [
  {
    title: "1. Service Overview",
    body: `${site.shortName} provides access to premium digital tools through a managed group-buy system. By purchasing any tool or package you agree to these terms.`,
  },
  {
    title: "2. Account & Access",
    body: "Access is provided per subscription. Unless stated otherwise, up to 2 devices / IP addresses are allowed per subscription. Sharing access credentials outside your subscription is prohibited and may result in suspension without refund.",
  },
  {
    title: "3. Fair Use",
    body: "AI and generation tools are subject to fair-use limits as listed on each tool page. Excessive automated usage, scraping, or resale of access is not permitted.",
  },
  {
    title: "4. Availability",
    body: "We target 99.9% uptime, however tool availability may vary depending on each tool's rules and technical limitations. Temporary downtime, login issues, tool updates, or tool removal due to technical problems can occur and are not eligible for refund.",
  },
  {
    title: "5. Payments & Renewals",
    body: "Subscriptions are billed monthly unless stated otherwise. Cancellation stops future access or renewal but does not automatically qualify for a refund.",
  },
  {
    title: "6. Changes",
    body: "We may update these terms at any time. Continued use of the service after changes constitutes acceptance of the new terms.",
  },
];

export default function TermsPage() {
  return (
    <>
      <PageHero title="Terms & Conditions" />
      <section className="bg-white py-14">
        <div className="mx-auto max-w-3xl space-y-8 px-4 sm:px-6 lg:px-8">
          {sections.map((s) => (
            <div key={s.title}>
              <h2 className="font-bold text-slate-900">{s.title}</h2>
              <p className="mt-2 text-sm leading-relaxed text-slate-600">{s.body}</p>
            </div>
          ))}
        </div>
      </section>
    </>
  );
}