Hide the homepage hero photo on mobile so only the banner text remains.

Co-authored-by: Cursor <cursoragent@cursor.com>

apps/web/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@moniki/web",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "private": true,
   "scripts": {
     "dev": "next dev -p 3000",

apps/web/src/components/home/HeroCarousel.tsx

@@ -121,7 +121,7 @@ export function HeroCarousel({ banners }: { banners: HeroBanner[] }) {
       ))}
       <div data-decorative className="hero-scrim pointer-events-none absolute inset-0" aria-hidden />
 
-      <div className="relative mx-auto grid min-h-[calc(100vh-var(--header-h))] max-w-6xl items-center gap-10 px-4 py-16 sm:px-6 lg:grid-cols-2 lg:gap-14 lg:py-20">
+      <div className="relative mx-auto grid max-w-6xl items-center gap-6 px-4 py-12 sm:px-6 lg:min-h-[calc(100vh-var(--header-h))] lg:grid-cols-2 lg:gap-14 lg:py-20">
         <div className="hero-copy max-w-xl rounded-[28px] p-6 sm:p-8">
           <p className="text-4xl font-extrabold tracking-tight text-[var(--brand-700)] sm:text-5xl lg:text-6xl">
             {current.eyebrow || t("brand")}
@@ -171,7 +171,7 @@ export function HeroCarousel({ banners }: { banners: HeroBanner[] }) {
         </div>
 
         <div className="relative">
-          <div className="relative aspect-[4/5] overflow-hidden rounded-[28px] shadow-[0_24px_80px_-32px_rgba(15,118,110,0.45)] sm:aspect-[5/6]">
+          <div className="relative hidden aspect-[4/5] overflow-hidden rounded-[28px] shadow-[0_24px_80px_-32px_rgba(15,118,110,0.45)] sm:aspect-[5/6] lg:block">
             {slides.map((slide, i) => {
               const active = i === index;
               const playing = playingId === slide.id && active;