spb/polyllm

1import Link from "next/link";2import { ArrowRight, Cookie, Fingerprint, Gauge, Lock, ScrollText, ShieldCheck } from "lucide-react";3import { Section, SectionHeading } from "./section";4import { Reveal } from "./reveal";56const ITEMS = [7  { icon: <Lock />, title: "AES-256-GCM key encryption", body: "HKDF-derived data key, per-user authenticated data, decrypted in memory only for the outgoing request." },8  { icon: <Fingerprint />, title: "Argon2id passwords", body: "OWASP parameters (19 MiB, t=2, p=1). E-mail verification is required before the first sign-in." },9  { icon: <Cookie />, title: "HttpOnly cookies", body: "Sessions in HttpOnly, SameSite=Lax cookies, Secure in production. Nothing sensitive in localStorage." },10  { icon: <ShieldCheck />, title: "Strict CSP and headers", body: "frame-ancestors 'none', connect-src 'self', HSTS for a year, no third-party scripts anywhere." },11  { icon: <Gauge />, title: "Rate limits per account", body: "Sign-in 8/min, sign-up 4/min, chat 60/min, key changes 12/min — every sensitive route is limited." },12  { icon: <ScrollText />, title: "Audit log you can read", body: "Logins, key changes, exports and deletions recorded with IP and shown in your account settings." },13];1415export function SecurityTeaser() {16  return (17    <Section id="security" tone="subtle" className="py-14 sm:py-20">18      <div className="grid gap-10 lg:grid-cols-12">19        <div className="lg:col-span-4">20          <SectionHeading eyebrow="Private and secure" title="Built like infrastructure, not a toy" description="PolyLLM handles API keys with a billing account attached. The defaults are conservative on purpose, and the security page describes the real implementation, verified against the code." />21          <Reveal delay={0.1}>22            <Link href="/security" className="mt-6 inline-flex items-center gap-1.5 text-[14px] font-medium text-accent underline-offset-4 hover:underline">23              Read the security page <ArrowRight className="size-4" aria-hidden />24            </Link>25          </Reveal>26        </div>27        <ul className="grid gap-x-8 gap-y-7 sm:grid-cols-2 lg:col-span-8">28          {ITEMS.map((item, i) => (29            <Reveal key={item.title} as="li" delay={0.04 * i} className="flex gap-3.5">30              <span className="flex size-9 shrink-0 items-center justify-center rounded-lg bg-bg-elevated text-accent shadow-xs [&_svg]:size-4.5">{item.icon}</span>31              <div className="min-w-0">32                <h3 className="text-[15px] font-semibold tracking-tight">{item.title}</h3>33                <p className="mt-1 text-[13.5px] leading-6 text-fg-muted">{item.body}</p>34              </div>35            </Reveal>36          ))}37        </ul>38      </div>39    </Section>40  );41}42