STYLED - Simplify closed coming-soon page

- Remove CTA buttons (site is closed, no navigation)
- Drop the card wrapper: content sits on the page background, gradient included
- Remove the launch label; keep the countdown
- Fit the viewport (no scroll)

app/[locale]/coming-soon/page.tsx

@@ -1,16 +1,13 @@
 import type { Metadata } from "next";
 import { unstable_noStore as noStore } from "next/cache";
-import Link from "next/link";
-import { ArrowLeft, ArrowRight, Mail } from "lucide-react";
 import { getLocale, getTranslations } from "next-intl/server";
 
 import { FloatingPreferences } from "@/components/layout/floating-preferences";
 import { HeroContentMotion, HeroMotionItem, HeroShell, HeroTitle } from "@/components/layout/site-hero";
 import { LaunchCountdown } from "@/components/site/launch-countdown";
-import { Button } from "@/components/ui/button";
 import { getSiteSettings } from "@/lib/app-config";
 import { buildLocalizedMetadata } from "@/lib/metadata";
-import { getLocalizedPath, resolveLocale } from "@/lib/locale";
+import { resolveLocale } from "@/lib/locale";
 import { cn } from "@/lib/utils";
 
 // Target launch date for the countdown. Edit this single line to change it.
@@ -48,7 +45,6 @@ export default async function ComingSoonPage({ params }: ComingSoonPageProps) {
   const localeKey = resolveLocale(await getLocale().catch(() => siteSettings.defaultLocale), siteSettings.defaultLocale);
   const t = await getTranslations({ locale: localeKey, namespace: "comingSoon" });
   const isArabic = localeKey === "ar";
-  const DirectionIcon = isArabic ? ArrowLeft : ArrowRight;
 
   const lines = [
     {
@@ -69,91 +65,57 @@ export default async function ComingSoonPage({ params }: ComingSoonPageProps) {
   ];
 
   const trackedEyebrow = isArabic ? "tracking-normal" : "uppercase tracking-[0.28em]";
-  const trackedLabel = isArabic ? "tracking-normal" : "uppercase tracking-[0.24em]";
   const trackedPill = isArabic ? "tracking-normal" : "uppercase tracking-[0.12em]";
 
   return (
-    <div className="relative min-h-screen overflow-hidden">
+    <div className="relative h-screen overflow-hidden">
       <FloatingPreferences locale={localeKey} defaultLocale={siteSettings.defaultLocale} />
 
-      <HeroShell className="min-h-screen" showBridges>
+      <HeroShell className="h-screen" showBridges>
         <HeroContentMotion className="relative z-10 w-full">
-          <div className="mx-auto w-full max-w-[60rem]">
+          <div className="mx-auto flex w-full max-w-[60rem] flex-col items-center text-center">
-            <div className="relative overflow-hidden rounded-[calc(var(--radius-surface)+10px)] border border-foreground/10 bg-background/45 px-6 py-12 shadow-panel backdrop-blur-[26px] dark:border-foreground/12 dark:bg-background/25 sm:px-14 sm:py-16">
+            <HeroMotionItem>
-              {/* top hairline highlight */}
               <span
-                aria-hidden
+                className={cn(
-                className="pointer-events-none absolute inset-x-8 top-0 h-px bg-gradient-to-r from-transparent via-foreground/25 to-transparent"
+                  "inline-flex items-center gap-2.5 rounded-pill border border-foreground/10 bg-background/55 px-4 py-2 text-xs font-medium text-[hsl(var(--hero-ink)/0.82)] shadow-[var(--shadow-sm)] backdrop-blur-[18px] dark:border-foreground/12 dark:bg-background/20 dark:text-foreground/82",
+                  trackedPill,
+                )}
+              >
+                <span className="relative flex h-2 w-2">
+                  <span className="absolute inline-flex h-full w-full animate-ping rounded-full bg-brand-secondary opacity-70" />
+                  <span className="relative inline-flex h-2 w-2 rounded-full bg-brand-secondary" />
+                </span>
+                {t("status")}
+              </span>
+            </HeroMotionItem>
+
+            <HeroMotionItem>
+              <p className={cn("mt-7 text-xs font-medium text-foreground/45", trackedEyebrow)}>
+                {t("kicker")}
+              </p>
+            </HeroMotionItem>
+
+            <HeroTitle locale={localeKey} lines={lines} className="mx-auto mt-4 tracking-normal" />
+
+            <HeroMotionItem>
+              <p className="mx-auto mt-8 max-w-[36rem] text-sm leading-7 text-foreground/68 sm:text-base">
+                {t("description")}
+              </p>
+            </HeroMotionItem>
+
+            <HeroMotionItem className="mt-11">
+              <LaunchCountdown
+                targetIso={LAUNCH_DATE_ISO}
+                arabic={isArabic}
+                launchedLabel={t("launched")}
+                labels={{
+                  days: t("unitDays"),
+                  hours: t("unitHours"),
+                  minutes: t("unitMinutes"),
+                  seconds: t("unitSeconds"),
+                }}
               />
-              {/* soft brand glow */}
+            </HeroMotionItem>
-              <span
-                aria-hidden
-                className="pointer-events-none absolute -top-28 left-1/2 h-64 w-[38rem] max-w-[120%] -translate-x-1/2 rounded-full bg-[radial-gradient(closest-side,hsl(var(--brand-primary)/0.18),transparent)] blur-2xl"
-              />
-
-              <div className="relative flex flex-col items-center text-center">
-                <HeroMotionItem>
-                  <span
-                    className={cn(
-                      "inline-flex items-center gap-2.5 rounded-pill border border-foreground/10 bg-background/55 px-4 py-2 text-xs font-medium text-[hsl(var(--hero-ink)/0.82)] shadow-[var(--shadow-sm)] backdrop-blur-[18px] dark:border-foreground/12 dark:bg-background/20 dark:text-foreground/82",
-                      trackedPill,
-                    )}
-                  >
-                    <span className="relative flex h-2 w-2">
-                      <span className="absolute inline-flex h-full w-full animate-ping rounded-full bg-brand-secondary opacity-70" />
-                      <span className="relative inline-flex h-2 w-2 rounded-full bg-brand-secondary" />
-                    </span>
-                    {t("status")}
-                  </span>
-                </HeroMotionItem>
-
-                <HeroMotionItem>
-                  <p className={cn("mt-7 text-xs font-medium text-foreground/45", trackedEyebrow)}>
-                    {t("kicker")}
-                  </p>
-                </HeroMotionItem>
-
-                <HeroTitle locale={localeKey} lines={lines} className="mx-auto mt-4 tracking-normal" />
-
-                <HeroMotionItem>
-                  <p className="mx-auto mt-8 max-w-[36rem] text-sm leading-7 text-foreground/68 sm:text-base">
-                    {t("description")}
-                  </p>
-                </HeroMotionItem>
-
-                <HeroMotionItem className="mt-11 flex flex-col items-center gap-4">
-                  <span className={cn("text-xs font-medium text-foreground/45", trackedLabel)}>
-                    {t("countdownLabel")}
-                  </span>
-                  <LaunchCountdown
-                    targetIso={LAUNCH_DATE_ISO}
-                    arabic={isArabic}
-                    launchedLabel={t("launched")}
-                    labels={{
-                      days: t("unitDays"),
-                      hours: t("unitHours"),
-                      minutes: t("unitMinutes"),
-                      seconds: t("unitSeconds"),
-                    }}
-                  />
-                </HeroMotionItem>
-
-                <HeroMotionItem className="mt-12 flex w-full flex-col items-center justify-center gap-3 sm:w-auto sm:flex-row">
-                  <Button asChild size="lg" className="w-full sm:w-auto">
-                    <Link href={getLocalizedPath(localeKey, "/contact", siteSettings.defaultLocale)}>
-                      <Mail className="h-4 w-4" />
-                      {t("primaryCta")}
-                    </Link>
-                  </Button>
-                  <Button asChild variant="outline" size="lg" className="w-full sm:w-auto">
-                    <Link href={getLocalizedPath(localeKey, "/", siteSettings.defaultLocale)}>
-                      {t("secondaryCta")}
-                      <DirectionIcon className="h-4 w-4" />
-                    </Link>
-                  </Button>
-                </HeroMotionItem>
-              </div>
-            </div>
           </div>
         </HeroContentMotion>
       </HeroShell>