diff --git a/.forgejo/workflows/deploy.yml b/.forgejo/workflows/deploy.yml
new file mode 100644
index 0000000..0972183
--- /dev/null
+++ b/.forgejo/workflows/deploy.yml
@@ -0,0 +1,32 @@
+name: Deploy
+
+on:
+  push:
+    branches:
+      - main
+
+jobs:
+  deploy:
+    name: Deploy to Production
+    runs-on: docker
+    container:
+      image: forgejo-ci-php:latest
+    steps:
+      - name: Checkout code
+        run: |
+          git clone --depth 1 --branch main https://oauth2:${{ github.token }}@forge.studio-variable.com/${{ github.repository }}.git .
+
+      - name: Deploy via FTP
+        env:
+          USERNAME: ${{ secrets.USERNAME }}
+          PASSWORD: ${{ secrets.PASSWORD }}
+          HOST: ${{ secrets.HOST }}
+        run: |
+          apt-get update -qq && apt-get install -y -qq lftp
+          cat > /tmp/lftp-script.txt <<SCRIPT
+          set ftp:ssl-allow no
+          open -u $USERNAME,$PASSWORD $HOST
+          mirror --reverse --verbose --ignore-time --parallel=10 -x cache/ -x .git/ -x .forgejo/ -x .claude/ -x backup/ . .
+          quit
+          SCRIPT
+          lftp -f /tmp/lftp-script.txt
diff --git a/assets/css/components/_btn--don.scss b/assets/css/components/_btn--don.scss
index 3c4e2d0..7b718d2 100644
--- a/assets/css/components/_btn--don.scss
+++ b/assets/css/components/_btn--don.scss
@@ -1,4 +1,4 @@
-#btn--don__mobile {
+#donation-cta-mobile {
   width: 100%;
   display: flex;
   align-items: center;
@@ -28,7 +28,7 @@
   }
 }
 
-.btn--don {
+.donation-cta {
   --vertical-padding: 0.5ch;
   height: calc(var(--h-block) + var(--vertical-padding));
   border-radius: calc(var(--h-block) / 1);
diff --git a/assets/css/components/_form-newsletter.scss b/assets/css/components/_form-newsletter.scss
index 8eac349..bc3fc48 100644
--- a/assets/css/components/_form-newsletter.scss
+++ b/assets/css/components/_form-newsletter.scss
@@ -1,4 +1,4 @@
-.form__newsletter{
+.newsletter-form{
     --size: 24px;
 
     position: relative;
diff --git a/assets/css/components/_gauge.scss b/assets/css/components/_gauge.scss
index 42fd1fb..8ddb75a 100644
--- a/assets/css/components/_gauge.scss
+++ b/assets/css/components/_gauge.scss
@@ -1,4 +1,4 @@
-.gauge__container {
+.gauge-container {
   width: 100%;
   display: flex;
   flex-wrap: wrap;
@@ -36,7 +36,7 @@
   }
 }
 
-.gauge--infos {
+.gauge-info {
   .property {
     font-size: var(--fs-small);
     padding-bottom: 3px;
@@ -51,7 +51,7 @@
   }
 }
 
-#gauge--infos__donors {
+#gauge-info--supporters {
   text-align: center;
   display: flex;
   flex-direction: column;
@@ -79,7 +79,7 @@
     }
   }
 
-  .gauge--infos {
+  .gauge-info {
     .property {
       font-size: var(--fs-small);
     }
diff --git a/assets/css/components/_text.scss b/assets/css/components/_text.scss
index 2aa69f1..66a8aa0 100644
--- a/assets/css/components/_text.scss
+++ b/assets/css/components/_text.scss
@@ -3,7 +3,7 @@
 [data-template="support"],
 [data-template="store"]{
 
-    .p__baseline-big{
+    .hero-heading{
         font-family: var(--title);
         font-size: var(--fs-big);
         font-weight: var(--fw-bold);
@@ -32,7 +32,7 @@
         }
     }
 
-    .p__baseline{
+    .subheading{
         font-size: var(--fs-medium);
         font-weight: var(--fw-medium);
         line-height: 1.1; 
@@ -44,13 +44,13 @@
         }
     }
 
-    .p__details{
+    .text-details{
         font-size: var(--fs-small);
         margin-bottom: 0.5em;
         color: var(--grey-400);
     }
 
-    .section__heading{
+    .section-heading{
         font-size: var(--fs-normal);
         font-weight: var(--fw-medium);
         line-height: 1;
diff --git a/assets/css/partials/_site-footer.scss b/assets/css/partials/_site-footer.scss
index b6ae09d..a43e6dc 100644
--- a/assets/css/partials/_site-footer.scss
+++ b/assets/css/partials/_site-footer.scss
@@ -19,12 +19,12 @@
     }
    }
 
-   .p__small{
+   .text-small{
     font-size: var(--fs-x-small);
     // margin-top: calc(var(--spacing)*0.5)
    }
 
-   #list-socials {
+   #socials-list {
     list-style: none;
     columns: 2;
     max-width: 500px;
@@ -68,10 +68,10 @@
 
    @media #{$small}{ 
     margin-top: calc(var(--spacing)*2);
-    .footer__socials{
+    .footer-socials{
         margin-top: calc(var(--spacing)*1.5);
     }
-    .footer__mentions{
+    .footer-mentions{
         margin-top: calc(var(--spacing)*0.5);
         p{       
             // font-size: var(--font-size);
@@ -83,7 +83,7 @@
 
    @media #{$small-up}{
 
-    .site-footer__container{
+    .footer-container{
         display: grid;
         grid-template-columns: 1fr 1fr;
         column-gap:  calc(var(--spacing)*2);
@@ -92,7 +92,7 @@
         margin: 0 auto;
     }
 
-    .footer__mentions{
+    .footer-mentions{
         grid-column: span 2;
         text-align: center;
         p{       
@@ -105,13 +105,13 @@
    }
 
    @media #{$medium-up}{
-        .site-footer__container{
+        .footer-container{
             column-gap:  calc(var(--spacing)*4);
         }
     }
 
     @media #{$small}{
-        .footer__mentions{
+        .footer-mentions{
             padding-top: calc(var(--spacing)*1);
             p{   margin-top: 0;}
           
diff --git a/assets/css/style.css b/assets/css/style.css
index 68d32fd..a13f35e 100644
--- a/assets/css/style.css
+++ b/assets/css/style.css
@@ -1,1311 +1 @@
-@charset "UTF-8";
-:root {
-  --font: "Executive", Arial, sans-serif;
-  --title: "System", Arial, sans-serif;
-  --fs-x-small: 10px;
-  --fs-small: 12px;
-  --fs-normal: 16px;
-  --fs-medium: 20px;
-  --fs-big: 30px;
-  --fs-x-big: 38px;
-  --fs-button-bold: 22px;
-  --leading-tight: 1;
-  --leading-normal: 1.2;
-  --fw-normal: 400;
-  --fw-medium: 500;
-  --fw-bold: 600;
-  --color-bg: #161616;
-  --color-txt: #ffffff;
-  --color-accent: #00ff00;
-  --color-accent-50: #e9ffe9;
-  --color-accent-100: #d8fdd8;
-  --grey-100: #d8d8d8;
-  --grey-300: #b9b9b9;
-  --grey-400: #969696;
-  --grey-600: #6d6d6d;
-  --grey-800: #383838;
-  --border: 1px solid var(--color-txt);
-  --border-light: 1px solid var(--grey-800);
-  --header-h: 80px;
-  --header-h-shrinked: 50px;
-  --padding-body: 20px;
-  --radius-small: 4px;
-  --spacing: 30px;
-  --h-block: 30px;
-  --curve: cubic-bezier(0.175, 0.885, 0.32, 1.275);
-}
-@media screen and (max-width: 720px) {
-  :root {
-    --fs-medium: 20px;
-    --fs-big: 26px;
-  }
-}
-
-* {
-  margin: 0;
-  padding: 0;
-  box-sizing: border-box;
-  -webkit-font-smoothing: antialiased;
-  -moz-font-smoothing: antialiased;
-  -o-font-smoothing: antialiased;
-  scroll-behavior: smooth;
-}
-
-a {
-  color: currentColor;
-}
-
-button {
-  background: none;
-  outline: none;
-  border: none;
-  color: var(--color-txt);
-}
-
-iframe {
-  border: none;
-}
-
-body {
-  font-family: var(--font);
-  line-height: var(--leading-normal);
-  font-size: var(--fs-normal);
-  color: var(--color-txt);
-  background-color: var(--color-bg);
-  padding: 0px var(--padding-body);
-  width: 100vw;
-  overflow-x: hidden;
-}
-
-main {
-  padding-top: var(--header-h);
-}
-
-.nav--tabs {
-  height: calc(var(--h-block) * 1);
-  width: auto;
-  border: var(--border);
-  border-radius: var(--radius-small);
-  overflow: hidden;
-  display: inline-flex;
-  width: auto;
-  margin: 0 auto;
-  margin-bottom: var(--spacing);
-}
-.nav--tabs .nav--tabs__btn {
-  font-family: var(--font);
-  font-size: var(--fs-small);
-  font-weight: var(--fw-medium);
-  padding: 0 2ch;
-}
-.nav--tabs .nav--tabs__btn.is-selected {
-  background-color: var(--color-txt);
-  color: var(--color-bg);
-}
-.nav--tabs .nav--tabs__btn:not(.is-selected):hover {
-  background-color: var(--grey-800);
-  cursor: pointer;
-}
-.nav--tabs .nav--tabs__btn + .nav--tabs__btn {
-  border-left: var(--border);
-}
-
-.btn__default {
-  --size: calc(var(--h-block) - 8px);
-  font-size: var(--fs-normal);
-  font-weight: var(--fw-normal);
-  height: var(--size);
-  padding-right: 1.5ch;
-  position: relative;
-  display: flex;
-  align-items: center;
-  gap: 0ch;
-  color: var(--color-accent);
-  font-weight: var(--fw-medium);
-  text-decoration: none;
-  cursor: pointer;
-}
-.btn__default .icon, .btn__default .txt {
-  z-index: 10;
-}
-.btn__default .icon {
-  width: var(--size);
-  height: var(--size);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: var(--color-bg);
-  text-align: center;
-}
-.btn__default .icon svg {
-  fill: var(--color-bg);
-  width: 80%;
-}
-.btn__default .txt {
-  font-family: var(--font-title);
-  color: var(--color-accent);
-  font-size: var(--fs-normal);
-  font-weight: var(--fw-bold);
-  padding-left: 1ch;
-}
-.btn__default::after {
-  content: "";
-  display: block;
-  background-color: var(--color-accent);
-  border-radius: calc(var(--size) / 2);
-  width: var(--size);
-  height: var(--size);
-  position: absolute;
-  left: 0;
-  z-index: 0;
-  transition: width 0.2s;
-}
-.btn__default:hover .txt {
-  color: var(--color-bg);
-  display: block;
-}
-.btn__default:hover::after {
-  width: 100%;
-}
-
-#btn--don__mobile {
-  width: 100%;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  padding-top: calc(var(--spacing) * 0.5);
-  padding-bottom: calc(var(--spacing) * 1.5);
-  position: fixed;
-  bottom: 0px;
-  left: 0;
-  z-index: 100;
-  opacity: 0;
-  transition: opacity ease-in 0.2s;
-  pointer-events: none;
-}
-#btn--don__mobile.is-visible {
-  pointer-events: all;
-  opacity: 1;
-}
-#btn--don__mobile.is-sticky {
-  position: relative;
-}
-@media screen and (min-width: 720px) {
-  #btn--don__mobile {
-    display: none !important;
-  }
-}
-
-.btn--don {
-  --vertical-padding: 0.5ch;
-  height: calc(var(--h-block) + var(--vertical-padding));
-  border-radius: calc(var(--h-block) / 1);
-  padding: var(--vertical-padding) 2ch;
-  background-color: var(--color-accent);
-  color: var(--color-bg);
-  font-family: var(--font);
-  font-size: var(--fs-medium);
-  font-weight: var(--fw-bold);
-}
-.btn--don a {
-  text-decoration: none;
-  display: flex;
-  align-items: center;
-  gap: 0.5ch;
-}
-.btn--don .icon {
-  height: 28px;
-  position: relative;
-  top: 1px;
-}
-.btn--don svg {
-  fill: var(--color-bg);
-  width: 24px;
-  height: 24px;
-}
-
-.form__newsletter {
-  --size: 24px;
-  position: relative;
-  display: flex;
-  align-items: center;
-  position: relative;
-}
-.form__newsletter input[type=email] {
-  height: calc(var(--h-block) * 1.25);
-  width: 100%;
-  border-radius: calc(var(--h-block) * 0.625);
-  outline: none;
-  border: none;
-  padding: 0 2ch;
-  font-family: var(--font);
-  font-size: var(--fs-normal);
-  z-index: 40;
-  padding-top: 4px;
-}
-.form__newsletter input[type=email]::-moz-placeholder {
-  font-family: var(--font);
-  font-size: var(--fs-normal);
-}
-.form__newsletter input[type=email]::placeholder {
-  font-family: var(--font);
-  font-size: var(--fs-normal);
-}
-.form__newsletter input[type=email]:focus {
-  outline: 3px solid var(--grey-400);
-}
-.form__newsletter button[type=submit].btn--bold {
-  position: absolute;
-  right: 2px;
-  z-index: 100;
-}
-.form__newsletter button[type=submit].btn--bold {
-  --size: calc(var(--h-block)*1.25 - 4px);
-  font-family: var(--font);
-  font-size: var(--fs-button-bold);
-  height: var(--size);
-  display: flex;
-  align-items: center;
-  gap: 0.75ch;
-  color: var(--color-accent);
-  font-weight: var(--fw-medium);
-  text-decoration: none;
-  cursor: pointer;
-}
-.form__newsletter button[type=submit].btn--bold .icon, .form__newsletter button[type=submit].btn--bold .txt {
-  z-index: 10;
-}
-.form__newsletter button[type=submit].btn--bold .icon {
-  width: var(--size);
-  height: var(--size);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  color: var(--color-bg);
-  text-align: center;
-}
-.form__newsletter button[type=submit].btn--bold .icon svg {
-  fill: var(--color-bg);
-  width: 80%;
-}
-.form__newsletter button[type=submit].btn--bold .txt {
-  position: relative;
-  top: 2px;
-  font-size: var(--fs-normal);
-  display: none;
-  padding-left: 1ch;
-}
-.form__newsletter button[type=submit].btn--bold::after {
-  content: "";
-  display: block;
-  background-color: var(--color-accent);
-  border-radius: calc(var(--size) / 2);
-  width: var(--size);
-  height: var(--size);
-  position: absolute;
-  right: 0;
-  z-index: 0;
-  transition: width 0.2s;
-}
-.form__newsletter button[type=submit].btn--bold:hover .txt {
-  color: var(--color-bg);
-  display: block;
-}
-.form__newsletter button[type=submit].btn--bold:hover::after {
-  width: 100%;
-}
-
-.gauge__container {
-  width: 100%;
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: space-between;
-  position: relative;
-  top: calc(var(--spacing) * 0.25);
-  padding: 0 calc(var(--spacing) * 0.5);
-}
-
-#gauge {
-  --gauge-h: 12px;
-  width: 100%;
-  margin-bottom: calc(var(--spacing) * 0.25);
-  height: var(--gauge-h);
-  border-radius: calc(var(--gauge-h) * 0.5);
-  background-color: var(--color-bg);
-  border: 1px solid var(--color-txt);
-  position: relative;
-  box-shadow: 7px 6px 5px -3px rgba(0, 0, 0, 0.14);
-}
-#gauge::before {
-  content: "";
-  display: block;
-  height: calc(var(--gauge-h) - 2px);
-  border-radius: calc(var(--gauge-h) * 0.5);
-  width: var(--pourcent);
-  min-width: 20px;
-  background-color: var(--color-accent);
-  position: absolute;
-  top: 0px;
-  left: 0px;
-  transition: width cubic-bezier(0.86, 0, 0.07, 1) 1s;
-}
-
-.gauge--infos .property {
-  font-size: var(--fs-small);
-  padding-bottom: 3px;
-}
-.gauge--infos .value {
-  font-size: var(--fs-small);
-}
-.gauge--infos:last-of-type {
-  text-align: right;
-}
-
-#gauge--infos__donors {
-  text-align: center;
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-}
-#gauge--infos__donors .value {
-  font-weight: bold;
-  display: inline;
-}
-#gauge--infos__donors .property {
-  display: inline;
-  padding-bottom: 0;
-}
-
-@media screen and (min-width: 720px) {
-  #gauge {
-    --gauge-h: 18px;
-    border: 2px solid var(--color-txt);
-  }
-  #gauge::before {
-    height: calc(var(--gauge-h) - 4px);
-  }
-  .gauge--infos .property {
-    font-size: var(--fs-small);
-  }
-  .gauge--infos .value {
-    font-size: var(--fs-normal);
-  }
-}
-[data-template=subscription-newsletter] .p__baseline-big,
-[data-template=thanks] .p__baseline-big,
-[data-template=support] .p__baseline-big,
-[data-template=store] .p__baseline-big {
-  font-family: var(--title);
-  font-size: var(--fs-big);
-  font-weight: var(--fw-bold);
-  line-height: 1.1;
-  text-align: center;
-  margin: calc(var(--spacing) * 1) 0;
-}
-[data-template=subscription-newsletter] .p__baseline-big strong,
-[data-template=thanks] .p__baseline-big strong,
-[data-template=support] .p__baseline-big strong,
-[data-template=store] .p__baseline-big strong {
-  font-weight: var(--fw-bolf);
-  color: var(--color-accent);
-}
-[data-template=subscription-newsletter] .p__baseline-big .link-don,
-[data-template=thanks] .p__baseline-big .link-don,
-[data-template=support] .p__baseline-big .link-don,
-[data-template=store] .p__baseline-big .link-don {
-  display: block;
-  color: var(--color-accent);
-  text-decoration: none;
-}
-[data-template=subscription-newsletter] .p__baseline-big .link-don:hover,
-[data-template=thanks] .p__baseline-big .link-don:hover,
-[data-template=support] .p__baseline-big .link-don:hover,
-[data-template=store] .p__baseline-big .link-don:hover {
-  -webkit-text-decoration: underline 2px;
-          text-decoration: underline 2px;
-  text-underline-offset: 4px;
-}
-[data-template=subscription-newsletter] .p__baseline,
-[data-template=thanks] .p__baseline,
-[data-template=support] .p__baseline,
-[data-template=store] .p__baseline {
-  font-size: var(--fs-medium);
-  font-weight: var(--fw-medium);
-  line-height: 1.1;
-  text-align: center;
-  margin: calc(var(--spacing) * 1) 0;
-}
-@media screen and (max-width: 720px) {
-  [data-template=subscription-newsletter] .p__baseline,
-  [data-template=thanks] .p__baseline,
-  [data-template=support] .p__baseline,
-  [data-template=store] .p__baseline {
-    text-align: center;
-    margin: var(--spacing) 0;
-  }
-}
-[data-template=subscription-newsletter] .p__details,
-[data-template=thanks] .p__details,
-[data-template=support] .p__details,
-[data-template=store] .p__details {
-  font-size: var(--fs-small);
-  margin-bottom: 0.5em;
-  color: var(--grey-400);
-}
-[data-template=subscription-newsletter] .section__heading,
-[data-template=thanks] .section__heading,
-[data-template=support] .section__heading,
-[data-template=store] .section__heading {
-  font-size: var(--fs-normal);
-  font-weight: var(--fw-medium);
-  line-height: 1;
-  text-align: center;
-  margin-top: calc(var(--spacing) * 0.5);
-  margin-bottom: calc(var(--spacing) * 1);
-}
-[data-template=subscription-newsletter] ul, [data-template=subscription-newsletter] ol,
-[data-template=thanks] ul,
-[data-template=thanks] ol,
-[data-template=support] ul,
-[data-template=support] ol,
-[data-template=store] ul,
-[data-template=store] ol {
-  margin-left: 3ch;
-  margin-bottom: 0.5em;
-}
-
-@keyframes add-border {
-  from {
-    border-bottom-color: transparent;
-  }
-  to {
-    border-bottom: var(--grey-800);
-  }
-}
-#site-header {
-  position: fixed;
-  left: var(--padding-body);
-  top: 0px;
-  z-index: 900;
-  width: calc(100vw - var(--padding-body) * 2);
-  height: var(--header-h);
-  background-color: var(--color-bg);
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-}
-#site-header.is-shrinked {
-  height: var(--header-h-shrinked);
-  border-bottom: var(--border-light);
-}
-#site-header .site-title {
-  display: flex;
-  width: 120px;
-  transition: all ease-in 0.2s;
-  overflow: hidden;
-}
-#site-header .site-title svg {
-  fill: var(--color-txt);
-}
-#site-header.is-shrinked .site-title {
-  width: 80px !important;
-}
-#site-header .header-left,
-#site-header .header-right {
-  width: 90px;
-  display: flex;
-  align-items: center;
-  justify-content: flex-end;
-}
-#site-header .header-center {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-}
-#site-header #toggle-lang {
-  list-style: none;
-  display: flex;
-  justify-content: flex-end;
-  gap: 0.75ch;
-  text-transform: uppercase;
-  color: var(--grey-400);
-  line-height: 1;
-  margin: 0;
-  padding: 0;
-}
-#site-header #toggle-lang a {
-  text-decoration: none;
-}
-#site-header #toggle-lang li.is-selected {
-  color: var(--color-txt);
-}
-
-#site-footer {
-  background-color: black;
-  width: 100vw;
-  position: relative;
-  left: calc(var(--padding-body) * -1);
-  padding: calc(var(--padding-body) * 2) var(--padding-body);
-}
-#site-footer p {
-  margin: calc(var(--spacing) * 0.5) 0;
-}
-#site-footer p a {
-  text-decoration: none;
-}
-#site-footer p a:hover {
-  text-decoration: underline;
-}
-#site-footer .p__small {
-  font-size: var(--fs-x-small);
-}
-#site-footer #list-socials {
-  list-style: none;
-  -moz-columns: 2;
-       columns: 2;
-  max-width: 500px;
-  margin: 0;
-}
-#site-footer #list-socials a {
-  display: flex;
-  align-items: center;
-  gap: 1ch;
-  text-decoration: none;
-  height: calc(var(--spacing) * 1);
-}
-#site-footer #list-socials a::after {
-  content: "↗";
-  color: var(--grey-300);
-}
-#site-footer #list-socials .text {
-  line-height: 1;
-}
-#site-footer #list-socials .icon {
-  width: 20px;
-  height: 20px;
-  position: relative;
-  top: -2px;
-}
-#site-footer #list-socials svg {
-  display: flex;
-  align-items: center;
-  width: 20px;
-  height: 20px;
-}
-@media screen and (max-width: 720px) {
-  #site-footer {
-    margin-top: calc(var(--spacing) * 2);
-  }
-  #site-footer .footer__socials {
-    margin-top: calc(var(--spacing) * 1.5);
-  }
-  #site-footer .footer__mentions {
-    margin-top: calc(var(--spacing) * 0.5);
-  }
-  #site-footer .footer__mentions p {
-    margin-top: calc(var(--spacing) * 2);
-  }
-}
-@media screen and (min-width: 720px) {
-  #site-footer .site-footer__container {
-    display: grid;
-    grid-template-columns: 1fr 1fr;
-    -moz-column-gap: calc(var(--spacing) * 2);
-         column-gap: calc(var(--spacing) * 2);
-    max-width: 1200px;
-    margin: 0 auto;
-  }
-  #site-footer .footer__mentions {
-    grid-column: span 2;
-    text-align: center;
-  }
-  #site-footer .footer__mentions p {
-    font-size: var(--font-size);
-    margin-top: calc(var(--spacing) * 2);
-  }
-}
-@media screen and (min-width: 1080px) {
-  #site-footer .site-footer__container {
-    -moz-column-gap: calc(var(--spacing) * 4);
-         column-gap: calc(var(--spacing) * 4);
-  }
-}
-@media screen and (max-width: 720px) {
-  #site-footer .footer__mentions {
-    padding-top: calc(var(--spacing) * 1);
-    text-align: center;
-  }
-  #site-footer .footer__mentions p {
-    margin-top: 0;
-  }
-}
-
-[data-template=support] section {
-  display: flex;
-  flex-direction: column;
-  margin: 0 auto;
-  padding-bottom: calc(var(--spacing) * 0.75);
-  margin-bottom: calc(var(--spacing) * 0.75);
-  border-bottom: var(--border-light);
-}
-[data-template=support] #section__hero {
-  margin-top: calc(var(--spacing) * 1);
-  display: block;
-}
-[data-template=support] #section__questions {
-  border-bottom: none;
-}
-[data-template=support] #section__donation:target {
-  padding-top: calc(var(--header-h) * 1.25);
-}
-[data-template=support] #section__video {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-}
-[data-template=support] #section__video .video-container {
-  display: flex;
-}
-[data-template=support] #section__video video {
-  width: 100%;
-  border: 1px solid var(--grey-800);
-  max-height: 90vh;
-  display: flex;
-}
-@media screen and (min-width: 1080px) {
-  [data-template=support] main {
-    display: grid;
-    grid-template-columns: 50% 50%;
-    grid-template-rows: repeat(4, auto);
-    max-width: 1200px;
-    margin: 0 auto;
-    padding-bottom: 0;
-  }
-  [data-template=support] #section__donation {
-    padding-top: calc(var(--spacing) * 1);
-  }
-  [data-template=support] #section__donation,
-  [data-template=support] #section__comments {
-    border: none;
-  }
-  [data-template=support] #section__baseline {
-    padding: calc(var(--spacing) * 0.5) 0;
-  }
-  [data-template=support] .gauge__container {
-    padding-top: calc(var(--spacing) * 1);
-  }
-  [data-template=support] .col-left,
-  [data-template=support] .col-right {
-    padding-top: calc(var(--spacing) * 1);
-  }
-  [data-template=support] .col-left {
-    grid-column: 1;
-    grid-row: 1/5;
-  }
-  [data-template=support] .col-right {
-    position: sticky;
-    top: calc(var(--spacing) * 2.5);
-    grid-column: 2;
-    grid-row: 1;
-    overflow: hidden;
-  }
-}
-@media screen and (max-width: 1080px) {
-  [data-template=support] main {
-    display: flex;
-    flex-direction: column;
-    align-items: stretch;
-    justify-content: stretch;
-    max-width: 600px;
-    margin: 0 auto;
-  }
-  [data-template=support] section {
-    width: 100%;
-  }
-  [data-template=support] .col-left,
-  [data-template=support] .col-right {
-    display: contents;
-  }
-  [data-template=support] #section__hero {
-    order: 1;
-  }
-  [data-template=support] #section__donation {
-    order: 2;
-  }
-  [data-template=support] #section__baseline {
-    order: 3;
-  }
-  [data-template=support] #section__video {
-    order: 4;
-  }
-  [data-template=support] #section__comments {
-    order: 5;
-  }
-  [data-template=support] #section__questions {
-    order: 6;
-    margin-bottom: calc(var(--spacing) * 2);
-  }
-}
-@media screen and (max-height: 670px) and (min-width: 1080px) {
-  [data-template=support] .col-left,
-  [data-template=support] .col-right {
-    display: contents;
-  }
-  [data-template=support] section {
-    width: 100%;
-  }
-  [data-template=support] #section__donation {
-    grid-row: 1;
-    grid-column: 2;
-    position: sticky;
-    top: calc(var(--spacing) * 3.75);
-  }
-  [data-template=support] #section__hero {
-    grid-row: 1;
-    grid-column: 1;
-  }
-  [data-template=support] #section__baseline {
-    grid-row: 2;
-    grid-column: 1;
-  }
-  [data-template=support] #section__video {
-    grid-row: 3;
-    grid-column: 1;
-  }
-  [data-template=support] #section__comments {
-    grid-row: 4;
-    grid-column: 1;
-    border-bottom: var(--border-light);
-  }
-  [data-template=support] #section__questions {
-    grid-row: 5;
-    grid-column: 1;
-  }
-}
-
-#section__donation {
-  display: flex;
-  align-items: center;
-}
-#section__donation .btn--donation__container {
-  display: grid;
-  grid-template-columns: 1fr 1fr;
-  grid-gap: calc(var(--padding-body) * 0.75);
-  display: none;
-}
-@media screen and (min-width: 1080px) {
-  #section__donation .btn--donation__container {
-    width: 420px;
-  }
-}
-@media screen and (max-width: 1080px) {
-  #section__donation .btn--donation__container {
-    width: 100%;
-    max-width: 420px;
-  }
-}
-#section__donation .btn--donation__container .btn--donation__grow-2 {
-  grid-column: span 2;
-}
-#section__donation .btn--donation__container.is-selected {
-  display: grid;
-}
-#section__donation .btn--donation {
-  background-color: var(--color-txt);
-  color: var(--color-bg);
-  border-radius: var(--radius-small);
-  height: calc(var(--h-block) * 2);
-}
-#section__donation .btn--donation .bold {
-  font-family: var(--title);
-  font-size: var(--fs-medium);
-  font-weight: var(--fw-bold);
-  margin-bottom: 0.25em;
-}
-#section__donation .btn--donation .small {
-  font-family: var(--font);
-  font-weight: var(--fw-medium);
-  font-size: var(--fs-small);
-}
-#section__donation .btn--donation:hover {
-  outline: 4px solid var(--color-accent);
-  cursor: pointer;
-}
-
-.comment__text {
-  font-size: var(--fs-medium);
-  font-weight: var(--fw-medium);
-  line-height: var(--leading-tight);
-  line-height: 1.1;
-  max-width: 28ch;
-  text-align: center;
-}
-
-.comment__name {
-  margin-top: calc(var(--spacing) * 0.5);
-  text-align: center;
-}
-
-.swiper {
-  width: 100%;
-  max-width: 700px;
-  height: auto;
-  position: relative;
-  padding-bottom: 40px; /* espace réservé pour les dots */
-}
-.swiper .swiper-slide {
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-}
-.swiper .comments-slider__dots {
-  position: absolute;
-  bottom: 10px; /* espace du bas */
-  left: 0;
-  width: 100%;
-  text-align: center;
-}
-.swiper .comments-slider__dots .swiper-pagination-bullet {
-  background-color: var(--grey-600);
-  opacity: 1;
-}
-.swiper .comments-slider__dots .swiper-pagination-bullet-active {
-  background-color: var(--color-txt);
-  opacity: 1;
-}
-
-#section__questions {
-  max-width: 700px;
-}
-#section__questions summary::marker {
-  content: "";
-  display: none;
-}
-#section__questions summary::-webkit-details-marker {
-  content: "";
-  display: none;
-}
-#section__questions details {
-  border-bottom: var(--border);
-}
-#section__questions details:first-of-type {
-  border-top: var(--border);
-}
-#section__questions details summary {
-  padding-top: calc(var(--spacing) * 0.25 + 2px);
-  padding-bottom: calc(var(--spacing) * 0.25);
-  cursor: pointer;
-  position: relative;
-  padding-right: 2ch;
-}
-#section__questions details[open] summary::after {
-  content: "✕";
-  position: absolute;
-  right: 0;
-}
-#section__questions details p {
-  margin: calc(var(--spacing) * 0.5) 0;
-}
-#section__questions details ul, #section__questions details ol {
-  margin-bottom: calc(var(--spacing) * 0.5);
-}
-
-#section__video {
-  margin-bottom: calc(var(--spacing) * 2);
-}
-#section__video .btn__deploy {
-  margin-top: calc(var(--spacing) * 1);
-  --size: var(--h-block);
-  font-family: var(--font);
-  font-size: var(--fs-small);
-  font-weight: var(--fw-normal);
-  line-height: 1;
-  border: var(--border-light);
-  height: var(--size);
-  border-radius: calc(var(--size) / 2);
-  padding-left: 1.5ch;
-  padding-right: 2ch;
-  padding-top: 1px;
-  position: relative;
-  cursor: pointer;
-  display: flex;
-  align-items: center;
-  gap: 1ch;
-  font-weight: var(--fw-medium);
-  text-decoration: none;
-  cursor: pointer;
-}
-#section__video .btn__deploy:hover {
-  background-color: var(--grey-800);
-  border-color: var(--color-txt);
-}
-#section__video .btn__deploy svg {
-  fill: var(--color-txt);
-  width: 10px;
-  position: relative;
-  top: 1px;
-  left: 1px;
-}
-#section__video .videos__ul {
-  list-style: none;
-  width: 100%;
-  margin-top: calc(var(--spacing) * 1);
-  display: none;
-}
-#section__video .videos__ul .videos__li {
-  position: relative;
-  padding-left: 40px;
-  padding-right: 2ch;
-  margin-bottom: calc(var(--spacing) * 0.75);
-  cursor: pointer;
-}
-@media screen and (max-width: 520px) {
-  #section__video .videos__ul .videos__li .br-desktop {
-    display: none;
-  }
-}
-#section__video .videos__ul .videos__li:hover {
-  color: var(--grey-100);
-}
-#section__video .videos__ul .videos__li .icon {
-  --size: 20px;
-  flex-shrink: 0;
-  width: var(--size);
-  height: var(--size);
-  border-radius: calc(var(--size) / 2);
-  border: var(--border);
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  position: absolute;
-  left: 0px;
-}
-#section__video .videos__ul .videos__li svg {
-  fill: var(--color-txt);
-  width: 7px;
-}
-#section__video #videos__input {
-  display: none;
-}
-#section__video #videos__input:checked ~ .videos__ul {
-  display: block;
-}
-
-#video__fullscreen {
-  width: 100vw;
-  height: 100vh;
-  background-color: var(--color-bg);
-  padding: var(--padding-body);
-  position: fixed;
-  top: 0px;
-  left: 0;
-  z-index: 3000;
-}
-#video__fullscreen iframe {
-  width: 90%;
-  height: calc(100vh - 60px);
-  height: calc(100dvh - 60px);
-  border: var(--border);
-}
-#video__fullscreen #video__close {
-  height: 60px;
-  font-size: 20px;
-  width: 100%;
-  font-weight: bold;
-  display: flex;
-  align-items: top;
-  justify-content: flex-end;
-}
-
-body.is-fullscreen {
-  overflow: hidden;
-}
-
-[data-template=store] main {
-  margin-bottom: calc(var(--spacing) * 2);
-}
-[data-template=store] .p__baseline-big {
-  margin-top: calc(var(--spacing) * 2);
-}
-[data-template=store] #store__container {
-  margin-top: calc(var(--spacing) * 2);
-  margin-bottom: calc(var(--spacing) * 4);
-  width: 100%;
-  max-width: 1000px;
-}
-[data-template=store] #store__container .store__product {
-  position: relative;
-}
-[data-template=store] #store__container .store__product figure {
-  aspect-ratio: 4/3;
-  background-color: var(--color-bg);
-  background-color: var(--data-bg);
-  margin-bottom: calc(var(--spacing) * 0.5);
-  overflow: hidden;
-}
-[data-template=store] #store__container .store__product img {
-  width: 100%;
-  height: 100%;
-  -o-object-fit: contain;
-     object-fit: contain;
-  transition: var(--curve) 0.5s;
-}
-[data-template=store] #store__container .store__product a {
-  text-decoration: none;
-}
-[data-template=store] #store__container .store__product .link-block {
-  display: block;
-  height: 100%;
-  width: 100%;
-  position: absolute;
-  top: 0;
-  left: 0;
-  cursor: pointer;
-}
-[data-template=store] #store__container .store__product:hover figure {
-  overflow: hidden;
-}
-[data-template=store] #store__container .store__product:hover img {
-  transform: scale(1.05);
-}
-[data-template=store] #store__container .store__product:hover .line-1 {
-  text-decoration: underline;
-}
-@media screen and (max-width: 720px) {
-  [data-template=store] #store__container .store__product {
-    margin-top: calc(var(--spacing) * 1.5);
-    margin-bottom: calc(var(--spacing) * 0.5);
-  }
-}
-@media screen and (min-width: 720px) {
-  [data-template=store] #store__container {
-    display: grid;
-    grid-template-columns: repeat(6, 1fr);
-    -moz-column-gap: calc(var(--padding-body) * 0.75);
-         column-gap: calc(var(--padding-body) * 0.75);
-    row-gap: calc(var(--spacing) * 2);
-    margin-left: auto;
-    margin-right: auto;
-  }
-  [data-template=store] #store__container .store__product {
-    grid-column: span 2;
-  }
-  [data-template=store] #store__container .store__product:nth-of-type(1),
-  [data-template=store] #store__container .store__product:nth-of-type(2) {
-    grid-column: span 3;
-  }
-}
-[data-template=store] #site-footer {
-  margin-top: calc(var(--spacing) * 4);
-  padding-top: 0px;
-}
-
-.section__product,
-.store__nav {
-  max-width: 1000px;
-  margin-left: auto;
-  margin-right: auto;
-}
-
-.store__nav {
-  padding-top: calc(var(--spacing) * 1);
-}
-.store__nav a {
-  text-decoration: none;
-}
-.store__nav a:hover {
-  text-decoration: underline;
-}
-.store__nav a::before {
-  content: "← ";
-}
-
-.section__product figure {
-  aspect-ratio: 1/1;
-}
-.section__product figure img {
-  width: 100%;
-  height: 100%;
-  -o-object-fit: contain;
-     object-fit: contain;
-}
-.section__product #list-size {
-  list-style: none;
-  display: flex;
-  margin-top: calc(var(--spacing) * 0.5);
-  margin-bottom: calc(var(--spacing) * 0.5);
-  gap: 2ch;
-}
-.section__product #list-size li {
-  position: relative;
-}
-.section__product #list-size li input[type=radio] {
-  position: fixed;
-  opacity: 0;
-  pointer-events: none;
-}
-.section__product #list-size li label {
-  font-family: var(--title);
-  font-size: var(--fs-normal);
-  height: 4ch;
-  width: 4ch;
-  border-radius: 50%;
-  border: var(--border);
-  border-color: transparent;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-  padding-top: 0px;
-  cursor: pointer;
-}
-.section__product #list-size li input[type=radio]:checked + label {
-  border-color: var(--color-txt);
-}
-.section__product #list-size li input[type=radio]:not(:checked) + label:hover {
-  border-color: var(--grey-600);
-  background-color: var(--grey-800);
-}
-.section__product .hero {
-  margin-bottom: calc(var(--spacing) * 1);
-  padding-top: calc(var(--spacing) * 0.5);
-  border-top: var(--border-light);
-}
-.section__product .hero .p__baseline-big {
-  margin: 0;
-  text-align: left;
-}
-.section__product .add-to-cart,
-.section__product #list-size {
-  margin: 0;
-  border-bottom: var(--border-light);
-  padding: calc(var(--spacing) * 0.5) 0;
-}
-
-@media screen and (max-width: 720px) {
-  .store__nav a {
-    padding-top: 0;
-    font-size: var(--fs-small);
-  }
-  .section__product {
-    display: flex;
-    flex-direction: column;
-  }
-  .section__product .col-left {
-    display: contents;
-  }
-  .section__product .hero {
-    margin-top: calc(var(--spacing) * 0.5);
-    order: 1;
-  }
-  .section__product figure {
-    order: 2;
-    margin-bottom: calc(var(--spacing) * 1);
-  }
-  .section__product .details {
-    order: 3;
-    margin-bottom: calc(var(--spacing) * 1.5);
-  }
-  .section__product .size {
-    border-top: var(--border-light);
-    order: 4;
-  }
-  .section__product .add-to-cart {
-    order: 5;
-  }
-}
-@media screen and (min-width: 720px) {
-  .section__product {
-    display: grid;
-    grid-template-columns: 50% 50%;
-    aspect-ratio: 2/1;
-    margin-top: calc(var(--spacing) * 0.5);
-    position: relative;
-  }
-  .section__product .col-left {
-    padding-right: var(--padding-body);
-  }
-  .section__product .details {
-    margin-bottom: calc(var(--spacing) * 3);
-  }
-  .section__product .add-to-cart,
-  .section__product #list-size {
-    width: calc(50% - var(--padding-body));
-  }
-  .section__product .add-to-cart {
-    position: absolute;
-    bottom: 10px;
-  }
-  .section__product #list-size {
-    position: absolute;
-    bottom: calc(var(--spacing) * 2);
-    border-top: var(--border-light);
-  }
-}
-[data-template=thanks] .p__baseline-big {
-  margin-top: calc(var(--spacing) * 3);
-  margin-bottom: calc(var(--spacing) * 3);
-}
-[data-template=thanks] .p__baseline {
-  text-align: left;
-  max-width: 800px;
-  margin: var(--spacing) auto;
-}
-[data-template=thanks] .p__baseline a {
-  color: var(--color-accent);
-  text-decoration: none;
-}
-[data-template=thanks] .p__baseline a:hover {
-  text-decoration: underline;
-}
-[data-template=thanks] #site-footer {
-  border-top: none;
-  margin-top: calc(var(--spacing) * 4);
-}
-
-.snipcart-modal__container {
-  z-index: 1000;
-}
-
-[data-template=subscription-newsletter] main {
-  margin-top: calc(var(--spacing) * 2);
-}
-[data-template=subscription-newsletter] #form__newsletter__container {
-  max-width: 700px;
-  margin: calc(var(--spacing) * 3) auto;
-  margin-bottom: calc(var(--spacing) * 4);
-}
-[data-template=subscription-newsletter] #form__newsletter__container .form__newsletter {
-  margin: calc(var(--spacing) * 1) 0;
-}
-[data-template=subscription-newsletter] #form__newsletter__container .form__newsletter input[type=email] {
-  height: calc(var(--h-block) * 1.75);
-  border-radius: calc(var(--h-block) * 0.875);
-  font-size: var(--fs-medium);
-}
-[data-template=subscription-newsletter] #form__newsletter__container .form__newsletter input[type=email]::-moz-placeholder {
-  font-size: var(--fs-medium);
-}
-[data-template=subscription-newsletter] #form__newsletter__container .form__newsletter input[type=email]::placeholder {
-  font-size: var(--fs-medium);
-}
-[data-template=subscription-newsletter] #form__newsletter__container .form__newsletter button[type=submit].btn--bold {
-  --size: calc(var(--h-block)*1.75 - 4px);
-}
-[data-template=subscription-newsletter] #form__newsletter__container .form__newsletter button[type=submit].btn--bold .icon svg {
-  width: 28px;
-}
-[data-template=subscription-newsletter] #form__newsletter__container .form__newsletter .txt {
-  padding-left: 2ch;
-}
-[data-template=subscription-newsletter] #form__newsletter__container .p__baseline {
-  max-width: 52ch;
-  text-align: left;
-}
-[data-template=subscription-newsletter] #form__newsletter__container .p__details {
-  color: var(--color-txt);
-  max-width: 80ch;
-}
-[data-template=subscription-newsletter] #site-footer {
-  margin-top: calc(var(--spacing) * 4);
-  padding-top: 0px;
-}/*# sourceMappingURL=style.css.map */
\ No newline at end of file
+:root{--font: "Executive", Arial, sans-serif;--title: "System", Arial, sans-serif;--fs-x-small: 10px;--fs-small: 12px;--fs-normal: 16px;--fs-medium: 20px;--fs-big: 30px;--fs-x-big: 38px;--fs-button-bold: 22px;--leading-tight: 1;--leading-normal: 1.2;--fw-normal: 400;--fw-medium: 500;--fw-bold: 600;--color-bg: #161616;--color-txt: #ffffff;--color-accent: #00ff00;--color-accent-50: #e9ffe9;--color-accent-100: #d8fdd8;--grey-100: #d8d8d8;--grey-300: #b9b9b9;--grey-400: #969696;--grey-600: #6d6d6d;--grey-800: #383838;--border: 1px solid var(--color-txt);--border-light: 1px solid var(--grey-800);--header-h: 80px;--header-h-shrinked: 50px;--padding-body: 20px;--radius-small: 4px;--spacing: 30px;--h-block: 30px;--curve: cubic-bezier(0.175, 0.885, 0.32, 1.275)}@media screen and (max-width: 720px){:root{--fs-medium: 20px;--fs-big: 26px}}*{margin:0;padding:0;box-sizing:border-box;-webkit-font-smoothing:antialiased;-moz-font-smoothing:antialiased;-o-font-smoothing:antialiased;scroll-behavior:smooth}a{color:currentColor}button{background:none;outline:none;border:none;color:var(--color-txt)}iframe{border:none}body{font-family:var(--font);line-height:var(--leading-normal);font-size:var(--fs-normal);color:var(--color-txt);background-color:var(--color-bg);padding:0px var(--padding-body);width:100vw;overflow-x:hidden}main{padding-top:var(--header-h)}.nav--tabs{height:calc(var(--h-block)*1);width:auto;border:var(--border);border-radius:var(--radius-small);overflow:hidden;display:inline-flex;width:auto;margin:0 auto;margin-bottom:var(--spacing)}.nav--tabs .nav--tabs__btn{font-family:var(--font);font-size:var(--fs-small);font-weight:var(--fw-medium);padding:0 2ch}.nav--tabs .nav--tabs__btn.is-selected{background-color:var(--color-txt);color:var(--color-bg)}.nav--tabs .nav--tabs__btn:not(.is-selected):hover{background-color:var(--grey-800);cursor:pointer}.nav--tabs .nav--tabs__btn+.nav--tabs__btn{border-left:var(--border)}.btn__default{--size: calc(var(--h-block) - 8px);font-size:var(--fs-normal);font-weight:var(--fw-normal);height:var(--size);padding-right:1.5ch;position:relative;display:flex;align-items:center;gap:0ch;color:var(--color-accent);font-weight:var(--fw-medium);text-decoration:none;cursor:pointer}.btn__default .icon,.btn__default .txt{z-index:10}.btn__default .icon{width:var(--size);height:var(--size);display:flex;align-items:center;justify-content:center;color:var(--color-bg);text-align:center}.btn__default .icon svg{fill:var(--color-bg);width:80%}.btn__default .txt{font-family:var(--font-title);color:var(--color-accent);font-size:var(--fs-normal);font-weight:var(--fw-bold);padding-left:1ch}.btn__default::after{content:"";display:block;background-color:var(--color-accent);border-radius:calc(var(--size)/2);width:var(--size);height:var(--size);position:absolute;left:0;z-index:0;transition:width .2s}.btn__default:hover .txt{color:var(--color-bg);display:block}.btn__default:hover::after{width:100%}#donation-cta-mobile{width:100%;display:flex;align-items:center;justify-content:center;padding-top:calc(var(--spacing)*.5);padding-bottom:calc(var(--spacing)*1.5);position:fixed;bottom:0px;left:0;z-index:100;opacity:0;transition:opacity ease-in .2s;pointer-events:none}#donation-cta-mobile.is-visible{pointer-events:all;opacity:1}#donation-cta-mobile.is-sticky{position:relative}@media screen and (min-width: 720px){#donation-cta-mobile{display:none !important}}.donation-cta{--vertical-padding: 0.5ch;height:calc(var(--h-block) + var(--vertical-padding));border-radius:calc(var(--h-block)/1);padding:var(--vertical-padding) 2ch;background-color:var(--color-accent);color:var(--color-bg);font-family:var(--font);font-size:var(--fs-medium);font-weight:var(--fw-bold)}.donation-cta a{text-decoration:none;display:flex;align-items:center;gap:.5ch}.donation-cta .icon{height:28px;position:relative;top:1px}.donation-cta svg{fill:var(--color-bg);width:24px;height:24px}.newsletter-form{--size: 24px;position:relative;display:flex;align-items:center;position:relative}.newsletter-form input[type=email]{height:calc(var(--h-block)*1.25);width:100%;border-radius:calc(var(--h-block)*.625);outline:none;border:none;padding:0 2ch;font-family:var(--font);font-size:var(--fs-normal);z-index:40;padding-top:4px}.newsletter-form input[type=email]::placeholder{font-family:var(--font);font-size:var(--fs-normal)}.newsletter-form input[type=email]:focus{outline:3px solid var(--grey-400)}.newsletter-form button[type=submit].btn--bold{position:absolute;right:2px;z-index:100}.newsletter-form button[type=submit].btn--bold{--size: calc(var(--h-block)*1.25 - 4px);font-family:var(--font);font-size:var(--fs-button-bold);height:var(--size);display:flex;align-items:center;gap:.75ch;color:var(--color-accent);font-weight:var(--fw-medium);text-decoration:none;cursor:pointer}.newsletter-form button[type=submit].btn--bold .icon,.newsletter-form button[type=submit].btn--bold .txt{z-index:10}.newsletter-form button[type=submit].btn--bold .icon{width:var(--size);height:var(--size);display:flex;align-items:center;justify-content:center;color:var(--color-bg);text-align:center}.newsletter-form button[type=submit].btn--bold .icon svg{fill:var(--color-bg);width:80%}.newsletter-form button[type=submit].btn--bold .txt{position:relative;top:2px;font-size:var(--fs-normal);display:none;padding-left:1ch}.newsletter-form button[type=submit].btn--bold::after{content:"";display:block;background-color:var(--color-accent);border-radius:calc(var(--size)/2);width:var(--size);height:var(--size);position:absolute;right:0;z-index:0;transition:width .2s}.newsletter-form button[type=submit].btn--bold:hover .txt{color:var(--color-bg);display:block}.newsletter-form button[type=submit].btn--bold:hover::after{width:100%}.gauge-container{width:100%;display:flex;flex-wrap:wrap;justify-content:space-between;position:relative;top:calc(var(--spacing)*.25);padding:0 calc(var(--spacing)*.5)}#gauge{--gauge-h: 12px;width:100%;margin-bottom:calc(var(--spacing)*.25);height:var(--gauge-h);border-radius:calc(var(--gauge-h)*.5);background-color:var(--color-bg);border:1px solid var(--color-txt);position:relative;box-shadow:7px 6px 5px -3px rgba(0,0,0,.14)}#gauge::before{content:"";display:block;height:calc(var(--gauge-h) - 2px);border-radius:calc(var(--gauge-h)*.5);width:var(--pourcent);min-width:20px;background-color:var(--color-accent);position:absolute;top:0px;left:0px;transition:width cubic-bezier(0.86, 0, 0.07, 1) 1s}.gauge-info .property{font-size:var(--fs-small);padding-bottom:3px}.gauge-info .value{font-size:var(--fs-small)}.gauge-info:last-of-type{text-align:right}#gauge-info--supporters{text-align:center;display:flex;flex-direction:column;justify-content:center}#gauge-info--supporters .value{font-weight:bold;display:inline}#gauge-info--supporters .property{display:inline;padding-bottom:0}@media screen and (min-width: 720px){#gauge{--gauge-h: 18px;border:2px solid var(--color-txt)}#gauge::before{height:calc(var(--gauge-h) - 4px)}.gauge-info .property{font-size:var(--fs-small)}.gauge-info .value{font-size:var(--fs-normal)}}[data-template=subscription-newsletter] .hero-heading,[data-template=thanks] .hero-heading,[data-template=support] .hero-heading,[data-template=store] .hero-heading{font-family:var(--title);font-size:var(--fs-big);font-weight:var(--fw-bold);line-height:1.1;text-align:center;margin:calc(var(--spacing)*1) 0}[data-template=subscription-newsletter] .hero-heading strong,[data-template=thanks] .hero-heading strong,[data-template=support] .hero-heading strong,[data-template=store] .hero-heading strong{font-weight:var(--fw-bolf);color:var(--color-accent)}[data-template=subscription-newsletter] .hero-heading .link-don,[data-template=thanks] .hero-heading .link-don,[data-template=support] .hero-heading .link-don,[data-template=store] .hero-heading .link-don{display:block;color:var(--color-accent);text-decoration:none}[data-template=subscription-newsletter] .hero-heading .link-don:hover,[data-template=thanks] .hero-heading .link-don:hover,[data-template=support] .hero-heading .link-don:hover,[data-template=store] .hero-heading .link-don:hover{text-decoration:underline 2px;text-underline-offset:4px}[data-template=subscription-newsletter] .subheading,[data-template=thanks] .subheading,[data-template=support] .subheading,[data-template=store] .subheading{font-size:var(--fs-medium);font-weight:var(--fw-medium);line-height:1.1;text-align:center;margin:calc(var(--spacing)*1) 0}@media screen and (max-width: 720px){[data-template=subscription-newsletter] .subheading,[data-template=thanks] .subheading,[data-template=support] .subheading,[data-template=store] .subheading{text-align:center;margin:var(--spacing) 0}}[data-template=subscription-newsletter] .text-details,[data-template=thanks] .text-details,[data-template=support] .text-details,[data-template=store] .text-details{font-size:var(--fs-small);margin-bottom:.5em;color:var(--grey-400)}[data-template=subscription-newsletter] .section-heading,[data-template=thanks] .section-heading,[data-template=support] .section-heading,[data-template=store] .section-heading{font-size:var(--fs-normal);font-weight:var(--fw-medium);line-height:1;text-align:center;margin-top:calc(var(--spacing)*.5);margin-bottom:calc(var(--spacing)*1)}[data-template=subscription-newsletter] ul,[data-template=subscription-newsletter] ol,[data-template=thanks] ul,[data-template=thanks] ol,[data-template=support] ul,[data-template=support] ol,[data-template=store] ul,[data-template=store] ol{margin-left:3ch;margin-bottom:.5em}@keyframes add-border{from{border-bottom-color:transparent}to{border-bottom:var(--grey-800)}}#site-header{position:fixed;left:var(--padding-body);top:0px;z-index:900;width:calc(100vw - var(--padding-body)*2);height:var(--header-h);background-color:var(--color-bg);display:flex;align-items:center;justify-content:space-between}#site-header.is-shrinked{height:var(--header-h-shrinked);border-bottom:var(--border-light)}#site-header .site-title{display:flex;width:120px;transition:all ease-in .2s;overflow:hidden}#site-header .site-title svg{fill:var(--color-txt)}#site-header.is-shrinked .site-title{width:80px !important}#site-header .header-left,#site-header .header-right{width:90px;display:flex;align-items:center;justify-content:flex-end}#site-header .header-center{display:flex;flex-direction:column;align-items:center}#site-header #toggle-lang{list-style:none;display:flex;justify-content:flex-end;gap:.75ch;text-transform:uppercase;color:var(--grey-400);line-height:1;margin:0;padding:0}#site-header #toggle-lang a{text-decoration:none}#site-header #toggle-lang li.is-selected{color:var(--color-txt)}#site-footer{background-color:#000;width:100vw;position:relative;left:calc(var(--padding-body)*-1);padding:calc(var(--padding-body)*2) var(--padding-body)}#site-footer p{margin:calc(var(--spacing)*.5) 0}#site-footer p a{text-decoration:none}#site-footer p a:hover{text-decoration:underline}#site-footer .text-small{font-size:var(--fs-x-small)}#site-footer #socials-list{list-style:none;columns:2;max-width:500px;margin:0}#site-footer #socials-list a{display:flex;align-items:center;gap:1ch;text-decoration:none;height:calc(var(--spacing)*1)}#site-footer #socials-list a::after{content:"↗";color:var(--grey-300)}#site-footer #socials-list .text{line-height:1}#site-footer #socials-list .icon{width:20px;height:20px;position:relative;top:-2px}#site-footer #socials-list svg{display:flex;align-items:center;width:20px;height:20px}@media screen and (max-width: 720px){#site-footer{margin-top:calc(var(--spacing)*2)}#site-footer .footer-socials{margin-top:calc(var(--spacing)*1.5)}#site-footer .footer-mentions{margin-top:calc(var(--spacing)*.5)}#site-footer .footer-mentions p{margin-top:calc(var(--spacing)*2)}}@media screen and (min-width: 720px){#site-footer .footer-container{display:grid;grid-template-columns:1fr 1fr;column-gap:calc(var(--spacing)*2);max-width:1200px;margin:0 auto}#site-footer .footer-mentions{grid-column:span 2;text-align:center}#site-footer .footer-mentions p{font-size:var(--font-size);margin-top:calc(var(--spacing)*2)}}@media screen and (min-width: 1080px){#site-footer .footer-container{column-gap:calc(var(--spacing)*4)}}@media screen and (max-width: 720px){#site-footer .footer-mentions{padding-top:calc(var(--spacing)*1);text-align:center}#site-footer .footer-mentions p{margin-top:0}}[data-template=support] section{display:flex;flex-direction:column;margin:0 auto;padding-bottom:calc(var(--spacing)*.75);margin-bottom:calc(var(--spacing)*.75);border-bottom:var(--border-light)}[data-template=support] #section__hero{margin-top:calc(var(--spacing)*1);display:block}[data-template=support] #section__questions{border-bottom:none}[data-template=support] #section__donation:target{padding-top:calc(var(--header-h)*1.25)}[data-template=support] #section__video{display:flex;flex-direction:column;align-items:center}[data-template=support] #section__video .video-container{display:flex}[data-template=support] #section__video video{width:100%;border:1px solid var(--grey-800);max-height:90vh;display:flex}@media screen and (min-width: 1080px){[data-template=support] main{display:grid;grid-template-columns:50% 50%;grid-template-rows:repeat(4, auto);max-width:1200px;margin:0 auto;padding-bottom:0}[data-template=support] #section__donation{padding-top:calc(var(--spacing)*1)}[data-template=support] #section__donation,[data-template=support] #section__comments{border:none}[data-template=support] #section__baseline{padding:calc(var(--spacing)*.5) 0}[data-template=support] .gauge-container{padding-top:calc(var(--spacing)*1)}[data-template=support] .col-left,[data-template=support] .col-right{padding-top:calc(var(--spacing)*1)}[data-template=support] .col-left{grid-column:1;grid-row:1/5}[data-template=support] .col-right{position:sticky;top:calc(var(--spacing)*2.5);grid-column:2;grid-row:1;overflow:hidden}}@media screen and (max-width: 1080px){[data-template=support] main{display:flex;flex-direction:column;align-items:stretch;justify-content:stretch;max-width:600px;margin:0 auto}[data-template=support] section{width:100%}[data-template=support] .col-left,[data-template=support] .col-right{display:contents}[data-template=support] #section__hero{order:1}[data-template=support] #section__donation{order:2}[data-template=support] #section__baseline{order:3}[data-template=support] #section__video{order:4}[data-template=support] #section__comments{order:5}[data-template=support] #section__questions{order:6;margin-bottom:calc(var(--spacing)*2)}}@media screen and (max-height: 670px)and (min-width: 1080px){[data-template=support] .col-left,[data-template=support] .col-right{display:contents}[data-template=support] section{width:100%}[data-template=support] #section__donation{grid-row:1;grid-column:2;position:sticky;top:calc(var(--spacing)*3.75)}[data-template=support] #section__hero{grid-row:1;grid-column:1}[data-template=support] #section__baseline{grid-row:2;grid-column:1}[data-template=support] #section__video{grid-row:3;grid-column:1}[data-template=support] #section__comments{grid-row:4;grid-column:1;border-bottom:var(--border-light)}[data-template=support] #section__questions{grid-row:5;grid-column:1}}#section__donation{display:flex;align-items:center}#section__donation .donation-grid{display:grid;grid-template-columns:1fr 1fr;grid-gap:calc(var(--padding-body)*.75);display:none}@media screen and (min-width: 1080px){#section__donation .donation-grid{width:420px}}@media screen and (max-width: 1080px){#section__donation .donation-grid{width:100%;max-width:420px}}#section__donation .donation-grid .donation-btn--full{grid-column:span 2}#section__donation .donation-grid.is-selected{display:grid}#section__donation .donation-btn{background-color:var(--color-txt);color:var(--color-bg);border-radius:var(--radius-small);height:calc(var(--h-block)*2)}#section__donation .donation-btn .bold{font-family:var(--title);font-size:var(--fs-medium);font-weight:var(--fw-bold);margin-bottom:.25em}#section__donation .donation-btn .small{font-family:var(--font);font-weight:var(--fw-medium);font-size:var(--fs-small)}#section__donation .donation-btn:hover{outline:4px solid var(--color-accent);cursor:pointer}.comment-text{font-size:var(--fs-medium);font-weight:var(--fw-medium);line-height:var(--leading-tight);line-height:1.1;max-width:28ch;text-align:center}.comment-name{margin-top:calc(var(--spacing)*.5);text-align:center}.swiper{width:100%;max-width:700px;height:auto;position:relative;padding-bottom:40px}.swiper .swiper-slide{display:flex;flex-direction:column;align-items:center}.swiper .comments-dots{position:absolute;bottom:10px;left:0;width:100%;text-align:center}.swiper .comments-dots .swiper-pagination-bullet{background-color:var(--grey-600);opacity:1}.swiper .comments-dots .swiper-pagination-bullet-active{background-color:var(--color-txt);opacity:1}#section__questions{max-width:700px}#section__questions summary::marker{content:"";display:none}#section__questions summary::-webkit-details-marker{content:"";display:none}#section__questions details{border-bottom:var(--border)}#section__questions details:first-of-type{border-top:var(--border)}#section__questions details summary{padding-top:calc(var(--spacing)*.25 + 2px);padding-bottom:calc(var(--spacing)*.25);cursor:pointer;position:relative;padding-right:2ch}#section__questions details[open] summary::after{content:"✕";position:absolute;right:0}#section__questions details p{margin:calc(var(--spacing)*.5) 0}#section__questions details ul,#section__questions details ol{margin-bottom:calc(var(--spacing)*.5)}#section__video{margin-bottom:calc(var(--spacing)*2)}#section__video .btn-expand{margin-top:calc(var(--spacing)*1);--size: var(--h-block);font-family:var(--font);font-size:var(--fs-small);font-weight:var(--fw-normal);line-height:1;border:var(--border-light);height:var(--size);border-radius:calc(var(--size)/2);padding-left:1.5ch;padding-right:2ch;padding-top:1px;position:relative;cursor:pointer;display:flex;align-items:center;gap:1ch;font-weight:var(--fw-medium);text-decoration:none;cursor:pointer}#section__video .btn-expand:hover{background-color:var(--grey-800);border-color:var(--color-txt)}#section__video .btn-expand svg{fill:var(--color-txt);width:10px;position:relative;top:1px;left:1px}#section__video .testimonies-list{list-style:none;width:100%;margin-top:calc(var(--spacing)*1);display:none}#section__video .testimonies-list .testimony-item{position:relative;padding-left:40px;padding-right:2ch;margin-bottom:calc(var(--spacing)*.75);cursor:pointer}@media screen and (max-width: 520px){#section__video .testimonies-list .testimony-item .desktop-break{display:none}}#section__video .testimonies-list .testimony-item:hover{color:var(--grey-100)}#section__video .testimonies-list .testimony-item .icon{--size: 20px;flex-shrink:0;width:var(--size);height:var(--size);border-radius:calc(var(--size)/2);border:var(--border);display:flex;align-items:center;justify-content:center;position:absolute;left:0px}#section__video .testimonies-list .testimony-item svg{fill:var(--color-txt);width:7px}#section__video #testimonies-toggle{display:none}#section__video #testimonies-toggle:checked~.testimonies-list{display:block}#video__fullscreen{width:100vw;height:100vh;background-color:var(--color-bg);padding:var(--padding-body);position:fixed;top:0px;left:0;z-index:3000}#video__fullscreen iframe{width:90%;height:calc(100vh - 60px);height:calc(100dvh - 60px);border:var(--border)}#video__fullscreen #video__close{height:60px;font-size:20px;width:100%;font-weight:bold;display:flex;align-items:top;justify-content:flex-end}body.is-fullscreen{overflow:hidden}[data-template=store] main{margin-bottom:calc(var(--spacing)*2)}[data-template=store] .hero-heading{margin-top:calc(var(--spacing)*2)}[data-template=store] #store__container{margin-top:calc(var(--spacing)*2);margin-bottom:calc(var(--spacing)*4);width:100%;max-width:1000px}[data-template=store] #store__container .store__product{position:relative}[data-template=store] #store__container .store__product figure{aspect-ratio:4/3;background-color:var(--color-bg);background-color:var(--data-bg);margin-bottom:calc(var(--spacing)*.5);overflow:hidden}[data-template=store] #store__container .store__product img{width:100%;height:100%;object-fit:contain;transition:var(--curve) .5s}[data-template=store] #store__container .store__product a{text-decoration:none}[data-template=store] #store__container .store__product .link-block{display:block;height:100%;width:100%;position:absolute;top:0;left:0;cursor:pointer}[data-template=store] #store__container .store__product:hover figure{overflow:hidden}[data-template=store] #store__container .store__product:hover img{transform:scale(1.05)}[data-template=store] #store__container .store__product:hover .line-1{text-decoration:underline}@media screen and (max-width: 720px){[data-template=store] #store__container .store__product{margin-top:calc(var(--spacing)*1.5);margin-bottom:calc(var(--spacing)*.5)}}@media screen and (min-width: 720px){[data-template=store] #store__container{display:grid;grid-template-columns:repeat(6, 1fr);column-gap:calc(var(--padding-body)*.75);row-gap:calc(var(--spacing)*2);margin-left:auto;margin-right:auto}[data-template=store] #store__container .store__product{grid-column:span 2}[data-template=store] #store__container .store__product:nth-of-type(1),[data-template=store] #store__container .store__product:nth-of-type(2){grid-column:span 3}}[data-template=store] #site-footer{margin-top:calc(var(--spacing)*4);padding-top:0px}.section__product,.store__nav{max-width:1000px;margin-left:auto;margin-right:auto}.store__nav{padding-top:calc(var(--spacing)*1)}.store__nav a{text-decoration:none}.store__nav a:hover{text-decoration:underline}.store__nav a::before{content:"← "}.section__product figure{aspect-ratio:1/1}.section__product figure img{width:100%;height:100%;object-fit:contain}.section__product #list-size{list-style:none;display:flex;margin-top:calc(var(--spacing)*.5);margin-bottom:calc(var(--spacing)*.5);gap:2ch}.section__product #list-size li{position:relative}.section__product #list-size li input[type=radio]{position:fixed;opacity:0;pointer-events:none}.section__product #list-size li label{font-family:var(--title);font-size:var(--fs-normal);height:4ch;width:4ch;border-radius:50%;border:var(--border);border-color:transparent;display:flex;align-items:center;justify-content:center;padding-top:0px;cursor:pointer}.section__product #list-size li input[type=radio]:checked+label{border-color:var(--color-txt)}.section__product #list-size li input[type=radio]:not(:checked)+label:hover{border-color:var(--grey-600);background-color:var(--grey-800)}.section__product .hero{margin-bottom:calc(var(--spacing)*1);padding-top:calc(var(--spacing)*.5);border-top:var(--border-light)}.section__product .hero .hero-heading{margin:0;text-align:left}.section__product .add-to-cart,.section__product #list-size{margin:0;border-bottom:var(--border-light);padding:calc(var(--spacing)*.5) 0}@media screen and (max-width: 720px){.store__nav a{padding-top:0;font-size:var(--fs-small)}.section__product{display:flex;flex-direction:column}.section__product .col-left{display:contents}.section__product .hero{margin-top:calc(var(--spacing)*.5);order:1}.section__product figure{order:2;margin-bottom:calc(var(--spacing)*1)}.section__product .details{order:3;margin-bottom:calc(var(--spacing)*1.5)}.section__product .size{border-top:var(--border-light);order:4}.section__product .add-to-cart{order:5}}@media screen and (min-width: 720px){.section__product{display:grid;grid-template-columns:50% 50%;aspect-ratio:2/1;margin-top:calc(var(--spacing)*.5);position:relative}.section__product .col-left{padding-right:var(--padding-body)}.section__product .details{margin-bottom:calc(var(--spacing)*3)}.section__product .add-to-cart,.section__product #list-size{width:calc(50% - var(--padding-body))}.section__product .add-to-cart{position:absolute;bottom:10px}.section__product #list-size{position:absolute;bottom:calc(var(--spacing)*2);border-top:var(--border-light)}}[data-template=thanks] .hero-heading{margin-top:calc(var(--spacing)*3);margin-bottom:calc(var(--spacing)*3)}[data-template=thanks] .subheading{text-align:left;max-width:800px;margin:var(--spacing) auto}[data-template=thanks] .subheading a{color:var(--color-accent);text-decoration:none}[data-template=thanks] .subheading a:hover{text-decoration:underline}[data-template=thanks] #site-footer{border-top:none;margin-top:calc(var(--spacing)*4)}.snipcart-modal__container{z-index:1000}[data-template=subscription-newsletter] main{margin-top:calc(var(--spacing)*2)}[data-template=subscription-newsletter] #form__newsletter__container{max-width:700px;margin:calc(var(--spacing)*3) auto;margin-bottom:calc(var(--spacing)*4)}[data-template=subscription-newsletter] #form__newsletter__container .newsletter-form{margin:calc(var(--spacing)*1) 0}[data-template=subscription-newsletter] #form__newsletter__container .newsletter-form input[type=email]{height:calc(var(--h-block)*1.75);border-radius:calc(var(--h-block)*.875);font-size:var(--fs-medium)}[data-template=subscription-newsletter] #form__newsletter__container .newsletter-form input[type=email]::placeholder{font-size:var(--fs-medium)}[data-template=subscription-newsletter] #form__newsletter__container .newsletter-form button[type=submit].btn--bold{--size: calc(var(--h-block)*1.75 - 4px)}[data-template=subscription-newsletter] #form__newsletter__container .newsletter-form button[type=submit].btn--bold .icon svg{width:28px}[data-template=subscription-newsletter] #form__newsletter__container .newsletter-form .txt{padding-left:2ch}[data-template=subscription-newsletter] #form__newsletter__container .subheading{max-width:52ch;text-align:left}[data-template=subscription-newsletter] #form__newsletter__container .text-details{color:var(--color-txt);max-width:80ch}[data-template=subscription-newsletter] #site-footer{margin-top:calc(var(--spacing)*4);padding-top:0px}
diff --git a/assets/css/template/store/_layout.scss b/assets/css/template/store/_layout.scss
index e64adcd..a47ea92 100644
--- a/assets/css/template/store/_layout.scss
+++ b/assets/css/template/store/_layout.scss
@@ -3,7 +3,7 @@
     margin-bottom: calc(var(--spacing) * 2);
   }
 
-  .p__baseline-big {
+  .hero-heading {
     margin-top: calc(var(--spacing) * 2);
   }
 
diff --git a/assets/css/template/store/_section--product.scss b/assets/css/template/store/_section--product.scss
index 40563ef..ebc5417 100644
--- a/assets/css/template/store/_section--product.scss
+++ b/assets/css/template/store/_section--product.scss
@@ -79,7 +79,7 @@
     padding-top: calc(var(--spacing) * 0.5);
     border-top: var(--border-light);
 
-    .p__baseline-big {
+    .hero-heading {
       margin: 0;
       text-align: left;
     }
diff --git a/assets/css/template/store/_thanks.scss b/assets/css/template/store/_thanks.scss
index 670fdef..bf79d64 100644
--- a/assets/css/template/store/_thanks.scss
+++ b/assets/css/template/store/_thanks.scss
@@ -1,11 +1,11 @@
 [data-template="thanks"]{
-    .p__baseline-big {
+    .hero-heading {
         margin-top: calc(var(--spacing) * 3);
         margin-bottom: calc(var(--spacing) * 3);
         // font-size: var(--fs-x-big);
     }
     
-    .p__baseline {
+    .subheading {
         // font-size: var(--fs-big);
         text-align: left;
         max-width: 800px;
diff --git a/assets/css/template/subscription-newsletter/_layout.scss b/assets/css/template/subscription-newsletter/_layout.scss
index 85fe399..382e0f2 100644
--- a/assets/css/template/subscription-newsletter/_layout.scss
+++ b/assets/css/template/subscription-newsletter/_layout.scss
@@ -11,7 +11,7 @@
     margin-bottom: calc(var(--spacing)*4);
 
 
-        .form__newsletter{
+        .newsletter-form{
             margin: calc(var(--spacing)*1) 0;
 
             input[type="email"]{
@@ -34,13 +34,13 @@
             }
         }
 
-        .p__baseline{
+        .subheading{
             max-width: 52ch;
             // margin: 0 auto;
             text-align: left; 
         }
 
-        .p__details{
+        .text-details{
             color: var(--color-txt);
             max-width: 80ch;
         }
diff --git a/assets/css/template/support/_layout.scss b/assets/css/template/support/_layout.scss
index 95ed351..4a242eb 100644
--- a/assets/css/template/support/_layout.scss
+++ b/assets/css/template/support/_layout.scss
@@ -63,7 +63,7 @@
             padding: calc(var(--spacing)*0.5) 0;
         }
 
-        .gauge__container{
+        .gauge-container{
             padding-top: calc(var(--spacing)*1);
         }
 
diff --git a/assets/css/template/support/_section--comments.scss b/assets/css/template/support/_section--comments.scss
index 6d72bde..81abc6d 100644
--- a/assets/css/template/support/_section--comments.scss
+++ b/assets/css/template/support/_section--comments.scss
@@ -1,5 +1,5 @@
 
-  .comment__text{
+  .comment-text{
     font-size: var(--fs-medium);
     font-weight: var(--fw-medium);
     line-height: var(--leading-tight);
@@ -8,7 +8,7 @@
     text-align: center;
   }
   
-  .comment__name {
+  .comment-name {
     margin-top: calc(var(--spacing)*0.5);
     text-align: center;
   }
@@ -29,7 +29,7 @@
       align-items: center;
     }
 
-    .comments-slider__dots{
+    .comments-dots{
       position: absolute;
       bottom: 10px; /* espace du bas */
       left: 0;
diff --git a/assets/css/template/support/_section--donation.scss b/assets/css/template/support/_section--donation.scss
index 20825b7..ff2dfd4 100644
--- a/assets/css/template/support/_section--donation.scss
+++ b/assets/css/template/support/_section--donation.scss
@@ -5,7 +5,7 @@
 
 
 
-    .btn--donation__container{
+    .donation-grid{
         display: grid;
         grid-template-columns: 1fr 1fr;
         grid-gap: calc(var(--padding-body)*0.75);
@@ -19,7 +19,7 @@
             max-width: 420px;
         }
 
-        .btn--donation__grow-2{
+        .donation-btn--full{
             grid-column: span 2;
         }
 
@@ -30,7 +30,7 @@
     }
 
 
-    .btn--donation{
+    .donation-btn{
         background-color: var(--color-txt);
         color: var(--color-bg);
         border-radius: var(--radius-small);
diff --git a/assets/css/template/support/_section--video.scss b/assets/css/template/support/_section--video.scss
index ee2bf96..d97a627 100644
--- a/assets/css/template/support/_section--video.scss
+++ b/assets/css/template/support/_section--video.scss
@@ -1,7 +1,7 @@
 #section__video{
     margin-bottom: calc(var(--spacing)*2);
 
-    .btn__deploy{
+    .btn-expand{
         margin-top: calc(var(--spacing)*1);
         --size: var(--h-block);
         font-family: var(--font);
@@ -45,13 +45,13 @@
     }
 
 
-    .videos__ul{
+    .testimonies-list{
         list-style: none;
         width: 100%;
         margin-top: calc(var(--spacing)*1);
         display: none;
 
-        .videos__li{
+        .testimony-item{
 
             position: relative;
             padding-left: 40px;
@@ -66,7 +66,7 @@
             cursor: pointer;
 
             @media screen and (max-width: 520px){
-                .br-desktop{ display: none; }
+                .desktop-break{ display: none; }
             }
       
 
@@ -96,9 +96,9 @@
         }
     }
 
-    #videos__input{ display: none }
+    #testimonies-toggle{ display: none }
 
-    #videos__input:checked ~ .videos__ul{
+    #testimonies-toggle:checked ~ .testimonies-list{
         display: block;
     }
 }
diff --git a/assets/js/donation.js b/assets/js/donation.js
index 8c3ef58..80e50b0 100644
--- a/assets/js/donation.js
+++ b/assets/js/donation.js
@@ -74,7 +74,7 @@
 
   function initTabs() {
     const tabButtons = document.querySelectorAll('.nav--tabs__btn');
-    const containers = document.querySelectorAll('.btn--donation__container');
+    const containers = document.querySelectorAll('.donation-grid');
 
     tabButtons.forEach((button, index) => {
       button.addEventListener('click', () => {
@@ -91,9 +91,9 @@
 
   function initDonationButtons() {
     const oneOffContainer = document.querySelector(
-      '[data-donnation="one-off"]'
+      '[data-donation="one-off"]'
     );
-    const oneOffButtons = oneOffContainer.querySelectorAll('.btn--donation');
+    const oneOffButtons = oneOffContainer.querySelectorAll('.donation-btn');
 
     oneOffButtons.forEach((button, index) => {
       if (index < AMOUNTS.oneOff.length) {
@@ -118,9 +118,9 @@
     });
 
     const monthlyContainer = document.querySelector(
-      '[data-donnation="monthly"]'
+      '[data-donation="monthly"]'
     );
-    const monthlyButtons = monthlyContainer.querySelectorAll('.btn--donation');
+    const monthlyButtons = monthlyContainer.querySelectorAll('.donation-btn');
 
     monthlyButtons.forEach((button, index) => {
       if (index < AMOUNTS.monthly.length) {
diff --git a/assets/js/donorbox-gauge.js b/assets/js/donorbox-gauge.js
index 3401c41..fde403a 100644
--- a/assets/js/donorbox-gauge.js
+++ b/assets/js/donorbox-gauge.js
@@ -45,7 +45,7 @@ function updateGaugeDisplay(campaignData) {
   }
 
   const countElement = document.querySelector(
-    '#gauge--infos__donateurs .value'
+    '#gauge-info--supporters .value'
   );
   if (countElement) {
     countElement.textContent = totalSupport;
diff --git a/assets/js/newsletter-brevo.js b/assets/js/newsletter-brevo.js
index f84b403..1e3bb38 100644
--- a/assets/js/newsletter-brevo.js
+++ b/assets/js/newsletter-brevo.js
@@ -81,7 +81,7 @@
   }
 
   function initNewsletterForms() {
-    const forms = document.querySelectorAll('.form__newsletter');
+    const forms = document.querySelectorAll('.newsletter-form');
     forms.forEach((form) => form.addEventListener('submit', handleFormSubmit));
   }
 
diff --git a/assets/js/onload.js b/assets/js/onload.js
index c2c7211..f554713 100644
--- a/assets/js/onload.js
+++ b/assets/js/onload.js
@@ -27,7 +27,7 @@ function headerShrink() {
 }
 
 function toggleDonationButton() {
-  const btn = document.getElementById('btn--don__mobile');
+  const btn = document.getElementById('donation-cta-mobile');
   const section = document.getElementById('section__donation');
   const footer = document.getElementById('site-footer');
 
@@ -61,7 +61,7 @@ function videos(){
   let section = document.getElementById("section__video");
   console.log(section);
 
-  let videoslinks = document.querySelectorAll(".videos__li");
+  let videoslinks = document.querySelectorAll(".testimony-item");
   videoslinks.forEach(function (video, index) {
 
     video.addEventListener("click", (event) => { 
diff --git a/en/index.html b/en/index.html
index fdc4982..4b88453 100644
--- a/en/index.html
+++ b/en/index.html
@@ -89,36 +89,36 @@
     <main>
       <div class="col-left">
         <section id="section__hero">
-          <p class="p__baseline-big">
+          <p class="hero-heading">
             To keep investigating, <br />Index needs your help
           </p>
 
-          <div class="gauge__container">
+          <div class="gauge-container">
             <div id="gauge" style="--pourcent: 0%"></div>
-            <div class="gauge--infos" id="gauge--infos__donateurs">
+            <div class="gauge-info" id="gauge-info--supporters">
               <p class="property">Regular supporters</p>
               <p class="value">0</p>
             </div>
-            <div class="gauge--infos" id="gauge--infos__objectif">
+            <div class="gauge-info" id="gauge-info--goal">
               <p class="property">Goal</p>
               <p class="value">500</p>
             </div>
           </div>
 
-          <p class="p__baseline-big">
+          <p class="hero-heading">
             Goal: 500 Supporters<br /><strong>by 21 June 2026</strong>
           </p>
         </section>
 
         <section id="section__baseline">
-          <p class="p__baseline">
+          <p class="subheading">
             Index is a not-for-profit, <br />digital investigation NGO.<br />Your
             support guarantees our independence.
           </p>
         </section>
 
         <section id="section__video">
-          <h2 class="section__heading">Why support Index? Hear from those at the heart of it.</h2>
+          <h2 class="section-heading">Why support Index? Hear from those at the heart of it.</h2>
           <div class="video-container">
             <iframe
               src="https://player.vimeo.com/video/1136957715?h=215c38e160&amp;badge=0&amp;autopause=0&amp;player_id=0&amp;app_id=58479&autoplay=1"
@@ -131,7 +131,7 @@
         </section>
 
         <section id="section__questions">
-          <h3 class="section__heading">Frequently Asked Questions</h3>
+          <h2 class="section-heading">Frequently Asked Questions</h2>
 
           <details>
             <summary>What are Index Supporters?</summary>
@@ -343,49 +343,49 @@
           </nav>
 
           <div
-            data-donnation="one-off"
-            class="btn--donation__container"
+            data-donation="one-off"
+            class="donation-grid"
           >
-            <button class="btn--donation">
+            <button class="donation-btn">
               <p class="bold">200&#8239;€</p>
               <p class="small">That is 68&#8239;€ after tax</p>
             </button>
-            <button class="btn--donation btn--donation__grow-1">
+            <button class="donation-btn donation-btn--wide">
               <p class="bold">100&#8239;€</p>
               <p class="small">That is 34&#8239;€ after tax</p>
             </button>
-            <button class="btn--donation btn--donation__grow-1">
+            <button class="donation-btn donation-btn--wide">
               <p class="bold">50&#8239;€</p>
               <p class="small">That is 17&#8239;€ after tax</p>
             </button>
-            <button class="btn--donation btn--donation__grow-1">
+            <button class="donation-btn donation-btn--wide">
               <p class="bold">20&#8239;€</p>
               <p class="small">That is 6.80&#8239;€ after tax</p>
             </button>
-            <button class="btn--donation btn--donation__grow-2">
+            <button class="donation-btn donation-btn--full">
               <p class="bold">Choose your amount</p>
               <p class="small">With 66&#8239;% tax deduction</p>
             </button>
           </div>
 
-          <div data-donnation="monthly" class="btn--donation__container is-selected">
-            <button class="btn--donation">
+          <div data-donation="monthly" class="donation-grid is-selected">
+            <button class="donation-btn">
               <p class="bold">5€/month</p>
               <p class="small">That is X€ after taxes</p>
             </button>
-            <button class="btn--donation btn--donation__grow-1">
+            <button class="donation-btn donation-btn--wide">
               <p class="bold">10€/month</p>
               <p class="small">That is X€ after taxes</p>
             </button>
-            <button class="btn--donation btn--donation__grow-1">
+            <button class="donation-btn donation-btn--wide">
               <p class="bold">20€/month</p>
               <p class="small">That is X€ after taxes</p>
             </button>
-            <button class="btn--donation btn--donation__grow-1">
+            <button class="donation-btn donation-btn--wide">
               <p class="bold">50€/month</p>
               <p class="small">That is X€ after taxes</p>
             </button>
-            <button class="btn--donation btn--donation__grow-2">
+            <button class="donation-btn donation-btn--full">
               <p class="bold">Choose your amount</p>
               <p class="small">With tax deduction</p>
             </button>
@@ -393,60 +393,59 @@
         </section>
 
         <section id="section__comments">
-          <h2 class="section__heading">Donor comments</h2>
+          <h2 class="section-heading">Donor comments</h2>
 
           <div class="swiper" id="comments-slider">
             <div class="swiper-wrapper">
               <div class="swiper-slide comment">
-                <p class="comment__text">
+                <p class="comment-text">
                   You are doing admirable work. Thank you for helping Justice
                   with a capital J. Keep up the good work!
                 </p>
-                <p class="comment__name">Olivier</p>
+                <p class="comment-name">Olivier</p>
               </div>
 
               <div class="swiper-slide comment">
-                <p class="comment__text">
+                <p class="comment-text">
                   Thank you for the beneficial, valuable, and extremely
                   professional work you do.
                 </p>
-                <p class="comment__name">Myriam</p>
+                <p class="comment-name">Myriam</p>
               </div>
 
               <div class="swiper-slide comment">
-                <p class="comment__text">
+                <p class="comment-text">
                   You are truly serving the public good, and the methods you use
                   deserve to be widely known.
                 </p>
-                <p class="comment__name">Frédéric</p>
+                <p class="comment-name">Frédéric</p>
               </div>
 
               <div class="swiper-slide comment">
-                <p class="comment__text">
+                <p class="comment-text">
                   Thank you for continuing your tireless quest to reveal the
                   truths that are being kept from us.
                 </p>
-                <p class="comment__name">Pauline</p>
+                <p class="comment-name">Pauline</p>
               </div>
 
               <div class="swiper-slide comment">
-                <p class="comment__text">
+                <p class="comment-text">
                   Index investigators do essential work for democracy and
                   justice. Through this citizen support, I express my gratitude
                   for their commitment and rigor.
                 </p>
-                <p class="comment__name">Anne</p>
+                <p class="comment-name">Anne</p>
               </div>
             </div>
 
-            <div class="swiper-pagination comments-slider__dots"></div>
+            <div class="swiper-pagination comments-dots"></div>
           </div>
         </section>
       </div>
 
-      <div id="btn--don__mobile">
-        <button class="btn--don">
-          <a href="#section__donation">
+      <div id="donation-cta-mobile">
+        <a href="#section__donation" class="donation-cta" role="button">
             <span class="txt">Donate</span>
             <span class="icon">
               <svg
@@ -463,21 +462,20 @@
                 />
               </svg>
             </span>
-          </a>
-        </button>
+        </a>
       </div>
     </main>
 
     <footer id="site-footer">
-      <div class="site-footer__container">
-        <div class="footer__newsletter">
+      <div class="footer-container">
+        <div class="footer-newsletter">
           <p>
             Receive the latest investigation and news from Index directly in
             your inbox.
           </p>
           <p>Sign up for the newsletter</p>
 
-          <form class="form__newsletter">
+          <form class="newsletter-form">
             <input
               type="email"
               name="email"
@@ -504,7 +502,7 @@
             </button>
           </form>
 
-          <p class="p__small">
+          <p class="text-small">
             By signing up, you agree to Index's
             <a target="_blank" href="https://www.index.ngo/mentions-legales/"
               >terms of use</a
@@ -512,10 +510,10 @@
           </p>
         </div>
 
-        <div class="footer__socials">
+        <div class="footer-socials">
           <p>Follow Index on social media</p>
 
-          <ul id="list-socials">
+          <ul id="socials-list">
             <li>
               <a
                 href="https://www.youtube.com/index-ngo"
@@ -696,8 +694,8 @@
           </ul>
         </div>
 
-        <div class="footer__mentions">
-          <p class="p__small">
+        <div class="footer-mentions">
+          <p class="text-small">
             © 2025 Index Investigation |
             <a target="_blank" href="https://www.index.ngo/mentions-legales/"
               >Legal notices</a
@@ -716,7 +714,7 @@
           disableOnInteraction: false,
         },
         pagination: {
-          el: '.comments-slider__dots',
+          el: '.comments-dots',
           clickable: true,
         },
       });
diff --git a/en/index.php b/en/index.php
new file mode 100644
index 0000000..d26de2b
--- /dev/null
+++ b/en/index.php
@@ -0,0 +1,270 @@
+<?php
+require_once __DIR__ . '/../includes/cache.php';
+$data = getSoutenirContent('en');
+?>
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title><?= htmlspecialchars($data['metaTitle'] ?? 'Support Index') ?></title>
+    <meta name="description" content="<?= htmlspecialchars($data['metaDescription'] ?? '') ?>" />
+
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@12/swiper-bundle.min.css" />
+    <script src="https://cdn.jsdelivr.net/npm/swiper@12/swiper-bundle.min.js"></script>
+
+    <link rel="icon" type="image/png" href="/assets/favicon.png" />
+    <link rel="stylesheet" type="text/css" href="/assets/fonts/stylesheet.css" />
+    <link rel="stylesheet" type="text/css" href="/assets/css/style.css" />
+    <script src="/assets/js/onload.js"></script>
+    <script src="/assets/js/temp/includeHtml.js"></script>
+    <script src="/assets/js/donorbox-gauge.js"></script>
+    <script src="/assets/js/donation.js"></script>
+    <script src="/assets/js/newsletter-brevo.js"></script>
+    <meta name="robots" content="index, nofollow" />
+  </head>
+  <body data-template="support">
+    <header id="site-header">
+      <div class="header-left"></div>
+      <div class="header-center">
+        <h1 class="site-title">
+          <a href="https://www.index.ngo/en" aria-label="Back to home" title="go to Index website">
+            <svg width="100%" height="100%" viewBox="0 0 162 29" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
+              <title>Index.ngo</title>
+              <g transform="matrix(1.04516,0,0,0.659091,57.4839,-6.59091)">
+                <rect x="-55" y="10" width="155" height="44" style="fill:none"/>
+                <clipPath id="_clip1"><rect x="-55" y="10" width="155" height="44"/></clipPath>
+                <g clip-path="url(#_clip1)">
+                  <g transform="matrix(0.95679,0,0,1.51724,-55,10)">
+                    <path d="M162,29L148.198,29L141.174,20.767L134.15,29L91.184,29L91.184,0.004L120.653,0.004L120.653,7.351L102.637,7.351L102.637,10.867L120.137,10.867L120.137,18.13L102.637,18.13L102.637,21.606L120.926,21.606L120.926,28.951L134.273,14.414L120.807,0L134.56,0L141.388,7.767L147.76,0L161.201,0L148.236,13.79L161.996,28.997L162,29ZM68.58,29L54.224,29L54.224,0.004L68.637,0.004C74.672,0.004 78.31,0.004 82.046,2.045C86.259,4.379 88.674,8.889 88.674,14.417C88.674,19.406 86.862,23.405 83.427,25.975C79.463,29 75.345,29 68.58,29ZM49.819,29L38.775,29L31.499,19.815C29.746,17.735 28.088,15.545 27.307,14.495C27.387,15.813 27.524,17.238 27.524,20.499L27.524,29L15.965,29L15.965,0.004L27.009,0.004L33.798,8.349C36.223,11.121 37.709,12.993 38.393,13.881C38.347,12.615 38.26,9.911 38.26,6.84L38.26,0.004L49.819,0.004L49.819,29ZM11.559,29L0,29L0,0.004L11.559,0.004L11.559,29ZM65.784,21.818L67.904,21.818C70.918,21.818 73.067,21.818 74.728,20.531C76.074,19.491 76.845,17.308 76.845,14.541C76.845,11.526 76.084,9.541 74.525,8.476C72.895,7.411 71.461,7.224 67.578,7.224L65.784,7.224L65.784,21.818Z" style="fill-rule:nonzero"/>
+                  </g>
+                </g>
+              </g>
+            </svg>
+          </a>
+        </h1>
+      </div>
+      <div class="header-right">
+        <ul id="toggle-lang">
+          <li><a href="../">Fr</a></li>
+          <li class="is-selected"><a href="./">En</a></li>
+        </ul>
+      </div>
+    </header>
+
+    <main>
+      <div class="col-left">
+        <section id="section__hero">
+          <p class="hero-heading"><?= $data['heroHeading'] ?? '' ?></p>
+
+          <div class="gauge-container">
+            <div id="gauge" style="--pourcent: 0%"></div>
+            <div class="gauge-info" id="gauge-info--supporters">
+              <p class="property">Regular supporters</p>
+              <p class="value">0</p>
+            </div>
+            <div class="gauge-info" id="gauge-info--goal">
+              <p class="property">Goal</p>
+              <p class="value">500</p>
+            </div>
+          </div>
+
+          <p class="hero-heading">
+            <?= htmlspecialchars($data['heroObjectiveLabel'] ?? '') ?><br />
+            <strong><?= htmlspecialchars($data['heroObjectiveDate'] ?? '') ?></strong>
+          </p>
+        </section>
+
+        <section id="section__baseline">
+          <p class="subheading"><?= $data['subheading'] ?? '' ?></p>
+        </section>
+
+        <section id="section__video">
+          <h2 class="section-heading"><?= $data['videoSectionHeading'] ?? '' ?></h2>
+          <div class="video-container">
+            <iframe
+              title="Campaign video"
+              src="<?= htmlspecialchars($data['mainVideoUrl'] ?? '') ?>"
+              style="aspect-ratio: 9/16; width: 100%; border: 0"
+              allow="autoplay; fullscreen; picture-in-picture"
+              allowfullscreen
+            ></iframe>
+          </div>
+
+          <?php if (!empty($data['testimonies'])): ?>
+          <input type="checkbox" id="testimonies-toggle" />
+          <label class="btn-expand" for="testimonies-toggle">
+            <span class="txt"><?= htmlspecialchars($data['testimoniesButtonLabel'] ?? 'Watch testimonies') ?></span>
+            <span class="icon"><svg width="34px" height="34px" viewBox="0 0 16 13" version="1.1" xmlns="http://www.w3.org/2000/svg" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
+              <rect x="0" y="0" width="15.43" height="12.636" style="fill:none"/>
+              <path d="M0,7.29L0,5.373L9.801,5.373C10.67,5.373 11.757,5.4 12.387,5.427C11.952,5.022 11.366,4.455 10.888,3.969L8.432,1.404L9.366,0L15.43,6.318L9.366,12.636L8.432,11.232L10.888,8.667C11.366,8.181 11.952,7.614 12.387,7.236C11.757,7.263 10.67,7.29 9.801,7.29L0,7.29Z" style="fill-rule:nonzero"/>
+            </svg></span>
+          </label>
+
+          <ul class="testimonies-list">
+            <?php foreach ($data['testimonies'] as $testimony): ?>
+            <li class="testimony-item" data-video="<?= htmlspecialchars($testimony['videoUrl']) ?>">
+              <span class="icon">
+                <svg height="80px" width="80px" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg">
+                  <path d="M500.203,236.907L30.869,2.24c-6.613-3.285-14.443-2.944-20.736,0.939C3.84,7.083,0,13.931,0,21.333v469.333 c0,7.403,3.84,14.251,10.133,18.155c3.413,2.112,7.296,3.179,11.2,3.179c3.264,0,6.528-0.747,9.536-2.24l469.333-234.667 C507.435,271.467,512,264.085,512,256S507.435,240.533,500.203,236.907z"/>
+                </svg>
+              </span>
+              <p class="txt"><?= $testimony['description'] ?></p>
+            </li>
+            <?php endforeach; ?>
+          </ul>
+          <?php endif; ?>
+        </section>
+
+        <section id="section__questions">
+          <h2 class="section-heading"><?= htmlspecialchars($data['faqHeading'] ?? 'Frequently Asked Questions') ?></h2>
+
+          <?php foreach (($data['questions'] ?? []) as $q): ?>
+          <details>
+            <summary><?= htmlspecialchars($q['question']) ?></summary>
+            <?= $q['answer'] ?>
+          </details>
+          <?php endforeach; ?>
+        </section>
+      </div>
+
+      <div class="col-right">
+        <section id="section__donation">
+          <nav class="nav--tabs">
+            <button class="nav--tabs__btn is-selected">Monthly donation</button>
+            <button class="nav--tabs__btn">One-time donation</button>
+          </nav>
+
+          <div data-donation="one-off" class="donation-grid">
+            <button class="donation-btn">
+              <p class="bold">200&#8239;€</p>
+              <p class="small">That is 68&#8239;€ after tax</p>
+            </button>
+            <button class="donation-btn donation-btn--wide">
+              <p class="bold">100&#8239;€</p>
+              <p class="small">That is 34&#8239;€ after tax</p>
+            </button>
+            <button class="donation-btn donation-btn--wide">
+              <p class="bold">50&#8239;€</p>
+              <p class="small">That is 17&#8239;€ after tax</p>
+            </button>
+            <button class="donation-btn donation-btn--wide">
+              <p class="bold">20&#8239;€</p>
+              <p class="small">That is 6.80&#8239;€ after tax</p>
+            </button>
+            <button class="donation-btn donation-btn--full">
+              <p class="bold">Choose your amount</p>
+              <p class="small">With 66&#8239;% tax deduction</p>
+            </button>
+          </div>
+
+          <div data-donation="monthly" class="donation-grid is-selected">
+            <button class="donation-btn">
+              <p class="bold">5€/month</p>
+              <p class="small">That is X€ after taxes</p>
+            </button>
+            <button class="donation-btn donation-btn--wide">
+              <p class="bold">10€/month</p>
+              <p class="small">That is X€ after taxes</p>
+            </button>
+            <button class="donation-btn donation-btn--wide">
+              <p class="bold">20€/month</p>
+              <p class="small">That is X€ after taxes</p>
+            </button>
+            <button class="donation-btn donation-btn--wide">
+              <p class="bold">50€/month</p>
+              <p class="small">That is X€ after taxes</p>
+            </button>
+            <button class="donation-btn donation-btn--full">
+              <p class="bold">Choose your amount</p>
+              <p class="small">With tax deduction</p>
+            </button>
+          </div>
+        </section>
+
+        <section id="section__comments">
+          <h2 class="section-heading"><?= htmlspecialchars($data['commentsHeading'] ?? 'Donor comments') ?></h2>
+
+          <div class="swiper" id="comments-slider">
+            <div class="swiper-wrapper">
+              <?php foreach (($data['comments'] ?? []) as $comment): ?>
+              <div class="swiper-slide">
+                <p class="comment-text"><?= htmlspecialchars($comment['text']) ?></p>
+                <p class="comment-name"><?= htmlspecialchars($comment['name']) ?></p>
+              </div>
+              <?php endforeach; ?>
+            </div>
+            <div class="swiper-pagination comments-dots"></div>
+          </div>
+        </section>
+      </div>
+
+      <div id="donation-cta-mobile">
+        <a href="#section__donation" class="donation-cta" role="button">
+            <span class="txt">Donate</span>
+            <span class="icon">
+              <svg clip-rule="evenodd" fill-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+                <path d="m14.523 18.787s4.501-4.505 6.255-6.26c.146-.146.219-.338.219-.53s-.073-.383-.219-.53c-1.753-1.754-6.255-6.258-6.255-6.258-.144-.145-.334-.217-.524-.217-.193 0-.385.074-.532.221-.293.292-.295.766-.004 1.056l4.978 4.978h-14.692c-.414 0-.75.336-.75.75s.336.75.75.75h14.692l-4.979 4.979c-.289.289-.286.762.006 1.054.148.148.341.222.533.222.19 0 .378-.072.522-.215z" fill-rule="nonzero"/>
+              </svg>
+            </span>
+        </a>
+      </div>
+    </main>
+
+    <footer id="site-footer">
+      <div class="footer-container">
+        <div class="footer-newsletter">
+          <p><?= $data['footerNewsletterText'] ?? '' ?></p>
+
+          <form class="newsletter-form">
+            <input type="email" name="email" placeholder="Your email address" required />
+            <button class="btn--bold" type="submit" aria-label="subscribe">
+              <span class="txt"><?= htmlspecialchars($data['footerNewsletterCta'] ?? 'Subscribe') ?></span>
+              <span class="icon">
+                <svg clip-rule="evenodd" fill-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+                  <path d="m14.523 18.787s4.501-4.505 6.255-6.26c.146-.146.219-.338.219-.53s-.073-.383-.219-.53c-1.753-1.754-6.255-6.258-6.255-6.258-.144-.145-.334-.217-.524-.217-.193 0-.385.074-.532.221-.293.292-.295.766-.004 1.056l4.978 4.978h-14.692c-.414 0-.75.336-.75.75s.336.75.75.75h14.692l-4.979 4.979c-.289.289-.286.762.006 1.054.148.148.341.222.533.222.19 0 .378-.072.522-.215z" fill-rule="nonzero"/>
+                </svg>
+              </span>
+            </button>
+          </form>
+
+          <p class="text-small"><?= $data['footerNewsletterDisclaimer'] ?? '' ?></p>
+        </div>
+
+        <div class="footer-socials">
+          <p><?= htmlspecialchars($data['footerSocialsHeading'] ?? '') ?></p>
+
+          <ul id="socials-list">
+            <?php foreach (($data['footerSocials'] ?? []) as $social): ?>
+            <li>
+              <a href="<?= htmlspecialchars($social['url']) ?>" target="_blank" rel="noopener noreferrer">
+                <span class="icon"><?= $social['svgIcon'] ?></span>
+                <span class="text"><?= htmlspecialchars($social['name']) ?></span>
+              </a>
+            </li>
+            <?php endforeach; ?>
+          </ul>
+        </div>
+
+        <div class="footer-mentions">
+          <p class="text-small"><?= $data['footerMentions'] ?? '' ?></p>
+        </div>
+      </div>
+    </footer>
+
+    <script>
+      const swiper = new Swiper('#comments-slider', {
+        slidesPerView: 1,
+        loop: true,
+        autoplay: {
+          delay: 4000,
+          disableOnInteraction: false,
+        },
+        pagination: {
+          el: '.comments-dots',
+          clickable: true,
+        },
+      });
+    </script>
+  </body>
+</html>
diff --git a/includes/cache.php b/includes/cache.php
new file mode 100644
index 0000000..9514a4f
--- /dev/null
+++ b/includes/cache.php
@@ -0,0 +1,42 @@
+<?php
+
+require_once __DIR__ . '/config.php';
+
+function getSoutenirContent(string $lang = 'fr'): array {
+    $cacheFile = CACHE_DIR . "/content.{$lang}.json";
+
+    // Serve cache if fresh
+    if (file_exists($cacheFile) && (time() - filemtime($cacheFile)) < CACHE_TTL) {
+        return json_decode(file_get_contents($cacheFile), true) ?: [];
+    }
+
+    // Fetch from Kirby API
+    $url = KIRBY_API_URL . '?lang=' . urlencode($lang);
+    if (SOUTIEN_API_TOKEN) {
+        $url .= '&token=' . urlencode(SOUTIEN_API_TOKEN);
+    }
+
+    $context = stream_context_create([
+        'http' => [
+            'timeout' => 5,
+            'header' => "Referer: https://soutenir.index.ngo\r\n",
+        ],
+    ]);
+
+    $response = @file_get_contents($url, false, $context);
+
+    if ($response !== false) {
+        $data = json_decode($response, true);
+        if ($data && !isset($data['error'])) {
+            @file_put_contents($cacheFile, $response, LOCK_EX);
+            return $data;
+        }
+    }
+
+    // Fallback: serve stale cache rather than nothing
+    if (file_exists($cacheFile)) {
+        return json_decode(file_get_contents($cacheFile), true) ?: [];
+    }
+
+    return [];
+}
diff --git a/includes/config.php b/includes/config.php
new file mode 100644
index 0000000..5f4447f
--- /dev/null
+++ b/includes/config.php
@@ -0,0 +1,6 @@
+<?php
+
+define('KIRBY_API_URL', 'https://www.index.ngo/api/soutien-content');
+define('SOUTIEN_API_TOKEN', ''); // À remplir avec le même token que dans la config Kirby
+define('CACHE_TTL', 300); // 5 minutes
+define('CACHE_DIR', __DIR__ . '/../cache');
diff --git a/index.html b/index.html
index 6753dbc..51f69cf 100644
--- a/index.html
+++ b/index.html
@@ -90,36 +90,36 @@
     <main>
       <div class="col-left">
         <section id="section__hero">
-          <p class="p__baseline-big">
+          <p class="hero-heading">
             Pour continuer à enquêter, <br />Index a besoin de vous
           </p>
 
-          <div class="gauge__container">
+          <div class="gauge-container">
             <div id="gauge" style="--pourcent: 0%"></div>
-            <div class="gauge--infos" id="gauge--infos__donateurs">
+            <div class="gauge-info" id="gauge-info--supporters">
               <p class="property">Soutiens réguliers</p>
               <p class="value">0</p>
             </div>
-            <div class="gauge--infos" id="gauge--infos__objectif">
+            <div class="gauge-info" id="gauge-info--goal">
               <p class="property">Objectif</p>
               <p class="value">500</p>
             </div>
           </div>
 
-          <p class="p__baseline-big">
+          <p class="hero-heading">
             Objectif 500 Soutiens<br /><strong>au 21 juin 2026</strong>
           </p>
         </section>
 
         <section id="section__baseline">
-          <p class="p__baseline">
+          <p class="subheading">
             Index est une ONG d’investigation <br />à&nbsp;but non-lucratif.
             <br />Vos dons garantissent notre indépendance.
           </p>
         </section>
 
         <section id="section__video">
-          <h2 class="section__heading">
+          <h2 class="section-heading">
             Pourquoi soutenir Index&#8239; ? <br />Écoutez les premier·es
             concerné·es
           </h2>
@@ -133,8 +133,8 @@
             ></iframe>
           </div>
 
-          <input type="checkbox" id="videos__input" />
-          <label class="btn__deploy" for="videos__input">
+          <input type="checkbox" id="testimonies-toggle" />
+          <label class="btn-expand" for="testimonies-toggle">
             <span class="txt">Voir les témoignages</span>
             <span class="icon"
               ><svg
@@ -169,9 +169,9 @@
             ></span>
           </label>
 
-          <ul class="videos__ul">
+          <ul class="testimonies-list">
             <li
-              class="videos__li"
+              class="testimony-item"
               data-video="https://player.vimeo.com/video/1138884807?h=384a2d15ea&autoplay=1"
             >
               <span class="icon">
@@ -192,13 +192,13 @@
               <p class="txt">
                 «&#8239;Index fait un travail que&nbsp;la&nbsp;justice
                 ne&nbsp;fait pas »&#8239;:
-                <span class="br-desktop"><br /></span>le&nbsp;témoignage
+                <span class="desktop-break"><br /></span>le&nbsp;témoignage
                 d’Issam&nbsp;El&nbsp;Khalfaoui
               </p>
             </li>
 
             <li
-              class="videos__li"
+              class="testimony-item"
               data-video="https://player.vimeo.com/video/1145581831?h=ce46358189&autoplay=1"
             >
               <span class="icon">
@@ -224,7 +224,7 @@
             </li>
 
             <li
-              class="videos__li"
+              class="testimony-item"
               data-video="https://player.vimeo.com/video/1142401468?h=f88778b3dd&autoplay=1"
             >
               <span class="icon">
@@ -244,13 +244,13 @@
               </span>
               <p class="txt">
                 «&#8239;Les enquêtes d'Index doivent continuer&#8239;»&#8239;:
-                <span class="br-desktop"><br /></span>le&nbsp;témoignage
+                <span class="desktop-break"><br /></span>le&nbsp;témoignage
                 d’Assa&nbsp;Traoré
               </p>
             </li>
 
             <li
-              class="videos__li"
+              class="testimony-item"
               data-video="https://player.vimeo.com/video/1143395847?h=f28d317c46&autoplay=1"
             >
               <span class="icon">
@@ -271,13 +271,13 @@
               <p class="txt">
                 «&#8239;Vous faites un travail rare
                 et&nbsp;concret&#8239;»&#8239;:
-                <span class="br-desktop"><br /></span>le&nbsp;témoignage
+                <span class="desktop-break"><br /></span>le&nbsp;témoignage
                 de&nbsp;Jérôme&nbsp;Rodrigues
               </p>
             </li>
 
             <li
-              class="videos__li"
+              class="testimony-item"
               data-video="https://player.vimeo.com/video/1144550389?h=5781ebef9b&autoplay=1"
             >
               <span class="icon">
@@ -297,13 +297,13 @@
               </span>
               <p class="txt">
                 «&#8239;Index est d’un intérêt public absolu&#8239;»&#8239;:
-                <span class="br-desktop"><br /></span>le&nbsp;témoignage
+                <span class="desktop-break"><br /></span>le&nbsp;témoignage
                 de&nbsp;Fatiha&nbsp;B.
               </p>
             </li>
 
             <li
-              class="videos__li"
+              class="testimony-item"
               data-video="https://player.vimeo.com/video/1145649552?h=63bd03334b&autoplay=1"
             >
               <span class="icon">
@@ -324,13 +324,13 @@
               <p class="txt">
                 «&#8239;Je n’aurais jamais imaginé recevoir un&nbsp;tel
                 soutien&#8239;»&#8239;:
-                <span class="br-desktop"><br /></span>le&nbsp;témoignage
+                <span class="desktop-break"><br /></span>le&nbsp;témoignage
                 de&nbsp;Jean-François&nbsp;Martin
               </p>
             </li>
 
             <li
-              class="videos__li"
+              class="testimony-item"
               data-video="https://player.vimeo.com/video/1146620554?badge=0&amp;autopause=0&amp;player_id=0&amp;app_id=58479&autoplay=1"
             >
               <span class="icon">
@@ -351,13 +351,13 @@
               <p class="txt">
                 «&#8239;Le travail d'Index a permis de rétablir
                 la&nbsp;vérité&#8239;»&#8239;:
-                <span class="br-desktop"><br /></span>le&nbsp;témoignage de
+                <span class="desktop-break"><br /></span>le&nbsp;témoignage de
                 Mahamadou&nbsp;Camara, frère de&nbsp;Gaye
               </p>
             </li>
 
             <li
-              class="videos__li"
+              class="testimony-item"
               data-video="https://player.vimeo.com/video/1148007280?h=2e9c81e900&autoplay=1"
             >
               <span class="icon">
@@ -378,7 +378,7 @@
               <p class="txt">
                 «&#8239;Pour les familles endeuillées, Index est
                 essentiel&#8239;»&#8239;:
-                <span class="br-desktop"><br /></span>le&nbsp;témoignage de
+                <span class="desktop-break"><br /></span>le&nbsp;témoignage de
                 Christelle Vendeiro-Bico, belle-sœur de Luis&nbsp;Bico
               </p>
             </li>
@@ -396,7 +396,7 @@
         </section> -->
 
         <section id="section__questions">
-          <h3 class="section__heading">Questions fréquentes</h3>
+          <h2 class="section-heading">Questions fréquentes</h2>
 
           <details>
             <summary>Les Soutiens d'Index, c'est quoi ?</summary>
@@ -618,49 +618,49 @@
           </nav>
 
           <div
-            data-donnation="one-off"
-            class="btn--donation__container"
+            data-donation="one-off"
+            class="donation-grid"
           >
-            <button class="btn--donation">
+            <button class="donation-btn">
               <p class="bold">200&#8239;€</p>
               <p class="small">Soit 68&#8239;€ après impôts</p>
             </button>
-            <button class="btn--donation btn--donation__grow-1">
+            <button class="donation-btn donation-btn--wide">
               <p class="bold">100&#8239;€</p>
               <p class="small">Soit 34&#8239;€ après impôts</p>
             </button>
-            <button class="btn--donation btn--donation__grow-1">
+            <button class="donation-btn donation-btn--wide">
               <p class="bold">50&#8239;€</p>
               <p class="small">Soit 17&#8239;€ après impôts</p>
             </button>
-            <button class="btn--donation btn--donation__grow-1">
+            <button class="donation-btn donation-btn--wide">
               <p class="bold">20&#8239;€</p>
               <p class="small">Soit 6.80&#8239;€ après impôts</p>
             </button>
-            <button class="btn--donation btn--donation__grow-2">
+            <button class="donation-btn donation-btn--full">
               <p class="bold">Choisissez votre montant</p>
               <p class="small">Avec déduction fiscale de 66&#8239;%</p>
             </button>
           </div>
 
-          <div data-donnation="monthly" class="btn--donation__container is-selected">
-            <button class="btn--donation">
+          <div data-donation="monthly" class="donation-grid is-selected">
+            <button class="donation-btn">
               <p class="bold">5€/mois</p>
               <p class="small">Soit X€ après impôts</p>
             </button>
-            <button class="btn--donation btn--donation__grow-1">
+            <button class="donation-btn donation-btn--wide">
               <p class="bold">10€/mois</p>
               <p class="small">Soit X€ après impôts</p>
             </button>
-            <button class="btn--donation btn--donation__grow-1">
+            <button class="donation-btn donation-btn--wide">
               <p class="bold">20€/mois</p>
               <p class="small">Soit X€ après impôts</p>
             </button>
-            <button class="btn--donation btn--donation__grow-1">
+            <button class="donation-btn donation-btn--wide">
               <p class="bold">50€/mois</p>
               <p class="small">Soit X€ après impôts</p>
             </button>
-            <button class="btn--donation btn--donation__grow-2">
+            <button class="donation-btn donation-btn--full">
               <p class="bold">Choisissez votre montant</p>
               <p class="small">Avec déduction fiscale</p>
             </button>
@@ -668,60 +668,59 @@
         </section>
 
         <section id="section__comments">
-          <h2 class="section__heading">Commentaires de donateur·ices</h2>
+          <h2 class="section-heading">Commentaires de donateur·ices</h2>
 
           <div class="swiper" id="comments-slider">
             <div class="swiper-wrapper">
               <div class="swiper-slide comment">
-                <p class="comment__text">
+                <p class="comment-text">
                   Vous faites un travail admirable. Merci de faire avancer la
                   Justice avec un grand J. Force à vous!
                 </p>
-                <p class="comment__name">Olivier</p>
+                <p class="comment-name">Olivier</p>
               </div>
 
               <div class="swiper-slide comment">
-                <p class="comment__text">
+                <p class="comment-text">
                   Merci du travail salutaire, précieux et extrêmement
                   professionnel que vous réalisez.
                 </p>
-                <p class="comment__name">Myriam</p>
+                <p class="comment-name">Myriam</p>
               </div>
 
               <div class="swiper-slide comment">
-                <p class="comment__text">
+                <p class="comment-text">
                   Vous êtes vraiment d'utilité publique et les méthodes que vous
                   utilisez méritent d'être popularisées.
                 </p>
-                <p class="comment__name">Frédéric</p>
+                <p class="comment-name">Frédéric</p>
               </div>
 
               <div class="swiper-slide comment">
-                <p class="comment__text">
+                <p class="comment-text">
                   Merci de poursuivre cette quête inlassable pour révéler les
                   vérités que l'on nous tait.
                 </p>
-                <p class="comment__name">Pauline</p>
+                <p class="comment-name">Pauline</p>
               </div>
 
               <div class="swiper-slide comment">
-                <p class="comment__text">
+                <p class="comment-text">
                   Les enquêteurs d'Index font un travail essentiel pour la
                   démocratie et la justice. Par ce soutien citoyen, j'exprime
                   toute ma reconnaissance pour leur engagement et leur rigueur.
                 </p>
-                <p class="comment__name">Anne</p>
+                <p class="comment-name">Anne</p>
               </div>
             </div>
 
-            <div class="swiper-pagination comments-slider__dots"></div>
+            <div class="swiper-pagination comments-dots"></div>
           </div>
         </section>
       </div>
 
-      <div id="btn--don__mobile">
-        <button class="btn--don">
-          <a href="#section__donation">
+      <div id="donation-cta-mobile">
+        <a href="#section__donation" class="donation-cta" role="button">
             <span class="txt">Faire un don</span>
             <span class="icon">
               <svg
@@ -738,21 +737,20 @@
                 />
               </svg>
             </span>
-          </a>
-        </button>
+        </a>
       </div>
     </main>
 
     <footer id="site-footer">
-      <div class="site-footer__container">
-        <div class="footer__newsletter">
+      <div class="footer-container">
+        <div class="footer-newsletter">
           <p>
             Recevez les dernières enquêtes et actualités d’Index directement
             dans votre boîte mail.
           </p>
           <p>Inscrivez-vous à la newsletter</p>
 
-          <form class="form__newsletter">
+          <form class="newsletter-form">
             <input
               type="email"
               name="email"
@@ -779,7 +777,7 @@
             </button>
           </form>
 
-          <p class="p__small">
+          <p class="text-small">
             En vous inscrivant, vous acceptez les
             <a target="_blank" href="https://www.index.ngo/mentions-legales/"
               >conditions d’utilisation</a
@@ -789,10 +787,10 @@
           </p>
         </div>
 
-        <div class="footer__socials">
+        <div class="footer-socials">
           <p>Suivez Index sur les réseaux sociaux</p>
 
-          <ul id="list-socials">
+          <ul id="socials-list">
             <li>
               <a
                 href="https://www.youtube.com/index-ngo"
@@ -973,8 +971,8 @@
           </ul>
         </div>
 
-        <div class="footer__mentions">
-          <p class="p__small">
+        <div class="footer-mentions">
+          <p class="text-small">
             © 2025 Index Investigation |
             <a target="_blank" href="https://www.index.ngo/mentions-legales/"
               >Mentions légales</a
@@ -993,7 +991,7 @@
           disableOnInteraction: false, // continue après un swipe
         },
         pagination: {
-          el: '.comments-slider__dots',
+          el: '.comments-dots',
           clickable: true,
         },
       });
diff --git a/index.php b/index.php
new file mode 100644
index 0000000..1a33943
--- /dev/null
+++ b/index.php
@@ -0,0 +1,270 @@
+<?php
+require_once __DIR__ . '/includes/cache.php';
+$data = getSoutenirContent('fr');
+?>
+<!DOCTYPE html>
+<html lang="fr">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title><?= htmlspecialchars($data['metaTitle'] ?? 'Soutenir Index') ?></title>
+    <meta name="description" content="<?= htmlspecialchars($data['metaDescription'] ?? '') ?>" />
+
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@12/swiper-bundle.min.css" />
+    <script src="https://cdn.jsdelivr.net/npm/swiper@12/swiper-bundle.min.js"></script>
+
+    <link rel="icon" type="image/png" href="assets/favicon.png" />
+    <link rel="stylesheet" type="text/css" href="assets/fonts/stylesheet.css" />
+    <link rel="stylesheet" type="text/css" href="assets/css/style.css" />
+    <script src="assets/js/onload.js"></script>
+    <script src="assets/js/temp/includeHtml.js"></script>
+    <script src="assets/js/donorbox-gauge.js"></script>
+    <script src="assets/js/donation.js"></script>
+    <script src="assets/js/newsletter-brevo.js"></script>
+    <meta name="robots" content="index, nofollow" />
+  </head>
+  <body data-template="support">
+    <header id="site-header">
+      <div class="header-left"></div>
+      <div class="header-center">
+        <h1 class="site-title">
+          <a href="https://www.index.ngo/" aria-label="Retour à l'accueil" title="aller au site d'Index">
+            <svg width="100%" height="100%" viewBox="0 0 162 29" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
+              <title>Index.ngo</title>
+              <g transform="matrix(1.04516,0,0,0.659091,57.4839,-6.59091)">
+                <rect x="-55" y="10" width="155" height="44" style="fill:none"/>
+                <clipPath id="_clip1"><rect x="-55" y="10" width="155" height="44"/></clipPath>
+                <g clip-path="url(#_clip1)">
+                  <g transform="matrix(0.95679,0,0,1.51724,-55,10)">
+                    <path d="M162,29L148.198,29L141.174,20.767L134.15,29L91.184,29L91.184,0.004L120.653,0.004L120.653,7.351L102.637,7.351L102.637,10.867L120.137,10.867L120.137,18.13L102.637,18.13L102.637,21.606L120.926,21.606L120.926,28.951L134.273,14.414L120.807,0L134.56,0L141.388,7.767L147.76,0L161.201,0L148.236,13.79L161.996,28.997L162,29ZM68.58,29L54.224,29L54.224,0.004L68.637,0.004C74.672,0.004 78.31,0.004 82.046,2.045C86.259,4.379 88.674,8.889 88.674,14.417C88.674,19.406 86.862,23.405 83.427,25.975C79.463,29 75.345,29 68.58,29ZM49.819,29L38.775,29L31.499,19.815C29.746,17.735 28.088,15.545 27.307,14.495C27.387,15.813 27.524,17.238 27.524,20.499L27.524,29L15.965,29L15.965,0.004L27.009,0.004L33.798,8.349C36.223,11.121 37.709,12.993 38.393,13.881C38.347,12.615 38.26,9.911 38.26,6.84L38.26,0.004L49.819,0.004L49.819,29ZM11.559,29L0,29L0,0.004L11.559,0.004L11.559,29ZM65.784,21.818L67.904,21.818C70.918,21.818 73.067,21.818 74.728,20.531C76.074,19.491 76.845,17.308 76.845,14.541C76.845,11.526 76.084,9.541 74.525,8.476C72.895,7.411 71.461,7.224 67.578,7.224L65.784,7.224L65.784,21.818Z" style="fill-rule:nonzero"/>
+                  </g>
+                </g>
+              </g>
+            </svg>
+          </a>
+        </h1>
+      </div>
+      <div class="header-right">
+        <ul id="toggle-lang">
+          <li class="is-selected"><a href="./">Fr</a></li>
+          <li><a href="./en">En</a></li>
+        </ul>
+      </div>
+    </header>
+
+    <main>
+      <div class="col-left">
+        <section id="section__hero">
+          <p class="hero-heading"><?= $data['heroHeading'] ?? '' ?></p>
+
+          <div class="gauge-container">
+            <div id="gauge" style="--pourcent: 0%"></div>
+            <div class="gauge-info" id="gauge-info--supporters">
+              <p class="property">Soutiens réguliers</p>
+              <p class="value">0</p>
+            </div>
+            <div class="gauge-info" id="gauge-info--goal">
+              <p class="property">Objectif</p>
+              <p class="value">500</p>
+            </div>
+          </div>
+
+          <p class="hero-heading">
+            <?= htmlspecialchars($data['heroObjectiveLabel'] ?? '') ?><br />
+            <strong><?= htmlspecialchars($data['heroObjectiveDate'] ?? '') ?></strong>
+          </p>
+        </section>
+
+        <section id="section__baseline">
+          <p class="subheading"><?= $data['subheading'] ?? '' ?></p>
+        </section>
+
+        <section id="section__video">
+          <h2 class="section-heading"><?= $data['videoSectionHeading'] ?? '' ?></h2>
+          <div class="video-container">
+            <iframe
+              title="Vidéo de campagne"
+              src="<?= htmlspecialchars($data['mainVideoUrl'] ?? '') ?>"
+              style="aspect-ratio: 9/16; width: 100%; border: 0"
+              allow="autoplay; fullscreen; picture-in-picture"
+              allowfullscreen
+            ></iframe>
+          </div>
+
+          <?php if (!empty($data['testimonies'])): ?>
+          <input type="checkbox" id="testimonies-toggle" />
+          <label class="btn-expand" for="testimonies-toggle">
+            <span class="txt"><?= htmlspecialchars($data['testimoniesButtonLabel'] ?? 'Voir les témoignages') ?></span>
+            <span class="icon"><svg width="34px" height="34px" viewBox="0 0 16 13" version="1.1" xmlns="http://www.w3.org/2000/svg" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
+              <rect x="0" y="0" width="15.43" height="12.636" style="fill:none"/>
+              <path d="M0,7.29L0,5.373L9.801,5.373C10.67,5.373 11.757,5.4 12.387,5.427C11.952,5.022 11.366,4.455 10.888,3.969L8.432,1.404L9.366,0L15.43,6.318L9.366,12.636L8.432,11.232L10.888,8.667C11.366,8.181 11.952,7.614 12.387,7.236C11.757,7.263 10.67,7.29 9.801,7.29L0,7.29Z" style="fill-rule:nonzero"/>
+            </svg></span>
+          </label>
+
+          <ul class="testimonies-list">
+            <?php foreach ($data['testimonies'] as $testimony): ?>
+            <li class="testimony-item" data-video="<?= htmlspecialchars($testimony['videoUrl']) ?>">
+              <span class="icon">
+                <svg height="80px" width="80px" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg">
+                  <path d="M500.203,236.907L30.869,2.24c-6.613-3.285-14.443-2.944-20.736,0.939C3.84,7.083,0,13.931,0,21.333v469.333 c0,7.403,3.84,14.251,10.133,18.155c3.413,2.112,7.296,3.179,11.2,3.179c3.264,0,6.528-0.747,9.536-2.24l469.333-234.667 C507.435,271.467,512,264.085,512,256S507.435,240.533,500.203,236.907z"/>
+                </svg>
+              </span>
+              <p class="txt"><?= $testimony['description'] ?></p>
+            </li>
+            <?php endforeach; ?>
+          </ul>
+          <?php endif; ?>
+        </section>
+
+        <section id="section__questions">
+          <h2 class="section-heading"><?= htmlspecialchars($data['faqHeading'] ?? 'Questions fréquentes') ?></h2>
+
+          <?php foreach (($data['questions'] ?? []) as $q): ?>
+          <details>
+            <summary><?= htmlspecialchars($q['question']) ?></summary>
+            <?= $q['answer'] ?>
+          </details>
+          <?php endforeach; ?>
+        </section>
+      </div>
+
+      <div class="col-right">
+        <section id="section__donation">
+          <nav class="nav--tabs">
+            <button class="nav--tabs__btn is-selected">Je donne tous les mois</button>
+            <button class="nav--tabs__btn">Je donne une fois</button>
+          </nav>
+
+          <div data-donation="one-off" class="donation-grid">
+            <button class="donation-btn">
+              <p class="bold">200&#8239;€</p>
+              <p class="small">Soit 68&#8239;€ après impôts</p>
+            </button>
+            <button class="donation-btn donation-btn--wide">
+              <p class="bold">100&#8239;€</p>
+              <p class="small">Soit 34&#8239;€ après impôts</p>
+            </button>
+            <button class="donation-btn donation-btn--wide">
+              <p class="bold">50&#8239;€</p>
+              <p class="small">Soit 17&#8239;€ après impôts</p>
+            </button>
+            <button class="donation-btn donation-btn--wide">
+              <p class="bold">20&#8239;€</p>
+              <p class="small">Soit 6.80&#8239;€ après impôts</p>
+            </button>
+            <button class="donation-btn donation-btn--full">
+              <p class="bold">Choisissez votre montant</p>
+              <p class="small">Avec déduction fiscale de 66&#8239;%</p>
+            </button>
+          </div>
+
+          <div data-donation="monthly" class="donation-grid is-selected">
+            <button class="donation-btn">
+              <p class="bold">5€/mois</p>
+              <p class="small">Soit X€ après impôts</p>
+            </button>
+            <button class="donation-btn donation-btn--wide">
+              <p class="bold">10€/mois</p>
+              <p class="small">Soit X€ après impôts</p>
+            </button>
+            <button class="donation-btn donation-btn--wide">
+              <p class="bold">20€/mois</p>
+              <p class="small">Soit X€ après impôts</p>
+            </button>
+            <button class="donation-btn donation-btn--wide">
+              <p class="bold">50€/mois</p>
+              <p class="small">Soit X€ après impôts</p>
+            </button>
+            <button class="donation-btn donation-btn--full">
+              <p class="bold">Choisissez votre montant</p>
+              <p class="small">Avec déduction fiscale</p>
+            </button>
+          </div>
+        </section>
+
+        <section id="section__comments">
+          <h2 class="section-heading"><?= htmlspecialchars($data['commentsHeading'] ?? 'Commentaires de donateur·ices') ?></h2>
+
+          <div class="swiper" id="comments-slider">
+            <div class="swiper-wrapper">
+              <?php foreach (($data['comments'] ?? []) as $comment): ?>
+              <div class="swiper-slide">
+                <p class="comment-text"><?= htmlspecialchars($comment['text']) ?></p>
+                <p class="comment-name"><?= htmlspecialchars($comment['name']) ?></p>
+              </div>
+              <?php endforeach; ?>
+            </div>
+            <div class="swiper-pagination comments-dots"></div>
+          </div>
+        </section>
+      </div>
+
+      <div id="donation-cta-mobile">
+        <a href="#section__donation" class="donation-cta" role="button">
+            <span class="txt">Faire un don</span>
+            <span class="icon">
+              <svg clip-rule="evenodd" fill-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+                <path d="m14.523 18.787s4.501-4.505 6.255-6.26c.146-.146.219-.338.219-.53s-.073-.383-.219-.53c-1.753-1.754-6.255-6.258-6.255-6.258-.144-.145-.334-.217-.524-.217-.193 0-.385.074-.532.221-.293.292-.295.766-.004 1.056l4.978 4.978h-14.692c-.414 0-.75.336-.75.75s.336.75.75.75h14.692l-4.979 4.979c-.289.289-.286.762.006 1.054.148.148.341.222.533.222.19 0 .378-.072.522-.215z" fill-rule="nonzero"/>
+              </svg>
+            </span>
+        </a>
+      </div>
+    </main>
+
+    <footer id="site-footer">
+      <div class="footer-container">
+        <div class="footer-newsletter">
+          <p><?= $data['footerNewsletterText'] ?? '' ?></p>
+
+          <form class="newsletter-form">
+            <input type="email" name="email" placeholder="Votre adresse e-mail" required />
+            <button class="btn--bold" type="submit" aria-label="s'inscrire">
+              <span class="txt"><?= htmlspecialchars($data['footerNewsletterCta'] ?? "S'inscrire") ?></span>
+              <span class="icon">
+                <svg clip-rule="evenodd" fill-rule="evenodd" stroke-linejoin="round" stroke-miterlimit="2" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
+                  <path d="m14.523 18.787s4.501-4.505 6.255-6.26c.146-.146.219-.338.219-.53s-.073-.383-.219-.53c-1.753-1.754-6.255-6.258-6.255-6.258-.144-.145-.334-.217-.524-.217-.193 0-.385.074-.532.221-.293.292-.295.766-.004 1.056l4.978 4.978h-14.692c-.414 0-.75.336-.75.75s.336.75.75.75h14.692l-4.979 4.979c-.289.289-.286.762.006 1.054.148.148.341.222.533.222.19 0 .378-.072.522-.215z" fill-rule="nonzero"/>
+                </svg>
+              </span>
+            </button>
+          </form>
+
+          <p class="text-small"><?= $data['footerNewsletterDisclaimer'] ?? '' ?></p>
+        </div>
+
+        <div class="footer-socials">
+          <p><?= htmlspecialchars($data['footerSocialsHeading'] ?? '') ?></p>
+
+          <ul id="socials-list">
+            <?php foreach (($data['footerSocials'] ?? []) as $social): ?>
+            <li>
+              <a href="<?= htmlspecialchars($social['url']) ?>" target="_blank" rel="noopener noreferrer">
+                <span class="icon"><?= $social['svgIcon'] ?></span>
+                <span class="text"><?= htmlspecialchars($social['name']) ?></span>
+              </a>
+            </li>
+            <?php endforeach; ?>
+          </ul>
+        </div>
+
+        <div class="footer-mentions">
+          <p class="text-small"><?= $data['footerMentions'] ?? '' ?></p>
+        </div>
+      </div>
+    </footer>
+
+    <script>
+      const swiper = new Swiper('#comments-slider', {
+        slidesPerView: 1,
+        loop: true,
+        autoplay: {
+          delay: 4000,
+          disableOnInteraction: false,
+        },
+        pagination: {
+          el: '.comments-dots',
+          clickable: true,
+        },
+      });
+    </script>
+  </body>
+</html>
diff --git a/merci/index.html b/merci/index.html
index cd430e7..c1739fb 100644
--- a/merci/index.html
+++ b/merci/index.html
@@ -78,27 +78,27 @@
     </header>
 
     <main>
-      <p class="p__baseline-big">
+      <p class="hero-heading">
         Un grand merci&#8239;!
       </p>
 
-      <p class="p__baseline">
+      <p class="subheading">
         Votre soutien nous permet de continuer à enquêter en toute indépendance.</p>
 
-        <p class="p__baseline"> Nous vous remercions sincèrement pour votre solidarité, qui est essentielle à&nbsp;la&nbsp;poursuite de notre mission.</p>
+        <p class="subheading"> Nous vous remercions sincèrement pour votre solidarité, qui est essentielle à&nbsp;la&nbsp;poursuite de notre mission.</p>
         
-        <p class="p__baseline"><a href="https://www.index.ngo/" class="link-don">Retour à la page d’accueil →</a></p>
+        <p class="subheading"><a href="https://www.index.ngo/" class="link-don">Retour à la page d’accueil →</a></p>
       </p>
     </main>
 
     <footer id="site-footer">
-      <div class="site-footer__container">
+      <div class="footer-container">
    
 
       
 
-        <div class="footer__mentions">
-          <p class="p__small">
+        <div class="footer-mentions">
+          <p class="text-small">
             © 2025  Index Investigation | <a target="_blank" href="https://www.index.ngo/mentions-legales/">Mentions légales</a>  
           </p>
         </div>
diff --git a/merci/index.php b/merci/index.php
new file mode 100644
index 0000000..64c6c58
--- /dev/null
+++ b/merci/index.php
@@ -0,0 +1,63 @@
+<?php
+require_once __DIR__ . '/../includes/cache.php';
+$data = getSoutenirContent('fr');
+?>
+<!DOCTYPE html>
+<html lang="fr">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Index.ngo</title>
+    <link rel="icon" type="image/png" href="/assets/favicon.png" />
+
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@12/swiper-bundle.min.css" />
+    <script src="https://cdn.jsdelivr.net/npm/swiper@12/swiper-bundle.min.js"></script>
+
+    <link rel="stylesheet" type="text/css" href="/assets/fonts/stylesheet.css" />
+    <link rel="stylesheet" type="text/css" href="/assets/css/style.css" />
+    <script src="/assets/js/onload.js"></script>
+    <script src="/assets/js/temp/includeHtml.js"></script>
+    <script src="/assets/js/newsletter-brevo.js"></script>
+  </head>
+  <body data-template="thanks">
+
+    <header id="site-header">
+      <div class="header-left"></div>
+      <div class="header-center">
+        <h1 class="site-title">
+          <a href="/" aria-label="Retour à l'accueil">
+            <svg width="100%" height="100%" viewBox="0 0 162 29" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
+              <title>Index.ngo</title>
+              <g transform="matrix(1.04516,0,0,0.659091,57.4839,-6.59091)">
+                <rect x="-55" y="10" width="155" height="44" style="fill:none"/>
+                <clipPath id="_clip1"><rect x="-55" y="10" width="155" height="44"/></clipPath>
+                <g clip-path="url(#_clip1)">
+                  <g transform="matrix(0.95679,0,0,1.51724,-55,10)">
+                    <path d="M162,29L148.198,29L141.174,20.767L134.15,29L91.184,29L91.184,0.004L120.653,0.004L120.653,7.351L102.637,7.351L102.637,10.867L120.137,10.867L120.137,18.13L102.637,18.13L102.637,21.606L120.926,21.606L120.926,28.951L134.273,14.414L120.807,0L134.56,0L141.388,7.767L147.76,0L161.201,0L148.236,13.79L161.996,28.997L162,29ZM68.58,29L54.224,29L54.224,0.004L68.637,0.004C74.672,0.004 78.31,0.004 82.046,2.045C86.259,4.379 88.674,8.889 88.674,14.417C88.674,19.406 86.862,23.405 83.427,25.975C79.463,29 75.345,29 68.58,29ZM49.819,29L38.775,29L31.499,19.815C29.746,17.735 28.088,15.545 27.307,14.495C27.387,15.813 27.524,17.238 27.524,20.499L27.524,29L15.965,29L15.965,0.004L27.009,0.004L33.798,8.349C36.223,11.121 37.709,12.993 38.393,13.881C38.347,12.615 38.26,9.911 38.26,6.84L38.26,0.004L49.819,0.004L49.819,29ZM11.559,29L0,29L0,0.004L11.559,0.004L11.559,29ZM65.784,21.818L67.904,21.818C70.918,21.818 73.067,21.818 74.728,20.531C76.074,19.491 76.845,17.308 76.845,14.541C76.845,11.526 76.084,9.541 74.525,8.476C72.895,7.411 71.461,7.224 67.578,7.224L65.784,7.224L65.784,21.818Z" style="fill-rule:nonzero"/>
+                  </g>
+                </g>
+              </g>
+            </svg>
+          </a>
+        </h1>
+      </div>
+      <div class="header-right"></div>
+    </header>
+
+    <main>
+      <p class="hero-heading"><?= htmlspecialchars($data['thanksHeading'] ?? 'Un grand merci !') ?></p>
+
+      <?= $data['thanksText'] ?? '' ?>
+
+      <p class="subheading"><a href="<?= htmlspecialchars($data['thanksLinkUrl'] ?? 'https://www.index.ngo/') ?>" class="link-don"><?= htmlspecialchars($data['thanksLinkText'] ?? "Retour à la page d'accueil →") ?></a></p>
+    </main>
+
+    <footer id="site-footer">
+      <div class="footer-container">
+        <div class="footer-mentions">
+          <p class="text-small"><?= $data['thanksMentions'] ?? '' ?></p>
+        </div>
+      </div>
+    </footer>
+  </body>
+</html>
diff --git a/thanks/index.html b/thanks/index.html
index 242cf6a..b06a1b1 100644
--- a/thanks/index.html
+++ b/thanks/index.html
@@ -78,27 +78,27 @@
     </header>
 
     <main>
-      <p class="p__baseline-big">
+      <p class="hero-heading">
         Thank you!
       </p>
 
-      <p class="p__baseline">
+      <p class="subheading">
         Your support allows us to continue investigating with complete independence.</p>
 
-        <p class="p__baseline">We sincerely thank you for your solidarity, which is essential to the pursuit of our&nbsp;mission.</p>
+        <p class="subheading">We sincerely thank you for your solidarity, which is essential to the pursuit of our&nbsp;mission.</p>
         
-        <p class="p__baseline"><a href="https://www.index.ngo/en/">Back to home page →</a></p>
+        <p class="subheading"><a href="https://www.index.ngo/en/">Back to home page →</a></p>
       </p>
     </main>
 
     <footer id="site-footer">
-      <div class="site-footer__container">
+      <div class="footer-container">
    
 
       
 
-        <div class="footer__mentions">
-          <p class="p__small">
+        <div class="footer-mentions">
+          <p class="text-small">
             © 2025  Index Investigation | <a target="_blank" href="https://www.index.ngo/mentions-legales/">Mentions légales</a>  
           </p>
         </div>
diff --git a/thanks/index.php b/thanks/index.php
new file mode 100644
index 0000000..045f307
--- /dev/null
+++ b/thanks/index.php
@@ -0,0 +1,63 @@
+<?php
+require_once __DIR__ . '/../includes/cache.php';
+$data = getSoutenirContent('en');
+?>
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Index.ngo</title>
+    <link rel="icon" type="image/png" href="/assets/favicon.png" />
+
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/swiper@12/swiper-bundle.min.css" />
+    <script src="https://cdn.jsdelivr.net/npm/swiper@12/swiper-bundle.min.js"></script>
+
+    <link rel="stylesheet" type="text/css" href="/assets/fonts/stylesheet.css" />
+    <link rel="stylesheet" type="text/css" href="/assets/css/style.css" />
+    <script src="/assets/js/onload.js"></script>
+    <script src="/assets/js/temp/includeHtml.js"></script>
+    <script src="/assets/js/newsletter-brevo.js"></script>
+  </head>
+  <body data-template="thanks">
+
+    <header id="site-header">
+      <div class="header-left"></div>
+      <div class="header-center">
+        <h1 class="site-title">
+          <a href="/" aria-label="Back to home">
+            <svg width="100%" height="100%" viewBox="0 0 162 29" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" xml:space="preserve" xmlns:serif="http://www.serif.com/" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
+              <title>Index.ngo</title>
+              <g transform="matrix(1.04516,0,0,0.659091,57.4839,-6.59091)">
+                <rect x="-55" y="10" width="155" height="44" style="fill:none"/>
+                <clipPath id="_clip1"><rect x="-55" y="10" width="155" height="44"/></clipPath>
+                <g clip-path="url(#_clip1)">
+                  <g transform="matrix(0.95679,0,0,1.51724,-55,10)">
+                    <path d="M162,29L148.198,29L141.174,20.767L134.15,29L91.184,29L91.184,0.004L120.653,0.004L120.653,7.351L102.637,7.351L102.637,10.867L120.137,10.867L120.137,18.13L102.637,18.13L102.637,21.606L120.926,21.606L120.926,28.951L134.273,14.414L120.807,0L134.56,0L141.388,7.767L147.76,0L161.201,0L148.236,13.79L161.996,28.997L162,29ZM68.58,29L54.224,29L54.224,0.004L68.637,0.004C74.672,0.004 78.31,0.004 82.046,2.045C86.259,4.379 88.674,8.889 88.674,14.417C88.674,19.406 86.862,23.405 83.427,25.975C79.463,29 75.345,29 68.58,29ZM49.819,29L38.775,29L31.499,19.815C29.746,17.735 28.088,15.545 27.307,14.495C27.387,15.813 27.524,17.238 27.524,20.499L27.524,29L15.965,29L15.965,0.004L27.009,0.004L33.798,8.349C36.223,11.121 37.709,12.993 38.393,13.881C38.347,12.615 38.26,9.911 38.26,6.84L38.26,0.004L49.819,0.004L49.819,29ZM11.559,29L0,29L0,0.004L11.559,0.004L11.559,29ZM65.784,21.818L67.904,21.818C70.918,21.818 73.067,21.818 74.728,20.531C76.074,19.491 76.845,17.308 76.845,14.541C76.845,11.526 76.084,9.541 74.525,8.476C72.895,7.411 71.461,7.224 67.578,7.224L65.784,7.224L65.784,21.818Z" style="fill-rule:nonzero"/>
+                  </g>
+                </g>
+              </g>
+            </svg>
+          </a>
+        </h1>
+      </div>
+      <div class="header-right"></div>
+    </header>
+
+    <main>
+      <p class="hero-heading"><?= htmlspecialchars($data['thanksHeading'] ?? 'Thank you!') ?></p>
+
+      <?= $data['thanksText'] ?? '' ?>
+
+      <p class="subheading"><a href="<?= htmlspecialchars($data['thanksLinkUrl'] ?? 'https://www.index.ngo/en/') ?>"><?= htmlspecialchars($data['thanksLinkText'] ?? 'Back to home page →') ?></a></p>
+    </main>
+
+    <footer id="site-footer">
+      <div class="footer-container">
+        <div class="footer-mentions">
+          <p class="text-small"><?= $data['thanksMentions'] ?? '' ?></p>
+        </div>
+      </div>
+    </footer>
+  </body>
+</html>