adjusting prmeium upgrade

Author: jdv

crowdsec-docs/src/components/premium-upgrade/feature-card.tsx

@@ -2,6 +2,7 @@ import Link from "@docusaurus/Link";
 import React from "react";
 
 export interface FeatureCardProps {
+	id?: string;
 	title: string;
 	metric?: string;
 	description: string;
@@ -35,6 +36,7 @@ const categoryColors = {
 };
 
 export const FeatureCard = ({
+	id,
 	title,
 	metric,
 	description,
@@ -46,8 +48,12 @@ export const FeatureCard = ({
 }: FeatureCardProps): React.JSX.Element => {
 	const colors = categoryColors[category];
 
+	// Generate ID from title if not explicitly provided
+	const generatedId = id || title.toLowerCase().replace(/\s+/g, '-').replace(/[^\w-]/g, '');
+
 	const cardContent = (
 		<div
+			id={generatedId}
 			className={`
 				h-full border border-solid border-border rounded-lg p-5 bg-card
 				hover:shadow-md hover:border-primary/30 transition-all duration-200
@@ -103,6 +109,7 @@ export const FeatureCard = ({
 };
 
 export interface HighlightCardProps {
+	id?: string;
 	title: string;
 	description: string;
 	stats?: Array<{
@@ -113,9 +120,12 @@ export interface HighlightCardProps {
 	category?: "protection" | "scale" | "monitoring" | "intelligence";
 }
 
-export const HighlightCard = ({ title, description, stats, link, category = "protection" }: HighlightCardProps): React.JSX.Element => {
+export const HighlightCard = ({ id, title, description, stats, link, category = "protection" }: HighlightCardProps): React.JSX.Element => {
+	// Generate ID from title if not explicitly provided
+	const generatedId = id || title.toLowerCase().replace(/\s+/g, '-').replace(/[^\w-]/g, '');
+
 	const content = (
-		<div className="border border-solid border-primary/30 rounded-lg p-6 bg-gradient-to-r from-primary/5 to-transparent hover:shadow-md transition-all">
+		<div id={generatedId} className="border border-solid border-primary/30 rounded-lg p-6 bg-gradient-to-r from-primary/5 to-transparent hover:shadow-md transition-all">
 			<h4 className="font-semibold text-lg mb-2 text-gray-900 dark:text-gray-900">{title}</h4>
 			<p className="text-sm text-gray-600 dark:text-gray-700 mb-4 leading-relaxed">{description}</p>
 			{stats && stats.length > 0 && (

crowdsec-docs/unversioned/console/premium_upgrade.mdx

@@ -16,8 +16,8 @@ export const personaOptions = [
 		value: "devops",
 		icon: "⚙️",
 		label: "DevOps / SRE",
-		description: "Managing infrastructure solo or in small teams, focused on reducing noise and blocking more threats.",
-		tag: "Solo · SME"
+		description: "Managing solo-infra or in small teams, focused on reducing noise and blocking more threats.",
+		tag: "Solo · SMB"
 	},
 	{
 		value: "secops",
@@ -37,11 +37,13 @@ export const personaOptions = [
 
 <div style={{marginBottom: '2rem'}}>
 
-# Find Premium Features **Made for You**
+## Find Premium Features **Made for You**
 
-CrowdSec Premium features are designed for users who have **commercial usage** of the Console or organizations that want to **enhance the security posture** of their infrastructure. Premium unlocks advanced capabilities based on your role.
+**Premium** is designed if you're seeking **enhanced protection** or want to unlock **commercial use** with advanced features.  
+**Community** covers the basics, **Premium** scales with your projects' needs.
 
-**Select your profile below** to see only the features that matter most to you.
+**Select your profile below** to see only the features that matter most to you.   
+*Or directly browse all premium features in the [**Features Overview**](/u/console/premium_upgrade/features_overview).*
 
 </div>
 
@@ -53,26 +55,26 @@ CrowdSec Premium features are designed for users who have **commercial usage** o
 >
 <TabItem value="devops">
 
-## Solo or Small Team Infrastructure Management
+### Solo or Small Team Infrastructure Management
 
 **Best for:** Individual engineers or small teams managing infrastructure, focused on reducing noise and blocking more threats efficiently.
 
 ---
 
-### 🛡️ Enhanced Protection
+#### 🛡️ Enhanced Protection
 
 <div className="grid grid-cols-1 md:grid-cols-2 gap-4 mb-6">
 
 <FeatureCard
 	title="Extended Community Blocklist"
 	metric="3k → 50k IPs"
 	category="protection"
-	description="Receive the top 50,000 most aggressive attackers targeting services like yours (up from 3,000 in Community). More attackers blocked before they reach your servers."
+	description="Receive the top 50k most aggressive attackers targeting services like yours (up from 3,000 in Community). More attackers blocked before they reach your servers."
 	comparison={{
 		before: "Community: top 3k",
 		after: "Premium: top 50k (×16)"
 	}}
-	link="/u/console/blocklists/intro"
+	link="/docs/central_api/community_blocklist/#community-blocklist-premium"
 />
 
 <FeatureCard
@@ -115,7 +117,7 @@ CrowdSec Premium features are designed for users who have **commercial usage** o
 
 ---
 
-### ⚡ Automation & Sync
+#### ⚡ Automation & Sync
 
 <HighlightCard
 	title="Remediation Sync"
@@ -143,7 +145,7 @@ CrowdSec Premium features are designed for users who have **commercial usage** o
 
 ---
 
-### 📊 Monitoring
+#### 📊 Monitoring
 
 <FeatureCard
 	title="Am I Under Attack"
@@ -155,7 +157,7 @@ CrowdSec Premium features are designed for users who have **commercial usage** o
 
 ---
 
-### 💡 Why Premium for DevOps/SRE?
+#### 💡 Why Premium for DevOps/SRE?
 
 - **Less noise, more signal**: Filter out scanner noise and focus on real threats
 - **Automation-first**: Sync decisions automatically, enroll engines without manual steps
@@ -166,13 +168,13 @@ CrowdSec Premium features are designed for users who have **commercial usage** o
 
 <TabItem value="secops" label="🛡️ SecOps / Blue Team">
 
-## Team Collaboration & Investigation
+### Team Collaboration & Investigation
 
 **Best for:** Security teams that need to collaborate, investigate incidents, and maintain data retention for compliance and audits.
 
 ---
 
-### 👥 Team Collaboration
+#### 👥 Team Collaboration
 
 <div className="grid grid-cols-1 md:grid-cols-2 gap-4 mb-6">
 
@@ -204,7 +206,7 @@ CrowdSec Premium features are designed for users who have **commercial usage** o
 
 ---
 
-### 🔍 Investigation & Forensics
+#### 🔍 Investigation & Forensics
 
 <div className="grid grid-cols-1 md:grid-cols-2 gap-4 mb-6">
 
@@ -255,7 +257,7 @@ CrowdSec Premium features are designed for users who have **commercial usage** o
 
 ---
 
-### 🔔 Monitoring & Alerting
+#### 🔔 Monitoring & Alerting
 
 <div className="grid grid-cols-1 md:grid-cols-2 gap-4 mb-6">
 
@@ -283,7 +285,7 @@ CrowdSec Premium features are designed for users who have **commercial usage** o
 
 ---
 
-### 🛡️ Enhanced Protection
+#### 🛡️ Enhanced Protection
 
 <div className="grid grid-cols-1 md:grid-cols-2 gap-4 mb-6">
 
@@ -315,7 +317,7 @@ CrowdSec Premium features are designed for users who have **commercial usage** o
 
 ---
 
-### 💡 Why Premium for SecOps/Blue Team?
+#### 💡 Why Premium for SecOps/Blue Team?
 
 - **Team collaboration**: Multiple seats with role-based access
 - **Long-term retention**: 1 year of alerts for compliance and forensics
@@ -326,13 +328,13 @@ CrowdSec Premium features are designed for users who have **commercial usage** o
 
 <TabItem value="msp" label="🏢 MSP / Integrator">
 
-## Multi-Tenant Management & Automation
+### Multi-Tenant Management & Automation
 
 **Best for:** MSPs and integrators managing security for multiple clients, requiring isolation, automation, and API-driven workflows.
 
 ---
 
-### 🏗️ Multi-Tenancy & Isolation
+#### 🏗️ Multi-Tenancy & Isolation
 
 <HighlightCard
 	title="Multi-Organization"
@@ -346,7 +348,7 @@ CrowdSec Premium features are designed for users who have **commercial usage** o
 
 ---
 
-### 🤖 Automation & API
+#### 🤖 Automation & API
 
 <div className="grid grid-cols-1 md:grid-cols-2 gap-4 mb-6">
 
@@ -394,7 +396,7 @@ CrowdSec Premium features are designed for users who have **commercial usage** o
 
 ---
 
-### 👥 Team & Client Management
+#### 👥 Team & Client Management
 
 <div className="grid grid-cols-1 md:grid-cols-2 gap-4 mb-6">
 
@@ -418,7 +420,7 @@ CrowdSec Premium features are designed for users who have **commercial usage** o
 
 ---
 
-### 🛡️ Protection at Scale
+#### 🛡️ Protection at Scale
 
 <div className="grid grid-cols-1 md:grid-cols-2 gap-4 mb-6">
 
@@ -457,7 +459,7 @@ CrowdSec Premium features are designed for users who have **commercial usage** o
 
 ---
 
-### 💡 Why Premium for MSPs?
+#### 💡 Why Premium for MSPs?
 
 - **Multi-tenant architecture**: Complete client isolation with unlimited organizations
 - **API-first**: Full Service API for automation and integration

crowdsec-docs/unversioned/console/premium_upgrade/features_overview.mdx

@@ -122,7 +122,7 @@ Make the best use of the premium features for your needs in: **Scaling, Multi-te
 		before: "Community: top 3k",
 		after: "Premium: top 50k (×16)"
 	}}
-	link="/u/console/blocklists/intro"
+	link="/docs/central_api/community_blocklist/#community-blocklist-lite"
 />
 
 <FeatureCard