46 lines
2.4 KiB
TypeScript
46 lines
2.4 KiB
TypeScript
import Link from "next/link";
|
|
|
|
export default function Hero() {
|
|
return (
|
|
<section className="relative overflow-hidden border-b border-neutral-200 dark:border-neutral-800 bg-gradient-to-b from-neutral-50 via-white to-neutral-100 dark:from-neutral-950 dark:via-neutral-900 dark:to-neutral-950">
|
|
<div className="container mx-auto grid items-center gap-12 py-24 sm:grid-cols-2 px-6">
|
|
<div>
|
|
<h1 className="text-5xl sm:text-6xl font-extrabold tracking-tight leading-tight bg-gradient-to-r from-blue-600 via-purple-600 to-blue-600 bg-clip-text text-transparent">
|
|
Fixes in days. <br /> <span className="text-blue-600 dark:text-blue-400">Uptime</span> for months.
|
|
</h1>
|
|
<p className="mt-6 text-lg text-neutral-700 dark:text-neutral-300 max-w-lg">
|
|
Productized IT for small businesses: inbox-ready email, secure Cloudflare & DNS, and website care—
|
|
clear scope, flat pricing, and measurable proof.
|
|
</p>
|
|
<div className="mt-8 flex flex-wrap gap-4">
|
|
<Link
|
|
href="/contact"
|
|
className="inline-flex items-center rounded-lg bg-gradient-to-r from-blue-600 via-purple-600 to-blue-600 text-white px-6 py-3 text-sm font-medium hover:opacity-90 transition"
|
|
>
|
|
Start now
|
|
</Link>
|
|
<Link
|
|
href="/services"
|
|
className="inline-flex items-center rounded-lg border border-neutral-300 dark:border-neutral-700 px-6 py-3 text-sm font-medium hover:bg-neutral-50 dark:hover:bg-neutral-800 transition"
|
|
>
|
|
See services
|
|
</Link>
|
|
</div>
|
|
</div>
|
|
|
|
<div className="rounded-2xl bg-white/70 dark:bg-neutral-900/70 backdrop-blur p-8 shadow-lg border border-neutral-200 dark:border-neutral-800 animate-[fadeInUp_0.8s_ease_forwards]">
|
|
<ul className="space-y-3 text-sm text-neutral-800 dark:text-neutral-200">
|
|
<li>✅ DMARC aligned, spoofing blocked</li>
|
|
<li>✅ Cloudflare WAF & HTTP/3, faster TTFB</li>
|
|
<li>✅ Daily backups with restore tests</li>
|
|
<li>✅ Uptime watch + incident notes</li>
|
|
</ul>
|
|
<div className="mt-6 rounded-xl bg-neutral-100 dark:bg-neutral-800 p-4 text-sm text-neutral-600 dark:text-neutral-300">
|
|
We agree scope up front and show proof: before/after reports and restore tests.
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
);
|
|
}
|