openship 0.1.1 → 0.1.7

package/apps/web/src/components/landing/no-lockin.tsx

@@ -1,185 +0,0 @@
-/* ── comparison rows ── */
-const ROWS: { feature: string; openship: string; vercel: string; warn?: boolean }[] = [
-  { feature: "Unlimited deployments", openship: "Included", vercel: "$20 / seat / mo", warn: true },
-  { feature: "CPU execution time", openship: "Your full server", vercel: "Metered — bills spike", warn: true },
-  { feature: "Bandwidth", openship: "Unlimited", vercel: "100 GB then overage", warn: true },
-  { feature: "Serverless invocations", openship: "No limits", vercel: "Billed per million", warn: true },
-  { feature: "Wildcard SSL", openship: "Auto", vercel: "Enterprise only" },
-  { feature: "Built-in mail server", openship: "Free", vercel: "—" },
-  { feature: "Microservices / Docker", openship: "Native", vercel: "—" },
-  { feature: "Custom backend & DB", openship: "Full control", vercel: "External only" },
-  { feature: "Full-control app", openship: "Built-in", vercel: "Limited" },
-  { feature: "MCP agent support", openship: "Built-in", vercel: "—" },
-  { feature: "Self-host anywhere", openship: "Any VPS", vercel: "—" },
-  { feature: "Vendor lock-in", openship: "None — MIT", vercel: "High" },
-];
-
-/* ── VPS providers ── */
-const VPS = [
-  { name: "Hetzner", from: "€3.79", note: "CX22 · 2 vCPU · 4 GB", accent: "#E32E2E" },
-  { name: "Hostinger", from: "$5.99", note: "KVM 1 · 4 GB · 50 GB NVMe", accent: "#6746C8" },
-  { name: "DigitalOcean", from: "$6.00", note: "Basic · 1 vCPU · 1 GB", accent: "#0080FF" },
-  { name: "OVH", from: "€3.50", note: "Starter · 2 GB · ∞ traffic", accent: "#123F6D" },
-];
-
-/* ── vercel bill callout figures ── */
-const BILLS = [
-  { label: "Small SaaS", vercel: "$150+/mo", self: "~$8/mo" },
-  { label: "Growing startup", vercel: "$800+/mo", self: "~$24/mo" },
-  { label: "At scale", vercel: "$5,000+/mo", self: "~$80/mo" },
-];
-
-export function NoLockin() {
-  return (
-    <section className="relative py-28 sm:py-36">
-      <div className="section-divider mx-auto mb-28 max-w-4xl sm:mb-36" />
-
-      <div className="mx-auto max-w-7xl px-6">
-        {/* ── Header ── */}
-        <div className="mx-auto max-w-3xl text-center">
-          <div className="mb-7 inline-flex items-center gap-2 rounded-full border border-[var(--th-on-06)] bg-white/60 px-4 py-1.5 shadow-[0_1px_3px_rgba(0,0,0,.04)] backdrop-blur-sm">
-            <span className="text-[12px] font-medium tracking-[0.02em] th-text-secondary">
-              Why switch
-            </span>
-          </div>
-          <h2>
-            <span className="block text-[clamp(2.75rem,6vw,4.75rem)] font-semibold leading-[1.06] tracking-[-0.035em] th-text-heading">
-              Stop getting locked in.
-            </span>
-            <span
-              className="block text-[clamp(2.75rem,6vw,4.75rem)] font-semibold leading-[1.06] tracking-[-0.035em]"
-              style={{ color: "var(--th-on-40)" }}
-            >
-              Own your stack.
-            </span>
-          </h2>
-          <p className="mx-auto mt-6 max-w-xl text-[17px] leading-[1.65] th-text-body">
-            Vercel&apos;s metered CPU time, per-seat pricing, and bandwidth caps
-            mean bills grow fast — especially when traffic spikes. With Openship,
-            the app runs on <strong className="th-text-heading">your machine</strong> and deploys to
-            <strong className="th-text-heading"> your server</strong> — you keep 100% of the performance you pay for.
-          </p>
-        </div>
-
-        {/* ── Bill comparison callout ── */}
-        <div className="mx-auto mt-14 grid max-w-5xl gap-4 sm:grid-cols-3">
-          {BILLS.map((b) => (
-            <div
-              key={b.label}
-              className="relative overflow-hidden rounded-2xl border border-[var(--th-card-bd)] bg-[var(--th-card-bg)] px-6 py-5 shadow-[var(--th-card-shadow)]"
-            >
-              <p className="text-[12px] font-semibold uppercase tracking-[0.1em] th-text-muted">
-                {b.label}
-              </p>
-
-              {/* Vercel row */}
-              <div className="mt-4">
-                <p className="text-[11px] font-medium uppercase tracking-[0.06em] th-text-muted">Vercel</p>
-                <p
-                  className="mt-0.5 text-[clamp(1.25rem,2.5vw,1.625rem)] font-bold leading-none tracking-tight"
-                  style={{ color: "var(--th-clr-terra)" }}
-                >
-                  {b.vercel}
-                </p>
-              </div>
-
-              {/* Divider + arrow */}
-              <div className="my-3 flex items-center gap-2">
-                <div className="h-px flex-1" style={{ background: "var(--th-sf-06, rgba(0,0,0,.06))" }} />
-                <svg className="h-4 w-4 shrink-0 th-text-muted" fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={1.5}>
-                  <path strokeLinecap="round" strokeLinejoin="round" d="M19.5 13.5L12 21m0 0l-7.5-7.5M12 21V3" />
-                </svg>
-                <div className="h-px flex-1" style={{ background: "var(--th-sf-06, rgba(0,0,0,.06))" }} />
-              </div>
-
-              {/* Self-host row */}
-              <div>
-                <p className="text-[11px] font-medium uppercase tracking-[0.06em] th-text-muted">Self-host</p>
-                <p
-                  className="mt-0.5 text-[clamp(1.25rem,2.5vw,1.625rem)] font-bold leading-none tracking-tight"
-                  style={{ color: "var(--th-clr-sea)" }}
-                >
-                  {b.self}
-                </p>
-              </div>
-            </div>
-          ))}
-        </div>
-
-        {/* ── Comparison table ── */}
-        <div className="mx-auto mt-14 max-w-5xl overflow-hidden rounded-2xl border border-[var(--th-card-bd)] bg-[var(--th-card-bg)] shadow-[var(--th-card-shadow)]">
-          {/* Header row */}
-          <div className="grid grid-cols-[1fr_140px_160px] sm:grid-cols-[1fr_200px_220px] border-b-2 border-[var(--th-card-bd)] bg-[var(--th-sf-02)] px-6 py-4">
-            <span className="text-[13px] font-bold uppercase tracking-[0.08em] th-text-muted">
-              Feature
-            </span>
-            <span className="text-center text-[14px] font-bold th-text-heading">
-              🚀 Openship
-            </span>
-            <span className="text-center text-[14px] font-bold th-text-muted">
-              Vercel
-            </span>
-          </div>
-
-          {/* Data rows */}
-          {ROWS.map((r, i) => (
-            <div
-              key={r.feature}
-              className="grid grid-cols-[1fr_140px_160px] sm:grid-cols-[1fr_200px_220px] items-center border-t border-[var(--th-card-bd)] px-6 py-4"
-              style={{ background: i % 2 === 0 ? "transparent" : "var(--th-sf-01)" }}
-            >
-              <span className="text-[15px] font-medium th-text-heading">
-                {r.feature}
-              </span>
-              <span className="text-center">
-                <span
-                  className="inline-block rounded-full px-3.5 py-1 text-[13px] font-semibold"
-                  style={{ background: "var(--th-clr-sea-wash)", color: "var(--th-clr-sea)" }}
-                >
-                  {r.openship}
-                </span>
-              </span>
-              <span className="text-center">
-                <span
-                  className="inline-block rounded-full px-3.5 py-1 text-[13px] font-medium"
-                  style={{
-                    background: r.warn ? "var(--th-clr-terra-wash)" : "var(--th-sf-04)",
-                    color: r.warn ? "var(--th-clr-terra)" : "var(--th-text-secondary)",
-                  }}
-                >
-                  {r.vercel}
-                </span>
-              </span>
-            </div>
-          ))}
-        </div>
-
-        {/* ── VPS provider cards ── */}
-        <div className="mt-12">
-          <p className="mb-5 text-center text-[13px] font-semibold uppercase tracking-[0.08em] th-text-muted">
-            Self-host on any VPS — popular picks
-          </p>
-          <div className="mx-auto grid max-w-4xl grid-cols-2 gap-4 sm:grid-cols-4">
-            {VPS.map((v) => (
-              <div
-                key={v.name}
-                className="relative overflow-hidden rounded-2xl border border-[var(--th-card-bd)] bg-[var(--th-card-bg)] p-5 shadow-[var(--th-card-shadow)] transition-colors hover:border-[var(--th-card-bd-hover)]"
-              >
-                <div
-                  className="absolute inset-x-0 top-0 h-[3px]"
-                  style={{ background: v.accent }}
-                />
-                <p className="text-[15px] font-bold th-text-heading">{v.name}</p>
-                <p className="mt-1 text-[24px] font-bold tracking-tight th-text-heading">
-                  {v.from}
-                  <span className="ml-1 text-[13px] font-normal th-text-muted">/mo</span>
-                </p>
-                <p className="mt-1.5 text-[12px] leading-snug th-text-muted">{v.note}</p>
-              </div>
-            ))}
-          </div>
-        </div>
-      </div>
-    </section>
-  );
-}

package/apps/web/src/components/landing/open-source-cta.tsx

@@ -1,151 +0,0 @@
-const TRAITS = [
-  {
-    icon: (
-      <svg fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={1.6} className="h-5 w-5">
-        <path strokeLinecap="round" strokeLinejoin="round" d="M9 12.75L11.25 15 15 9.75m-3-7.036A11.959 11.959 0 013.598 6 11.955 11.955 0 003 12c0 6.628 5.373 12 12 12s12-5.372 12-12c0-1.99-.487-3.87-1.346-5.528A11.95 11.95 0 0112 2.964z" />
-      </svg>
-    ),
-    label: "MIT License",
-    desc: "No vendor lock-in. Fork it, own it.",
-  },
-  {
-    icon: (
-      <svg fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={1.6} className="h-5 w-5">
-        <path strokeLinecap="round" strokeLinejoin="round" d="M21.75 6.75v10.5a2.25 2.25 0 01-2.25 2.25h-15a2.25 2.25 0 01-2.25-2.25V6.75m19.5 0A2.25 2.25 0 0019.5 4.5h-15a2.25 2.25 0 00-2.25 2.25m19.5 0v.243a2.25 2.25 0 01-1.07 1.916l-7.5 4.615a2.25 2.25 0 01-2.36 0L3.32 8.91a2.25 2.25 0 01-1.07-1.916V6.75" />
-      </svg>
-    ),
-    label: "Free Mail Server",
-    desc: "Transactional email — no Sendgrid bill.",
-  },
-  {
-    icon: (
-      <svg fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={1.6} className="h-5 w-5">
-        <path strokeLinecap="round" strokeLinejoin="round" d="M12 21a9.004 9.004 0 008.716-6.747M12 21a9.004 9.004 0 01-8.716-6.747M12 21c2.485 0 4.5-4.03 4.5-9S14.485 3 12 3m0 18c-2.485 0-4.5-4.03-4.5-9S9.515 3 12 3m0 0a8.997 8.997 0 017.843 4.582M12 3a8.997 8.997 0 00-7.843 4.582m15.686 0A11.953 11.953 0 0112 10.5c-2.998 0-5.74-1.1-7.843-2.918m15.686 0A8.959 8.959 0 0121 12c0 .778-.099 1.533-.284 2.253m0 0A17.919 17.919 0 0112 16.5c-3.162 0-6.133-.815-8.716-2.247m0 0A9.015 9.015 0 013 12c0-1.605.42-3.113 1.157-4.418" />
-      </svg>
-    ),
-    label: "Unlimited Domains",
-    desc: "Wildcard SSL included, always.",
-  },
-  {
-    icon: (
-      <svg fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={1.6} className="h-5 w-5">
-        <path strokeLinecap="round" strokeLinejoin="round" d="M3.75 13.5l10.5-11.25L12 10.5h8.25L9.75 21.75 12 13.5H3.75z" />
-      </svg>
-    ),
-    label: "No Usage Limits",
-    desc: "Deploy as much as your server can handle.",
-  },
-  {
-    icon: (
-      <svg fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={1.6} className="h-5 w-5">
-        <path strokeLinecap="round" strokeLinejoin="round" d="M17 20h5v-2a3 3 0 00-5.356-1.857M17 20H7m10 0v-2c0-.656-.126-1.283-.356-1.857M7 20H2v-2a3 3 0 015.356-1.857M7 20v-2c0-.656.126-1.283.356-1.857m0 0a5.002 5.002 0 019.288 0M15 7a3 3 0 11-6 0 3 3 0 016 0z" />
-      </svg>
-    ),
-    label: "Community Driven",
-    desc: "Built in public, with contributors worldwide.",
-  },
-  {
-    icon: (
-      <svg fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={1.6} className="h-5 w-5">
-        <path strokeLinecap="round" strokeLinejoin="round" d="M5.25 14.25h13.5m-13.5 0a3 3 0 01-3-3m3 3a3 3 0 100 6h13.5a3 3 0 100-6m-16.5-3a3 3 0 013-3h13.5a3 3 0 013 3m-19.5 0a4.5 4.5 0 01.9-2.7L5.737 5.1a3.375 3.375 0 012.7-1.35h7.126c1.062 0 2.062.5 2.7 1.35l2.587 3.45a4.5 4.5 0 01.9 2.7m0 0a3 3 0 01-3 3m0 3h.008v.008h-.008v-3zm0 0H12m-16.5-3h.008v.008H3.75V12z" />
-      </svg>
-    ),
-    label: "Self-Host Anywhere",
-    desc: "Your VPS, bare-metal, or private cloud.",
-  },
-];
-
-export function OpenSourceCta() {
-  return (
-    <section className="relative py-28 sm:py-36">
-      {/* Divider */}
-      <div className="section-divider mx-auto mb-28 max-w-4xl sm:mb-36" />
-
-      <div className="mx-auto max-w-7xl px-6">
-        <div className="grid gap-16 lg:grid-cols-[1fr_auto] lg:gap-24 lg:items-start">
-
-          {/* ── Left: headline + CTAs ── */}
-          <div>
-            {/* Badge */}
-            <div className="mb-7 inline-flex items-center gap-2 rounded-full border border-[var(--th-on-06)] bg-white/60 px-4 py-1.5 shadow-[0_1px_3px_rgba(0,0,0,.04)] backdrop-blur-sm">
-              <svg className="h-3.5 w-3.5 th-text-muted" fill="currentColor" viewBox="0 0 24 24">
-                <path d="M12 0C5.37 0 0 5.37 0 12c0 5.31 3.435 9.795 8.205 11.385.6.105.825-.255.825-.57 0-.285-.015-1.23-.015-2.235-3.015.555-3.795-.735-4.035-1.41-.135-.345-.72-1.41-1.23-1.695-.42-.225-1.02-.78-.015-.795.945-.015 1.62.87 1.845 1.23 1.08 1.815 2.805 1.305 3.495.99.105-.78.42-1.305.765-1.605-2.67-.3-5.46-1.335-5.46-5.925 0-1.305.465-2.385 1.23-3.225-.12-.3-.54-1.53.12-3.18 0 0 1.005-.315 3.3 1.23.96-.27 1.98-.405 3-.405s2.04.135 3 .405c2.295-1.56 3.3-1.23 3.3-1.23.66 1.65.24 2.88.12 3.18.765.84 1.23 1.905 1.23 3.225 0 4.605-2.805 5.625-5.475 5.925.435.375.81 1.095.81 2.22 0 1.605-.015 2.895-.015 3.3 0 .315.225.69.825.57A12.02 12.02 0 0024 12c0-6.63-5.37-12-12-12z" />
-              </svg>
-              <span className="text-[12px] font-medium tracking-[0.02em] th-text-secondary">
-                Open Source &middot; MIT License
-              </span>
-            </div>
-
-            {/* Headline */}
-            <h2>
-              <span className="block text-[clamp(2.75rem,6vw,4.75rem)] font-semibold leading-[1.06] tracking-[-0.035em] th-text-heading">
-                Free. Open Source.
-              </span>
-              <span
-                className="block text-[clamp(2.75rem,6vw,4.75rem)] font-semibold leading-[1.06] tracking-[-0.035em]"
-                style={{ color: "var(--th-on-40)" }}
-              >
-                Forever.
-              </span>
-            </h2>
-
-            <p className="mt-6 max-w-[480px] text-[16px] leading-[1.65] th-text-body">
-              MIT licensed and built in public. Deploy to
-              Openship Cloud, self-host on your own server, or contribute to the codebase.{" "}
-              No hidden costs, no usage limits, no lock-in.
-            </p>
-
-            {/* CTAs */}
-            <div className="mt-9 flex flex-col gap-3.5 sm:flex-row sm:items-center">
-              <a
-                href="/login"
-                className="th-btn group rounded-full px-7 py-3 text-[15px] font-medium"
-              >
-                Start Free
-                <svg
-                  className="ml-1.5 h-4 w-4 transition-transform group-hover:translate-x-0.5"
-                  fill="none"
-                  viewBox="0 0 24 24"
-                  stroke="currentColor"
-                  strokeWidth={2.2}
-                >
-                  <path strokeLinecap="round" strokeLinejoin="round" d="M13 7l5 5m0 0l-5 5m5-5H6" />
-                </svg>
-              </a>
-              <a
-                href="https://github.com/openshiporg/openship"
-                target="_blank"
-                rel="noopener noreferrer"
-                className="th-btn-ghost rounded-full px-7 py-3 text-[15px]"
-              >
-                <svg className="h-[18px] w-[18px]" fill="currentColor" viewBox="0 0 24 24">
-                  <path d="M12 0C5.37 0 0 5.37 0 12c0 5.31 3.435 9.795 8.205 11.385.6.105.825-.255.825-.57 0-.285-.015-1.23-.015-2.235-3.015.555-3.795-.735-4.035-1.41-.135-.345-.72-1.41-1.23-1.695-.42-.225-1.02-.78-.015-.795.945-.015 1.62.87 1.845 1.23 1.08 1.815 2.805 1.305 3.495.99.105-.78.42-1.305.765-1.605-2.67-.3-5.46-1.335-5.46-5.925 0-1.305.465-2.385 1.23-3.225-.12-.3-.54-1.53.12-3.18 0 0 1.005-.315 3.3 1.23.96-.27 1.98-.405 3-.405s2.04.135 3 .405c2.295-1.56 3.3-1.23 3.3-1.23.66 1.65.24 2.88.12 3.18.765.84 1.23 1.905 1.23 3.225 0 4.605-2.805 5.625-5.475 5.925.435.375.81 1.095.81 2.22 0 1.605-.015 2.895-.015 3.3 0 .315.225.69.825.57A12.02 12.02 0 0024 12c0-6.63-5.37-12-12-12z" />
-                </svg>
-                View on GitHub
-              </a>
-            </div>
-          </div>
-
-          {/* ── Right: trait grid ── */}
-          <div className="grid grid-cols-1 gap-px sm:grid-cols-2 lg:grid-cols-1 lg:w-[360px] rounded-2xl overflow-hidden border border-[var(--th-card-bd)] bg-[var(--th-card-bd)]">
-            {TRAITS.map((t) => (
-              <div
-                key={t.label}
-                className="flex items-start gap-4 bg-[var(--th-card-bg)] px-5 py-4"
-              >
-                <span className="mt-0.5 flex-none rounded-lg border border-[var(--th-card-bd)] p-2 th-text-secondary">
-                  {t.icon}
-                </span>
-                <div>
-                  <p className="text-[14px] font-semibold th-text-heading">{t.label}</p>
-                  <p className="mt-0.5 text-[13px] leading-snug th-text-body">{t.desc}</p>
-                </div>
-              </div>
-            ))}
-          </div>
-
-        </div>
-      </div>
-    </section>
-  );
-}

package/apps/web/src/components/landing/portability.tsx

@@ -1,190 +0,0 @@
-const DIRECTIONS = [
-  {
-    from: "Self-hosted VPS",
-    to: "Openship Cloud",
-    icon: (
-      <svg className="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={1.5}>
-        <path strokeLinecap="round" strokeLinejoin="round" d="M2.25 15a4.5 4.5 0 004.5 4.5H18a3.75 3.75 0 001.332-7.257 3 3 0 00-3.758-3.848 5.25 5.25 0 00-10.233 2.33A4.502 4.502 0 002.25 15z" />
-      </svg>
-    ),
-    desc: "Want managed scaling? Push your self-hosted instance to Openship Cloud — projects, domains, certs, and databases transfer instantly. Control everything from the app.",
-    color: "var(--th-clr-plum)",
-    bgWash: "var(--th-clr-plum-bg)",
-    blob: "var(--th-clr-plum-blob)",
-  },
-  {
-    from: "Openship Cloud",
-    to: "Self-hosted VPS",
-    icon: (
-      <svg className="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={1.5}>
-        <path strokeLinecap="round" strokeLinejoin="round" d="M5.25 14.25h13.5m-13.5 0a3 3 0 01-3-3m3 3a3 3 0 100 6h13.5a3 3 0 100-6m-16.5-3a3 3 0 013-3h13.5a3 3 0 013 3m-19.5 0a4.5 4.5 0 01.9-2.7L5.737 5.1a3.375 3.375 0 012.7-1.35h7.126c1.062 0 2.062.5 2.7 1.35l2.587 3.45a4.5 4.5 0 01.9 2.7m0 0a3 3 0 01-3 3m0 3h.008v.008h-.008v-.008zm0-6h.008v.008h-.008v-.008zm-3 6h.008v.008h-.008v-.008zm0-6h.008v.008h-.008v-.008z" />
-      </svg>
-    ),
-    desc: "Want full control? Export from Openship Cloud to your own server in one tap. You own the data — we never hold it hostage.",
-    color: "var(--th-clr-sea)",
-    bgWash: "var(--th-clr-sea-bg)",
-    blob: "var(--th-clr-sea-blob)",
-  },
-  {
-    from: "Server A",
-    to: "Server B",
-    icon: (
-      <svg className="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={1.5}>
-        <path strokeLinecap="round" strokeLinejoin="round" d="M7.5 21L3 16.5m0 0L7.5 12M3 16.5h13.5m0-13.5L21 7.5m0 0L16.5 12M21 7.5H7.5" />
-      </svg>
-    ),
-    desc: "Moving between VPS providers? Hetzner to DigitalOcean, OVH to Hostinger — migrate everything without touching a config file.",
-    color: "var(--th-clr-terra)",
-    bgWash: "var(--th-clr-terra-bg)",
-    blob: "var(--th-clr-terra-blob)",
-  },
-];
-
-const TRUST_POINTS = [
-  "No proprietary formats — standard Docker + volumes",
-  "CLI export produces a portable .tar.gz archive",
-  "Encrypted transfer over SSH by default",
-  "Domains & SSL auto-reconnect on the new host",
-  "Works between any Linux server, any provider",
-];
-
-const CHECK = (
-  <svg className="mt-0.5 h-4 w-4 shrink-0" fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={2.2}>
-    <path strokeLinecap="round" strokeLinejoin="round" d="M4.5 12.75l6 6 9-13.5" />
-  </svg>
-);
-
-export function Portability() {
-  return (
-    <section className="relative py-28 sm:py-36">
-      <div className="section-divider mx-auto mb-28 max-w-4xl sm:mb-36" />
-
-      <div className="mx-auto max-w-7xl px-6">
-        {/* ── Header ── */}
-        <div className="mx-auto max-w-3xl text-center">
-          <div className="mb-7 inline-flex items-center gap-2 rounded-full border border-[var(--th-on-06)] bg-white/60 px-4 py-1.5 shadow-[0_1px_3px_rgba(0,0,0,.04)] backdrop-blur-sm">
-            <span className="text-[12px] font-medium tracking-[0.02em] th-text-secondary">
-              Portability
-            </span>
-          </div>
-          <h2>
-            <span className="block text-[clamp(2.75rem,6vw,4.75rem)] font-semibold leading-[1.06] tracking-[-0.035em] th-text-heading">
-              Cloud ↔ self-host.
-            </span>
-            <span
-              className="block text-[clamp(2.75rem,6vw,4.75rem)] font-semibold leading-[1.06] tracking-[-0.035em]"
-              style={{ color: "var(--th-on-40)" }}
-            >
-              Move anytime. Zero setup.
-            </span>
-          </h2>
-          <p className="mx-auto mt-6 max-w-xl text-[17px] leading-[1.65] th-text-body">
-            Your infrastructure should never be a cage. Transfer between Openship
-            Cloud and any self-hosted VPS — or between two servers — in a single
-            tap from the app. No re-deploy, no data loss, no vendor games.
-          </p>
-        </div>
-
-        {/* ── Direction cards ── */}
-        <div className="mx-auto mt-16 grid max-w-6xl gap-6 md:grid-cols-3">
-          {DIRECTIONS.map((d) => (
-            <div
-              key={d.from + d.to}
-              className="relative overflow-hidden rounded-2xl border border-[var(--th-card-bd)] bg-[var(--th-card-bg)] p-7 shadow-[var(--th-card-shadow)] transition-colors hover:border-[var(--th-card-bd-hover)]"
-            >
-              {/* Accent top bar */}
-              <div
-                className="absolute inset-x-0 top-0 h-[3px]"
-                style={{ background: d.color }}
-              />
-
-              {/* Ambient blob */}
-              <div
-                className="pointer-events-none absolute -right-10 -top-10 h-[160px] w-[160px] rounded-full blur-[60px]"
-                style={{ background: d.blob }}
-              />
-
-              <div className="relative">
-                <div
-                  className="mb-5 flex h-12 w-12 items-center justify-center rounded-xl"
-                  style={{ background: d.bgWash, color: d.color }}
-                >
-                  {d.icon}
-                </div>
-
-                {/* From → To — bigger & bolder */}
-                <div className="mb-3 flex flex-wrap items-center gap-2">
-                  <span className="text-[17px] font-bold th-text-heading">{d.from}</span>
-                  <svg className="h-4 w-4 th-text-muted" fill="none" viewBox="0 0 24 24" stroke="currentColor" strokeWidth={2}>
-                    <path strokeLinecap="round" strokeLinejoin="round" d="M13.5 4.5L21 12m0 0l-7.5 7.5M21 12H3" />
-                  </svg>
-                  <span className="text-[17px] font-bold th-text-heading">{d.to}</span>
-                </div>
-
-                <p className="text-[14px] leading-[1.65] th-text-body">{d.desc}</p>
-              </div>
-            </div>
-          ))}
-        </div>
-
-        {/* ── CLI demo + trust points ── */}
-        <div className="mx-auto mt-14 grid max-w-5xl items-start gap-10 lg:grid-cols-[1fr_1fr]">
-          {/* Terminal card */}
-          <div className="overflow-hidden rounded-2xl border border-[var(--th-card-bd)] bg-[var(--th-card-bg)] font-mono text-[13px] shadow-[var(--th-card-shadow)]">
-            <div className="border-b border-[var(--th-card-bd)] px-5 py-2.5 text-[11px] font-semibold uppercase tracking-[0.1em] th-text-muted">
-              Terminal
-            </div>
-            <div className="space-y-2 px-5 py-4">
-              <div>
-                <span className="th-text-muted">$</span>{" "}
-                <span className="th-text-heading">openship export</span>
-              </div>
-              <div className="th-text-muted">
-                ✓ 3 projects, 2 databases, 4 domains
-              </div>
-              <div className="th-text-muted">
-                ✓ Packed → openship-backup-2026-03-07.tar.gz (142 MB)
-              </div>
-              <div className="mt-3">
-                <span className="th-text-muted">$</span>{" "}
-                <span className="th-text-heading">openship import --host new-server.example.com</span>
-              </div>
-              <div className="th-text-muted">
-                ✓ Transferred via SSH (encrypted)
-              </div>
-              <div className="th-text-muted">
-                ✓ Projects restored, domains reconnected
-              </div>
-              <div style={{ color: "var(--th-clr-sea)" }}>
-                ✓ Migration complete — 0 downtime
-              </div>
-            </div>
-          </div>
-
-          {/* Trust points */}
-          <div>
-            <h3 className="mb-5 text-[20px] font-bold th-text-heading">
-              True portability, not marketing talk.
-            </h3>
-            <ul className="space-y-3">
-              {TRUST_POINTS.map((t) => (
-                <li
-                  key={t}
-                  className="flex items-start gap-2.5 text-[15px] th-text-heading"
-                >
-                  <span style={{ color: "var(--th-clr-sea)" }}>{CHECK}</span>
-                  {t}
-                </li>
-              ))}
-            </ul>
-            <p className="mt-6 text-[14px] leading-[1.65] th-text-body">
-              Your stack is standard Docker. There is no proprietary runtime, no
-              secret sauce tying you down. Leave whenever you want — or never
-              leave at all. It&apos;s your call.
-            </p>
-          </div>
-        </div>
-      </div>
-    </section>
-  );
-}