src/app/page.tsx

@@ -12,7 +12,8 @@ import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
 import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
 import PricingCardThree from '@/components/sections/pricing/PricingCardThree';
 import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
-import { BarChart, ShieldCheck, Target, TrendingUp, Users, Zap } from "lucide-react";
+import { BarChart, ShieldCheck, Target, TrendingUp, Users, Zap, Mail, ChevronRight } from "lucide-react";
+import FeatureCardTwentySeven from '@/components/sections/feature/FeatureCardTwentySeven';
 
 export default function LandingPage() {
   return (
@@ -68,6 +69,22 @@ export default function LandingPage() {
     />
   </div>
 
+  <div id="opt-in" data-section="opt-in">
+      <FeatureCardTwentySeven
+        animationType="blur-reveal"
+        title="Get The Service Export Blueprint"
+        description="Stop guessing and start scaling. Download the exact system we use to help companies dominate their niche."
+        textboxLayout="split"
+        useInvertedBackground={true}
+        features={[
+            { id: "1", title: "The 'Hidden' Lead Magnet Trick", descriptions: ["Why 99% of agencies are using outdated lead magnets that kill conversion."] },
+            { id: "2", title: "Service Export Strategy", descriptions: ["The secret blueprint that turns cold leads into high-paying clients overnight."] },
+            { id: "3", title: "Zero-Spend Scaling", descriptions: ["How to leverage proprietary systems to scale without blowing your budget."] }
+        ]}
+        buttons={[{ text: "Get the Blueprint", href: "#contact" }]}
+      />
+  </div>
+
   <div id="about" data-section="about">
       <AboutMetric
       useInvertedBackground={false}