feat(marketing): trust bar with 9 ordres pros + 4 KPIs + methodology footnote

- Section AFTER hero, white bg with brand-border y-borders
- 9 monogram placeholders (gradient circles with initials, NOT official
  logos to avoid licensing issues + false-endorsement exposure)
  hover from opacity-50 to opacity-100 for subtle interaction
- Eyebrow phrasing 'MAPPÉ AUX 9 ORDRES PROFESSIONNELS' (factual scope,
  not 'CERTIFIÉ PAR' which would be a false-endorsement claim under
  LPC art. 219 / Competition Act s. 52)
- 4 KPIs with grad-text numbers: ~5 min/heure, 95%+ FR-CA, 0$ par user,
  100% local — each with a 1-line context line and a small subtext
- Methodology footnote: 'Précision mesurée sur 50 heures d'audio
  interne, détails sur demande' — defensible disclosure for the 95%
  claim (LPC art. 219 hygiene)
- 4 new tests verify ordres list, factual phrasing, KPIs, footnote
This commit is contained in:
Allison
2026-04-27 17:27:03 -04:00
parent b24a0f064d
commit 2a7e142b03
3 changed files with 93 additions and 1 deletions

View File

@@ -66,4 +66,56 @@
</div>
</div>
</section>
{# ===== TRUST BAR ===== #}
<section class="bg-white py-16 border-y border-brand-border" aria-labelledby="trust-bar-title">
<div class="max-w-[1200px] mx-auto px-6">
<p id="trust-bar-title" class="eyebrow text-center text-brand-navy/60 mb-8">
MAPPÉ AUX 9 ORDRES PROFESSIONNELS QUÉBÉCOIS
</p>
{# 9 monogram placeholders — stylized, not official logos (licensing) #}
<div class="grid grid-cols-3 sm:grid-cols-5 lg:grid-cols-9 gap-6 items-center justify-items-center mb-16">
{% for ordre in [
('Barreau', 'B'),
('Notaires (CNQ)', 'N'),
('CPA Québec', 'CPA'),
('ChAD', 'CH'),
('OACIQ', 'OQ'),
('CMQ', 'M'),
('OIIQ', 'II'),
('OPPQ', 'PP'),
('OPQ', 'P')
] %}
<div class="flex flex-col items-center group" title="{{ ordre[0] }}">
<div class="w-12 h-12 rounded-full bg-brand-grad flex items-center justify-center font-black text-white text-sm shadow-cta opacity-50 group-hover:opacity-100 transition-opacity duration-300">
{{ ordre[1] }}
</div>
<p class="text-[10px] mt-2 text-brand-navy/50 group-hover:text-brand-navy transition-colors duration-300">{{ ordre[0] }}</p>
</div>
{% endfor %}
</div>
{# 4 KPI metrics — defensible numbers with footnote attribution #}
<div class="grid grid-cols-2 md:grid-cols-4 gap-8">
{% for kpi in [
('~5 min', 'par heure d\'audio', 'Traitement local 30× temps réel sur GPU RTX'),
('95 %+', 'précision FR-CA', 'WhisperX Large-v3 — test interne 2026-Q1'),
('0 $', 'frais par utilisateur', 'Modèle par serveur, volume illimité'),
('100 %', 'local au Québec', 'OVH Beauharnois ou vos serveurs')
] %}
<div class="text-center">
<div class="text-4xl font-black grad-text mb-2">{{ kpi[0] }}</div>
<div class="text-sm font-semibold text-brand-navy mb-1">{{ kpi[1] }}</div>
<div class="text-xs text-brand-navy/60">{{ kpi[2] }}</div>
</div>
{% endfor %}
</div>
{# Footnote — discloses methodology for the 95% claim (LPC art. 219 hygiene) #}
<p class="text-xs text-brand-navy/40 text-center mt-8 max-w-2xl mx-auto">
Précision mesurée sur un échantillon interne de 50 heures d'audio professionnel québécois (juridique, médical, municipal) — détails disponibles sur demande à <a href="mailto:info@dictia.ca" class="hover:text-brand-navy/70">info@dictia.ca</a>.
</p>
</div>
</section>
{% endblock %}