import Button from "@/components/lib/layout/Button";
import Divider from "@/components/lib/layout/Divider";
import H1 from "@/components/lib/layout/H1";
import H2 from "@/components/lib/layout/H2";
import Link from "@/components/lib/layout/Link";
import P from "@/components/lib/layout/P";
import Row from "@/components/lib/layout/Row";
import Section from "@/components/lib/layout/Section";
import Span from "@/components/lib/layout/Span";
import Stack from "@/components/lib/layout/Stack";
import { Terminal } from "lucide-react";

export default function Main() {
    return (
        <Section>
            <Stack className="w-full max-w-full xl:max-w-[50vw] gap-8">
                {/* <Span className="leading-snug -mb-6 text-sm">
                    I Build & Operate Production Systems
                </Span> */}
                <H1 className="leading-snug">About Me</H1>
                <Span>
                    I'm Benjamin Toby, a DevOps/Platform engineer and CTO at
                    Summit Lending. I build and operate production systems that
                    support real businesses.
                </Span>

                <Divider />

                <H2>What I Do</H2>
                <Span>I focus on infrastructure and reliability:</Span>
                <ul className="space-y-4">
                    <li>CI/CD automation and deployment pipelines</li>
                    <li>Multi-cloud architecture (AWS, GCP, Azure, Hetzner)</li>
                    <li>NGINX hardening, TLS, caching, rate limiting</li>
                    <li>Full-stack delivery with Next.js, Bun, and SQL</li>
                </ul>

                <Divider />

                <H2>Background</H2>
                <P>
                    I started as a full-stack developer and moved into DevOps
                    and platform engineering out of necessity, building systems
                    that could scale without breaking. That led to Summit
                    Lending, where I manage all engineering, from infrastructure
                    to product.
                </P>
                <P>
                    Along the way I built TurboCI, a deployment orchestration
                    tool, and Datasquirel, a cloud SQL platform. I write about
                    what I learn on my <a href="/blog">blog</a>.
                </P>

                <Divider />

                <Span>
                    I focus on measurable outcomes: faster deployments, lower
                    costs, fewer incidents.
                </Span>

                <Row className="items-stretch flex-col md:flex-row w-full md:w-auto gap-4">
                    <Button
                        title="View My Work"
                        beforeIcon={
                            <Terminal size={17} className="font-normal" />
                        }
                        href="/work"
                        className="grow w-full bg-transparent!"
                        variant="outlined"
                    >
                        View My Work
                    </Button>
                </Row>
            </Stack>
        </Section>
    );
}