From df6e119ad468c4bafbdd4b04bf52f445656aaf8a Mon Sep 17 00:00:00 2001
From: Desktop <desktop@igny8.com>
Date: Fri, 14 Nov 2025 02:53:08 +0500
Subject: [PATCH] product and solutions

---
 frontend/src/marketing/pages/Product.tsx   | 72 +++++++---------------
 frontend/src/marketing/pages/Solutions.tsx |  3 +
 2 files changed, 24 insertions(+), 51 deletions(-)

diff --git a/frontend/src/marketing/pages/Product.tsx b/frontend/src/marketing/pages/Product.tsx
index 5bb9fe68..f0ca25b7 100644
--- a/frontend/src/marketing/pages/Product.tsx
+++ b/frontend/src/marketing/pages/Product.tsx
@@ -118,58 +118,28 @@ const Product: React.FC = () => {
   return (
     <div className="bg-white">
       {/* HERO SECTION */}
-      <section className="relative overflow-hidden bg-gradient-to-br from-[#0693e3] via-[#5d4ae3] to-[#8b5cf6]">
-        {/* Radial glow behind headline */}
-        <div className="absolute inset-0 bg-[radial-gradient(circle_at_30%_50%,rgba(255,255,255,0.1),transparent_60%)]" />
-        <div className="absolute inset-0 bg-[radial-gradient(circle_at_70%_20%,rgba(109,74,227,0.2),transparent_50%)]" />
+      <section className="relative overflow-hidden bg-gradient-to-b from-white via-slate-50/50 to-white">
+        <div className="absolute inset-0 bg-[radial-gradient(circle_at_50%_50%,rgba(6,147,227,0.03),transparent_60%)]" />
         
-        <div className="relative max-w-7xl mx-auto px-6 py-20 md:py-32 lg:py-40">
-          <div className="grid grid-cols-1 lg:grid-cols-2 gap-12 lg:gap-16 items-center">
-            {/* Left: Text Content */}
-            <div className="flex flex-col gap-6 z-10">
-              <h1 className="text-5xl md:text-6xl lg:text-5xl font-bold leading-tight text-white">
-                One platform for keyword intelligence, AI content, and workflow automation.
-              </h1>
-              <p className="text-lg md:text-xl text-white/85 leading-relaxed max-w-xl">
-                IGNY8 unifies research, writing, images, and automation so your team creates more output with less effort. Start manual or run fully automated.
-              </p>
-              <div className="flex flex-col sm:flex-row gap-4 mt-2">
-                {renderCta(
-                  { label: "Start free", href: "https://app.igny8.com/signup" },
-                  "inline-flex items-center justify-center rounded-xl bg-white text-[#0693e3] px-8 py-4 text-base font-semibold hover:bg-white/95 transition shadow-xl hover:shadow-2xl hover:-translate-y-0.5"
-                )}
-                {renderCta(
-                  { label: "Book a demo", href: "/contact" },
-                  "inline-flex items-center justify-center rounded-xl border-2 border-white/30 bg-white/10 backdrop-blur-sm text-white px-8 py-4 text-base font-semibold hover:bg-white/20 hover:border-white/50 transition"
-                )}
-              </div>
-            </div>
-
-            {/* Right: Product Dashboard Screenshot */}
-            <div className="relative z-10">
-              <div className="relative scale-110 lg:scale-125">
-                {/* Soft glow behind screenshot */}
-                <div className="absolute -inset-8 bg-gradient-to-br from-white/30 via-[#0693e3]/20 to-[#5d4ae3]/20 rounded-3xl blur-3xl" />
-                {/* Device frame effect */}
-                <div className="absolute -inset-4 bg-gradient-to-br from-white/20 to-white/5 rounded-3xl blur-2xl" />
-                <div className="relative rounded-2xl border-4 border-white/20 bg-white/10 backdrop-blur-sm shadow-2xl overflow-hidden">
-                  <div className="absolute top-0 left-0 right-0 h-12 bg-gradient-to-b from-slate-800/50 to-transparent flex items-center gap-2 px-4">
-                    <div className="flex gap-2">
-                      <div className="w-3 h-3 rounded-full bg-red-500/50" />
-                      <div className="w-3 h-3 rounded-full bg-yellow-500/50" />
-                      <div className="w-3 h-3 rounded-full bg-green-500/50" />
-                    </div>
-                  </div>
-                  <img
-                    src="/marketing/images/hero-dashboard.png"
-                    alt="Igny8 product dashboard"
-                    className="w-full h-auto object-cover mt-12"
-                  />
-                </div>
-                {/* Soft shadow */}
-                <div className="absolute -bottom-8 -left-8 right-8 h-32 bg-gradient-to-t from-[#0693e3]/20 to-transparent blur-3xl -z-10" />
-              </div>
-            </div>
+        <div className="relative max-w-4xl mx-auto px-6 py-24 md:py-32 text-center z-10">
+          <span className="inline-flex items-center gap-2 text-xs font-semibold uppercase tracking-[0.28em] text-slate-500 bg-slate-100 px-4 py-2 rounded-full mb-6">
+            Product
+          </span>
+          <h1 className="text-5xl md:text-6xl lg:text-5xl font-bold leading-tight text-slate-900 mb-6">
+            One platform for keyword intelligence, AI content, and workflow automation.
+          </h1>
+          <p className="text-xl md:text-2xl text-slate-600 mb-10 max-w-2xl mx-auto leading-relaxed">
+            IGNY8 unifies research, writing, images, and automation so your team creates more output with less effort. Start manual or run fully automated.
+          </p>
+          <div className="flex flex-col sm:flex-row gap-4 justify-center">
+            {renderCta(
+              { label: "Start free", href: "https://app.igny8.com/signup" },
+              "inline-flex items-center justify-center rounded-xl bg-gradient-to-r from-[#0693e3] to-[#0472b8] text-white px-8 py-4 text-base font-semibold hover:shadow-lg hover:-translate-y-0.5 transition shadow-md"
+            )}
+            {renderCta(
+              { label: "Book a demo", href: "/contact" },
+              "inline-flex items-center justify-center rounded-xl border-2 border-slate-300 bg-white text-slate-700 px-8 py-4 text-base font-semibold hover:border-[#0693e3] hover:text-[#0693e3] transition"
+            )}
           </div>
         </div>
       </section>
diff --git a/frontend/src/marketing/pages/Solutions.tsx b/frontend/src/marketing/pages/Solutions.tsx
index a15b1d9c..2abf0808 100644
--- a/frontend/src/marketing/pages/Solutions.tsx
+++ b/frontend/src/marketing/pages/Solutions.tsx
@@ -149,6 +149,9 @@ const Solutions: React.FC = () => {
         <div className="absolute inset-0 bg-[radial-gradient(circle_at_50%_50%,rgba(6,147,227,0.03),transparent_60%)]" />
         
         <div className="relative max-w-4xl mx-auto px-6 py-24 md:py-32 text-center z-10">
+          <span className="inline-flex items-center gap-2 text-xs font-semibold uppercase tracking-[0.28em] text-slate-500 bg-slate-100 px-4 py-2 rounded-full mb-6">
+            Solutions
+          </span>
           <h1 className="text-5xl md:text-6xl lg:text-5xl font-bold leading-tight text-slate-900 mb-6">
             Designed for teams that operate at scale.
           </h1>