From cfe3c1a2b3cb3b485f212417d07c3f529b4940f0 Mon Sep 17 00:00:00 2001
From: SnapOtter <snapotter.hq@gmail.com>
Date: Sat, 6 Jun 2026 11:38:48 +0800
Subject: [PATCH] fix: refine landing hero layout and spacing

Clean headline break, two-tier subtitle with tool list and lighter
attributes line, more vertical breathing room.
---
 apps/landing/src/components/hero.tsx | 16 ++++++++++------
 1 file changed, 10 insertions(+), 6 deletions(-)

diff --git a/apps/landing/src/components/hero.tsx b/apps/landing/src/components/hero.tsx
index d4ff6b4e..d5886f08 100644
--- a/apps/landing/src/components/hero.tsx
+++ b/apps/landing/src/components/hero.tsx
@@ -79,7 +79,7 @@ export function Hero() {
   const mouse = useMouseParallax(25);
 
   return (
-    <section className="relative overflow-hidden px-6 pt-32 pb-24 md:pt-44 md:pb-36">
+    <section className="relative overflow-hidden px-6 pt-40 pb-32 md:pt-52 md:pb-44">
       {/* Gradient mesh background - follows mouse */}
       <div
         className="pointer-events-none absolute inset-0 -z-10 transition-transform duration-700 ease-out"
@@ -115,15 +115,19 @@ export function Hero() {
 
       <div className="relative mx-auto max-w-4xl text-center">
         <h1 className="animate-[fadeUp_0.6s_ease-out_both] font-[family-name:var(--font-nunito)] text-4xl font-extrabold tracking-tight sm:text-5xl md:text-6xl lg:text-7xl">
-          50+ image tools. One Docker container.
+          50+ image tools.
+          <br />
+          One Docker container.
         </h1>
 
-        <p className="mt-4 animate-[fadeUp_0.6s_ease-out_0.1s_both] text-base text-muted md:text-lg">
-          Resize, compress, convert, remove backgrounds, upscale, OCR, and more. Open source. Runs
-          on your network.
+        <p className="mx-auto mt-6 max-w-2xl animate-[fadeUp_0.6s_ease-out_0.1s_both] text-base text-muted md:text-lg">
+          Resize, compress, convert, remove backgrounds, upscale, OCR, and more.
+        </p>
+        <p className="mt-2 animate-[fadeUp_0.6s_ease-out_0.15s_both] text-sm tracking-wide text-muted/60">
+          Open source. Fully offline. Runs on your network.
         </p>
 
-        <p className="mt-4 animate-[fadeUp_0.6s_ease-out_0.2s_both] text-xl font-medium md:text-2xl">
+        <p className="mt-6 animate-[fadeUp_0.6s_ease-out_0.2s_both] text-xl font-medium md:text-2xl">
           <TypingCursor />
         </p>