design : accueil en trois variantes (console, parcours, établi) + couleur par axe

- typo : Bricolage Grotesque (titres) + Atkinson Hyperlegible (texte),
  Syne gardée pour le logo seul ; une seule source de polices (Bunny)
- palettes : teinte propre à chaque axe dans les 4 ambiances ;
  pages d'axe en axis-scope, cartes sans bordure (canon design)
- accueil : console des trois curseurs (tablist clavier), boîte à outils,
  bloc format éditorial + événement + reproduction ; ?v=a|b|c|0
- numérique : carte LPK ; bouquet rendu avec statut et légende
- messages : sans bordure, deux colonnes en grand écran

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

app/pages/numerique/[slug].vue

@@ -1,5 +1,5 @@
 <template>
-  <div class="page-outer section-padding">
+  <div class="axis-scope axis-scope--num page-outer section-padding">
 
     <!-- Shadok pinguin — tenant une clé USB, petit Tux à ses pieds -->
     <svg class="shadok-dl shadok-dl-pinguin" viewBox="0 0 170 210" fill="none" aria-hidden="true">
@@ -483,6 +483,12 @@
                   <div class="i-lucide-package h-4 w-4" />
                   {{ section.bouquet.title }}
                 </h3>
+                <p v-if="section.bouquet.provider" class="territoire-bouquet-provider">{{ section.bouquet.provider }}</p>
+                <ul v-if="section.bouquet.statuses" class="bouquet-legend" aria-label="Légende des statuts">
+                  <li v-for="(label, key) in section.bouquet.statuses" :key="key">
+                    <span class="bouquet-dot" :class="`bouquet-dot--${key}`" aria-hidden="true" />{{ label }}
+                  </li>
+                </ul>
                 <div class="territoire-bouquet-grid">
                   <div
                     v-for="(cat, ci) in section.bouquet.categories"
@@ -494,8 +500,24 @@
                       <span>{{ cat.label }}</span>
                     </div>
                     <ul class="territoire-bouquet-items">
-                      <li v-for="(item, ii) in cat.items" :key="ii">{{ item }}</li>
+                      <template v-for="(item, ii) in cat.items" :key="ii">
+                        <li v-if="typeof item === 'string'">{{ item }}</li>
+                        <li v-else class="bouquet-item">
+                          <span
+                            class="bouquet-dot"
+                            :class="`bouquet-dot--${item.status}`"
+                            :title="section.bouquet.statuses?.[item.status]"
+                          />
+                          <span class="bouquet-role">{{ item.role }}</span>
+                          <template v-if="item.name">
+                            <a v-if="item.url" :href="item.url" target="_blank" rel="noopener" class="bouquet-name">{{ item.name }}</a>
+                            <span v-else class="bouquet-name">{{ item.name }}</span>
+                          </template>
+                          <span class="sr-only">— {{ section.bouquet.statuses?.[item.status] }}</span>
+                        </li>
+                      </template>
                     </ul>
+                    <p v-if="cat.note" class="bouquet-note">{{ cat.note }}</p>
                   </div>
                 </div>
               </div>
@@ -1628,6 +1650,74 @@ useSeoPage({
   color: hsl(var(--color-primary) / 0.5);
 }
 
+/* Bouquet — status of each stack */
+.territoire-bouquet-provider {
+  font-size: 0.8rem;
+  color: hsl(var(--color-text-muted));
+  margin: -0.25rem 0 0.75rem;
+}
+
+.bouquet-legend {
+  list-style: none;
+  display: flex;
+  flex-wrap: wrap;
+  gap: 0.35rem 1rem;
+  padding: 0;
+  margin: 0 0 1rem;
+  font-family: var(--font-mono);
+  font-size: 0.7rem;
+  color: hsl(var(--color-text-muted));
+}
+
+.bouquet-legend li {
+  display: inline-flex;
+  align-items: center;
+  gap: 0.4rem;
+}
+
+.territoire-bouquet-items li.bouquet-item {
+  padding-left: 0;
+  display: grid;
+  grid-template-columns: 0.5rem minmax(0, 1fr);
+  column-gap: 0.45rem;
+  align-items: baseline;
+}
+
+.bouquet-item > .bouquet-dot { grid-row: 1; align-self: center; }
+.bouquet-item > .bouquet-role { grid-column: 2; }
+.bouquet-item > .bouquet-name { grid-column: 2; }
+
+.territoire-bouquet-items li.bouquet-item::before { content: none; }
+
+.bouquet-dot {
+  display: inline-block;
+  flex-shrink: 0;
+  width: 0.5rem;
+  height: 0.5rem;
+  border-radius: 50%;
+  align-self: center;
+}
+
+.bouquet-dot--service { background: hsl(var(--axis-num)); }
+.bouquet-dot--catalogue { box-shadow: inset 0 0 0 1.5px hsl(var(--axis-num)); }
+.bouquet-dot--avenir { box-shadow: inset 0 0 0 1px hsl(var(--color-text) / 0.3); }
+
+.bouquet-role { color: hsl(var(--color-text-muted)); }
+
+.bouquet-name {
+  color: hsl(var(--color-text));
+  font-weight: 600;
+}
+
+a.bouquet-name:hover { color: hsl(var(--axis-num)); }
+
+.bouquet-note {
+  margin: 0.4rem 0 0;
+  font-size: 0.72rem;
+  font-style: italic;
+  color: hsl(var(--color-text-muted));
+}
+
 /* Estimation toggled */
 .territoire-estimate {
   border-top: 1px solid hsl(var(--color-text) / 0.06);