Waimia.

Hero Header Sections

hero-problem-index

stable Bibliothèque Contenu inline (instance)

Énoncer la proposition de valeur

Hero d'index par problème : décor SVG rectangle rotated 12°, h1 monumental, lede italique et phrase canonique.

Instances sur le site

Global 0 instance en page composable

Uniquement en bibliothèque (aucune instance en page).

Aperçu

Comment l'utiliser

Contrat de slots

Champ Nature Type Requis Bilingue Bornes / valeurs
background Présentation enum Non · paper · paper-2 · paper-3 · ink
kicker Contenu text Oui fr / en ·
h1 Contenu text Oui fr / en ·
lede Contenu text Non fr / en ·
canonical Contenu text Non fr / en ·
transition_id Contenu text Non · ·

Déclinaisons · 16

Combinaisons nommées « variante × palette × densité » appliquées à ce composant, prévisualisées en rendu isolé. 3 curées, 13 générées. Échantillon des 12 premières générées (sur 13) ; toutes accessibles en rendu isolé.

  • Hero problèmes · papier 2

    curée
    hero-problem-index--paper-2
  • Hero problèmes · papier 3

    curée
    hero-problem-index--paper-3
  • Hero problèmes · encre

    curée
    hero-problem-index--ink
  • hero-problem-index · split

    générée
    hero-problem-index--split
  • hero-problem-index · centré

    générée
    hero-problem-index--centered
  • hero-problem-index · masthead

    générée
    hero-problem-index--masthead
  • hero-problem-index · entonnoir

    générée
    hero-problem-index--funnel
  • hero-problem-index · image pleine

    générée
    hero-problem-index--full-bleed-image
  • hero-problem-index · empilé

    générée
    hero-problem-index--stacked
  • hero-problem-index · minimal

    générée
    hero-problem-index--minimal
  • hero-problem-index · avec formulaire

    générée
    hero-problem-index--with-form
  • hero-problem-index · split inversé

    générée
    hero-problem-index--split-reverse
  • hero-problem-index · fond vidéo

    générée
    hero-problem-index--video-bg
  • hero-problem-index · centré étroit

    générée
    hero-problem-index--centered-narrow
  • hero-problem-index · avec bande de logos

    générée
    hero-problem-index--with-logos-strip

Comparer les déclinaisons · 15

Chaque déclinaison, résumée par son écart d'axes face à la démo par défaut du type : seuls les axes qui changent une valeur sont listés. Ouvre-la dans le builder pour l'assembler dans une page.

  • Hero problèmes · papier 2

    curée
    hero-problem-index--paper-2
    background:paper-2
    Ouvrir dans le builder
  • Hero problèmes · papier 3

    curée
    hero-problem-index--paper-3
    background:paper-3
    Ouvrir dans le builder
  • Hero problèmes · encre

    curée
    hero-problem-index--ink
    background:ink
    Ouvrir dans le builder
  • hero-problem-index · split

    générée
    hero-problem-index--split
    layout:split
    Ouvrir dans le builder
  • hero-problem-index · centré

    générée
    hero-problem-index--centered
    layout:centered
    Ouvrir dans le builder
  • hero-problem-index · masthead

    générée
    hero-problem-index--masthead
    layout:masthead
    Ouvrir dans le builder
  • hero-problem-index · entonnoir

    générée
    hero-problem-index--funnel
    layout:funnel
    Ouvrir dans le builder
  • hero-problem-index · image pleine

    générée
    hero-problem-index--full-bleed-image
    layout:full-bleed-image
    Ouvrir dans le builder
  • hero-problem-index · empilé

    générée
    hero-problem-index--stacked
    layout:stacked
    Ouvrir dans le builder
  • hero-problem-index · minimal

    générée
    hero-problem-index--minimal
    layout:minimal
    Ouvrir dans le builder
  • hero-problem-index · avec formulaire

    générée
    hero-problem-index--with-form
    layout:with-form
    Ouvrir dans le builder
  • hero-problem-index · split inversé

    générée
    hero-problem-index--split-reverse
    layout:split-reverse
    Ouvrir dans le builder
  • hero-problem-index · fond vidéo

    générée
    hero-problem-index--video-bg
    layout:video-bg
    Ouvrir dans le builder
  • hero-problem-index · centré étroit

    générée
    hero-problem-index--centered-narrow
    layout:centered-narrow
    Ouvrir dans le builder
  • hero-problem-index · avec bande de logos

    générée
    hero-problem-index--with-logos-strip
    layout:with-logos-strip
    Ouvrir dans le builder

Sections liées

Même famille

hero-academy-hub stable

Hero hub académie : kicker mono, h1 display, lede et bande de stats mono (cours, parcours, alumni).

hero Hero Header Sections Apparition au scrollSurvolDéfilement +8 16 décl.
hero-asymmetric-grid stable

Héro plein écran en grille multi-lignes asymétrique : titre serif pleine largeur, rangée 2 colonnes (label + lede + 2 CTA à gauche, label + puces fléchées à droite), puis bande de 4 KPI dont la dernière cellule est inversée en ink. Variante paper et ink, responsive.

hero Hero Header Sections BoutonsListeChiffres clés +1 14 décl.
hero-atlas stable

Hero Atlas en deux colonnes avec signature grid, copy éditoriale, CTAs et mini-map des quatre piliers.

hero Hero Header Sections Apparition au scrollDéfilementImage de fond +4 16 décl.
hero-author stable

Hero de page auteur : 2-col copy/portrait, breadcrumb équipe, role eyebrow, h1 split prénom+nom italic accent, lede display.

hero Hero Header Sections Apparition au scrollSurvolDéfilement +8 16 décl.
hero-baseline-stats stable

Héro plein écran à impact typographique : kicker, titre serif géant et lede court en tête, rangée de 4 KPI poussée en baseline (séparée par une hairline forte). CTA optionnel, pas de média. Variante paper et ink, responsive (KPI 2 colonnes sur mobile).

hero Hero Header Sections BoutonsListeChiffres clés +1 14 décl.
hero-capability-band stable

Héro plein écran : titre serif accent et lede alignés à gauche (~70 % de large), puis une bande de capacités asymétrique pleine largeur de 5 cellules dont la 3e (large, accent) porte un KPI serif, les 4 autres des capacités mono. Variante paper et ink, responsive.

hero Hero Header Sections BoutonsListeChiffres clés +1 14 décl.

Même catégorie

hero-academy-hub stable

Hero hub académie : kicker mono, h1 display, lede et bande de stats mono (cours, parcours, alumni).

hero Hero Header Sections Apparition au scrollSurvolDéfilement +8 16 décl.
hero-asymmetric-grid stable

Héro plein écran en grille multi-lignes asymétrique : titre serif pleine largeur, rangée 2 colonnes (label + lede + 2 CTA à gauche, label + puces fléchées à droite), puis bande de 4 KPI dont la dernière cellule est inversée en ink. Variante paper et ink, responsive.

hero Hero Header Sections BoutonsListeChiffres clés +1 14 décl.
hero-atlas stable

Hero Atlas en deux colonnes avec signature grid, copy éditoriale, CTAs et mini-map des quatre piliers.

hero Hero Header Sections Apparition au scrollDéfilementImage de fond +4 16 décl.
hero-author stable

Hero de page auteur : 2-col copy/portrait, breadcrumb équipe, role eyebrow, h1 split prénom+nom italic accent, lede display.

hero Hero Header Sections Apparition au scrollSurvolDéfilement +8 16 décl.
hero-baseline-stats stable

Héro plein écran à impact typographique : kicker, titre serif géant et lede court en tête, rangée de 4 KPI poussée en baseline (séparée par une hairline forte). CTA optionnel, pas de média. Variante paper et ink, responsive (KPI 2 colonnes sur mobile).

hero Hero Header Sections BoutonsListeChiffres clés +1 14 décl.
hero-capability-band stable

Héro plein écran : titre serif accent et lede alignés à gauche (~70 % de large), puis une bande de capacités asymétrique pleine largeur de 5 cellules dont la 3e (large, accent) porte un KPI serif, les 4 autres des capacités mono. Variante paper et ink, responsive.

hero Hero Header Sections BoutonsListeChiffres clés +1 14 décl.

Similaires

hero-case-study stable

Hero d'étude de cas avec décor géométrique, titre et barre de spécifications (client, secteur, durée).

hero Hero Header Sections Apparition au scrollSurvolDéfilement +8 19 décl.
hero-hub-listing deprecated

(déprécié → hero-hub-masthead variant=listing) Hero éditorial de hub avec titre monumental et lede courte, sans appel à l'action, pour pages de listing.

hero Hero Header Sections Apparition au scrollSurvolDéfilement +8 16 décl.
hero-centered stable

Hero centré pour poser une proposition de valeur claire et guider vers une action principale.

hero Hero Header Sections Apparition au scrollSurvolDéfilement +8 17 décl.
hero-essay stable

Hero d'article éditorial avec accroche italique et métadonnées auteur, date et temps de lecture.

hero Hero Header Sections Apparition au scrollSurvolDéfilement +8 16 décl.
hero-landing stable

Hero magnétique landing : eyebrow mono, h1 italique avec emphasis, lede, double CTA et bandeau de disponibilité.

hero Hero Header Sections Apparition au scrollSurvolDéfilement +8 16 décl.
hero-service-detail stable

Hero de page service avec numéro éditorial, titre, accroche et barre de preuves chiffrées optionnelle.

hero Hero Header Sections Apparition au scrollSurvolDéfilement +8 16 décl.

Code

Données de la section (à placer dans sections[])

{
  "type": "hero-problem-index",
  "kicker_fr": "§ Solutions · 5 cas d'usage horizontaux",
  "kicker_en": "§ Solutions · 5 horizontal use cases",
  "h1_fr": "Cinq <i>problèmes</i> business. Une <i>méthode</i>.",
  "h1_en": "Five business <i>problems</i>. One <i>method</i>.",
  "lede_fr": "Cinq douleurs récurrentes. Pas de slide sur l'IA : un système câblé à votre stack, mesuré dès la première semaine.",
  "lede_en": "Five recurring pains. No AI slides: a system wired into your stack, measured from week one.",
  "canonical_fr": "Nous ne vendons pas de l'IA. Nous construisons des <strong>systèmes</strong> qui tournent dans vos outils, que vous pouvez reprendre en main.",
  "canonical_en": "We do not sell AI. We build <strong>systems</strong> that run in your tools and that you can take back in-house."
}

Pour un agent / MCP

Détail machine de cette section (intention, rôle, contrat de slots, sections liées).

/library/section/hero-problem-index.json

Chemin du détail machine

/library/section/hero-problem-index.json