fix: corriger le nombre de clips DJANGOKAM (2 au lieu d'1)

src/_data/djangokam.json

@@ -0,0 +1,55 @@
+{
+  "surtitre": "Notre projet musical",
+  "titre": "DJANGOKAM",
+  "titreAccent": "l'artiste IA caribéen",
+  "accroche": "Quand l'intelligence artificielle chante en KA.",
+  "message_cle": "DJANGOKAM n'est pas simplement un artiste virtuel. Il est le premier projet musical porté par l'ORGANISATION KA INTERNATIONALE (OKI), une association culturelle guadeloupéenne qui explore les possibilités offertes par l'intelligence artificielle pour promouvoir les langues, les cultures et la création artistique caribéennes. À travers ce projet, OKI démontre que les technologies émergentes peuvent être mises au service du patrimoine culturel plutôt que de s'y opposer.",
+  "histoire": [
+    "DJANGOKAM est né il y a 29 ans à Wanakaera — le nom que les Kalinas, premiers habitants de l'île, donnaient à ce qu'on appelle aujourd'hui la Martinique. Il porte le reggae, le zouk et le konpa de scène en scène, jusqu'à la K-pop qu'il chante en coréen. La langue de son cœur est le KA, celle qu'on appelle à tort « créole » ; son arme, la musique. Ses scènes préférées : Wanakaera et Karukera, l'île de son grand-père — la Guadeloupe.",
+    "À ses côtés, NYYOKA, artiste IA caribéenne du même collectif, mène le même combat depuis la mer — en solo ou en duo, comme sur le single « She Told Me (Fanm-la di mwen) »."
+  ],
+  "faits": [
+    {
+      "icon": "🎵",
+      "chiffre": "12 sorties",
+      "texte": "disponibles sur toutes les plateformes (Spotify, Apple Music, Deezer, Tidal, Qobuz, Amazon Music, SoundCloud), référencées sur MusicBrainz"
+    },
+    {
+      "icon": "🎬",
+      "chiffre": "2 clips officiels",
+      "texte": "pour les singles « I Want You Girl » et « Ish Mwen KUTE »"
+    },
+    {
+      "icon": "🎤",
+      "chiffre": "2 artistes IA",
+      "texte": "DJANGOKAM et NYYOKA, duos et remixes croisés"
+    },
+    {
+      "icon": "📝",
+      "chiffre": "Paroles & traductions",
+      "texte": "transcriptions, traductions et karaokés de chaque titre sur PAWOL.NU"
+    }
+  ],
+  "ia_instrument": "L'intelligence artificielle n'a pas vocation à remplacer les artistes : elle constitue un nouvel instrument, un outil de création, un laboratoire artistique — et un moyen de faire rayonner les cultures créoles. DJANGOKAM est un personnage artistique complet — identité, univers graphique, répertoire — créé et dirigé par des humains. Il est la vitrine musicale de l'écosystème d'OKI : PAWOL.NU, médias libres, outils libres et plateformes du Fédiverse.",
+  "boutons": [
+    {
+      "text": "Écouter DJANGOKAM",
+      "url": "https://djangokam.pawol.nu",
+      "primary": true
+    },
+    {
+      "text": "Découvrir NYYOKA",
+      "url": "https://nyyoka.pawol.nu",
+      "primary": false
+    },
+    {
+      "text": "PAWOL.NU",
+      "url": "https://pawol.nu",
+      "primary": false
+    }
+  ],
+  "presse": {
+    "texte": "Presse & médias : dossier de presse, visuels HD et interviews sur demande —",
+    "email": "kontak@o-k-i.net"
+  }
+}

src/_data/navigation.json

@@ -7,6 +7,10 @@
     "text": "Nos projets",
     "url": "#projets"
   },
+  {
+    "text": "DJANGOKAM",
+    "url": "#djangokam"
+  },
   {
     "text": "Services",
     "url": "#hebergement"

src/_includes/layouts/base.njk

@@ -74,6 +74,22 @@
     }
     </script>
 
+    <script type="application/ld+json">
+    {
+      "@context": "https://schema.org",
+      "@type": "MusicGroup",
+      "name": "DJANGOKAM",
+      "genre": ["Reggae", "Zouk", "Konpa", "K-pop"],
+      "url": "https://djangokam.pawol.nu",
+      "sameAs": ["https://djangokam.pawol.nu"],
+      "member": {
+        "@type": "Organization",
+        "name": "{{ site.name }}",
+        "url": "https://o-k-i.net"
+      }
+    }
+    </script>
+
     <script>
         (function() {
             // Récupérer le thème stocké ou détecter le thème système

src/_includes/partials/djangokam.njk

@@ -0,0 +1,43 @@
+<section id="djangokam" class="djangokam">
+    <div class="section-container">
+        <p class="djangokam-surtitre">{{ djangokam.surtitre }}</p>
+        <h2>{{ djangokam.titre }} <span class="accent-text">{{ djangokam.titreAccent }}</span></h2>
+        <p class="section-subtitle">{{ djangokam.accroche }}</p>
+
+        {# TODO: visuel officiel DJANGOKAM (src/assets/images/) #}
+
+        <blockquote class="djangokam-highlight">
+            {{ djangokam.message_cle }}
+        </blockquote>
+
+        <div class="djangokam-histoire">
+            {% for paragraphe in djangokam.histoire %}
+            <p>{{ paragraphe }}</p>
+            {% endfor %}
+        </div>
+
+        <div class="djangokam-facts">
+            {% for fait in djangokam.faits %}
+            <div class="djangokam-fact-card">
+                <div class="djangokam-fact-icon">{{ fait.icon }}</div>
+                <h3>{{ fait.chiffre }}</h3>
+                <p>{{ fait.texte }}</p>
+            </div>
+            {% endfor %}
+        </div>
+
+        <p class="djangokam-instrument">{{ djangokam.ia_instrument }}</p>
+
+        <div class="cta-buttons djangokam-buttons">
+            {% for bouton in djangokam.boutons %}
+            <a href="{{ bouton.url }}" target="_blank" rel="noopener noreferrer" class="btn {% if bouton.primary %}btn-primary{% else %}btn-secondary{% endif %}">
+                {{ bouton.text }} →
+            </a>
+            {% endfor %}
+        </div>
+
+        <p class="djangokam-presse">
+            {{ djangokam.presse.texte }} <a href="mailto:{{ djangokam.presse.email }}">{{ djangokam.presse.email }}</a>
+        </p>
+    </div>
+</section>

src/assets/css/styles.css

@@ -1376,3 +1376,132 @@ input[type="number"]:focus {
         font-size: 2rem;
     }
 }
+
+/* DJANGOKAM Section */
+.djangokam {
+    padding: 4rem 2rem;
+    background:
+        url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 90 90" width="90" height="90"><circle cx="45" cy="45" r="30" fill="none" stroke="%23FDB813" stroke-width="1" opacity="0.05"/><circle cx="45" cy="45" r="15" fill="none" stroke="%2300D66C" stroke-width="0.5" opacity="0.05"/></svg>') 0 0 / 160px 160px,
+        linear-gradient(135deg, var(--noir-profond) 0%, var(--gris-sombre) 100%);
+    text-align: center;
+}
+
+.djangokam-surtitre {
+    text-transform: uppercase;
+    letter-spacing: 0.15em;
+    font-size: 0.9rem;
+    font-weight: 600;
+    color: var(--vert-oki);
+    margin-bottom: 0.5rem;
+}
+
+.djangokam h2 {
+    font-size: 3rem;
+    margin-bottom: 1rem;
+}
+
+.djangokam-highlight {
+    max-width: 800px;
+    margin: 2rem auto;
+    padding: 2rem;
+    text-align: left;
+    font-size: 1.1rem;
+    line-height: 1.8;
+    font-style: italic;
+    background: rgba(253, 184, 19, 0.1);
+    border-left: 4px solid var(--or-oki);
+    border-radius: 0 25px 25px 0;
+}
+
+.djangokam-histoire {
+    max-width: 800px;
+    margin: 0 auto 3rem;
+    text-align: left;
+}
+
+.djangokam-histoire p {
+    font-size: 1.1rem;
+    line-height: 1.8;
+    margin-bottom: 1.5rem;
+}
+
+.djangokam-facts {
+    display: grid;
+    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
+    gap: 2rem;
+    margin-bottom: 3rem;
+}
+
+.djangokam-fact-card {
+    background: rgba(0, 214, 108, 0.1);
+    border: 3px solid var(--vert-oki);
+    border-radius: 30px 15px 30px 15px;  /* Forme organique asymétrique */
+    padding: 2rem;
+    transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
+    box-shadow: 0 8px 25px rgba(0, 214, 108, 0.15);
+}
+
+.djangokam-fact-card:nth-child(2n) {
+    background: rgba(255, 22, 84, 0.1);
+    border-color: var(--rouge-oki);
+    box-shadow: 0 8px 25px rgba(255, 22, 84, 0.15);
+}
+
+.djangokam-fact-card:hover {
+    transform: translateY(-5px);
+    border-color: var(--or-oki);
+}
+
+.djangokam-fact-icon {
+    font-size: 2.5rem;
+    margin-bottom: 1rem;
+    display: inline-block;
+    animation: floatOrganic 4s ease-in-out infinite;
+}
+
+.djangokam-fact-card h3 {
+    color: var(--or-oki);
+    margin-bottom: 0.5rem;
+    font-size: 1.3rem;
+}
+
+.djangokam-instrument {
+    max-width: 800px;
+    margin: 0 auto 3rem;
+    font-size: 1.1rem;
+    line-height: 1.8;
+    opacity: 0.9;
+}
+
+.djangokam-buttons {
+    justify-content: center;
+    margin-bottom: 2rem;
+}
+
+.djangokam-presse {
+    font-size: 0.9rem;
+    opacity: 0.7;
+}
+
+.djangokam-presse a {
+    color: var(--or-oki);
+    text-decoration: none;
+}
+
+.djangokam-presse a:hover {
+    text-decoration: underline;
+}
+
+@media (max-width: 768px) {
+    .djangokam h2 {
+        font-size: 2rem;
+    }
+
+    .djangokam-facts {
+        grid-template-columns: 1fr;
+    }
+
+    .djangokam-buttons {
+        flex-direction: column;
+    }
+}

src/index.njk

@@ -5,6 +5,7 @@ layout: layouts/base.njk
 {% include "partials/hero.njk" %}
 {% include "partials/publics.njk" %}
 {% include "partials/projects.njk" %}
+{% include "partials/djangokam.njk" %}
 {% include "partials/mission.njk" %}
 {% include "partials/hosting.njk" %}
 {% include "partials/clients.njk" %}