@lynxflow/seo-engine 1.5.3 → 1.5.5

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (8) hide show
  1. package/dist/brand-icons.d.ts +22 -0
  2. package/dist/index.d.ts +1 -0
  3. package/dist/index.js +199 -12
  4. package/dist/index.mjs +199 -12
  5. package/package.json +1 -1
  6. package/src/brand-icons.ts +138 -0
  7. package/src/index.ts +1 -0
  8. package/src/llm-prompt.ts +80 -12
package/dist/brand-icons.d.ts ADDED
@@ -0,0 +1,22 @@
1
+ /**
2
+ * 🎨 Zero-Dependency Brand & Social SVG Icons Resolver
3
+ * Enhances Programmatic SEO pages, OpenGraph banners, and CRO trust elements
4
+ * by automatically injecting official, crisp vector icons for detected brands.
5
+ */
6
+ export interface BrandIcon {
7
+ name: string;
8
+ slug: string;
9
+ category: "social" | "tech" | "ecommerce" | "crm" | "general";
10
+ viewBox: string;
11
+ svgPath: string;
12
+ brandColor: string;
13
+ }
14
+ export declare const BRAND_ICONS: Record<string, BrandIcon>;
15
+ /**
16
+ * Resolves a brand SVG vector from text matching or keywords.
17
+ */
18
+ export declare function resolveBrandIcon(input: string): BrandIcon | undefined;
19
+ /**
20
+ * Returns raw inline SVG markup for a brand icon.
21
+ */
22
+ export declare function renderBrandIconSvg(input: string, className?: string): string;
package/dist/index.d.ts CHANGED
@@ -13,6 +13,7 @@ export * from "./engine";
13
13
  export * from "./slug-engine";
14
14
  export * from "./legal-disclaimers";
15
15
  export * from "./matrix-engine";
16
+ export * from "./brand-icons";
16
17
  export * from "./llm-prompt";
17
18
  export * from "./auth-key";
18
19
  export * from "./token-quota-manager";
package/dist/index.js CHANGED
@@ -40,6 +40,8 @@ var __export = (target, all) => {
40
40
  var exports_src = {};
41
41
  __export(exports_src, {
42
42
  validateSeoSlug: () => validateSeoSlug,
43
+ resolveBrandIcon: () => resolveBrandIcon,
44
+ renderBrandIconSvg: () => renderBrandIconSvg,
43
45
  getSeoAgentPrompt: () => getSeoAgentPrompt,
44
46
  default: () => src_default,
45
47
  createLynxSeoEngine: () => createLynxSeoEngine,
@@ -89,6 +91,7 @@ __export(exports_src, {
89
91
  CopywritingFrameworksMaster: () => CopywritingFrameworksMaster,
90
92
  BrandDnaCalendarEngine: () => BrandDnaCalendarEngine,
91
93
  BacklinksClient: () => BacklinksClient,
94
+ BRAND_ICONS: () => BRAND_ICONS,
92
95
  ApiKeyGuardian: () => ApiKeyGuardian,
93
96
  AiCopilotClient: () => AiCopilotClient,
94
97
  AiBotsLogAnalyzer: () => AiBotsLogAnalyzer,
@@ -3635,6 +3638,122 @@ class PseoMatrixEngine {
3635
3638
  return allPages;
3636
3639
  }
3637
3640
  }
3641
+ // src/brand-icons.ts
3642
+ var BRAND_ICONS = {
3643
+ facebook: {
3644
+ name: "Facebook",
3645
+ slug: "facebook",
3646
+ category: "social",
3647
+ viewBox: "0 0 24 24",
3648
+ svgPath: "M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z",
3649
+ brandColor: "#1877F2"
3650
+ },
3651
+ instagram: {
3652
+ name: "Instagram",
3653
+ slug: "instagram",
3654
+ category: "social",
3655
+ viewBox: "0 0 24 24",
3656
+ svgPath: "M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zm0-2.163c-3.259 0-3.667.014-4.947.072-4.358.2-6.78 2.618-6.98 6.98-.059 1.281-.073 1.689-.073 4.948 0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98 1.281.058 1.689.072 4.948.072 3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98-1.281-.059-1.69-.073-4.949-.073zm0 5.838c-3.403 0-6.162 2.759-6.162 6.162s2.759 6.163 6.162 6.163 6.162-2.759 6.162-6.163c0-3.403-2.759-6.162-6.162-6.162zm0 10.162c-2.209 0-4-1.79-4-4 0-2.209 1.791-4 4-4s4 1.791 4 4c0 2.21-1.791 4-4 4zm6.406-11.845c-.796 0-1.441.645-1.441 1.44s.645 1.44 1.441 1.44c.795 0 1.439-.645 1.439-1.44s-.644-1.44-1.439-1.44z",
3657
+ brandColor: "#E4405F"
3658
+ },
3659
+ linkedin: {
3660
+ name: "LinkedIn",
3661
+ slug: "linkedin",
3662
+ category: "social",
3663
+ viewBox: "0 0 24 24",
3664
+ svgPath: "M19 0h-14c-2.761 0-5 2.239-5 5v14c0 2.761 2.239 5 5 5h14c2.762 0 5-2.239 5-5v-14c0-2.761-2.238-5-5-5zm-11 19h-3v-11h3v11zm-1.5-12.268c-.966 0-1.75-.79-1.75-1.764s.784-1.764 1.75-1.764 1.75.79 1.75 1.764-.783 1.764-1.75 1.764zm13.5 12.268h-3v-5.604c0-3.368-4-3.113-4 0v5.604h-3v-11h3v1.765c1.396-2.586 7-2.777 7 2.476v6.759z",
3665
+ brandColor: "#0A66C2"
3666
+ },
3667
+ twitter: {
3668
+ name: "X (Twitter)",
3669
+ slug: "twitter",
3670
+ category: "social",
3671
+ viewBox: "0 0 24 24",
3672
+ svgPath: "M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z",
3673
+ brandColor: "#000000"
3674
+ },
3675
+ youtube: {
3676
+ name: "YouTube",
3677
+ slug: "youtube",
3678
+ category: "social",
3679
+ viewBox: "0 0 24 24",
3680
+ svgPath: "M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z",
3681
+ brandColor: "#FF0000"
3682
+ },
3683
+ tiktok: {
3684
+ name: "TikTok",
3685
+ slug: "tiktok",
3686
+ category: "social",
3687
+ viewBox: "0 0 24 24",
3688
+ svgPath: "M12.525.02c1.31-.02 2.61-.01 3.91-.02.08 1.53.63 3.09 1.75 4.17 1.12 1.11 2.7 1.62 4.24 1.79v4.03c-1.44-.05-2.89-.35-4.2-.97-.57-.26-1.1-.59-1.62-.93-.01 2.92.01 5.84-.02 8.75-.08 1.4-.54 2.79-1.35 3.94-1.31 1.92-3.58 3.17-5.91 3.21-1.43.08-2.86-.31-4.08-1.03-2.02-1.19-3.44-3.37-3.65-5.71-.02-.5-.03-1-.01-1.49.18-1.9 1.12-3.72 2.58-4.96 1.66-1.44 3.98-2.13 6.15-1.72.02 1.48-.04 2.96-.04 4.44-.99-.32-2.15-.23-3.02.37-.63.41-1.11 1.04-1.36 1.75-.21.51-.24 1.07-.14 1.61.24 1.64 1.82 2.89 3.5 2.76 1.25-.04 2.4-1.02 2.68-2.22.12-.55.13-1.12.13-1.68V.02z",
3689
+ brandColor: "#000000"
3690
+ },
3691
+ shopify: {
3692
+ name: "Shopify",
3693
+ slug: "shopify",
3694
+ category: "ecommerce",
3695
+ viewBox: "0 0 24 24",
3696
+ svgPath: "M18.8 6.5l-1.3-.4c-.1-.3-.4-1.1-.7-1.5-.7-.9-1.7-1.4-2.8-1.4-.1 0-.2 0-.3.1l-.8-2.5c-.1-.4-.6-.6-.9-.4l-6.5 2.1c-.2.1-.3.2-.3.4l-.8 2.5-3.3 1c-.7.2-.9.9-.5 1.5l5.5 14.7c.2.4.6.7 1.1.7h11.1c.5 0 .9-.3 1.1-.7l3.6-14.8c.2-.7-.3-1.3-.9-1.2zm-5.7-1.9c.7 0 1.3.4 1.8 1.1.3.4.5 1 .6 1.3l-3.9 1.2 1.5-3.6zm-3.3 1.1l3.5-1.1-1.4 3.4-3.4-1.1 1.3-1.2z",
3697
+ brandColor: "#96BF48"
3698
+ },
3699
+ slack: {
3700
+ name: "Slack",
3701
+ slug: "slack",
3702
+ category: "tech",
3703
+ viewBox: "0 0 24 24",
3704
+ svgPath: "M5.042 15.165a2.528 2.528 0 0 1-2.52 2.523A2.528 2.528 0 0 1 0 15.165a2.527 2.527 0 0 1 2.522-2.52h2.52v2.52zM6.313 15.165a2.527 2.527 0 0 1 2.521-2.52 2.527 2.527 0 0 1 2.521 2.52v6.313A2.528 2.528 0 0 1 8.834 24a2.528 2.528 0 0 1-2.521-2.522v-6.313zM8.834 5.042a2.528 2.528 0 0 1-2.521-2.52A2.528 2.528 0 0 1 8.834 0a2.528 2.528 0 0 1 2.521 2.522v2.52H8.834zM8.834 6.313a2.528 2.528 0 0 1 2.521 2.521 2.528 2.528 0 0 1-2.521 2.521H2.522A2.528 2.528 0 0 1 0 8.834a2.528 2.528 0 0 1 2.522-2.521h6.312zM18.956 8.834a2.528 2.528 0 0 1 2.522-2.521A2.528 2.528 0 0 1 24 8.834a2.528 2.528 0 0 1-2.522 2.521h-2.522V8.834zM17.688 8.834a2.528 2.528 0 0 1-2.523 2.521 2.527 2.527 0 0 1-2.52-2.521V2.522A2.527 2.527 0 0 1 15.165 0a2.528 2.528 0 0 1 2.523 2.522v6.312zM15.165 18.956a2.528 2.528 0 0 1 2.523 2.522A2.528 2.528 0 0 1 15.165 24a2.527 2.527 0 0 1-2.52-2.522v-2.522h2.52zM15.165 17.688a2.527 2.527 0 0 1-2.52-2.523 2.526 2.526 0 0 1 2.52-2.52h6.313A2.527 2.527 0 0 1 24 15.165a2.528 2.528 0 0 1-2.522 2.523h-6.313z",
3705
+ brandColor: "#4A154B"
3706
+ },
3707
+ whatsapp: {
3708
+ name: "WhatsApp",
3709
+ slug: "whatsapp",
3710
+ category: "social",
3711
+ viewBox: "0 0 24 24",
3712
+ svgPath: "M.057 24l1.687-6.163c-1.041-1.804-1.588-3.849-1.587-5.946.003-6.556 5.338-11.891 11.893-11.891 3.181.001 6.167 1.24 8.413 3.488 2.245 2.248 3.481 5.236 3.48 8.414-.003 6.557-5.338 11.892-11.893 11.892-1.99-.001-3.951-.5-5.688-1.448l-6.305 1.654zm6.597-3.807c1.676.995 3.276 1.591 5.392 1.592 5.448 0 9.886-4.434 9.889-9.885.002-5.462-4.415-9.89-9.881-9.892-5.452 0-9.887 4.434-9.889 9.884-.001 2.225.651 3.891 1.746 5.634l-.999 3.648 3.742-.981z",
3713
+ brandColor: "#25D366"
3714
+ },
3715
+ hubspot: {
3716
+ name: "HubSpot",
3717
+ slug: "hubspot",
3718
+ category: "crm",
3719
+ viewBox: "0 0 24 24",
3720
+ svgPath: "M17.48 7.37V4.92c.73-.37 1.23-1.12 1.23-2 0-1.24-1-2.24-2.24-2.24s-2.24 1-2.24 2.24c0 .88.5 1.63 1.23 2v2.45c-1.39.38-2.48 1.48-2.86 2.87H9.28c-.37-.5-1-.83-1.68-.83-.07 0-.15 0-.22.02V7.15c.61-.35 1.02-.99 1.02-1.74 0-1.1-.9-2-2-2s-2 .9-2 2c0 .75.41 1.39 1.02 1.74v2.28c-.68.22-1.19.8-1.31 1.52H2.24c-.2-.58-.75-1-1.4-1C.38 10 0 10.38 0 10.84s.38.84.84.84c.65 0 1.2-.42 1.4-1h1.87c.12.72.63 1.3 1.31 1.52v5.26c-.61.35-1.02.99-1.02 1.74 0 1.1.9 2 2 2s2-.9 2-2c0-.75-.41-1.39-1.02-1.74v-5.26c.07.02.15.02.22.02.68 0 1.31-.33 1.68-.83h3.32c.38 1.39 1.47 2.49 2.86 2.87v2.45c-.73.37-1.23 1.12-1.23 2 0 1.24 1 2.24 2.24 2.24s2.24-1 2.24-2.24c0-.88-.5-1.63-1.23-2v-2.45c1.84-.5 3.23-2.16 3.23-4.14s-1.39-3.64-3.23-4.14zm-1.01 6.13c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2z",
3721
+ brandColor: "#FF7A59"
3722
+ },
3723
+ github: {
3724
+ name: "GitHub",
3725
+ slug: "github",
3726
+ category: "tech",
3727
+ viewBox: "0 0 24 24",
3728
+ svgPath: "M12 0C5.37 0 0 5.37 0 12c0 5.31 3.435 9.795 8.205 11.385.6.105.825-.255.825-.57 0-.285-.015-1.23-.015-2.235-3.015.555-3.795-.735-4.035-1.41-.135-.345-.72-1.41-1.23-1.695-.42-.225-1.02-.78-.015-.795.945-.015 1.62.87 1.845 1.23 1.08 1.815 2.805 1.305 3.495.99.105-.78.42-1.305.765-1.605-2.67-.3-5.46-1.335-5.46-5.925 0-1.305.465-2.385 1.23-3.225-.12-.3-.54-1.53.12-3.18 0 0 1.005-.315 3.3 1.23.96-.27 1.98-.405 3-.405s2.04.135 3 .405c2.295-1.56 3.3-1.23 3.3-1.23.66 1.65.24 2.88.12 3.18.765.84 1.23 1.905 1.23 3.225 0 4.605-2.805 5.625-5.475 5.925.435.375.81 1.095.81 2.22 0 1.605-.015 2.895-.015 3.3 0 .315.225.69.825.57A12.02 12.02 0 0 0 24 12c0-6.63-5.37-12-12-12z",
3729
+ brandColor: "#181717"
3730
+ },
3731
+ google: {
3732
+ name: "Google",
3733
+ slug: "google",
3734
+ category: "tech",
3735
+ viewBox: "0 0 24 24",
3736
+ svgPath: "M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09zM12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23zm-6.16-8.9c-.22-.66-.35-1.36-.35-2.1s.13-1.44.35-2.1V7.06H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.94l2.85-2.22.81-.62zM12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.06l3.66 2.84c.87-2.6 3.3-4.52 6.16-4.52z",
3737
+ brandColor: "#4285F4"
3738
+ }
3739
+ };
3740
+ function resolveBrandIcon(input) {
3741
+ if (!input || typeof input !== "string")
3742
+ return;
3743
+ const clean = input.toLowerCase().replace(/[^a-z0-9]/g, "");
3744
+ for (const [key, icon] of Object.entries(BRAND_ICONS)) {
3745
+ if (clean.includes(key) || clean.includes(icon.slug)) {
3746
+ return icon;
3747
+ }
3748
+ }
3749
+ return;
3750
+ }
3751
+ function renderBrandIconSvg(input, className = "w-5 h-5 inline-block") {
3752
+ const icon = resolveBrandIcon(input);
3753
+ if (!icon)
3754
+ return "";
3755
+ return `<svg class="${className}" viewBox="${icon.viewBox}" fill="currentColor" aria-hidden="true"><path d="${icon.svgPath}"/></svg>`;
3756
+ }
3638
3757
  // src/llm-prompt.ts
3639
3758
  var PSEO_AGENT_SYSTEM_PROMPT = `
3640
3759
  You are the Programmatic SEO Implementation Specialist powered by @lynxflow/seo-engine.
@@ -3642,17 +3761,20 @@ Your role is to configure, resolve, and maintain programmatic SEO pages, XML sit
3642
3761
 
3643
3762
  ---
3644
3763
 
3645
- ### \uD83D\uDEA8 1. CRITICAL RULE: FEATURE DISCOVERY FROM FRONTEND ONLY (NEVER USE BACKEND / PROVIDERS)
3764
+ ### \uD83D\uDEA8 1. CRITICAL RULE: SEMANTIC PRODUCT DISCOVERY FROM THE FRONTEND
3646
3765
 
3647
- When discovering or listing product modules, features, or services to build the SEO matrices:
3766
+ When discovering product modules, features, or services to build the SEO matrices:
3648
3767
  - **❌ NEVER inspect backend API routes, internal database folders, or third-party providers:**
3649
3768
  - DO NOT create programmatic pages for internal plumbing like: \`/api/stripe\`, \`/api/resend\`, \`/api/auth\`, \`/api/d1\`, \`/api/webhooks\`, \`/api/openai\`.
3650
3769
  - DO NOT expose internal infrastructure, vendors, or suppliers (e.g. Stripe, Resend, Cloudflare D1, Better-Auth, Supabase, PostgreSQL drivers) as public product features. End users never search for or buy your internal backend plumbing.
3651
- - **✅ ALWAYS inspect the FRONTEND user-facing interface & commercial value propositions:**
3652
- - **Step 1A - Marketing Navbars & Dropdowns:** Scan \`components/Navbar.tsx\`, \`components/Header.tsx\`, \`components/Navigation.tsx\` to list all primary product modules.
3653
- - **Step 1B - Marketing Feature Pages & Pricing:** Scan \`app/(marketing)/*\`, \`pages/features/*\`, \`app/pricing/*\` to list commercial feature names and pricing tiers.
3654
- - **Step 1C - Dashboard Navigation & User Tools:** Scan \`components/dashboard/*\`, \`components/sidebar/*\` to find actual user workflows.
3655
- - **Step 1D - Extraction Requirement:** For EACH discovered module (or major product branch), create at least 1 programmatic service entry with \`slug\`, \`name\`, \`category\`, \`description\`, \`keyFeatures\`, and \`priceMonthly\`.
3770
+ - **✅ DEEPLY READ & UNDERSTAND THE FRONTEND PRODUCT (SEMANTIC ANALYSIS):**
3771
+ - **Framework-Agnostic Exploration:** Do not look for specific filenames (e.g. \`Navbar.tsx\` or \`Header.tsx\`). Every codebase organizes UI differently (React, Vue, Svelte, Astro, Remix, Next.js, HTML).
3772
+ - **Read the Public Product Pages & User UI:** Read the website's landing pages, public feature descriptions, menus/navigation (whatever they are named), pricing tables, and user dashboard views.
3773
+ - **Understand the Core Value & Workflows:** For every distinct tool or capability of the application:
3774
+ - *What does this module actually do?* (e.g. "Automates quote follow-ups", "Visual drag-and-drop pipeline", "Real-time client portal").
3775
+ - *What pain point does it solve for the end user?*
3776
+ - *Who is the primary persona/industry benefiting from it?*
3777
+ - **Extraction Requirement:** For EACH detected product module or major feature branch, create at least 1 programmatic service entry with \`slug\`, \`name\`, \`category\`, \`description\`, \`keyFeatures\`, and \`priceMonthly\`.
3656
3778
 
3657
3779
  ---
3658
3780
 
@@ -3726,10 +3848,12 @@ export const PSEO_DATASET = {
3726
3848
  };
3727
3849
  \`\`\`
3728
3850
 
3729
- #### File 2: Universal Dynamic Catch-All Route (\`app/[...slug]/page.tsx\`)
3851
+ #### File 2: Ultra-Modern Dynamic Catch-All Route (\`app/[...slug]/page.tsx\`)
3730
3852
  \`\`\`tsx
3731
3853
  import { notFound } from "next/navigation";
3854
+ import Link from "next/link";
3732
3855
  import { matrixEngine, SEO_CONFIG, PSEO_DATASET } from "@/lib/seo";
3856
+ import { renderBrandIconSvg } from "@lynxflow/seo-engine";
3733
3857
 
3734
3858
  export async function generateMetadata({ params }: { params: { slug: string[] } }) {
3735
3859
  const path = "/" + params.slug.join("/");
@@ -3747,12 +3871,75 @@ export default async function ProgrammaticPage({ params }: { params: { slug: str
3747
3871
  const page = pages.find((p) => p.urlPath === path);
3748
3872
  if (!page) notFound();
3749
3873
 
3874
+ // Automatic Brand Icon Detection
3875
+ const brandSvg = renderBrandIconSvg(page.integration?.name || page.competitor?.name || page.service?.name || "");
3876
+
3750
3877
  return (
3751
- <article className="max-w-4xl mx-auto py-12 px-6">
3878
+ <article className="min-h-screen bg-background text-foreground transition-colors duration-200">
3879
+ {/* 1. Official Google Schema.org JSON-LD */}
3752
3880
  <script type="application/ld+json" dangerouslySetInnerHTML={{ __html: JSON.stringify(page.schemaGraph) }} />
3753
- <h1 className="text-4xl font-extrabold">{page.h1}</h1>
3754
- <p className="mt-4 text-xl text-gray-600">{page.description}</p>
3755
- {page.disclaimerText && <aside className="mt-8 p-4 bg-gray-50 border rounded text-xs text-gray-500">{page.disclaimerText}</aside>}
3881
+
3882
+ <main className="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8 py-12 md:py-16 space-y-12">
3883
+ {/* 2. Hero Section with Glassmorphism Badge */}
3884
+ <header className="space-y-6 text-center md:text-left">
3885
+ <div className="inline-flex items-center gap-2 px-3 py-1 rounded-full text-xs font-semibold bg-primary/10 text-primary border border-primary/20 backdrop-blur-md">
3886
+ {brandSvg && <span dangerouslySetInnerHTML={{ __html: brandSvg }} className="w-4 h-4 flex items-center" />}
3887
+ <span>{page.matrixFamily.toUpperCase()}</span>
3888
+ </div>
3889
+
3890
+ <h1 className="text-4xl sm:text-5xl lg:text-6xl font-black tracking-tight leading-tight">
3891
+ {page.h1}
3892
+ </h1>
3893
+ <p className="text-lg sm:text-xl text-muted-foreground max-w-3xl leading-relaxed">
3894
+ {page.description}
3895
+ </p>
3896
+ </header>
3897
+
3898
+ {/* 3. AEO / GEO Direct-Answer Callout Box (Optimized for ChatGPT & Perplexity Citations) */}
3899
+ <section className="p-6 md:p-8 rounded-2xl bg-card border border-border shadow-sm space-y-3" data-geo-extract="true">
3900
+ <div className="flex items-center gap-2 text-primary font-bold text-sm">
3901
+ <span>⚡</span>
3902
+ <span>Direct Summary & Key Takeaways</span>
3903
+ </div>
3904
+ <p className="text-base text-card-foreground leading-relaxed">
3905
+ {page.description}
3906
+ </p>
3907
+ </section>
3908
+
3909
+ {/* 4. Interactive Value & Feature Grid */}
3910
+ <section className="grid grid-cols-1 md:grid-cols-3 gap-6">
3911
+ {(page.service?.keyFeatures || ["Real-time Sync", "Bank-grade Security", "Zero Lock-in"]).map((feat, idx) => (
3912
+ <div key={idx} className="p-6 rounded-xl bg-card/60 border border-border/80 hover:border-primary/50 transition duration-200 space-y-2">
3913
+ <div className="w-8 h-8 rounded-lg bg-primary/10 text-primary flex items-center justify-center font-bold text-sm">
3914
+ 0{idx + 1}
3915
+ </div>
3916
+ <h3 className="font-bold text-lg">{feat}</h3>
3917
+ <p className="text-sm text-muted-foreground">Automated workflows engineered for high-performance scale.</p>
3918
+ </div>
3919
+ ))}
3920
+ </section>
3921
+
3922
+ {/* 5. Geodesic Mesh Linking Footer (Prevents Orphan Pages & Spreads PageRank) */}
3923
+ {page.neighboringLinks && page.neighboringLinks.length > 0 && (
3924
+ <nav className="pt-8 border-t border-border space-y-4">
3925
+ <h3 className="text-sm font-semibold uppercase tracking-wider text-muted-foreground">Nearby & Related Hubs</h3>
3926
+ <div className="flex flex-wrap gap-2">
3927
+ {page.neighboringLinks.map((link, idx) => (
3928
+ <Link key={idx} href={link.url} className="px-3 py-1.5 rounded-lg text-xs font-medium bg-secondary text-secondary-foreground hover:bg-primary hover:text-primary-foreground transition duration-150">
3929
+ {link.name}
3930
+ </Link>
3931
+ ))}
3932
+ </div>
3933
+ </nav>
3934
+ )}
3935
+
3936
+ {/* 6. SeedRank Legal Compliance Notice */}
3937
+ {page.disclaimerText && (
3938
+ <aside className="p-4 rounded-lg bg-muted/40 border border-border text-xs text-muted-foreground leading-relaxed">
3939
+ {page.disclaimerText}
3940
+ </aside>
3941
+ )}
3942
+ </main>
3756
3943
  </article>
3757
3944
  );
3758
3945
  }
package/dist/index.mjs CHANGED
@@ -3537,6 +3537,122 @@ class PseoMatrixEngine {
3537
3537
  return allPages;
3538
3538
  }
3539
3539
  }
3540
+ // src/brand-icons.ts
3541
+ var BRAND_ICONS = {
3542
+ facebook: {
3543
+ name: "Facebook",
3544
+ slug: "facebook",
3545
+ category: "social",
3546
+ viewBox: "0 0 24 24",
3547
+ svgPath: "M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z",
3548
+ brandColor: "#1877F2"
3549
+ },
3550
+ instagram: {
3551
+ name: "Instagram",
3552
+ slug: "instagram",
3553
+ category: "social",
3554
+ viewBox: "0 0 24 24",
3555
+ svgPath: "M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zm0-2.163c-3.259 0-3.667.014-4.947.072-4.358.2-6.78 2.618-6.98 6.98-.059 1.281-.073 1.689-.073 4.948 0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98 1.281.058 1.689.072 4.948.072 3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98-1.281-.059-1.69-.073-4.949-.073zm0 5.838c-3.403 0-6.162 2.759-6.162 6.162s2.759 6.163 6.162 6.163 6.162-2.759 6.162-6.163c0-3.403-2.759-6.162-6.162-6.162zm0 10.162c-2.209 0-4-1.79-4-4 0-2.209 1.791-4 4-4s4 1.791 4 4c0 2.21-1.791 4-4 4zm6.406-11.845c-.796 0-1.441.645-1.441 1.44s.645 1.44 1.441 1.44c.795 0 1.439-.645 1.439-1.44s-.644-1.44-1.439-1.44z",
3556
+ brandColor: "#E4405F"
3557
+ },
3558
+ linkedin: {
3559
+ name: "LinkedIn",
3560
+ slug: "linkedin",
3561
+ category: "social",
3562
+ viewBox: "0 0 24 24",
3563
+ svgPath: "M19 0h-14c-2.761 0-5 2.239-5 5v14c0 2.761 2.239 5 5 5h14c2.762 0 5-2.239 5-5v-14c0-2.761-2.238-5-5-5zm-11 19h-3v-11h3v11zm-1.5-12.268c-.966 0-1.75-.79-1.75-1.764s.784-1.764 1.75-1.764 1.75.79 1.75 1.764-.783 1.764-1.75 1.764zm13.5 12.268h-3v-5.604c0-3.368-4-3.113-4 0v5.604h-3v-11h3v1.765c1.396-2.586 7-2.777 7 2.476v6.759z",
3564
+ brandColor: "#0A66C2"
3565
+ },
3566
+ twitter: {
3567
+ name: "X (Twitter)",
3568
+ slug: "twitter",
3569
+ category: "social",
3570
+ viewBox: "0 0 24 24",
3571
+ svgPath: "M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z",
3572
+ brandColor: "#000000"
3573
+ },
3574
+ youtube: {
3575
+ name: "YouTube",
3576
+ slug: "youtube",
3577
+ category: "social",
3578
+ viewBox: "0 0 24 24",
3579
+ svgPath: "M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z",
3580
+ brandColor: "#FF0000"
3581
+ },
3582
+ tiktok: {
3583
+ name: "TikTok",
3584
+ slug: "tiktok",
3585
+ category: "social",
3586
+ viewBox: "0 0 24 24",
3587
+ svgPath: "M12.525.02c1.31-.02 2.61-.01 3.91-.02.08 1.53.63 3.09 1.75 4.17 1.12 1.11 2.7 1.62 4.24 1.79v4.03c-1.44-.05-2.89-.35-4.2-.97-.57-.26-1.1-.59-1.62-.93-.01 2.92.01 5.84-.02 8.75-.08 1.4-.54 2.79-1.35 3.94-1.31 1.92-3.58 3.17-5.91 3.21-1.43.08-2.86-.31-4.08-1.03-2.02-1.19-3.44-3.37-3.65-5.71-.02-.5-.03-1-.01-1.49.18-1.9 1.12-3.72 2.58-4.96 1.66-1.44 3.98-2.13 6.15-1.72.02 1.48-.04 2.96-.04 4.44-.99-.32-2.15-.23-3.02.37-.63.41-1.11 1.04-1.36 1.75-.21.51-.24 1.07-.14 1.61.24 1.64 1.82 2.89 3.5 2.76 1.25-.04 2.4-1.02 2.68-2.22.12-.55.13-1.12.13-1.68V.02z",
3588
+ brandColor: "#000000"
3589
+ },
3590
+ shopify: {
3591
+ name: "Shopify",
3592
+ slug: "shopify",
3593
+ category: "ecommerce",
3594
+ viewBox: "0 0 24 24",
3595
+ svgPath: "M18.8 6.5l-1.3-.4c-.1-.3-.4-1.1-.7-1.5-.7-.9-1.7-1.4-2.8-1.4-.1 0-.2 0-.3.1l-.8-2.5c-.1-.4-.6-.6-.9-.4l-6.5 2.1c-.2.1-.3.2-.3.4l-.8 2.5-3.3 1c-.7.2-.9.9-.5 1.5l5.5 14.7c.2.4.6.7 1.1.7h11.1c.5 0 .9-.3 1.1-.7l3.6-14.8c.2-.7-.3-1.3-.9-1.2zm-5.7-1.9c.7 0 1.3.4 1.8 1.1.3.4.5 1 .6 1.3l-3.9 1.2 1.5-3.6zm-3.3 1.1l3.5-1.1-1.4 3.4-3.4-1.1 1.3-1.2z",
3596
+ brandColor: "#96BF48"
3597
+ },
3598
+ slack: {
3599
+ name: "Slack",
3600
+ slug: "slack",
3601
+ category: "tech",
3602
+ viewBox: "0 0 24 24",
3603
+ svgPath: "M5.042 15.165a2.528 2.528 0 0 1-2.52 2.523A2.528 2.528 0 0 1 0 15.165a2.527 2.527 0 0 1 2.522-2.52h2.52v2.52zM6.313 15.165a2.527 2.527 0 0 1 2.521-2.52 2.527 2.527 0 0 1 2.521 2.52v6.313A2.528 2.528 0 0 1 8.834 24a2.528 2.528 0 0 1-2.521-2.522v-6.313zM8.834 5.042a2.528 2.528 0 0 1-2.521-2.52A2.528 2.528 0 0 1 8.834 0a2.528 2.528 0 0 1 2.521 2.522v2.52H8.834zM8.834 6.313a2.528 2.528 0 0 1 2.521 2.521 2.528 2.528 0 0 1-2.521 2.521H2.522A2.528 2.528 0 0 1 0 8.834a2.528 2.528 0 0 1 2.522-2.521h6.312zM18.956 8.834a2.528 2.528 0 0 1 2.522-2.521A2.528 2.528 0 0 1 24 8.834a2.528 2.528 0 0 1-2.522 2.521h-2.522V8.834zM17.688 8.834a2.528 2.528 0 0 1-2.523 2.521 2.527 2.527 0 0 1-2.52-2.521V2.522A2.527 2.527 0 0 1 15.165 0a2.528 2.528 0 0 1 2.523 2.522v6.312zM15.165 18.956a2.528 2.528 0 0 1 2.523 2.522A2.528 2.528 0 0 1 15.165 24a2.527 2.527 0 0 1-2.52-2.522v-2.522h2.52zM15.165 17.688a2.527 2.527 0 0 1-2.52-2.523 2.526 2.526 0 0 1 2.52-2.52h6.313A2.527 2.527 0 0 1 24 15.165a2.528 2.528 0 0 1-2.522 2.523h-6.313z",
3604
+ brandColor: "#4A154B"
3605
+ },
3606
+ whatsapp: {
3607
+ name: "WhatsApp",
3608
+ slug: "whatsapp",
3609
+ category: "social",
3610
+ viewBox: "0 0 24 24",
3611
+ svgPath: "M.057 24l1.687-6.163c-1.041-1.804-1.588-3.849-1.587-5.946.003-6.556 5.338-11.891 11.893-11.891 3.181.001 6.167 1.24 8.413 3.488 2.245 2.248 3.481 5.236 3.48 8.414-.003 6.557-5.338 11.892-11.893 11.892-1.99-.001-3.951-.5-5.688-1.448l-6.305 1.654zm6.597-3.807c1.676.995 3.276 1.591 5.392 1.592 5.448 0 9.886-4.434 9.889-9.885.002-5.462-4.415-9.89-9.881-9.892-5.452 0-9.887 4.434-9.889 9.884-.001 2.225.651 3.891 1.746 5.634l-.999 3.648 3.742-.981z",
3612
+ brandColor: "#25D366"
3613
+ },
3614
+ hubspot: {
3615
+ name: "HubSpot",
3616
+ slug: "hubspot",
3617
+ category: "crm",
3618
+ viewBox: "0 0 24 24",
3619
+ svgPath: "M17.48 7.37V4.92c.73-.37 1.23-1.12 1.23-2 0-1.24-1-2.24-2.24-2.24s-2.24 1-2.24 2.24c0 .88.5 1.63 1.23 2v2.45c-1.39.38-2.48 1.48-2.86 2.87H9.28c-.37-.5-1-.83-1.68-.83-.07 0-.15 0-.22.02V7.15c.61-.35 1.02-.99 1.02-1.74 0-1.1-.9-2-2-2s-2 .9-2 2c0 .75.41 1.39 1.02 1.74v2.28c-.68.22-1.19.8-1.31 1.52H2.24c-.2-.58-.75-1-1.4-1C.38 10 0 10.38 0 10.84s.38.84.84.84c.65 0 1.2-.42 1.4-1h1.87c.12.72.63 1.3 1.31 1.52v5.26c-.61.35-1.02.99-1.02 1.74 0 1.1.9 2 2 2s2-.9 2-2c0-.75-.41-1.39-1.02-1.74v-5.26c.07.02.15.02.22.02.68 0 1.31-.33 1.68-.83h3.32c.38 1.39 1.47 2.49 2.86 2.87v2.45c-.73.37-1.23 1.12-1.23 2 0 1.24 1 2.24 2.24 2.24s2.24-1 2.24-2.24c0-.88-.5-1.63-1.23-2v-2.45c1.84-.5 3.23-2.16 3.23-4.14s-1.39-3.64-3.23-4.14zm-1.01 6.13c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2z",
3620
+ brandColor: "#FF7A59"
3621
+ },
3622
+ github: {
3623
+ name: "GitHub",
3624
+ slug: "github",
3625
+ category: "tech",
3626
+ viewBox: "0 0 24 24",
3627
+ svgPath: "M12 0C5.37 0 0 5.37 0 12c0 5.31 3.435 9.795 8.205 11.385.6.105.825-.255.825-.57 0-.285-.015-1.23-.015-2.235-3.015.555-3.795-.735-4.035-1.41-.135-.345-.72-1.41-1.23-1.695-.42-.225-1.02-.78-.015-.795.945-.015 1.62.87 1.845 1.23 1.08 1.815 2.805 1.305 3.495.99.105-.78.42-1.305.765-1.605-2.67-.3-5.46-1.335-5.46-5.925 0-1.305.465-2.385 1.23-3.225-.12-.3-.54-1.53.12-3.18 0 0 1.005-.315 3.3 1.23.96-.27 1.98-.405 3-.405s2.04.135 3 .405c2.295-1.56 3.3-1.23 3.3-1.23.66 1.65.24 2.88.12 3.18.765.84 1.23 1.905 1.23 3.225 0 4.605-2.805 5.625-5.475 5.925.435.375.81 1.095.81 2.22 0 1.605-.015 2.895-.015 3.3 0 .315.225.69.825.57A12.02 12.02 0 0 0 24 12c0-6.63-5.37-12-12-12z",
3628
+ brandColor: "#181717"
3629
+ },
3630
+ google: {
3631
+ name: "Google",
3632
+ slug: "google",
3633
+ category: "tech",
3634
+ viewBox: "0 0 24 24",
3635
+ svgPath: "M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09zM12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23zm-6.16-8.9c-.22-.66-.35-1.36-.35-2.1s.13-1.44.35-2.1V7.06H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.94l2.85-2.22.81-.62zM12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.06l3.66 2.84c.87-2.6 3.3-4.52 6.16-4.52z",
3636
+ brandColor: "#4285F4"
3637
+ }
3638
+ };
3639
+ function resolveBrandIcon(input) {
3640
+ if (!input || typeof input !== "string")
3641
+ return;
3642
+ const clean = input.toLowerCase().replace(/[^a-z0-9]/g, "");
3643
+ for (const [key, icon] of Object.entries(BRAND_ICONS)) {
3644
+ if (clean.includes(key) || clean.includes(icon.slug)) {
3645
+ return icon;
3646
+ }
3647
+ }
3648
+ return;
3649
+ }
3650
+ function renderBrandIconSvg(input, className = "w-5 h-5 inline-block") {
3651
+ const icon = resolveBrandIcon(input);
3652
+ if (!icon)
3653
+ return "";
3654
+ return `<svg class="${className}" viewBox="${icon.viewBox}" fill="currentColor" aria-hidden="true"><path d="${icon.svgPath}"/></svg>`;
3655
+ }
3540
3656
  // src/llm-prompt.ts
3541
3657
  var PSEO_AGENT_SYSTEM_PROMPT = `
3542
3658
  You are the Programmatic SEO Implementation Specialist powered by @lynxflow/seo-engine.
@@ -3544,17 +3660,20 @@ Your role is to configure, resolve, and maintain programmatic SEO pages, XML sit
3544
3660
 
3545
3661
  ---
3546
3662
 
3547
- ### \uD83D\uDEA8 1. CRITICAL RULE: FEATURE DISCOVERY FROM FRONTEND ONLY (NEVER USE BACKEND / PROVIDERS)
3663
+ ### \uD83D\uDEA8 1. CRITICAL RULE: SEMANTIC PRODUCT DISCOVERY FROM THE FRONTEND
3548
3664
 
3549
- When discovering or listing product modules, features, or services to build the SEO matrices:
3665
+ When discovering product modules, features, or services to build the SEO matrices:
3550
3666
  - **❌ NEVER inspect backend API routes, internal database folders, or third-party providers:**
3551
3667
  - DO NOT create programmatic pages for internal plumbing like: \`/api/stripe\`, \`/api/resend\`, \`/api/auth\`, \`/api/d1\`, \`/api/webhooks\`, \`/api/openai\`.
3552
3668
  - DO NOT expose internal infrastructure, vendors, or suppliers (e.g. Stripe, Resend, Cloudflare D1, Better-Auth, Supabase, PostgreSQL drivers) as public product features. End users never search for or buy your internal backend plumbing.
3553
- - **✅ ALWAYS inspect the FRONTEND user-facing interface & commercial value propositions:**
3554
- - **Step 1A - Marketing Navbars & Dropdowns:** Scan \`components/Navbar.tsx\`, \`components/Header.tsx\`, \`components/Navigation.tsx\` to list all primary product modules.
3555
- - **Step 1B - Marketing Feature Pages & Pricing:** Scan \`app/(marketing)/*\`, \`pages/features/*\`, \`app/pricing/*\` to list commercial feature names and pricing tiers.
3556
- - **Step 1C - Dashboard Navigation & User Tools:** Scan \`components/dashboard/*\`, \`components/sidebar/*\` to find actual user workflows.
3557
- - **Step 1D - Extraction Requirement:** For EACH discovered module (or major product branch), create at least 1 programmatic service entry with \`slug\`, \`name\`, \`category\`, \`description\`, \`keyFeatures\`, and \`priceMonthly\`.
3669
+ - **✅ DEEPLY READ & UNDERSTAND THE FRONTEND PRODUCT (SEMANTIC ANALYSIS):**
3670
+ - **Framework-Agnostic Exploration:** Do not look for specific filenames (e.g. \`Navbar.tsx\` or \`Header.tsx\`). Every codebase organizes UI differently (React, Vue, Svelte, Astro, Remix, Next.js, HTML).
3671
+ - **Read the Public Product Pages & User UI:** Read the website's landing pages, public feature descriptions, menus/navigation (whatever they are named), pricing tables, and user dashboard views.
3672
+ - **Understand the Core Value & Workflows:** For every distinct tool or capability of the application:
3673
+ - *What does this module actually do?* (e.g. "Automates quote follow-ups", "Visual drag-and-drop pipeline", "Real-time client portal").
3674
+ - *What pain point does it solve for the end user?*
3675
+ - *Who is the primary persona/industry benefiting from it?*
3676
+ - **Extraction Requirement:** For EACH detected product module or major feature branch, create at least 1 programmatic service entry with \`slug\`, \`name\`, \`category\`, \`description\`, \`keyFeatures\`, and \`priceMonthly\`.
3558
3677
 
3559
3678
  ---
3560
3679
 
@@ -3628,10 +3747,12 @@ export const PSEO_DATASET = {
3628
3747
  };
3629
3748
  \`\`\`
3630
3749
 
3631
- #### File 2: Universal Dynamic Catch-All Route (\`app/[...slug]/page.tsx\`)
3750
+ #### File 2: Ultra-Modern Dynamic Catch-All Route (\`app/[...slug]/page.tsx\`)
3632
3751
  \`\`\`tsx
3633
3752
  import { notFound } from "next/navigation";
3753
+ import Link from "next/link";
3634
3754
  import { matrixEngine, SEO_CONFIG, PSEO_DATASET } from "@/lib/seo";
3755
+ import { renderBrandIconSvg } from "@lynxflow/seo-engine";
3635
3756
 
3636
3757
  export async function generateMetadata({ params }: { params: { slug: string[] } }) {
3637
3758
  const path = "/" + params.slug.join("/");
@@ -3649,12 +3770,75 @@ export default async function ProgrammaticPage({ params }: { params: { slug: str
3649
3770
  const page = pages.find((p) => p.urlPath === path);
3650
3771
  if (!page) notFound();
3651
3772
 
3773
+ // Automatic Brand Icon Detection
3774
+ const brandSvg = renderBrandIconSvg(page.integration?.name || page.competitor?.name || page.service?.name || "");
3775
+
3652
3776
  return (
3653
- <article className="max-w-4xl mx-auto py-12 px-6">
3777
+ <article className="min-h-screen bg-background text-foreground transition-colors duration-200">
3778
+ {/* 1. Official Google Schema.org JSON-LD */}
3654
3779
  <script type="application/ld+json" dangerouslySetInnerHTML={{ __html: JSON.stringify(page.schemaGraph) }} />
3655
- <h1 className="text-4xl font-extrabold">{page.h1}</h1>
3656
- <p className="mt-4 text-xl text-gray-600">{page.description}</p>
3657
- {page.disclaimerText && <aside className="mt-8 p-4 bg-gray-50 border rounded text-xs text-gray-500">{page.disclaimerText}</aside>}
3780
+
3781
+ <main className="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8 py-12 md:py-16 space-y-12">
3782
+ {/* 2. Hero Section with Glassmorphism Badge */}
3783
+ <header className="space-y-6 text-center md:text-left">
3784
+ <div className="inline-flex items-center gap-2 px-3 py-1 rounded-full text-xs font-semibold bg-primary/10 text-primary border border-primary/20 backdrop-blur-md">
3785
+ {brandSvg && <span dangerouslySetInnerHTML={{ __html: brandSvg }} className="w-4 h-4 flex items-center" />}
3786
+ <span>{page.matrixFamily.toUpperCase()}</span>
3787
+ </div>
3788
+
3789
+ <h1 className="text-4xl sm:text-5xl lg:text-6xl font-black tracking-tight leading-tight">
3790
+ {page.h1}
3791
+ </h1>
3792
+ <p className="text-lg sm:text-xl text-muted-foreground max-w-3xl leading-relaxed">
3793
+ {page.description}
3794
+ </p>
3795
+ </header>
3796
+
3797
+ {/* 3. AEO / GEO Direct-Answer Callout Box (Optimized for ChatGPT & Perplexity Citations) */}
3798
+ <section className="p-6 md:p-8 rounded-2xl bg-card border border-border shadow-sm space-y-3" data-geo-extract="true">
3799
+ <div className="flex items-center gap-2 text-primary font-bold text-sm">
3800
+ <span>⚡</span>
3801
+ <span>Direct Summary & Key Takeaways</span>
3802
+ </div>
3803
+ <p className="text-base text-card-foreground leading-relaxed">
3804
+ {page.description}
3805
+ </p>
3806
+ </section>
3807
+
3808
+ {/* 4. Interactive Value & Feature Grid */}
3809
+ <section className="grid grid-cols-1 md:grid-cols-3 gap-6">
3810
+ {(page.service?.keyFeatures || ["Real-time Sync", "Bank-grade Security", "Zero Lock-in"]).map((feat, idx) => (
3811
+ <div key={idx} className="p-6 rounded-xl bg-card/60 border border-border/80 hover:border-primary/50 transition duration-200 space-y-2">
3812
+ <div className="w-8 h-8 rounded-lg bg-primary/10 text-primary flex items-center justify-center font-bold text-sm">
3813
+ 0{idx + 1}
3814
+ </div>
3815
+ <h3 className="font-bold text-lg">{feat}</h3>
3816
+ <p className="text-sm text-muted-foreground">Automated workflows engineered for high-performance scale.</p>
3817
+ </div>
3818
+ ))}
3819
+ </section>
3820
+
3821
+ {/* 5. Geodesic Mesh Linking Footer (Prevents Orphan Pages & Spreads PageRank) */}
3822
+ {page.neighboringLinks && page.neighboringLinks.length > 0 && (
3823
+ <nav className="pt-8 border-t border-border space-y-4">
3824
+ <h3 className="text-sm font-semibold uppercase tracking-wider text-muted-foreground">Nearby & Related Hubs</h3>
3825
+ <div className="flex flex-wrap gap-2">
3826
+ {page.neighboringLinks.map((link, idx) => (
3827
+ <Link key={idx} href={link.url} className="px-3 py-1.5 rounded-lg text-xs font-medium bg-secondary text-secondary-foreground hover:bg-primary hover:text-primary-foreground transition duration-150">
3828
+ {link.name}
3829
+ </Link>
3830
+ ))}
3831
+ </div>
3832
+ </nav>
3833
+ )}
3834
+
3835
+ {/* 6. SeedRank Legal Compliance Notice */}
3836
+ {page.disclaimerText && (
3837
+ <aside className="p-4 rounded-lg bg-muted/40 border border-border text-xs text-muted-foreground leading-relaxed">
3838
+ {page.disclaimerText}
3839
+ </aside>
3840
+ )}
3841
+ </main>
3658
3842
  </article>
3659
3843
  );
3660
3844
  }
@@ -5873,6 +6057,8 @@ var LynxSeo = {
5873
6057
  var src_default = LynxSeo;
5874
6058
  export {
5875
6059
  validateSeoSlug,
6060
+ resolveBrandIcon,
6061
+ renderBrandIconSvg,
5876
6062
  getSeoAgentPrompt,
5877
6063
  src_default as default,
5878
6064
  createLynxSeoEngine,
@@ -5922,6 +6108,7 @@ export {
5922
6108
  CopywritingFrameworksMaster,
5923
6109
  BrandDnaCalendarEngine,
5924
6110
  BacklinksClient,
6111
+ BRAND_ICONS,
5925
6112
  ApiKeyGuardian,
5926
6113
  AiCopilotClient,
5927
6114
  AiBotsLogAnalyzer,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lynxflow/seo-engine",
3
- "version": "1.5.3",
3
+ "version": "1.5.5",
4
4
  "description": "High-Performance Multilingual Programmatic SEO & AI Search Engine SDK",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/index.mjs",
package/src/brand-icons.ts ADDED
@@ -0,0 +1,138 @@
1
+ /**
2
+ * 🎨 Zero-Dependency Brand & Social SVG Icons Resolver
3
+ * Enhances Programmatic SEO pages, OpenGraph banners, and CRO trust elements
4
+ * by automatically injecting official, crisp vector icons for detected brands.
5
+ */
6
+
7
+ export interface BrandIcon {
8
+ name: string;
9
+ slug: string;
10
+ category: "social" | "tech" | "ecommerce" | "crm" | "general";
11
+ viewBox: string;
12
+ svgPath: string;
13
+ brandColor: string;
14
+ }
15
+
16
+ export const BRAND_ICONS: Record<string, BrandIcon> = {
17
+ facebook: {
18
+ name: "Facebook",
19
+ slug: "facebook",
20
+ category: "social",
21
+ viewBox: "0 0 24 24",
22
+ svgPath: "M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z",
23
+ brandColor: "#1877F2",
24
+ },
25
+ instagram: {
26
+ name: "Instagram",
27
+ slug: "instagram",
28
+ category: "social",
29
+ viewBox: "0 0 24 24",
30
+ svgPath: "M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zm0-2.163c-3.259 0-3.667.014-4.947.072-4.358.2-6.78 2.618-6.98 6.98-.059 1.281-.073 1.689-.073 4.948 0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98 1.281.058 1.689.072 4.948.072 3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98-1.281-.059-1.69-.073-4.949-.073zm0 5.838c-3.403 0-6.162 2.759-6.162 6.162s2.759 6.163 6.162 6.163 6.162-2.759 6.162-6.163c0-3.403-2.759-6.162-6.162-6.162zm0 10.162c-2.209 0-4-1.79-4-4 0-2.209 1.791-4 4-4s4 1.791 4 4c0 2.21-1.791 4-4 4zm6.406-11.845c-.796 0-1.441.645-1.441 1.44s.645 1.44 1.441 1.44c.795 0 1.439-.645 1.439-1.44s-.644-1.44-1.439-1.44z",
31
+ brandColor: "#E4405F",
32
+ },
33
+ linkedin: {
34
+ name: "LinkedIn",
35
+ slug: "linkedin",
36
+ category: "social",
37
+ viewBox: "0 0 24 24",
38
+ svgPath: "M19 0h-14c-2.761 0-5 2.239-5 5v14c0 2.761 2.239 5 5 5h14c2.762 0 5-2.239 5-5v-14c0-2.761-2.238-5-5-5zm-11 19h-3v-11h3v11zm-1.5-12.268c-.966 0-1.75-.79-1.75-1.764s.784-1.764 1.75-1.764 1.75.79 1.75 1.764-.783 1.764-1.75 1.764zm13.5 12.268h-3v-5.604c0-3.368-4-3.113-4 0v5.604h-3v-11h3v1.765c1.396-2.586 7-2.777 7 2.476v6.759z",
39
+ brandColor: "#0A66C2",
40
+ },
41
+ twitter: {
42
+ name: "X (Twitter)",
43
+ slug: "twitter",
44
+ category: "social",
45
+ viewBox: "0 0 24 24",
46
+ svgPath: "M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z",
47
+ brandColor: "#000000",
48
+ },
49
+ youtube: {
50
+ name: "YouTube",
51
+ slug: "youtube",
52
+ category: "social",
53
+ viewBox: "0 0 24 24",
54
+ svgPath: "M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z",
55
+ brandColor: "#FF0000",
56
+ },
57
+ tiktok: {
58
+ name: "TikTok",
59
+ slug: "tiktok",
60
+ category: "social",
61
+ viewBox: "0 0 24 24",
62
+ svgPath: "M12.525.02c1.31-.02 2.61-.01 3.91-.02.08 1.53.63 3.09 1.75 4.17 1.12 1.11 2.7 1.62 4.24 1.79v4.03c-1.44-.05-2.89-.35-4.2-.97-.57-.26-1.1-.59-1.62-.93-.01 2.92.01 5.84-.02 8.75-.08 1.4-.54 2.79-1.35 3.94-1.31 1.92-3.58 3.17-5.91 3.21-1.43.08-2.86-.31-4.08-1.03-2.02-1.19-3.44-3.37-3.65-5.71-.02-.5-.03-1-.01-1.49.18-1.9 1.12-3.72 2.58-4.96 1.66-1.44 3.98-2.13 6.15-1.72.02 1.48-.04 2.96-.04 4.44-.99-.32-2.15-.23-3.02.37-.63.41-1.11 1.04-1.36 1.75-.21.51-.24 1.07-.14 1.61.24 1.64 1.82 2.89 3.5 2.76 1.25-.04 2.4-1.02 2.68-2.22.12-.55.13-1.12.13-1.68V.02z",
63
+ brandColor: "#000000",
64
+ },
65
+ shopify: {
66
+ name: "Shopify",
67
+ slug: "shopify",
68
+ category: "ecommerce",
69
+ viewBox: "0 0 24 24",
70
+ svgPath: "M18.8 6.5l-1.3-.4c-.1-.3-.4-1.1-.7-1.5-.7-.9-1.7-1.4-2.8-1.4-.1 0-.2 0-.3.1l-.8-2.5c-.1-.4-.6-.6-.9-.4l-6.5 2.1c-.2.1-.3.2-.3.4l-.8 2.5-3.3 1c-.7.2-.9.9-.5 1.5l5.5 14.7c.2.4.6.7 1.1.7h11.1c.5 0 .9-.3 1.1-.7l3.6-14.8c.2-.7-.3-1.3-.9-1.2zm-5.7-1.9c.7 0 1.3.4 1.8 1.1.3.4.5 1 .6 1.3l-3.9 1.2 1.5-3.6zm-3.3 1.1l3.5-1.1-1.4 3.4-3.4-1.1 1.3-1.2z",
71
+ brandColor: "#96BF48",
72
+ },
73
+ slack: {
74
+ name: "Slack",
75
+ slug: "slack",
76
+ category: "tech",
77
+ viewBox: "0 0 24 24",
78
+ svgPath: "M5.042 15.165a2.528 2.528 0 0 1-2.52 2.523A2.528 2.528 0 0 1 0 15.165a2.527 2.527 0 0 1 2.522-2.52h2.52v2.52zM6.313 15.165a2.527 2.527 0 0 1 2.521-2.52 2.527 2.527 0 0 1 2.521 2.52v6.313A2.528 2.528 0 0 1 8.834 24a2.528 2.528 0 0 1-2.521-2.522v-6.313zM8.834 5.042a2.528 2.528 0 0 1-2.521-2.52A2.528 2.528 0 0 1 8.834 0a2.528 2.528 0 0 1 2.521 2.522v2.52H8.834zM8.834 6.313a2.528 2.528 0 0 1 2.521 2.521 2.528 2.528 0 0 1-2.521 2.521H2.522A2.528 2.528 0 0 1 0 8.834a2.528 2.528 0 0 1 2.522-2.521h6.312zM18.956 8.834a2.528 2.528 0 0 1 2.522-2.521A2.528 2.528 0 0 1 24 8.834a2.528 2.528 0 0 1-2.522 2.521h-2.522V8.834zM17.688 8.834a2.528 2.528 0 0 1-2.523 2.521 2.527 2.527 0 0 1-2.52-2.521V2.522A2.527 2.527 0 0 1 15.165 0a2.528 2.528 0 0 1 2.523 2.522v6.312zM15.165 18.956a2.528 2.528 0 0 1 2.523 2.522A2.528 2.528 0 0 1 15.165 24a2.527 2.527 0 0 1-2.52-2.522v-2.522h2.52zM15.165 17.688a2.527 2.527 0 0 1-2.52-2.523 2.526 2.526 0 0 1 2.52-2.52h6.313A2.527 2.527 0 0 1 24 15.165a2.528 2.528 0 0 1-2.522 2.523h-6.313z",
79
+ brandColor: "#4A154B",
80
+ },
81
+ whatsapp: {
82
+ name: "WhatsApp",
83
+ slug: "whatsapp",
84
+ category: "social",
85
+ viewBox: "0 0 24 24",
86
+ svgPath: "M.057 24l1.687-6.163c-1.041-1.804-1.588-3.849-1.587-5.946.003-6.556 5.338-11.891 11.893-11.891 3.181.001 6.167 1.24 8.413 3.488 2.245 2.248 3.481 5.236 3.48 8.414-.003 6.557-5.338 11.892-11.893 11.892-1.99-.001-3.951-.5-5.688-1.448l-6.305 1.654zm6.597-3.807c1.676.995 3.276 1.591 5.392 1.592 5.448 0 9.886-4.434 9.889-9.885.002-5.462-4.415-9.89-9.881-9.892-5.452 0-9.887 4.434-9.889 9.884-.001 2.225.651 3.891 1.746 5.634l-.999 3.648 3.742-.981z",
87
+ brandColor: "#25D366",
88
+ },
89
+ hubspot: {
90
+ name: "HubSpot",
91
+ slug: "hubspot",
92
+ category: "crm",
93
+ viewBox: "0 0 24 24",
94
+ svgPath: "M17.48 7.37V4.92c.73-.37 1.23-1.12 1.23-2 0-1.24-1-2.24-2.24-2.24s-2.24 1-2.24 2.24c0 .88.5 1.63 1.23 2v2.45c-1.39.38-2.48 1.48-2.86 2.87H9.28c-.37-.5-1-.83-1.68-.83-.07 0-.15 0-.22.02V7.15c.61-.35 1.02-.99 1.02-1.74 0-1.1-.9-2-2-2s-2 .9-2 2c0 .75.41 1.39 1.02 1.74v2.28c-.68.22-1.19.8-1.31 1.52H2.24c-.2-.58-.75-1-1.4-1C.38 10 0 10.38 0 10.84s.38.84.84.84c.65 0 1.2-.42 1.4-1h1.87c.12.72.63 1.3 1.31 1.52v5.26c-.61.35-1.02.99-1.02 1.74 0 1.1.9 2 2 2s2-.9 2-2c0-.75-.41-1.39-1.02-1.74v-5.26c.07.02.15.02.22.02.68 0 1.31-.33 1.68-.83h3.32c.38 1.39 1.47 2.49 2.86 2.87v2.45c-.73.37-1.23 1.12-1.23 2 0 1.24 1 2.24 2.24 2.24s2.24-1 2.24-2.24c0-.88-.5-1.63-1.23-2v-2.45c1.84-.5 3.23-2.16 3.23-4.14s-1.39-3.64-3.23-4.14zm-1.01 6.13c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2z",
95
+ brandColor: "#FF7A59",
96
+ },
97
+ github: {
98
+ name: "GitHub",
99
+ slug: "github",
100
+ category: "tech",
101
+ viewBox: "0 0 24 24",
102
+ svgPath: "M12 0C5.37 0 0 5.37 0 12c0 5.31 3.435 9.795 8.205 11.385.6.105.825-.255.825-.57 0-.285-.015-1.23-.015-2.235-3.015.555-3.795-.735-4.035-1.41-.135-.345-.72-1.41-1.23-1.695-.42-.225-1.02-.78-.015-.795.945-.015 1.62.87 1.845 1.23 1.08 1.815 2.805 1.305 3.495.99.105-.78.42-1.305.765-1.605-2.67-.3-5.46-1.335-5.46-5.925 0-1.305.465-2.385 1.23-3.225-.12-.3-.54-1.53.12-3.18 0 0 1.005-.315 3.3 1.23.96-.27 1.98-.405 3-.405s2.04.135 3 .405c2.295-1.56 3.3-1.23 3.3-1.23.66 1.65.24 2.88.12 3.18.765.84 1.23 1.905 1.23 3.225 0 4.605-2.805 5.625-5.475 5.925.435.375.81 1.095.81 2.22 0 1.605-.015 2.895-.015 3.3 0 .315.225.69.825.57A12.02 12.02 0 0 0 24 12c0-6.63-5.37-12-12-12z",
103
+ brandColor: "#181717",
104
+ },
105
+ google: {
106
+ name: "Google",
107
+ slug: "google",
108
+ category: "tech",
109
+ viewBox: "0 0 24 24",
110
+ svgPath: "M22.56 12.25c0-.78-.07-1.53-.2-2.25H12v4.26h5.92c-.26 1.37-1.04 2.53-2.21 3.31v2.77h3.57c2.08-1.92 3.28-4.74 3.28-8.09zM12 23c2.97 0 5.46-.98 7.28-2.66l-3.57-2.77c-.98.66-2.23 1.06-3.71 1.06-2.86 0-5.29-1.93-6.16-4.53H2.18v2.84C3.99 20.53 7.7 23 12 23zm-6.16-8.9c-.22-.66-.35-1.36-.35-2.1s.13-1.44.35-2.1V7.06H2.18C1.43 8.55 1 10.22 1 12s.43 3.45 1.18 4.94l2.85-2.22.81-.62zM12 5.38c1.62 0 3.06.56 4.21 1.64l3.15-3.15C17.45 2.09 14.97 1 12 1 7.7 1 3.99 3.47 2.18 7.06l3.66 2.84c.87-2.6 3.3-4.52 6.16-4.52z",
111
+ brandColor: "#4285F4",
112
+ },
113
+ };
114
+
115
+ /**
116
+ * Resolves a brand SVG vector from text matching or keywords.
117
+ */
118
+ export function resolveBrandIcon(input: string): BrandIcon | undefined {
119
+ if (!input || typeof input !== "string") return undefined;
120
+ const clean = input.toLowerCase().replace(/[^a-z0-9]/g, "");
121
+
122
+ for (const [key, icon] of Object.entries(BRAND_ICONS)) {
123
+ if (clean.includes(key) || clean.includes(icon.slug)) {
124
+ return icon;
125
+ }
126
+ }
127
+ return undefined;
128
+ }
129
+
130
+ /**
131
+ * Returns raw inline SVG markup for a brand icon.
132
+ */
133
+ export function renderBrandIconSvg(input: string, className: string = "w-5 h-5 inline-block"): string {
134
+ const icon = resolveBrandIcon(input);
135
+ if (!icon) return "";
136
+
137
+ return `<svg class="${className}" viewBox="${icon.viewBox}" fill="currentColor" aria-hidden="true"><path d="${icon.svgPath}"/></svg>`;
138
+ }
package/src/index.ts CHANGED
@@ -14,6 +14,7 @@ export * from "./engine";
14
14
  export * from "./slug-engine";
15
15
  export * from "./legal-disclaimers";
16
16
  export * from "./matrix-engine";
17
+ export * from "./brand-icons";
17
18
  export * from "./llm-prompt";
18
19
  export * from "./auth-key";
19
20
  export * from "./token-quota-manager";
package/src/llm-prompt.ts CHANGED
@@ -10,17 +10,20 @@ Your role is to configure, resolve, and maintain programmatic SEO pages, XML sit
10
10
 
11
11
  ---
12
12
 
13
- ### 🚨 1. CRITICAL RULE: FEATURE DISCOVERY FROM FRONTEND ONLY (NEVER USE BACKEND / PROVIDERS)
13
+ ### 🚨 1. CRITICAL RULE: SEMANTIC PRODUCT DISCOVERY FROM THE FRONTEND
14
14
 
15
- When discovering or listing product modules, features, or services to build the SEO matrices:
15
+ When discovering product modules, features, or services to build the SEO matrices:
16
16
  - **❌ NEVER inspect backend API routes, internal database folders, or third-party providers:**
17
17
  - DO NOT create programmatic pages for internal plumbing like: \`/api/stripe\`, \`/api/resend\`, \`/api/auth\`, \`/api/d1\`, \`/api/webhooks\`, \`/api/openai\`.
18
18
  - DO NOT expose internal infrastructure, vendors, or suppliers (e.g. Stripe, Resend, Cloudflare D1, Better-Auth, Supabase, PostgreSQL drivers) as public product features. End users never search for or buy your internal backend plumbing.
19
- - **✅ ALWAYS inspect the FRONTEND user-facing interface & commercial value propositions:**
20
- - **Step 1A - Marketing Navbars & Dropdowns:** Scan \`components/Navbar.tsx\`, \`components/Header.tsx\`, \`components/Navigation.tsx\` to list all primary product modules.
21
- - **Step 1B - Marketing Feature Pages & Pricing:** Scan \`app/(marketing)/*\`, \`pages/features/*\`, \`app/pricing/*\` to list commercial feature names and pricing tiers.
22
- - **Step 1C - Dashboard Navigation & User Tools:** Scan \`components/dashboard/*\`, \`components/sidebar/*\` to find actual user workflows.
23
- - **Step 1D - Extraction Requirement:** For EACH discovered module (or major product branch), create at least 1 programmatic service entry with \`slug\`, \`name\`, \`category\`, \`description\`, \`keyFeatures\`, and \`priceMonthly\`.
19
+ - **✅ DEEPLY READ & UNDERSTAND THE FRONTEND PRODUCT (SEMANTIC ANALYSIS):**
20
+ - **Framework-Agnostic Exploration:** Do not look for specific filenames (e.g. \`Navbar.tsx\` or \`Header.tsx\`). Every codebase organizes UI differently (React, Vue, Svelte, Astro, Remix, Next.js, HTML).
21
+ - **Read the Public Product Pages & User UI:** Read the website's landing pages, public feature descriptions, menus/navigation (whatever they are named), pricing tables, and user dashboard views.
22
+ - **Understand the Core Value & Workflows:** For every distinct tool or capability of the application:
23
+ - *What does this module actually do?* (e.g. "Automates quote follow-ups", "Visual drag-and-drop pipeline", "Real-time client portal").
24
+ - *What pain point does it solve for the end user?*
25
+ - *Who is the primary persona/industry benefiting from it?*
26
+ - **Extraction Requirement:** For EACH detected product module or major feature branch, create at least 1 programmatic service entry with \`slug\`, \`name\`, \`category\`, \`description\`, \`keyFeatures\`, and \`priceMonthly\`.
24
27
 
25
28
  ---
26
29
 
@@ -94,10 +97,12 @@ export const PSEO_DATASET = {
94
97
  };
95
98
  \`\`\`
96
99
 
97
- #### File 2: Universal Dynamic Catch-All Route (\`app/[...slug]/page.tsx\`)
100
+ #### File 2: Ultra-Modern Dynamic Catch-All Route (\`app/[...slug]/page.tsx\`)
98
101
  \`\`\`tsx
99
102
  import { notFound } from "next/navigation";
103
+ import Link from "next/link";
100
104
  import { matrixEngine, SEO_CONFIG, PSEO_DATASET } from "@/lib/seo";
105
+ import { renderBrandIconSvg } from "@lynxflow/seo-engine";
101
106
 
102
107
  export async function generateMetadata({ params }: { params: { slug: string[] } }) {
103
108
  const path = "/" + params.slug.join("/");
@@ -115,12 +120,75 @@ export default async function ProgrammaticPage({ params }: { params: { slug: str
115
120
  const page = pages.find((p) => p.urlPath === path);
116
121
  if (!page) notFound();
117
122
 
123
+ // Automatic Brand Icon Detection
124
+ const brandSvg = renderBrandIconSvg(page.integration?.name || page.competitor?.name || page.service?.name || "");
125
+
118
126
  return (
119
- <article className="max-w-4xl mx-auto py-12 px-6">
127
+ <article className="min-h-screen bg-background text-foreground transition-colors duration-200">
128
+ {/* 1. Official Google Schema.org JSON-LD */}
120
129
  <script type="application/ld+json" dangerouslySetInnerHTML={{ __html: JSON.stringify(page.schemaGraph) }} />
121
- <h1 className="text-4xl font-extrabold">{page.h1}</h1>
122
- <p className="mt-4 text-xl text-gray-600">{page.description}</p>
123
- {page.disclaimerText && <aside className="mt-8 p-4 bg-gray-50 border rounded text-xs text-gray-500">{page.disclaimerText}</aside>}
130
+
131
+ <main className="max-w-5xl mx-auto px-4 sm:px-6 lg:px-8 py-12 md:py-16 space-y-12">
132
+ {/* 2. Hero Section with Glassmorphism Badge */}
133
+ <header className="space-y-6 text-center md:text-left">
134
+ <div className="inline-flex items-center gap-2 px-3 py-1 rounded-full text-xs font-semibold bg-primary/10 text-primary border border-primary/20 backdrop-blur-md">
135
+ {brandSvg && <span dangerouslySetInnerHTML={{ __html: brandSvg }} className="w-4 h-4 flex items-center" />}
136
+ <span>{page.matrixFamily.toUpperCase()}</span>
137
+ </div>
138
+
139
+ <h1 className="text-4xl sm:text-5xl lg:text-6xl font-black tracking-tight leading-tight">
140
+ {page.h1}
141
+ </h1>
142
+ <p className="text-lg sm:text-xl text-muted-foreground max-w-3xl leading-relaxed">
143
+ {page.description}
144
+ </p>
145
+ </header>
146
+
147
+ {/* 3. AEO / GEO Direct-Answer Callout Box (Optimized for ChatGPT & Perplexity Citations) */}
148
+ <section className="p-6 md:p-8 rounded-2xl bg-card border border-border shadow-sm space-y-3" data-geo-extract="true">
149
+ <div className="flex items-center gap-2 text-primary font-bold text-sm">
150
+ <span>⚡</span>
151
+ <span>Direct Summary & Key Takeaways</span>
152
+ </div>
153
+ <p className="text-base text-card-foreground leading-relaxed">
154
+ {page.description}
155
+ </p>
156
+ </section>
157
+
158
+ {/* 4. Interactive Value & Feature Grid */}
159
+ <section className="grid grid-cols-1 md:grid-cols-3 gap-6">
160
+ {(page.service?.keyFeatures || ["Real-time Sync", "Bank-grade Security", "Zero Lock-in"]).map((feat, idx) => (
161
+ <div key={idx} className="p-6 rounded-xl bg-card/60 border border-border/80 hover:border-primary/50 transition duration-200 space-y-2">
162
+ <div className="w-8 h-8 rounded-lg bg-primary/10 text-primary flex items-center justify-center font-bold text-sm">
163
+ 0{idx + 1}
164
+ </div>
165
+ <h3 className="font-bold text-lg">{feat}</h3>
166
+ <p className="text-sm text-muted-foreground">Automated workflows engineered for high-performance scale.</p>
167
+ </div>
168
+ ))}
169
+ </section>
170
+
171
+ {/* 5. Geodesic Mesh Linking Footer (Prevents Orphan Pages & Spreads PageRank) */}
172
+ {page.neighboringLinks && page.neighboringLinks.length > 0 && (
173
+ <nav className="pt-8 border-t border-border space-y-4">
174
+ <h3 className="text-sm font-semibold uppercase tracking-wider text-muted-foreground">Nearby & Related Hubs</h3>
175
+ <div className="flex flex-wrap gap-2">
176
+ {page.neighboringLinks.map((link, idx) => (
177
+ <Link key={idx} href={link.url} className="px-3 py-1.5 rounded-lg text-xs font-medium bg-secondary text-secondary-foreground hover:bg-primary hover:text-primary-foreground transition duration-150">
178
+ {link.name}
179
+ </Link>
180
+ ))}
181
+ </div>
182
+ </nav>
183
+ )}
184
+
185
+ {/* 6. SeedRank Legal Compliance Notice */}
186
+ {page.disclaimerText && (
187
+ <aside className="p-4 rounded-lg bg-muted/40 border border-border text-xs text-muted-foreground leading-relaxed">
188
+ {page.disclaimerText}
189
+ </aside>
190
+ )}
191
+ </main>
124
192
  </article>
125
193
  );
126
194
  }