feat(ui): vague 4 — la zone de dépôt répond, l'or devient lisible, tarifs binaires, avant/après réel

Zone de dépôt : le contour s'allume en doré et la carte s'agrandit
quand on la survole avec un fichier (l'information existait, elle
n'était jamais affichée).

Or lisible : nouveau jeton « or encre » (#8B6F47) pour les textes,
l'or clair reste aux traits, fonds et au mode sombre ; 52 textes dorés
convertis, pastille comprises ; plus aucun texte sous 10 px
(8,5 px → 11 px dans le sélecteur de moteurs).

Tarifs : le choix redevient binaire — les trois abonnements payants en
grandes cartes, le gratuit en ligne discrète au-dessus, le sur mesure
en ligne dorée dessous. Le tableau comparatif complet reste dessous.

Accueil : le mur de six cartes génériques est remplacé par un vrai
avant/après — une page « Cahier des charges — Traitement d'air » à
côté de sa traduction anglaise, structure identique au mot près
(terme technique en gras des deux côtés), sceau « Même mise en page,
mot pour mot » entre les deux, et trois preuves précises (SmartArt
reconstruits, séries de graphiques traduites, tables des matières
régénérées) à la place des promesses vagues.

frontend/src/app/pricing/page.tsx

@@ -574,8 +574,21 @@ export default function PricingPage() {
           <PricingDataSkeleton />
         ) : (
           <>
-        <div className="grid md:grid-cols-3 lg:grid-cols-5 gap-6 items-stretch">
-          {plans.map((plan) => {
+        {/* Essai gratuit : une ligne discrète au-dessus du choix payant */}
+        <div className="mb-8 flex flex-col items-center justify-between gap-4 rounded-2xl border border-black/[0.06] bg-brand-muted/40 px-6 py-4 dark:border-white/[0.08] dark:bg-white/5 sm:flex-row">
+          <p className="text-sm font-light text-brand-dark/70 dark:text-white/70">
+            {t('pricing.freeBand.text')}
+          </p>
+          <Link
+            href="/auth/register"
+            className="shrink-0 rounded-xl border border-black/10 px-5 py-2 text-[11px] font-bold uppercase tracking-wider text-brand-dark/70 transition-colors hover:bg-black/5 dark:border-white/15 dark:text-white/70 dark:hover:bg-white/10"
+          >
+            {t('pricing.freeBand.cta')}
+          </Link>
+        </div>
+
+        <div className="grid gap-6 md:grid-cols-3 items-stretch">
+          {plans.filter((p) => !['free', 'enterprise'].includes(p.id)).map((plan) => {
             const Icon = PLAN_ICONS[plan.id] ?? Sparkles;
             const price = displayPrice(plan);
             const isCurrent = currentPlan === plan.id;
@@ -595,7 +608,7 @@ export default function PricingPage() {
                   {(plan.popular || isCurrent) && (
                     <div className="absolute top-5 right-5 flex gap-2">
                       {plan.badge && (
-                        <span className="rounded-full border border-brand-accent/30 bg-brand-accent/10 px-3 py-1 text-[10px] font-bold uppercase tracking-wider text-brand-accent">
+                        <span className="rounded-full border border-brand-accent/30 bg-brand-accent/10 px-3 py-1 text-[10px] font-bold uppercase tracking-wider text-brand-goldink dark:text-brand-accent">
                           {t(plan.badge)}
                         </span>
                       )}
@@ -614,7 +627,7 @@ export default function PricingPage() {
 
                   {/* Icon + plan name */}
                   <div className="mb-4 flex items-center gap-3">
-                    <div className="flex size-10 items-center justify-center rounded-xl bg-brand-muted text-brand-accent dark:bg-white/10">
+                    <div className="flex size-10 items-center justify-center rounded-xl bg-brand-muted text-brand-goldink dark:text-brand-accent dark:bg-white/10">
                       <Icon size={18} />
                     </div>
                     <span className="text-xs font-bold uppercase tracking-[0.15em] text-brand-dark/70 dark:text-white/70">
@@ -770,6 +783,19 @@ export default function PricingPage() {
           })}
         </div>
 
+        {/* Sur mesure : une ligne discrète sous le choix payant */}
+        <div className="mt-8 flex flex-col items-center justify-between gap-4 rounded-2xl border border-brand-accent/25 bg-brand-accent/[0.06] px-6 py-4 dark:border-brand-accent/20 dark:bg-brand-accent/10 sm:flex-row">
+          <p className="text-sm font-light text-brand-dark/70 dark:text-white/70">
+            {t('pricing.enterpriseBand.text')}
+          </p>
+          <a
+            href={`mailto:${SUPPORT_EMAIL}?subject=${encodeURIComponent(t('pricing.enterprise.subject'))}`}
+            className="shrink-0 rounded-xl border border-brand-accent/40 px-5 py-2 text-[11px] font-bold uppercase tracking-wider text-brand-goldink transition-colors hover:bg-brand-accent/10 dark:text-brand-accent"
+          >
+            {t('pricing.enterpriseBand.cta')}
+          </a>
+        </div>
+
         {/* ── Feature comparison table ── */}
         <div className="mt-20">
           <h2 className="text-3xl font-bold text-center mb-2">{t('pricing.comparison.title')}</h2>