import { Nav, Footer } from "../new-site";
import "../../styles/new-site.css";

export const metadata = {
  title: "Vibn — Our Mission",
};

export default function MissionPage() {
  return (
    <div
      className="new-site-wrapper"
      style={{ display: "flex", flexDirection: "column", minHeight: "100vh" }}
    >
      <Nav />
      <main className="mission-page" style={{ flex: 1 }}>
        <style>{`
          .mission-hero {
            padding-block: clamp(80px, 15vh, 160px) clamp(40px, 8vh, 80px);
            text-align: center;
          }
          .mission-eyebrow {
            display: inline-flex; align-items: center; gap: 8px;
            font-family: var(--font-mono);
            font-size: 13px;
            color: var(--accent);
            letter-spacing: 0.14em;
            text-transform: uppercase;
            margin-bottom: 24px;
          }
          .mission-eyebrow::before {
            content: ""; width: 6px; height: 6px; border-radius: 50%;
            background: var(--accent); box-shadow: 0 0 12px var(--accent-glow);
          }
          .mission-quote {
            font-size: clamp(32px, 5vw, 56px);
            font-weight: 500;
            letter-spacing: -0.025em;
            line-height: 1.1;
            text-wrap: balance;
            max-width: 960px;
            margin: 0 auto;
            color: var(--fg);
          }
          .mission-quote .highlight {
            color: var(--accent);
            text-shadow: 0 0 30px var(--accent-glow);
          }
          .mission-content {
            max-width: 680px;
            margin: 0 auto;
            padding-block: 40px 120px;
            font-size: 18px;
            line-height: 1.65;
            color: var(--fg-dim);
          }
          .mission-content h2 {
            font-size: 28px;
            color: var(--fg);
            margin-top: 64px;
            margin-bottom: 24px;
            font-weight: 500;
            letter-spacing: -0.015em;
          }
          .mission-content p {
            margin-bottom: 24px;
          }
          .mission-content p:last-child {
            margin-bottom: 0;
          }
          .mission-content strong {
            color: var(--fg);
            font-weight: 500;
          }
          .mission-signoff {
            margin-top: 64px;
            padding-top: 32px;
            border-top: 1px solid var(--hairline);
            font-family: var(--font-mono);
            font-size: 14px;
            color: var(--fg-mute);
          }
          .mission-signoff .author {
            color: var(--fg);
            font-weight: 500;
            font-size: 16px;
            font-family: var(--font-sans);
            margin-bottom: 4px;
          }
          @media (max-width: 760px) {
            .mission-quote { font-size: clamp(28px, 8vw, 36px); }
            .mission-content { font-size: 16px; padding-block: 20px 80px; }
            .mission-content h2 { font-size: 24px; margin-top: 48px; margin-bottom: 20px; }
          }
        `}</style>

        <div className="wrap">
          <section className="mission-hero">
            <span className="mission-eyebrow">Our Mission</span>
            <h1 className="mission-quote">
              "Look at your subscription costs, ask if they're doing the job,{" "}
              <span className="highlight">if not, get building.</span>"
            </h1>
          </section>

          <article className="mission-content">
            <h2>A letter from the founder</h2>
            <p>
              I've spent the last ten years trying to help small businesses
              grow.
            </p>
            <p>
              Startups. Clubs. Plumbers. Bookkeepers. Family restaurants.
              Single-location retail. The businesses that make neighborhoods
              what they are. I've watched they struggle and stagnate.
            </p>
            <p>
              Here's what I learned: the biggest thing holding small businesses
              back isn't the economy, or competition, or marketing.{" "}
              <strong>It's the owner.</strong> Their hesitations. Their (very
              reasonable) skepticism of change. Most small business owners are
              run off their feet — they don't have the time or appetite to adopt
              new tools, new systems, new anything. And when someone tries to
              sell them on change, they bristle. They've been burned too many
              times.
            </p>
            <p>
              But I've also learned something else.{" "}
              <strong>
                When an owner makes an idea theirs, they adopt it instantly.
              </strong>
            </p>
            <p>
              That's what AI changes. For the first time, software can have a
              real conversation with a small business owner. It can listen to
              their problem in their words, propose a solution that feels
              obvious to them, and build it on the spot. The owner isn't being
              sold to. They're being heard. And when an idea is theirs, the
              resistance disappears.
            </p>
            <p>That's the unlock. That's why this moment matters.</p>

            <h2>Why small business never got the software it deserved</h2>
            <p>
              People love to blame SaaS for squeezing small business. I don't
              think that's quite right.
            </p>
            <p>
              The real story is structural. For the last two decades, the math
              of venture capital pushed every promising software company toward
              enterprise. It wasn't a conspiracy — it was incentives. Small
              business has high churn. Enterprise has multi-year contracts. LPs
              expect returns on a fund timeline that small business revenue
              can't deliver. So founders with great ideas for small business
              software kept getting nudged upmarket — by their investors, their
              boards, their boards' investors — until eventually the SMB version
              of every product was an afterthought, and the real product was
              built for a 500-person finance team.
            </p>
            <p>
              Small business got the leftovers. Monthly subscriptions for
              software that almost-but-not-quite solves the problem.
            </p>
            <p>
              Nobody set out to underserve small business. The system just
              didn't reward serving them well. That gap — the gap between what
              small businesses actually needed and what got built — is the gap
              Vibn fills.
            </p>

            <h2>Why now</h2>
            <p>
              There's a wave coming. AI is going to displace a lot of people —
              software engineers especially, but knowledge workers across the
              board. The doom narrative says this is the end of opportunity. I
              think it's the opposite.
            </p>
            <p>
              <strong>
                Small business is where the next generation of careers gets
                built.
              </strong>
            </p>
            <p>
              Not as a consolation prize. As an upgrade. Owning the bakery
              instead of writing code for a company that sells software to
              bakeries. Building custom tools for the plumber down the street
              instead of building dashboards for a Series C SaaS. Working at a
              thriving local business that owns its own software, instead of
              grinding through layoffs at companies that don't know what they
              want to be.
            </p>
            <p>
              For laid-off engineers, this is a place to land — and not a small
              one. The same skills that built SaaS for the enterprise can build
              extraordinary things for small businesses now that the tools
              exist. For young entrepreneurs, this is the cheapest, fastest,
              most legitimate path to running a real business that has ever
              existed. For everyone who wants to help small businesses thrive,
              this is the moment to do it.
            </p>

            <h2>What Vibn is, really</h2>
            <p>Vibn is a vibe coding platform. That's the surface.</p>
            <p>
              Underneath, it's a wager: that if you make it possible for a small
              business to have custom software — built by the owner, or by a
              local freelancer who hands it over — without subscriptions,
              without endless tool sprawl, without code, without engineering
              teams — you start to fix something that's been broken for twenty
              years.
            </p>
            <p>
              Owners build tools and own them outright. Freelancers build custom
              solutions for their community and get paid like the craftsmen they
              are. Subscriptions get cancelled. Margins go back to the
              businesses earning them. Software stops being something small
              businesses rent forever and starts being something they own.
            </p>
            <p>
              That's the golden age. Not abstract. Concrete. One business at a
              time. One tool at a time.
            </p>

            <h2>What you can do right now</h2>
            <p>
              <strong>If you own a small business:</strong> pull up your bank
              statement and look at the subscription line. Look at every tool
              you pay for every month. Ask one question — is this actually doing
              the job for my business today? If the answer is no, even
              partially, you should be building.
            </p>
            <p>
              <strong>
                If you're an engineer who got laid off, or never got the job:
              </strong>{" "}
              there is real work here. Real businesses that need real tools. You
              don't need a startup, a co-founder, or a Series A. You need one
              local small business and a willingness to build them exactly what
              they need.
            </p>
            <p>
              <strong>
                If you're an entrepreneur looking for a wave to ride:
              </strong>{" "}
              this is it. The tools are here. The customers are here. The moment
              is here.
            </p>
            <p>We built Vibn for all of you.</p>
            <p>Let's build the golden age.</p>

            <div className="mission-signoff">
              <div className="author">Mark Henderson</div>
              Founder, Vibn
            </div>
          </article>
        </div>
      </main>
      <Footer />
    </div>
  );
}
