Source: VelvetRopeLeadCard.jsx
import React from 'react';
export default function VelvetRopeLeadCard({
title = 'SAS QUALIFICATION VELVET ROPE',
sector = 'BTP & Immobilier',
frictionLevel = 'Haute Friction Intentionnelle',
targetSiren = '984 512 809',
accessState = 'SAS VERROUILLÉ'
}) {
return (
<div style={{
background: '#121214',
border: '1px solid #27272A',
borderRadius: '8px',
padding: '24px',
maxWidth: '440px',
color: '#F4F4F5',
fontFamily: 'Inter Tight, -apple-system, sans-serif'
}}>
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '14px' }}>
<span style={{ fontSize: '11px', color: '#A1A1AA', fontFamily: 'Geist Mono, monospace' }}>{title}</span>
<span style={{ fontSize: '10px', background: 'rgba(239, 68, 68, 0.1)', color: '#EF4444', border: '1px solid rgba(239, 68, 68, 0.2)', padding: '3px 8px', borderRadius: '4px', fontFamily: 'Geist Mono, monospace' }}>
{accessState}
</span>
</div>
<div style={{ background: '#0A0A0B', border: '1px solid #27272A', padding: '14px', borderRadius: '6px', marginBottom: '16px' }}>
<div style={{ fontSize: '10px', color: '#A1A1AA', textTransform: 'uppercase', marginBottom: '4px' }}>Secteur Cible</div>
<div style={{ fontSize: '15px', fontWeight: 600, color: '#FFFFFF' }}>{sector}</div>
<div style={{ fontSize: '11px', color: '#71717A', marginTop: '4px', fontFamily: 'Geist Mono, monospace' }}>Régime : {frictionLevel}</div>
</div>
<div style={{ borderTop: '1px solid #27272A', paddingTop: '14px', marginBottom: '16px' }}>
<div style={{ display: 'flex', justifyContent: 'space-between', fontSize: '12px', marginBottom: '6px' }}>
<span style={{ color: '#A1A1AA' }}>Entité validée :</span>
<span style={{ color: '#FFFFFF', fontFamily: 'Geist Mono, monospace' }}>SIREN {targetSiren}</span>
</div>
<div style={{ display: 'flex', justifyContent: 'space-between', fontSize: '12px' }}>
<span style={{ color: '#A1A1AA' }}>Filtrage PII Edge :</span>
<span style={{ color: '#22C55E', fontFamily: 'Geist Mono, monospace' }}>TIER-0 ACTIF</span>
</div>
</div>
<button style={{
width: '100%',
background: '#F4F4F5',
color: '#0A0A0B',
border: 'none',
borderRadius: '6px',
padding: '10px 16px',
fontSize: '12px',
fontWeight: 600,
letterSpacing: '0.02em',
cursor: 'pointer'
}}>
DÉVERROUILLER LE DIAGNOSTIC CLINIQUE
</button>
</div>
);
}