/* =============================================================================
   POLICE — Montserrat, auto-hébergée
   -----------------------------------------------------------------------------
   Un seul fichier variable de 37 Ko couvre TOUTES les graisses de 100 à 900.
   Auparavant la police venait de fonts.googleapis.com : deux connexions
   supplémentaires (DNS + TLS) et une feuille de style bloquante avant le
   moindre pixel affiché — coûteux sur une connexion mobile marocaine.

   Le sous-ensemble « latin » suffit au français : é è à ç ô œ « » y sont tous.
   Ne PAS ajouter latin-ext (+69 Ko) tant que le site ne publie pas de contenu
   en langue d'Europe centrale.

   ⚠ Le CSS utilise font-weight: 900 à 36 endroits, absent de l'ancienne requête
     Google : ces titres étaient jusqu'ici graissés artificiellement par le
     navigateur. La police variable les rend correctement.
   ============================================================================= */
@font-face {
  font-family: 'Montserrat';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('/assets/fonts/montserrat-variable-latin.woff2') format('woff2-variations');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
                 U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122,
                 U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* POCUS brochure clone: active on phones only. */
@media (max-width: 767px) {
  .formation-page--pocus-clone {
    background: #050505;
  }

  .formation-page--pocus-clone .header {
    position: absolute;
    inset: 0 0 auto;
    z-index: 80;
    background: transparent;
  }

  .formation-page--pocus-clone .formation-detail--pocus-clone-desktop {
    padding-bottom: 0;
  }

  .formation-page--pocus-clone .formation-detail--pocus-clone-desktop > .formation-hero,
  .formation-page--pocus-clone .formation-detail--pocus-clone-desktop .formation-detail__body > :not(.formation-success),
  .formation-page--pocus-clone .formation-detail--pocus-clone-desktop .formation-mobile-sticky-bar {
    display: none;
  }

  .formation-page--pocus-clone .formation-detail--pocus-clone-desktop .formation-detail__body {
    padding-top: 0;
    background: #050505;
  }

  .formation-page--pocus-clone .formation-success {
    margin-top: 0;
    padding-block: 9vw 10vw;
    background: #050505;
  }

  .formation-page--pocus-clone .formation-success h2 {
    color: #fff;
  }

  .formation-page--pocus-clone .pocus-mobile-clone {
    display: block;
    width: min(100%, 820px);
    margin-inline: auto;
    overflow: hidden;
    container-type: inline-size;
    background: #050505;
  }

  .pocus-poster {
    position: relative;
    width: 100%;
    aspect-ratio: 595.276 / 841.89;
    overflow: hidden;
    background: #050505;
    color: #fff;
    isolation: isolate;
  }

  .pocus-poster h1,
  .pocus-poster h2,
  .pocus-poster h3,
  .pocus-poster p,
  .pocus-poster ul {
    margin: 0;
    letter-spacing: 0;
  }

  .pocus-poster p,
  .pocus-poster li {
    color: inherit;
    font-size: 1.75cqw;
    line-height: 1.25;
  }

  .pocus-poster ul {
    padding-left: 2.2cqw;
    list-style: disc;
  }

  .pocus-poster__brand {
    position: absolute;
    z-index: 4;
    width: 29cqw;
    height: auto;
    object-fit: contain;
  }

  .pocus-poster__brand--small {
    width: 24cqw;
  }

  .pocus-poster--cover {
    aspect-ratio: auto;
    height: 146.45cqw;
  }

  .pocus-cover__full-page {
    position: absolute;
    inset: 5cqw 0 auto;
    z-index: 0;
    width: 100%;
    height: auto;
    object-fit: contain;
  }

  .pocus-poster--team {
    padding: 7.5cqw 7.4cqw 5cqw;
  }

  .pocus-poster__intro {
    text-align: center;
  }

  .pocus-poster__intro h2 {
    color: #fff;
    font-size: 3.6cqw;
    line-height: 1.05;
  }

  .pocus-poster__intro p {
    width: 78cqw;
    margin: 2cqw auto 0;
  }

  .pocus-team__director {
    display: grid;
    grid-template-columns: 29cqw 1fr;
    align-items: center;
    gap: 5cqw;
    margin-top: 5.5cqw;
  }

  .pocus-team__director img {
    width: 29cqw;
    aspect-ratio: 1;
    object-fit: cover;
    border-radius: 2.4cqw;
  }

  .pocus-team__director h3,
  .pocus-team__pedagogy h3 {
    color: #fff;
    font-size: 2.1cqw;
    line-height: 1.25;
  }

  .pocus-team__director ul {
    margin-top: 1.8cqw;
  }

  .pocus-team__pedagogy {
    display: grid;
    grid-template-columns: 30cqw 1fr;
    align-items: center;
    gap: 4cqw;
    margin-top: 4cqw;
  }

  .pocus-team__pedagogy img {
    width: 100%;
    border-radius: 2.4cqw;
  }

  .pocus-team__pedagogy p {
    margin-top: 1cqw;
  }

  .pocus-team__supervision {
    margin-top: 5cqw;
    text-align: center;
  }

  .pocus-team__supervision h3 {
    color: #fff;
    font-size: 2.55cqw;
  }

  .pocus-team__supervision > p {
    margin-top: 1cqw;
  }

  .pocus-team__portraits {
    display: grid;
    grid-template-columns: repeat(3, 25.5cqw);
    justify-content: center;
    gap: 2.2cqw;
    margin-top: 3.5cqw;
  }

  .pocus-team__portraits img {
    width: 25.5cqw;
    aspect-ratio: 717 / 925;
    object-fit: cover;
    border-radius: 2.4cqw;
  }

  .pocus-overview__background {
    position: absolute;
    inset: 0;
    z-index: -1;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .pocus-poster--overview {
    aspect-ratio: auto;
    height: 133cqw;
  }

  .pocus-poster--overview .pocus-poster__brand {
    top: 5.5cqw;
    left: 7.4cqw;
  }

  .pocus-overview__copy {
    position: absolute;
    top: 14cqw;
    left: 7.4cqw;
    width: 46cqw;
  }

  .pocus-overview__copy > p:first-child {
    font-weight: 800;
    text-transform: uppercase;
  }

  .pocus-overview__copy h2 {
    margin-top: 1cqw;
    color: #fff;
    font-size: 5.4cqw;
    line-height: .98;
    text-transform: uppercase;
  }

  .pocus-overview__copy h3 {
    margin-top: 3cqw;
    color: #fff;
    font-size: 2.35cqw;
    line-height: 1.15;
  }

  .pocus-overview__copy p + p {
    margin-top: 2cqw;
  }

  .pocus-overview__group {
    position: absolute;
    top: 68cqw;
    left: 7.4cqw;
    width: 85.2cqw;
    height: 42cqw;
    object-fit: cover;
    border-radius: 2.6cqw;
  }

  .pocus-overview__scenarios {
    position: absolute;
    top: 114cqw;
    left: 7.4cqw;
    right: 7.4cqw;
  }

  .pocus-overview__scenarios h3 {
    color: #fff;
    font-size: 2.45cqw;
  }

  .pocus-overview__scenarios p {
    margin-top: 1.4cqw;
  }

  .pocus-poster--outcomes {
    padding: 6cqw 7.4cqw;
  }

  .pocus-outcomes__lead {
    display: grid;
    gap: 1.55cqw;
  }

  .pocus-outcomes__lead ul {
    columns: 2;
    column-gap: 4cqw;
  }

  .pocus-outcomes__photos {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.2cqw;
    margin-top: 3.2cqw;
  }

  .pocus-outcomes__photos img {
    width: 100%;
    aspect-ratio: 717 / 594;
    object-fit: cover;
    border-radius: 1.8cqw;
  }

  .pocus-outcomes__list {
    margin-top: 3.5cqw;
  }

  .pocus-outcomes__list h2 {
    color: #fff;
    font-size: 3cqw;
  }

  .pocus-outcomes__list h3 {
    margin-top: 2cqw;
    color: #ef1b23;
    font-size: 1.9cqw;
  }

  .pocus-outcomes__list ul {
    margin-top: .8cqw;
  }

  .pocus-poster--schedule {
    background: #fff;
    color: #222;
  }

  .pocus-schedule__background {
    position: absolute;
    inset: 0;
    z-index: -1;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .pocus-schedule__lead-image {
    position: absolute;
    top: 7.5cqw;
    left: 7.4cqw;
    z-index: 1;
    width: 53cqw;
    height: 25cqw;
    border-radius: 2.2cqw;
    object-fit: cover;
  }

  .pocus-schedule__content {
    position: absolute;
    inset: 10cqw 7.4cqw 7cqw;
  }

  .pocus-poster--schedule-one .pocus-schedule__content {
    top: 37cqw;
  }

  .pocus-schedule__content h2 {
    color: #222;
    font-size: 3.1cqw;
    line-height: 1.05;
    text-transform: uppercase;
  }

  .pocus-schedule__summary {
    margin-top: 1cqw;
    font-weight: 700;
  }

  .pocus-schedule__content section {
    margin-top: 1.55cqw;
  }

  .pocus-schedule__content h3 {
    color: #202020;
    font-size: 1.95cqw;
    line-height: 1.2;
  }

  .pocus-schedule__content p,
  .pocus-schedule__content li {
    color: #303030;
    font-size: 1.82cqw;
    line-height: 1.2;
  }

  .pocus-schedule__content ul {
    margin-top: .35cqw;
    padding-left: 2cqw;
  }

  .pocus-schedule__footer {
    position: absolute;
    inset: auto 0 0;
    height: 3.4cqw;
    overflow: hidden;
    background: #0753ad;
    color: #fff;
    font-size: 1.15cqw;
    line-height: 3.4cqw;
    text-align: center;
    text-transform: uppercase;
  }

  .pocus-poster--schedule-two .pocus-schedule__content {
    inset: 6.4cqw 6.7cqw 4.5cqw;
  }

  .pocus-poster--schedule-two .pocus-schedule__content section {
    margin-top: 1.3cqw;
  }

  .pocus-poster--schedule-two .pocus-schedule__content h3 {
    font-size: 2.18cqw;
    line-height: 1.16;
  }

  .pocus-poster--schedule-two .pocus-schedule__content p,
  .pocus-poster--schedule-two .pocus-schedule__content li {
    font-size: 1.95cqw;
    line-height: 1.15;
  }

  .pocus-poster--schedule-two .pocus-schedule__content ul {
    margin-top: .25cqw;
    padding-left: 2.15cqw;
  }

  .pocus-poster--schedule-two .pocus-schedule__content p + p,
  .pocus-poster--schedule-two .pocus-schedule__content ul + p {
    margin-top: .4cqw;
  }

  .pocus-schedule__why,
  .pocus-schedule__summary-list {
    padding-top: .8cqw;
    border-top: .2cqw solid #0753ad;
  }

  .pocus-schedule__why h2,
  .pocus-schedule__summary-list h2 {
    color: #0753ad;
    font-size: 3.15cqw;
    line-height: 1.05;
  }

  .pocus-poster--information {
    aspect-ratio: auto;
    min-height: 0;
    padding: 4.5cqw 5cqw 5cqw;
    background:
      radial-gradient(circle at 84% 22%, rgba(165,83,45,.42), transparent 22%),
      radial-gradient(circle at 72% 12%, rgba(49,94,120,.36), transparent 34%),
      linear-gradient(120deg, #03101d, #05090d 72%);
  }

  .pocus-information__head {
    padding-bottom: 2.4cqw;
    border-bottom: .18cqw solid rgba(255,255,255,.9);
  }

  .pocus-information__head h2 {
    color: #d8df28;
    font-size: 4.2cqw;
    line-height: 1;
    text-transform: uppercase;
  }

  .pocus-information__meta {
    display: grid;
    grid-template-columns: max-content 1fr;
    gap: 3.2cqw;
    align-items: center;
    margin-top: 1.5cqw;
  }

  .pocus-information__meta p {
    color: #c6deff;
    font-size: 2.2cqw;
    text-transform: uppercase;
  }

  .pocus-information__meta p:last-child {
    display: flex;
    align-items: center;
    gap: .8cqw;
  }

  .pocus-information__meta p:last-child span {
    color: #e31f26;
    font-weight: 800;
  }

  .pocus-information__layout {
    display: grid;
    grid-template-columns: minmax(0, 58cqw) minmax(0, 1fr);
    gap: 4cqw;
    margin-top: 3.2cqw;
  }

  .pocus-information__offers {
    display: grid;
    gap: 1.8cqw;
  }

  .pocus-information__offers article {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 2cqw;
    min-height: 10cqw;
    padding: 1.7cqw 2.3cqw;
    border: .2cqw solid rgba(255,255,255,.95);
    border-radius: 1.5cqw;
  }

  .pocus-information__offers article > span:first-child {
    color: #fff;
    font-size: 1.95cqw;
    line-height: 1.15;
  }

  .pocus-information__offers strong {
    color: #c6deff;
    font-size: 2.9cqw;
    line-height: 1;
    white-space: nowrap;
  }

  .pocus-information__price {
    display: grid;
    justify-items: end;
    gap: .5cqw;
  }

  .pocus-information__price del {
    color: #8aa2bd;
    font-size: 1.75cqw;
    line-height: 1;
    white-space: nowrap;
  }

  .pocus-poster--information .pocus-information__deposit {
    margin-top: 4.5cqw;
    color: #c6deff;
    font-size: 1.75cqw;
  }

  .pocus-poster--information .pocus-information__capacity {
    margin: 3.2cqw 0 2.5cqw;
    color: #d8df28;
    font-size: 2.25cqw;
    font-weight: 800;
    line-height: 1.12;
    text-transform: uppercase;
  }

  .pocus-information__benefits {
    display: grid;
    align-content: start;
    padding: 0;
    list-style: none;
  }

  .pocus-information__benefits li {
    display: grid;
    grid-template-columns: 6.2cqw 1fr;
    align-items: center;
    gap: 1.6cqw;
    min-height: 11cqw;
    border-bottom: .14cqw solid rgba(255,255,255,.8);
    color: #c6deff;
    font-size: 2.05cqw;
    line-height: 1.12;
    text-transform: uppercase;
  }

  .pocus-information__benefits img {
    width: 5cqw;
    max-height: 5.5cqw;
    object-fit: contain;
  }

  .pocus-information__seal {
    display: grid;
    width: 5cqw;
    aspect-ratio: 1;
    place-items: center;
    border: .35cqw double #fff;
    border-radius: 50%;
    color: #fff;
    font-size: 2.5cqw;
    font-weight: 800;
  }

  .pocus-information__registration {
    position: static;
    width: 100%;
    min-height: 8cqw;
    margin-top: 4cqw;
    border-radius: 1cqw;
    font-size: 2.4cqw;
    text-transform: uppercase;
  }
}

/* DU opening reel: regular page content, loaded only at the mobile DU layout. */
.du-mobile-intro-video {
  display: none;
}

@media (max-width: 1023px) {
  .du-mobile-intro-video {
    display: block;
    padding: 22px clamp(14px, 5vw, 28px) 28px;
    background: #06358e url("/assets/images/formations/DU-PDF-ASSETS/du-page-background.webp") center / cover no-repeat;
  }

  .du-mobile-intro-video__frame {
    position: relative;
    width: min(100%, 430px);
    margin-inline: auto;
    overflow: hidden;
    border-radius: 8px;
    aspect-ratio: 9 / 16;
    background: #001d56;
    box-shadow: 0 16px 36px rgba(0, 27, 82, .28);
  }

  .du-mobile-intro-video__frame iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
  }

  /*
   * Superposé DANS la vidéo, et centré.
   *
   * Le bas était le placement naturel, mais le bandeau « Je m'inscris » est en
   * `position: fixed` : il ne suit pas la vidéo au défilement, donc aucune
   * valeur de `bottom` ne le évite à toutes les positions de scroll. Le centre,
   * lui, reste dégagé — le bandeau ne couvre jamais que ~50 px en bas de
   * l'écran, et l'en-tête autant en haut.
   *
   * Le bouton disparaît au premier appui, d'où la superposition plutôt qu'un
   * placement sous la vidéo : la mise en page ne bouge pas à ce moment-là.
   */
  .du-mobile-intro-video__sound {
    position: absolute;
    z-index: 2;
    top: 50%;
    left: 50%;
    display: inline-flex;
    gap: 9px;
    align-items: center;
    justify-content: center;
    min-height: 52px;
    padding: 13px 26px;
    transform: translate(-50%, -50%);
    white-space: nowrap;
    border: 0;
    border-radius: 999px;
    background: rgba(255, 255, 255, .94);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    box-shadow: 0 6px 20px rgba(0, 20, 60, .3);
    color: #0649a8;
    font: inherit;
    font-size: 16px;
    font-weight: 800;
    cursor: pointer;
  }

  .du-mobile-intro-video__sound[hidden] {
    display: none;
  }

  .du-mobile-intro-video__sound:active {
    transform: translate(-50%, -50%) scale(.97);
  }

  /* Haut-parleur dessiné en CSS — pas d'emoji, dont le rendu change selon l'OS. */
  .du-mobile-intro-video__sound-icon {
    position: relative;
    flex: none;
    width: 10px;
    height: 12px;
    background: currentcolor;
    clip-path: polygon(0 30%, 38% 30%, 100% 0, 100% 100%, 38% 70%, 0 70%);
  }

  .du-mobile-intro-video__sound-icon::after {
    position: absolute;
    top: 50%;
    left: 15px;
    width: 7px;
    height: 7px;
    border: 2px solid currentcolor;
    border-radius: 50%;
    border-bottom-color: transparent;
    border-left-color: transparent;
    transform: translateY(-50%) rotate(-45deg);
    content: "";
  }

  .du-mobile-intro-video__sound[hidden] {
    display: none;
  }

  .du-mobile-intro-video__sound:focus-visible {
    outline: 3px solid #ffe21f;
    outline-offset: 3px;
  }
}

.du-pdf-mobile {
  display: none;
}

@media (max-width: 1023px) {
  .du-page {
    overflow-x: hidden;
  }

  .du-page .du-hero,
  .du-page .du-desktop-main > :not(.du-pdf-mobile):not(.du-media-faq),
  .du-page .du-desktop-sidebar {
    display: none !important;
  }

  .du-page .du-desktop-shell,
  .du-page .du-desktop-main {
    width: 100%;
    margin: 0;
    display: block;
  }
}

.du-pdf-mobile {
    --du-pdf-deep: #06358e;
    --du-pdf-blue: #0868cf;
    --du-pdf-heading-size: 5.55cqw;
    display: block;
    width: 100%;
    overflow: hidden;
    container-type: inline-size;
    background: var(--du-pdf-deep);
    color: #fff;
  }

  .du-pdf-sheet {
    position: relative;
    width: 100%;
    height: 141.52cqw;
    overflow: hidden;
    isolation: isolate;
    color: #fff;
    background: var(--du-pdf-deep) url("/assets/images/formations/DU-PDF-ASSETS/du-page-background.webp") center / cover no-repeat;
  }

  .du-pdf-sheet:not(.du-pdf-sheet--cover)::before,
  .du-pdf-sheet:not(.du-pdf-sheet--cover)::after {
    content: "INSTITUT INTERNATIONAL DES FORMATIONS SCIENTIFIQUES   INSTITUT INTERNATIONAL DES FORMATIONS SCIENTIFIQUES";
    position: absolute;
    z-index: 4;
    left: 0;
    width: 100%;
    height: 2.65cqw;
    overflow: hidden;
    color: #fff;
    font-size: 1.5cqw;
    font-weight: 700;
    line-height: 2.65cqw;
    white-space: nowrap;
  }

  .du-pdf-sheet:not(.du-pdf-sheet--cover)::before {
    top: 0;
  }

  .du-pdf-sheet:not(.du-pdf-sheet--cover)::after {
    bottom: 0;
  }

  .du-pdf-sheet h1,
  .du-pdf-sheet h2,
  .du-pdf-sheet h3,
  .du-pdf-sheet p,
  .du-pdf-sheet ul,
  .du-pdf-sheet figure {
    margin: 0;
  }

  .du-pdf-sheet h1,
  .du-pdf-sheet h2,
  .du-pdf-sheet h3,
  .du-pdf-sheet strong {
    font-weight: 900;
  }

  .du-pdf-logos {
    display: flex;
    align-items: center;
    gap: 2.05cqw;
  }

  .du-pdf-logos img {
    display: block;
    width: 20.3cqw;
    max-height: 7cqw;
    object-fit: contain;
  }

  .du-pdf-logos .du-pdf-logo-iifs {
    width: 28.5cqw;
  }

  .du-pdf-logos i {
    width: .16cqw;
    height: 6.2cqw;
    flex: 0 0 auto;
    background: rgba(255, 255, 255, .88);
  }

  .du-pdf-sheet--cover {
    background: #0055bd url("/assets/images/formations/DU-PDF-ASSETS/du-hero-avignon.webp") center top / cover no-repeat;
  }

  .du-pdf-logos--cover {
    position: absolute;
    z-index: 2;
    top: 99.7cqw;
    left: 13.8cqw;
    width: 72.4cqw;
    justify-content: center;
  }

  .du-pdf-cover-title {
    position: absolute;
    z-index: 2;
    left: 5.8cqw;
    right: 5.8cqw;
    top: 74.2cqw;
    text-align: center;
    text-transform: uppercase;
  }

  .du-pdf-cover-title h2 {
    font-size: 9.25cqw;
    line-height: .88;
  }

  .du-pdf-cover-title p {
    margin-top: 1.15cqw;
    font-size: 5.5cqw;
    line-height: 1;
  }

  .du-pdf-cover-partner {
    position: absolute;
    z-index: 2;
    top: 109.1cqw;
    left: 0;
    width: 100%;
    min-height: 12.1cqw;
    padding: 2.25cqw 4cqw 1.5cqw;
    display: grid;
    align-content: center;
    background: #fff;
    color: #07126f;
    text-align: center;
    text-transform: uppercase;
  }

  .du-pdf-cover-partner span,
  .du-pdf-cover-partner strong {
    display: block;
    font-size: 3.1cqw;
    line-height: 1.06;
  }

  .du-pdf-cover-partner strong {
    margin-top: .7cqw;
    font-size: 3.75cqw;
  }

  .du-pdf-cover-meta {
    position: absolute;
    z-index: 2;
    inset: 121.2cqw 0 0;
    padding: 2.65cqw 6cqw 2.2cqw;
    background: rgba(0, 88, 194, .92);
    text-align: center;
    text-transform: uppercase;
  }

  .du-pdf-cover-meta > strong,
  .du-pdf-cover-meta > span {
    display: block;
  }

  .du-pdf-cover-meta > strong {
    font-size: 3.35cqw;
    line-height: 1.05;
  }

  .du-pdf-cover-meta > span {
    margin-top: 1.05cqw;
    font-size: 2.65cqw;
    line-height: 1;
  }

  .du-pdf-page-copy {
    position: absolute;
    z-index: 2;
    top: 10.4cqw;
    left: 6.75cqw;
    right: 6.75cqw;
  }

  .du-pdf-page-copy h2 {
    padding-bottom: 1.6cqw;
    border-bottom: .18cqw solid rgba(255, 255, 255, .72);
    font-size: var(--du-pdf-heading-size);
    line-height: .96;
    text-transform: uppercase;
  }

  .du-pdf-subtitle {
    margin-top: 1.1cqw !important;
    font-size: 2.55cqw;
    line-height: 1.08;
    text-transform: uppercase;
  }

  .du-pdf-lead {
    margin-top: 5.1cqw !important;
    font-size: 3.35cqw;
    font-weight: 800;
    line-height: 1.18;
  }

  .du-pdf-page-copy ul,
  .du-pdf-sheet--director ul,
  .du-pdf-investment-copy ul,
  .du-pdf-elearning-copy ul {
    margin-top: 4.2cqw;
    display: grid;
    gap: 3.55cqw;
  }

  .du-pdf-page-copy li,
  .du-pdf-sheet--director li,
  .du-pdf-investment-copy li,
  .du-pdf-elearning-copy li {
    position: relative;
    padding-left: 2.1cqw;
    font-size: 2.85cqw;
    line-height: 1.32;
  }

  .du-pdf-page-copy li::before,
  .du-pdf-sheet--director li::before,
  .du-pdf-investment-copy li::before,
  .du-pdf-elearning-copy li::before {
    content: "•";
    position: absolute;
    left: 0;
    top: 0;
  }

  .du-pdf-sheet--overview .du-pdf-page-copy {
    top: 11.1cqw;
  }

  .du-pdf-sheet--overview .du-pdf-lead {
    margin-top: 4.2cqw !important;
    font-size: 3.1cqw;
  }

  .du-pdf-sheet--overview .du-pdf-page-copy ul {
    margin-top: 2.8cqw;
    gap: 1.8cqw;
  }

  .du-pdf-sheet--overview .du-pdf-page-copy li {
    font-size: 2.75cqw;
    line-height: 1.22;
  }

  .du-pdf-live-note {
    margin-top: 3.5cqw !important;
    font-size: 2.35cqw;
    font-style: italic;
    line-height: 1.15;
  }

  .du-pdf-elearning-lead {
    margin-top: 3.5cqw !important;
    font-size: 2.8cqw;
    font-weight: 800;
    line-height: 1.17;
  }

  .du-pdf-platform {
    margin-top: 2cqw !important;
    font-size: 2.65cqw;
    font-weight: 800;
    line-height: 1.1;
  }

  .du-pdf-sheet--presence {
    padding: 13.8cqw 5.15cqw 7cqw;
  }

  .du-pdf-presence-heading h2 {
    font-size: var(--du-pdf-heading-size);
    line-height: .96;
    white-space: nowrap;
    text-transform: uppercase;
  }

  .du-pdf-presence-heading > div {
    margin-top: 1.3cqw;
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: start;
    gap: 2cqw;
  }

  .du-pdf-presence-heading p,
  .du-pdf-presence-heading strong {
    font-size: 1.9cqw;
    line-height: 1.1;
    text-transform: uppercase;
  }

  .du-pdf-presence-heading strong {
    padding-left: 13cqw;
    border-top: .2cqw solid rgba(255, 255, 255, .8);
  }

  .du-pdf-presence-intro {
    width: fit-content;
    margin-top: 5.3cqw !important;
    padding-bottom: 1.4cqw;
    border-bottom: .2cqw solid rgba(255, 255, 255, .8);
    font-size: 3.4cqw;
    font-weight: 600;
    line-height: 1.03;
    text-transform: uppercase;
  }

  .du-pdf-module-list {
    margin-top: 5cqw;
    display: grid;
    gap: 3.5cqw;
  }

  .du-pdf-module {
    min-height: 13.85cqw;
    display: grid;
    grid-template-columns: 17cqw 1fr;
    border: .2cqw solid rgba(45, 142, 255, .68);
  }

  .du-pdf-module time {
    padding: 2.65cqw 2.05cqw;
    display: flex;
    align-items: center;
    background: linear-gradient(145deg, #0477ff, #11bfff);
    font-size: 2.85cqw;
    font-weight: 900;
    line-height: 1.05;
    text-transform: uppercase;
  }

  .du-pdf-module > div {
    padding: 2.7cqw 2.55cqw;
    display: grid;
    align-content: center;
  }

  .du-pdf-module span,
  .du-pdf-module strong {
    display: block;
    text-transform: uppercase;
  }

  .du-pdf-module span {
    font-size: 2.5cqw;
    font-weight: 400;
  }

  .du-pdf-module strong {
    margin-top: .65cqw;
    font-size: 2.8cqw;
    line-height: 1.02;
  }

  .du-pdf-logos--footer {
    position: absolute;
    z-index: 3;
    left: 5.1cqw;
    bottom: 6.4cqw;
  }

  .du-pdf-logos--footer img {
    width: 13.5cqw;
    max-height: 4.5cqw;
  }

  .du-pdf-logos--footer .du-pdf-logo-iifs {
    width: 18.2cqw;
  }

  .du-pdf-logos--footer i {
    height: 4.2cqw;
  }

  .du-pdf-sheet--elearning {
    padding: 11.5cqw 7cqw 7cqw;
  }

  .du-pdf-elearning-heading > p {
    font-size: 4.75cqw;
    font-weight: 300;
    line-height: 1;
    text-transform: uppercase;
  }

  .du-pdf-elearning-heading h2 {
    margin-top: .7cqw;
    font-size: 4.25cqw;
    line-height: 1;
    white-space: nowrap;
    text-transform: uppercase;
  }

  .du-pdf-elearning-heading > div {
    margin-top: .95cqw;
    display: flex;
    justify-content: space-between;
    font-size: 2.75cqw;
    line-height: 1;
    text-transform: uppercase;
  }

  .du-pdf-video-frame {
    position: relative;
    left: 50%;
    width: 112cqw;
    max-width: none;
    height: 56.6cqw;
    margin: 2.5cqw 0 0;
    display: block;
    object-fit: contain;
    transform: translateX(-50%);
  }

  .du-pdf-elearning-copy {
    margin-top: 4cqw;
  }

  .du-pdf-elearning-copy h3 {
    font-size: 2.9cqw;
    line-height: 1.13;
    text-transform: uppercase;
  }

  .du-pdf-elearning-copy ul {
    margin-top: 3.45cqw;
    gap: 3.2cqw;
  }

  .du-pdf-elearning-copy li {
    font-size: 2.35cqw;
    line-height: 1.25;
  }

  .du-pdf-elearning-copy li:last-child {
    font-weight: 700;
    font-style: italic;
  }

  .du-pdf-elearning-copy li:last-child::marker {
    content: "";
  }

  .du-pdf-sheet--community {
    padding: 20.5cqw 10.4cqw 8cqw;
  }

  .du-pdf-logos--community {
    width: 52cqw;
  }

  .du-pdf-logos--community img {
    width: 13.8cqw;
    max-height: 4.4cqw;
  }

  .du-pdf-logos--community .du-pdf-logo-iifs {
    width: 18.4cqw;
  }

  .du-pdf-logos--community i {
    height: 4.2cqw;
  }

  .du-pdf-sheet--community h2 {
    margin-top: 1.7cqw;
    width: max-content;
    max-width: none;
    font-size: 3.55cqw;
    line-height: 1.07;
    white-space: nowrap;
    text-transform: uppercase;
  }

  .du-pdf-phones {
    position: absolute;
    z-index: -1;
    top: 4.8cqw;
    right: -4cqw;
    width: 105.5cqw;
    max-width: none;
    height: auto;
    object-fit: contain;
  }

  .du-pdf-sheet--community > p {
    position: absolute;
    left: 10.5cqw;
    right: 10.5cqw;
    top: 95.8cqw;
    padding-top: 7cqw;
    border-top: 0;
    background: linear-gradient(rgba(255, 255, 255, .35), rgba(255, 255, 255, .35)) 0 0 / 41cqw .2cqw no-repeat;
    font-size: 2.25cqw;
    line-height: 1.42;
    text-align: justify;
  }

  .du-pdf-sheet--director {
    padding: 11.6cqw 6.2cqw 7cqw;
  }

  .du-pdf-director-heading h2 {
    font-size: var(--du-pdf-heading-size);
    line-height: .96;
    text-transform: uppercase;
  }

  .du-pdf-director-heading {
    width: 39cqw;
  }

  .du-pdf-director-heading p {
    margin-top: .5cqw !important;
    font-size: 2.2cqw;
    line-height: 1;
    text-transform: uppercase;
  }

  .du-pdf-logos--director {
    position: absolute;
    top: 12.8cqw;
    right: 3cqw;
    gap: 1cqw;
  }

  .du-pdf-logos--director img {
    width: 11cqw;
    max-height: 4cqw;
  }

  .du-pdf-logos--director .du-pdf-logo-iifs {
    width: 16cqw;
  }

  .du-pdf-logos--director i {
    height: 3.8cqw;
  }

  .du-pdf-director-photo {
    width: 87.6cqw;
    height: 49.3cqw;
    margin-top: 3.5cqw;
    display: block;
    object-fit: cover;
  }

  .du-pdf-sheet--director h3 {
    width: fit-content;
    margin-top: 3.6cqw;
    padding-bottom: 1.15cqw;
    border-bottom: .32cqw solid #fff;
    font-size: 4.05cqw;
    line-height: 1;
    text-transform: uppercase;
  }

  .du-pdf-sheet--director ul {
    margin-top: 4.15cqw;
    gap: 2.25cqw;
  }

  .du-pdf-sheet--director li {
    font-size: 2.45cqw;
    line-height: 1.18;
  }

  .du-pdf-sheet--investment {
    height: 152.5cqw;
    padding: 0 7.65cqw 6cqw;
  }

  .du-pdf-impact {
    position: relative;
    height: 47.2cqw;
    margin-inline: -7.65cqw;
    overflow: hidden;
  }

  .du-pdf-impact img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
  }

  .du-pdf-impact > div {
    position: absolute;
    inset: 7.2cqw 0 auto;
    display: grid;
    justify-items: center;
    text-transform: uppercase;
  }

  .du-pdf-impact strong {
    font-size: 14.8cqw;
    line-height: .9;
  }

  .du-pdf-impact span {
    margin-top: 2cqw;
    font-size: 3.2cqw;
    font-weight: 800;
  }

  .du-pdf-investment-copy {
    margin-top: 4.5cqw;
  }

  .du-pdf-investment-copy h2 {
    font-size: 4.15cqw;
    line-height: 1;
    text-transform: uppercase;
    white-space: nowrap;
  }

  .du-pdf-investment-copy ul {
    margin-top: 3.3cqw;
    gap: 2.5cqw;
  }

  .du-pdf-investment-copy li {
    font-size: 2.35cqw;
    line-height: 1.2;
  }

  .du-pdf-fee-heading {
    width: fit-content;
    margin: 5cqw auto 0 !important;
    padding-bottom: .7cqw;
    border-bottom: .2cqw solid rgba(255, 255, 255, .8);
    font-size: 3.6cqw;
    line-height: 1;
    text-transform: uppercase;
  }

  .du-pdf-fee-row {
    margin-top: 2.15cqw;
    display: block;
  }

  .du-pdf-fee-package {
    display: block;
  }

  .du-pdf-fee-card {
    min-height: 31.3cqw;
    padding: 2.25cqw 3.5cqw;
    border: .2cqw solid #fff;
    border-radius: 2.2cqw;
  }

  .du-pdf-fee-card strong,
  .du-pdf-fee-card span {
    display: block;
    text-transform: uppercase;
  }

  .du-pdf-fee-card strong {
    font-size: 7.6cqw;
    line-height: 1;
  }

  .du-pdf-fee-card span {
    margin-top: .6cqw;
    padding-bottom: 1.25cqw;
    border-bottom: .2cqw solid rgba(255, 255, 255, .7);
    font-size: 2.5cqw;
  }

  .du-pdf-fee-card p {
    margin-top: 1.8cqw !important;
    font-size: 1.95cqw;
    line-height: 1.12;
  }

  .du-pdf-fee-card p em {
    color: #f5e02a;
    font-weight: 800;
  }

  .du-pdf-package-cta {
    width: 100%;
    min-height: 10.5cqw;
    margin-top: 3cqw;
    padding: 1.8cqw 3cqw;
    border-radius: 1cqw;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f5e02a;
    color: #005fc4;
    font-size: 2.8cqw;
    font-weight: 900;
    line-height: 1;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
  }

  .du-pdf-package-cta:hover,
  .du-pdf-package-cta:focus-visible {
    background: #fff;
    color: #005fc4;
  }

@media (max-width: 1023px) {
  .du-page .du-reels {
    margin: 0;
  }
}

/* =============================================================================
   IIFS — Institut International des Formations Scientifiques
   Single global stylesheet.

   MOBILE IS THE SOURCE OF TRUTH.
   The Figma comp is a 1080px-wide artboard. Every mobile value below is
   transcribed from the comp's real coordinates using:

        css_vw = figma_px / 10.8          (because 1080px comp = 100vw)

   That makes the mobile layout proportionally exact on every phone width
   (320 → 480px) instead of approximating it with breakpoints.

   Tablet (>=768px) and desktop (>=1025px) stop scaling by viewport and switch
   to px inside a centred max-width container, reusing the same tokens.
   ============================================================================= */

:root {
  /* ---- Brand colours (sampled from the Figma nodes) ---- */
  --color-primary:      #005FC4;
  --color-primary-dark: #042B79;
  --color-primary-deep: #00349D;
  --color-hero-overlay: #034294;
  --color-accent:       #F5E02A;
  --color-white:        #FFFFFF;
  --color-text:         #1E1E1E;
  --color-text-soft:    #3E3E3E;
  --color-muted:        #4C4C4C;
  --color-muted-2:      #737373;
  --color-surface:      #F4F4F4;
  --color-surface-blue: #F2F8FB;

  --font: "Montserrat", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  /* ---- Layout ---- */
  --container-lg: 1200px;
  --container-md: 960px;
  --container-sm: 720px;
  --page-pad: 8.15vw;          /* comp x=88 */
  --page-pad-d: 40px;

  /* ---- Radii (estimated from the comp; single place to tune) ---- */
  --radius-sm: 0.56vw;         /* buttons  ~6px  */
  --radius-md: 1.30vw;         /* cards    ~14px */
  --radius-lg: 1.67vw;         /* panels   ~18px */

  --shadow-card:  0 2px 35px rgba(0, 0, 0, .08);
  --shadow-soft:  0 6px 29px rgba(0, 0, 0, .06);
  --shadow-float: 0 18px 59px rgba(0, 0, 0, .49);

  --sponsor-opacity: 1;
}

/* =============================================================================
   RESET
   ============================================================================= */
*, *::before, *::after { box-sizing: border-box; }
:where([hidden]) { display: none !important; }

html { -webkit-text-size-adjust: 100%; overflow-x: clip; }

body {
  margin: 0;
  font-family: var(--font);
  color: var(--color-text);
  background: var(--color-white);
  overflow-x: clip;                 /* the comp has full-bleed art that overhangs */
  -webkit-font-smoothing: antialiased;
}

img, svg { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
button { font: inherit; color: inherit; }

h1, h2, h3, h4, p, figure { margin: 0; }
ul { margin: 0; padding: 0; list-style: none; }

/* Visible focus for keyboard users only. */
:focus-visible {
  outline: 3px solid var(--color-accent);
  outline-offset: 3px;
}

/* Screen-reader-only text. */
.sr-only {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* Honeypot — must be invisible to humans but reachable to bots. */
.hp {
  position: absolute !important;
  left: -9999px !important;
  width: 1px; height: 1px; overflow: hidden;
}

.skip-link {
  position: absolute; left: -9999px;
  background: var(--color-primary); color: #fff;
  padding: 12px 20px; z-index: 999; border-radius: 0 0 6px 0;
}
.skip-link:focus { left: 0; top: 0; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .001ms !important;
    transition-duration: .001ms !important;
    scroll-behavior: auto !important;
  }
}

/* -----------------------------------------------------------------------------
   Apparition au defilement.

   `has-reveal` est posee par app.js : sans JS, aucune de ces regles ne
   s'applique et la page s'affiche normalement. Meme deplacement que
   `heroFadeUp` (18px), pour que l'entree du hero et celle des sections
   parlent la meme langue.

   `--reveal-delay` sert au seul endroit ou l'echelonnement dit quelque chose :
   les cartes formateurs, qui arrivent l'une apres l'autre comme on lirait une
   liste. Ailleurs il vaut 0 et tout le bloc entre d'un coup.
   ----------------------------------------------------------------------------- */
.has-reveal [data-reveal] {
  opacity: 0;
  transform: translateY(18px);
}
.has-reveal [data-reveal][data-revealed] {
  opacity: 1;
  transform: translateY(0);
  transition: opacity .62s cubic-bezier(.22, .61, .36, 1) var(--reveal-delay, 0ms),
              transform .62s cubic-bezier(.22, .61, .36, 1) var(--reveal-delay, 0ms);
}

/* Les cartes formateurs suivent l'apparition de LEUR SECTION, elles ne sont
   pas observees une par une. En mobile la piste defile horizontalement : les
   cartes 3 a 6 sont hors de l'ecran et ne croiseraient jamais l'observateur,
   elles resteraient donc invisibles jusqu'a ce qu'on les fasse glisser. */
.has-reveal .trainers .trainer {
  opacity: 0;
  transform: translateY(18px);
}
.has-reveal .trainers[data-revealed] .trainer {
  opacity: 1;
  transform: translateY(0);
  transition: opacity .62s cubic-bezier(.22, .61, .36, 1) var(--reveal-delay, 0ms),
              transform .62s cubic-bezier(.22, .61, .36, 1) var(--reveal-delay, 0ms);
}

@media (prefers-reduced-motion: reduce) {
  .has-reveal [data-reveal],
  .has-reveal .trainers .trainer {
    opacity: 1;
    transform: none;
  }
}

@keyframes heroFadeUp {
  from {
    opacity: 0;
    transform: translateY(18px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* =============================================================================
   SHARED PRIMITIVES
   ============================================================================= */
.container { width: 100%; margin-inline: auto; }
.pad       { padding-inline: var(--page-pad); }

/* Buttons ------------------------------------------------------------------ */
.btn {
  display: inline-flex; align-items: center; justify-content: center;
  text-decoration: none; text-align: center; cursor: pointer;
  border: 2px solid transparent; border-radius: var(--radius-sm);
  font-weight: 700; line-height: 1;
  transition: background-color .15s ease, color .15s ease, box-shadow .15s ease, transform .12s ease;
}
.btn:active { transform: translateY(1px); }

.btn--primary { background: var(--color-primary); color: #fff; }
.btn--primary:hover { background: #0a4fa0; box-shadow: 0 8px 22px rgba(0, 95, 196, .28); }

.btn--light { background: var(--color-surface-blue); color: var(--color-primary); }
.btn--light:hover { background: #e3eef8; }

.btn--yellow { background: var(--color-accent); color: var(--color-primary); }
.btn--yellow:hover { filter: brightness(.96); }

/* Section headings --------------------------------------------------------- */
/* comp 52.83px, ExtraBold, letter-spacing -0.0059em */
.section-title {
  font-size: 4.892vw; font-weight: 800; line-height: 1;
  letter-spacing: -.0059em; color: var(--color-primary); text-align: center;
}

/* =============================================================================
   HEADER  (comp: white bar, 1109x168 bitmap at y=-3 -> 165px tall)
   ============================================================================= */
.header {
  position: relative; z-index: 20;
  background: #fff;
  height: 15.28vw;                    /* comp 165 */
  display: flex; align-items: center; justify-content: space-between;
  padding-inline: 3.24vw 4vw;         /* comp logo starts x=35 */
}
.header__logo { display: block; }
.header__logo img { width: 53.89vw; }  /* comp 582 */
.header__logo picture { display: block; }

.header--hero {
  position: absolute;
  inset: 0 0 auto;
  background: transparent;
}
.du-page .header--hero,
.formation-page .header--hero {
  background: transparent;
}

@media (max-width: 767px) {
  .du-page .header--hero,
  .formation-page .header--hero {
    background: transparent;
  }

  .header--hero .nav-toggle {
    color: #fff;
  }
  .header--hero .nav-toggle__bars i {
    background: #fff;
  }
}

/* Hamburger + the word "Menu", exactly as the comp shows it. */
.nav-toggle {
  display: inline-flex; align-items: center; gap: 2.4vw;
  background: none; border: 0; padding: 1.5vw; cursor: pointer;
  color: #2b2b2b; font-size: 3.4vw; font-weight: 500;
}
.nav-toggle span:last-child { line-height: 1; }
.nav-toggle__bars { display: inline-flex; flex-direction: column; gap: 1.05vw; }
.nav-toggle__bars i { display: block; width: 6.5vw; height: .55vw; background: #2b2b2b; border-radius: 2px; }

/* Desktop nav is hidden on mobile — the comp only has the Menu button. */
.nav { display: none; }

/* Mobile drawer ------------------------------------------------------------ */
.mobile-menu {
  position: fixed; inset: 0; z-index: 100;
  color: #fff;
  pointer-events: none;
  visibility: hidden;
}
.mobile-menu[data-open="true"] {
  pointer-events: auto;
  visibility: visible;
}
.mobile-menu__backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: rgba(0, 30, 82, .58);
  opacity: 0;
  transition: opacity .24s ease;
}
.mobile-menu[data-open="true"] .mobile-menu__backdrop {
  opacity: 1;
}
.mobile-menu__panel {
  position: absolute;
  inset: 0 0 0 auto;
  width: min(86vw, 390px);
  padding: 8vw 7vw;
  display: flex;
  flex-direction: column;
  gap: 6vw;
  overflow-y: auto;
  background:
    linear-gradient(180deg, rgba(0,95,196,.96), rgba(4,43,121,.98)),
    var(--color-primary-dark);
  box-shadow: -18px 0 52px rgba(0, 28, 82, .32);
  transform: translateX(100%);
  transition: transform .28s ease;
}
.mobile-menu[data-open="true"] .mobile-menu__panel { transform: translateX(0); }
.mobile-menu__close {
  align-self: flex-end; background: none; border: 0;
  color: #fff; font-size: 8vw; line-height: 1; padding: 2vw; cursor: pointer;
}
.mobile-menu nav {
  display: flex;
  flex-direction: column;
  gap: 1vw;
}
.mobile-menu a {
  color: #fff; text-decoration: none;
  font-size: 4.7vw; font-weight: 700; line-height: 1.1;
  padding: 3.1vw 0;
  border-bottom: 1px solid rgba(255,255,255,.14);
}
.mobile-menu a[aria-current="page"] { color: var(--color-accent); }
.mobile-menu__cta {
  margin-top: 5vw;
  min-height: 13vw;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-bottom: 0 !important;
  border-radius: 999px;
  background: var(--color-accent);
  color: var(--color-primary) !important;
}

/* =============================================================================
   HERO
   Mobile follows the legacy IIFS composition: full viewport image, strong lower
   blue wash, title locked to the bottom, and a compact 2-column CTA grid.
   ============================================================================= */
.hero {
  position: relative;
  min-height: 100svh;
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: 32px 24px 26px;
  background:
    linear-gradient(
      180deg,
      rgba(0, 54, 135, .05) 0%,
      rgba(0, 76, 184, .12) 42%,
      rgba(0, 72, 180, .72) 76%,
      rgba(0, 55, 155, .98) 100%
    ),
    var(--color-primary-deep) url("/assets/images/brand/hero-home-mobile.webp") center top / cover no-repeat;
  color: #fff;
  isolation: isolate;
}

.hero__inner {
  position: relative;
  z-index: 1;
  width: 100%;
}

.hero__title {
  max-width: 100%;
  font-size: clamp(41px, 11.2vw, 50px); font-weight: 700; line-height: .98;
  margin-bottom: 24px;
  letter-spacing: 0;
  color: #fff;
}
.hero__title-line {
  display: block;
  white-space: nowrap;
}

.hero__actions {
  display: grid;
  grid-template-columns: .88fr 1.12fr;
  gap: 10px;
  width: 100%;
}

.hero__btn {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 54px; padding: 10px 8px;
  border-radius: 10px; border: 2px solid #fff;
  font-size: 11px; font-weight: 800; line-height: 1.15;
  letter-spacing: 0;
  text-align: center; text-transform: uppercase; text-decoration: none;
  transition: opacity .15s ease, transform .15s ease, background-color .15s ease;
}
.hero__btn--primary { background: var(--color-accent); color: var(--color-primary); border-color: var(--color-accent); }
.hero__btn--outline,
.hero__btn--solid { background: transparent; color: #fff; }
.hero__btn--solid {
  grid-column: 1 / 2;
  min-width: 130%;
}
.hero__btn:hover { opacity: .88; transform: translateY(-1px); }

.hero__desktop-extra,
.hero__formation-nav {
  display: none;
}

@media (max-width: 390px) {
  .hero { padding-right: 14px; padding-left: 14px; }
  .hero__btn { min-height: 50px; padding: 8px 6px; font-size: 10px; }
}

@media (min-width: 430px) and (max-width: 767px) {
  .hero { padding: 40px 24px 34px; }
  .hero__inner { max-width: 720px; margin-inline: auto; }
  .hero__title { margin-bottom: 28px; }
  .hero__actions { grid-template-columns: .9fr 1.1fr; gap: 12px; }
  .hero__btn { min-height: 58px; padding: 12px 14px; border-radius: 12px; font-size: 13px; }
  .hero__btn--solid { min-width: 120%; }
}

@media (min-width: 600px) and (max-width: 767px) {
  .hero__btn { font-size: 15px; }
}

/* =============================================================================
   INTRO / CONTACT / ACADEMIC PARTNERS
   ============================================================================= */
.intro { padding: 6.195vw var(--page-pad) 0; }   /* comp gap 66.91 */

/* comp 35px Medium, lh 42 */
.intro__lead {
  font-size: 3.241vw; font-weight: 500; line-height: 1.2;
  color: var(--color-text); max-width: 84.1vw;
}

/* comp 41.44px Medium */
.intro__question {
  margin-top: 6.805vw;                   /* comp 73.49 */
  font-size: 3.837vw; font-weight: 500; line-height: .984;
  color: var(--color-primary);
}

/* comp 30px SemiBold #3E3E3E, lh 40.77 */
.intro__contact { margin-top: 3.5vw; display: flex; flex-direction: column; }
.intro__contact a {
  font-size: 2.778vw; font-weight: 600; line-height: 1.359;
  color: var(--color-text-soft); text-decoration: none;
}
.intro__contact a:hover { color: var(--color-primary); text-decoration: underline; }

@media (max-width: 767px) {
  .home-page .intro__question,
  .home-page .intro__contact {
    display: none;
  }
}

/* comp 27.18px SemiBold uppercase */
.partners__label {
  margin-top: 8.17vw;                    /* comp 88.24 */
  font-size: 2.516vw; font-weight: 600; text-transform: uppercase;
  color: var(--color-primary);
}
.partners__row {
  margin-top: 5.2vw;
  display: flex; align-items: center; justify-content: space-between; gap: 2vw;
}
.partners__row img { width: auto; object-fit: contain; }
.partners__row li:nth-child(1) img { height: 8.15vw; }   /* comp 88  */
.partners__row li:nth-child(2) img { height: 7.69vw; }   /* comp 83  */
.partners__row li:nth-child(3) img { height: 16.57vw; }  /* comp 179 */
.partners__row li:nth-child(4) img { height: 11.30vw; }  /* comp 122 */
.partners__sep { width: .19vw; height: 8.6vw; background: var(--color-primary); flex: none; }

/* =============================================================================
   CATEGORY CARDS   (comp: 3 per row, 277.09 x 276.87, gap 25.92)
   ============================================================================= */
.categories { padding: 8.45vw 9.04vw 0; }

/* comp 28.52px Regular, lh 40.5, ls -0.0166em, centred */
.categories__lead {
  font-size: 2.641vw; line-height: 1.42; letter-spacing: -.0166em;
  color: var(--color-primary); text-align: center;
  max-width: 70.28vw; margin-inline: auto;
}

.categories__grid {
  margin-top: 4.266vw;                   /* comp 46.07 */
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  column-gap: 2.4vw; row-gap: 4.27vw;
}

.category-card {
  position: relative;
  background: #fff;
  border: 1px solid rgba(0, 95, 196, .24);
  border-radius: var(--radius-md);
  box-shadow: 0 12px 34px rgba(0, 95, 196, .08);
  padding: 3.22vw 2.92vw 40px;           /* reserve a clear action row for the arrow */
  min-height: 25.64vw;                   /* comp card height 276.87 */
  display: flex; flex-direction: column;
  text-decoration: none;
}
.category-card::after {
  content: "→";
  position: absolute;
  right: 14px;
  bottom: 12px;
  color: var(--color-primary);
  font-family: Arial, sans-serif;
  font-size: 24px;
  font-weight: 400;
  line-height: 1;
  transition: transform .2s ease;
}
.category-card:hover::after,
.category-card:focus-visible::after {
  transform: translateX(4px);
}
.category-card__icon {
  width: 9.26vw; height: 10.19vw;        /* comp 100 x 110 */
  object-fit: contain; margin-inline: auto;
  filter: brightness(0) saturate(100%) invert(29%) sepia(96%) saturate(2292%) hue-rotate(200deg) brightness(91%) contrast(101%);
}
/* comp 19.86px SemiBold uppercase */
.category-card__label {
  margin-top: 3.97vw;                    /* comp 42.84 */
  font-size: 1.839vw; font-weight: 600; text-transform: uppercase;
  line-height: 1.17; color: var(--color-primary);
  text-align: center;
}
/* comp 19.86px Regular, lh 23.83 */
.category-card__text {
  margin-top: .58vw;
  overflow-wrap: anywhere;
  font-size: 1.839vw; line-height: 1.2; color: var(--color-muted);
}

/* =============================================================================
   FORMATIONS ACCORDION
   ============================================================================= */
.formations { padding-top: 6.34vw; }
.formations__title { margin-bottom: 6.06vw; }   /* comp 65.44 */

.accordion { padding-inline: 4.073vw; display: flex; flex-direction: column; gap: .3vw; }

.accordion__item { background: var(--color-surface); border-radius: var(--radius-md); overflow: hidden; }

/* comp closed row height 125.54 */
.accordion__head {
  width: 100%; background: none; border: 0; cursor: pointer;
  display: flex; align-items: center; gap: 1.5vw;
  padding: 4.14vw 5.2vw;                 /* comp label offsets */
  min-height: 11.62vw; text-align: left;
}
/* comp 31.09px ExtraBold uppercase */
.accordion__label {
  font-size: 2.879vw; font-weight: 800; text-transform: uppercase;
  line-height: 1; color: var(--color-primary);
}
/* The comp puts the chevron immediately after the label, not right-aligned. */
.accordion__chevron {
  width: 1.55vw; height: 1.55vw; flex: none;
  border-right: .28vw solid var(--color-primary);
  border-bottom: .28vw solid var(--color-primary);
  transform: rotate(-45deg);             /* closed: points right */
  transition: transform .25s ease;
  margin-left: .6vw;
}
.accordion__item[data-open="true"] .accordion__chevron { transform: rotate(45deg); } /* open: down */

.accordion__panel { display: none; padding: 0 3.9vw 5vw; }
.accordion__item[data-open="true"] .accordion__panel { display: grid; gap: 4vw; }

/* Formation card ----------------------------------------------------------- */
.formation-card {
  min-height: 100%;
  display: flex;
  flex-direction: column;
  background: #fff; border-radius: var(--radius-md);
  box-shadow: var(--shadow-card); overflow: hidden;
}
.formation-card[data-pinned="true"] {
  border: 3px solid var(--color-accent);
  box-shadow: 0 12px 34px rgba(245, 224, 42, .28), var(--shadow-card);
}
.formation-card[data-pinned="true"] .formation-card__title {
  font-size: clamp(19px, 5.2vw, 31px);
  line-height: 1.14;
  overflow-wrap: anywhere;
}
.formation-card__media { width: 100%; aspect-ratio: 935 / 561; }
.formation-card__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
/* Formateur sans photo livrée : bloc de marque, même ratio que les autres,
   pour que toutes les cartes gardent la même silhouette dans la grille. */
.formation-card__media--empty {
  display: grid;
  place-items: center;
  background:
    radial-gradient(120% 120% at 15% 0%, rgba(255, 255, 255, .18) 0%, rgba(255, 255, 255, 0) 55%),
    linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-dark) 100%);
}
.formation-card__media--empty::after {
  content: "";
  width: 38%;
  height: 38%;
  opacity: .45;
  background: url("/assets/images/brand/logo-iifs-white.webp") center / contain no-repeat;
}
.formation-card__body {
  flex: 1;
  padding: 20px 22px 24px;
  display: flex;
  flex-direction: column;
}

.formation-card__category {
  display: inline-flex;
  margin-bottom: 10px;
  color: var(--color-primary);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.1;
  text-transform: uppercase;
}

/* comp 41.82px Bold, lh 50.18 */
.formation-card__title {
  font-size: 22px; font-weight: 700; line-height: 1.16;
  color: var(--color-primary); text-decoration: none; display: block;
}
a.formation-card__title:hover { text-decoration: underline; }

/* Date + ville sur une ligne, bouton pleine largeur en dessous. Empilés
   côte à côte, la date passait à deux lignes et écrasait la pastille ville. */
.formation-card__meta {
  margin-top: 18px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 12px;
}
.formation-card__when {
  min-width: 0;
  display: flex;
  flex-flow: row wrap;
  align-items: center;
  gap: 8px 10px;
}
/* comp 41.82px Regular */
.formation-card__date { font-size: 20px; color: #000; }
.formation-card__dates {
  display: grid;
  gap: 4px;
}
.formation-card__city {
  width: fit-content;
  max-width: 100%;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 10px;
  border: 1px solid rgba(0, 95, 196, .16);
  border-radius: 999px;
  background: var(--color-surface-blue);
  color: var(--color-primary);
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
}
.formation-card__city::before {
  content: "";
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: currentColor;
}
/* comp button 388.85 x 52.25, text 25.19 Bold */
.formation-card__cta {
  min-height: 42px; padding-inline: 18px;
  font-size: 12px; text-transform: uppercase;
}

/* Offre participant : affichée uniquement sur /inscription/merci/, quand la
   carte reçoit discount_percent. Ailleurs, aucun prix n'apparaît. */
.formation-card__offer {
  margin: 0 0 14px;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px 10px;
}
.formation-card__offer del {
  color: var(--color-muted-2);
  font-size: 15px;
  text-decoration-thickness: 2px;
}
.formation-card__offer strong {
  color: var(--color-primary);
  font-size: 22px;
  font-weight: 900;
  line-height: 1;
}
.formation-card__offer span {
  padding: 5px 9px;
  border-radius: 999px;
  background: var(--color-accent);
  color: var(--color-primary);
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
  white-space: nowrap;
}

.formation-card__divider {
  height: 2px; background: var(--color-muted-2);
  margin: 20px 0 16px; border: 0;
}
/* comp 34.56px ExtraBold #737373 */
.formation-card__trainer {
  font-size: 16px; font-weight: 800; line-height: 1.2; color: var(--color-muted-2);
  overflow: hidden;
}
.formation-card__trainer span {
  display: -webkit-box;
  margin-top: 8px;
  overflow: hidden;
  font-weight: 400;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.accordion__empty {
  padding: 4vw 0; color: var(--color-muted-2); font-size: 2.8vw;
}

/* Formation browser filters ------------------------------------------------ */
.formation-filters {
  margin-inline: var(--page-pad);
  display: grid;
  gap: 4vw;
}
.formation-filter-tabs {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.formation-filter-tab {
  position: relative;
  min-width: 0;
  min-height: 54px;
  padding: 8px 5px 10px;
  border: 1px solid rgba(0, 95, 196, .15);
  border-radius: 6px;
  background: #fff;
  color: var(--color-muted-2);
  font: inherit;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  cursor: pointer;
  overflow-wrap: anywhere;
}
.formation-filter-tab::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: -1px;
  left: 0;
  height: 3px;
  background: var(--color-primary);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .2s ease;
}
.formation-filter-tab[aria-selected="true"] {
  color: var(--color-primary);
  border-color: rgba(0, 95, 196, .34);
  background: var(--color-surface-blue);
}
.formation-filter-tab[aria-selected="true"]::after {
  transform: scaleX(1);
}
.formation-filter-tab:focus-visible {
  outline: 3px solid rgba(0, 95, 196, .28);
  outline-offset: 4px;
}
.formation-filters__meta {
  display: grid;
  gap: 2.4vw;
}
.formation-filters__selects {
  display: grid;
  gap: 2.4vw;
}
.formation-select {
  display: grid;
  gap: 1.1vw;
  color: var(--color-primary);
  font-size: 2.55vw;
  font-weight: 800;
}
.formation-select select {
  appearance: none;
  width: 100%;
  min-height: 9.4vw;
  border: 1px solid rgba(0,95,196,.22);
  border-radius: 1.6vw;
  background:
    linear-gradient(45deg, transparent 50%, var(--color-primary) 50%) right 4.3vw center / 7px 7px no-repeat,
    linear-gradient(135deg, var(--color-primary) 50%, transparent 50%) right 3.65vw center / 7px 7px no-repeat,
    #fff;
  color: var(--color-text);
  font: inherit;
  font-weight: 600;
  padding: 0 8vw 0 3vw;
}
.formation-results {
  width: max-content;
  max-width: 100%;
  display: inline-flex;
  align-items: center;
  gap: 1.5vw;
  padding: 2.2vw 2.8vw;
  border: 1px solid rgba(0, 95, 196, .14);
  border-radius: 999px;
  background: var(--color-surface-blue);
  color: var(--color-primary);
  font-size: 2.45vw;
  font-weight: 800;
  line-height: 1;
}
.formation-results::before {
  content: "";
  width: 1.3vw;
  height: 1.3vw;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--color-primary);
}
.formation-browser-grid {
  display: grid;
  gap: 4vw;
  padding: 4vw var(--page-pad) 0;
}
.formation-empty {
  margin: 4vw var(--page-pad) 0;
  padding: 4vw;
  border-radius: var(--radius-md);
  background: var(--color-surface-blue);
  color: var(--color-primary);
  font-size: 3vw;
  font-weight: 700;
}

/* Homepage category slider ------------------------------------------------- */
.home-formation-slider {
  overflow: hidden;
}
.home-formation-slider .formations__title {
  margin-bottom: 4vw;
}
.formation-slider__tabs-wrap {
  margin-inline: var(--page-pad);
  overflow: visible;
}
.formation-slider__tabs-wrap::-webkit-scrollbar,
.formation-slider__track::-webkit-scrollbar {
  display: none;
}
.formation-slider__tabs {
  width: 100%;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}
.formation-slider__tab {
  position: relative;
  min-width: 0;
  min-height: 54px;
  padding: 8px 5px 10px;
  border: 1px solid rgba(0, 95, 196, .15);
  border-radius: 6px;
  background: #fff;
  color: var(--color-muted-2);
  font: inherit;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  cursor: pointer;
  overflow-wrap: anywhere;
}
.formation-slider__tab::after {
  content: "";
  position: absolute;
  right: 0;
  bottom: -1px;
  left: 0;
  height: 3px;
  background: var(--color-primary);
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .2s ease;
}
.formation-slider__tab[aria-selected="true"] {
  color: var(--color-primary);
  border-color: rgba(0, 95, 196, .34);
  background: var(--color-surface-blue);
}
.formation-slider__tab[aria-selected="true"]::after {
  transform: scaleX(1);
}
.formation-slider__tab:focus-visible {
  outline: 3px solid rgba(0, 95, 196, .28);
  outline-offset: 4px;
}
.formation-slider__viewport {
  position: relative;
  margin-top: 22px;
}
.formation-slider__track {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scroll-behavior: smooth;
  scroll-padding-inline: var(--page-pad);
  scroll-snap-type: inline mandatory;
  scrollbar-width: none;
  padding: 4px var(--page-pad) 24px;
}
.formation-slider__track .formation-card {
  flex: 0 0 min(84vw, 350px);
  min-height: 0;
  scroll-snap-align: start;
  scroll-snap-stop: always;
}
.home-formation-slider .formation-card__body {
  display: flex;
  flex-direction: column;
}
.home-formation-slider .formation-card__category {
  min-height: 0;
  overflow: visible;
  white-space: normal;
  text-overflow: clip;
  line-height: 1.2;
}
.home-formation-slider .formation-card__title,
.home-formation-slider .formation-card[data-pinned="true"] .formation-card__title {
  display: block;
  min-height: 0;
  overflow: visible;
  color: var(--color-primary);
  font-size: 20px;
  line-height: 1.18;
  overflow-wrap: anywhere;
  -webkit-line-clamp: initial;
}
.home-formation-slider .formation-card__meta {
  margin-top: 18px;
}
.formation-slider__track .formation-card[hidden] {
  display: none;
}
.formation-slider__arrow {
  position: absolute;
  top: 180px;
  z-index: 5;
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(0, 95, 196, .18);
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 10px 28px rgba(0, 39, 101, .20);
  color: var(--color-primary);
  font-size: 25px;
  line-height: 1;
  cursor: pointer;
  transform: translateY(-50%);
  transition: opacity .2s ease, transform .2s ease, box-shadow .2s ease;
}
.formation-slider__arrow--prev { left: 8px; }
.formation-slider__arrow--next { right: 8px; }
.formation-slider__arrow:hover {
  box-shadow: 0 14px 34px rgba(0, 39, 101, .26);
  transform: translateY(-50%) scale(1.05);
}
.formation-slider__arrow:focus-visible {
  outline: 3px solid rgba(0, 95, 196, .28);
  outline-offset: 3px;
}
.formation-slider__arrow:disabled {
  opacity: 0;
  pointer-events: none;
}
.formation-slider__empty {
  margin: 20px var(--page-pad) 0;
  color: var(--color-primary);
  font-size: 15px;
  font-weight: 700;
}

/* =============================================================================
   TRUST STATEMENT
   ============================================================================= */
.stats {
  margin-top: 14.37vw;
  padding-inline: var(--page-pad);
}
.stats__trust {
  width: 100%;
  max-width: 680px;
  margin-inline: auto;
  padding: 18px 16px;
  display: grid;
  grid-template-columns: 126px minmax(0, 1fr);
  align-items: center;
  gap: 16px;
  border: 1px solid rgba(255, 255, 255, .92);
  border-radius: 8px;
  background: var(--color-primary);
  box-shadow: 0 14px 34px rgba(0, 65, 150, .16);
  color: #fff;
}
.stats__trust strong {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 44px;
  font-weight: 400;
  line-height: .9;
  text-align: right;
  white-space: nowrap;
}
.stats__trust span {
  font-size: 16px;
  font-weight: 500;
  line-height: 1.16;
  text-transform: uppercase;
}

/* =============================================================================
   SUGGESTION CTA   (comp: full-bleed blue band, height 403)
   ============================================================================= */
.suggest {
  margin-top: 13.03vw; padding: 5.57vw var(--page-pad) 0;
  min-height: 37.31vw; background: var(--color-primary); color: #fff;
  text-align: center;
}
/* comp 32.78px Medium, lh 39.34 */
.suggest__text {
  font-size: 3.035vw; font-weight: 500; line-height: 1.2;
  max-width: 82.59vw; margin-inline: auto;
}
/* comp 449.16 x 69.86, text 31.03 Bold */
.suggest__cta {
  margin-top: 4.35vw;
  min-width: 41.59vw; min-height: 6.47vw;
  font-size: 2.873vw; letter-spacing: -.0098em;
}

/* =============================================================================
   GALLERY  "Le succès s'apprend"   (comp: 2 cols x 3 rows inside a grey panel)
   ============================================================================= */
.gallery { padding-top: 7.64vw; }
.gallery--home-end {
  margin-top: 4vw;
  padding: 7vw 0 6.5vw;
  background: var(--color-primary);
}
.gallery__inner {
  width: min(100% - clamp(40px, 10vw, 160px), 1320px);
  margin-inline: auto;
}
.gallery--home-end .section-title {
  color: #fff;
  font-size: clamp(30px, 6.4vw, 58px);
  line-height: 1.08;
  text-transform: uppercase;
}
.gallery__mobile-trust { display: none; }
.gallery__featured {
  margin: 6vw 0 0;
  background: #fff;
}
.gallery__featured img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 6;
  object-fit: cover;
  object-position: center center;
}
.gallery__panel {
  margin: 7.36vw 3.06vw 0;
  background: var(--color-surface); border-radius: var(--radius-lg);
  padding: 5.56vw 4.35vw;
}
.gallery--home-end .gallery__panel {
  margin: 0;
  padding: 1.5vw;
  background: #fff;
  border-radius: 0;
}
.gallery__grid {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 1.39vw; row-gap: 1.57vw;
}
.gallery--home-end .gallery__grid {
  gap: 1.5vw;
}
.gallery__grid img {
  width: 100%; aspect-ratio: 4 / 3; object-fit: cover;
  object-position: center center;
  border-radius: .6vw;
}
.gallery--home-end .gallery__grid img {
  border-radius: 0;
}

/* =============================================================================
   UNIVERSITY DEGREE PITCH
   ============================================================================= */
.pitch {
  margin-top: 0;
  padding: 19vw 0 8vw;
  background: #eef7fc;
}
.pitch__inner {
  width: min(100% - 12vw, 1200px);
  margin-inline: auto;
}
.pitch__intro {
  display: grid;
  gap: 4vw;
}
.pitch__prof {
  overflow: hidden;
  border-radius: 9vw;
  box-shadow: 0 18px 44px rgba(0, 54, 135, .13);
}
.pitch__prof img {
  width: 100%;
  aspect-ratio: 386 / 356;
  object-fit: cover;
  object-position: 38% 24%;
  display: block;
  transform: scale(1.48);
  transform-origin: 38% 24%;
}
.pitch__name {
  color: var(--color-primary);
  font-size: 7.3vw;
  font-weight: 900;
  line-height: 1.12;
  letter-spacing: 0;
}
.pitch__name a {
  color: inherit;
  text-decoration: none;
}
.pitch__subtitle {
  color: var(--color-text-soft);
  font-size: 3.8vw;
  line-height: 1.25;
}
.pitch__copy {
  margin-top: 7vw;
  padding-top: 5vw;
  border-top: 1px solid rgba(35, 35, 35, .7);
}
.pitch__cta {
  width: 100%;
  min-height: 13.5vw;
  margin-top: 6vw;
  border-radius: 1.11vw;
  font-size: 3.7vw;
  font-weight: 900;
  line-height: 1.2;
  text-transform: uppercase;
  text-align: center;
}

@media (max-width: 767px) {
  .home-page .pitch {
    padding: 12vw 0;
  }

  .home-page .pitch__copy--side {
    margin-top: 5vw;
    padding-top: 0;
    border-top: 0;
  }

  .home-page .pitch__cta {
    margin-top: 0;
  }
}

/* -----------------------------------------------------------------------------
   Mise en avant « Certificat addictologie », juste après le bloc DU.

   Elle réutilise les classes `pitch__*` : même typographie, même bouton, une
   seule maquette à maintenir. Trois écarts seulement, tous justifiés ci-dessous.
   ----------------------------------------------------------------------------- */
.pitch--rolland {
  /* Fond blanc : deux blocs #eef7fc collés l'un à l'autre se liraient comme
     une seule section, et le DU perdrait sa mise en avant. */
  background: #fff;
}

/* Le cadrage du DU (scale 1.48/1.32, origine 38% 24%) est réglé sur le
   portrait du Pr Avignon. Ici le sujet est à gauche, debout à un pupitre :
   il tient dans le cadre sans zoom, aux deux tailles d'écran. */
.pitch--rolland .pitch__prof img {
  object-position: 32% 28%;
  transform: none;
}

@media (max-width: 767px) {
  /* Le titre de cette formation est deux fois plus long que « Diplôme
     Universitaire… » : au corps du DU il occuperait cinq lignes.
     Uniquement en mobile — en `vw`, cette valeur donnerait 85px sur un
     écran de 1440px. Le desktop garde le corps commun de `.pitch__name`. */
  .pitch--rolland .pitch__name {
    font-size: 5.9vw;
  }
}

/* -----------------------------------------------------------------------------
   Les deux mises en avant côte à côte à partir de 768px.

   Deux <section> plutôt qu'une grille à deux colonnes dans un seul bloc :
   chacune porte son propre fond sur toute sa hauteur, et les deux colonnes
   restent d'égale hauteur quelle que soit la longueur des titres.
   ----------------------------------------------------------------------------- */
@media (min-width: 768px) {
  .pitch-duo {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
  }

  /* Le bloc DU n'a plus de seconde image ni de colonnes d'arguments : son
     `pitch__inner` en trois colonnes n'a plus rien à répartir. */
  .pitch-duo .pitch__inner {
    width: min(100% - 56px, 460px);
    display: flex;
    flex-direction: column;
    height: 100%;
  }

  .pitch-duo .pitch__intro {
    gap: 0;
  }

  /* `nowrap` était réglé sur « Diplôme Universitaire… », coupé manuellement
     par des <br>. Le titre du certificat vient de la fiche et doit pouvoir
     revenir à la ligne tout seul. */
  .pitch-duo .pitch__name {
    white-space: normal;
  }

  /* Le bouton se cale en bas : les deux titres n'ont pas la même hauteur, et
     deux boutons décalés de quelques pixels se verraient. */
  .pitch-duo .pitch__copy--side {
    margin-top: auto;
    padding-top: 24px;
    border-top: 0;
  }
}

/* -----------------------------------------------------------------------------
   Ordre des sections de l'accueil — MOBILE UNIQUEMENT

   Le DOM garde l'ordre du desktop ; c'est `order` qui remonte la galerie
   juste après « +1800 médecins », puis le DU, puis la suggestion. Une seule
   arborescence sert les deux affichages, comme partout ailleurs sur le site :
   dupliquer le markup pour le mobile ferait deux versions à corriger.

   Les dix sections sont numérotées, pas seulement les quatre déplacées :
   `order` par défaut vaut 0, donc toute section laissée sans numéro
   remonterait avant les autres. La liste ci-dessous est donc l'ordre mobile
   complet — pour insérer une section, la numéroter ici aussi.
   ----------------------------------------------------------------------------- */
@media (max-width: 767px) {
  .home-page #main {
    display: flex;
    flex-direction: column;
  }

  .home-page .hero                 { order: 1; }
  .home-page .intro                { order: 2; }
  .home-page .formations           { order: 3; }
  .home-page .stats                { display: none; }
  .home-page .gallery--home-end    { order: 4; }
  .home-page .pitch-duo            { order: 6; }
  .home-page .suggest              { order: 7; }
  .home-page .sponsors             { order: 8; }
  .home-page .reviews              { order: 9; }
  .home-page .trainers             { order: 10; }

  .home-page .gallery--home-end {
    margin-top: 0;
  }

  .gallery--home-end .section-title {
    display: none;
  }

  .gallery__mobile-trust {
    width: 100%;
    margin: 0;
    padding: 18px 16px;
    display: grid;
    grid-template-columns: 126px minmax(0, 1fr);
    align-items: center;
    gap: 16px;
    border: 1px solid rgba(255, 255, 255, .92);
    border-radius: 8px;
    color: #fff;
  }

  .gallery__mobile-trust strong {
    font-family: Georgia, "Times New Roman", serif;
    font-size: 44px;
    font-weight: 400;
    line-height: .9;
    text-align: right;
    white-space: nowrap;
  }

  .gallery__mobile-trust span {
    font-size: 16px;
    font-weight: 500;
    line-height: 1.16;
    text-transform: uppercase;
  }
}

/* =============================================================================
   SPONSORS
   ============================================================================= */
.sponsors { padding-top: 8.18vw; text-align: center; }
.sponsors__title { font-size: 4.63vw; font-weight: 800; line-height: 1; color: var(--color-primary); }
.sponsors__rule {
  width: 38.7vw; height: .28vw; background: var(--color-primary);
  border: 0; margin: 1.4vw auto 0;
}
.sponsors__row {
  width: min(100% - 8vw, 1180px);
  margin-top: 10.37vw;
  margin-inline: auto;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: center;
  justify-items: center;
  gap: 3.2vw;
}
.sponsors__item {
  width: 100%;
  min-height: 18vw;
  margin: 0;
  padding: 3vw 4vw;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(0, 95, 196, .08);
  border-radius: 2vw;
  background: #fff;
  box-shadow: 0 10px 28px rgba(0, 54, 135, .055);
}
.sponsors__row img {
  width: auto;
  max-width: 100%;
  max-height: 11vw;
  height: auto;
  object-fit: contain;
  opacity: var(--sponsor-opacity);
}

/* =============================================================================
   REVIEWS  (mobile collage, desktop testimonial wall)
   ============================================================================= */
.reviews {
  position: relative;
  margin-top: 4vw; padding: 13.14vw 0 7vw; overflow: hidden;
  background: var(--color-primary); color: #fff;
}
/* comp 42.8px Medium, lh 51.37 */
.reviews__title {
  font-size: 3.963vw; font-weight: 600; line-height: 1.2; text-align: center;
  max-width: 81.11vw; margin-inline: auto;
}

.reviews__collage {
  position: relative; height: 136vw; margin-top: 5vw;
}
.reviews__item {
  position: absolute; margin: 0; border-radius: 1vw; overflow: hidden;
  transform-origin: center top;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .28);
}
.reviews__item img {
  display: block;
  width: 100%;
  height: auto;
  object-position: center top;
}
.reviews__item:nth-child(n+5) { display: none; }
.reviews__item:nth-child(1) { left: 3vw; top: 0; width: 37vw; transform: rotate(-4deg); }
.reviews__item:nth-child(2) { right: 3vw; top: 1vw; width: 38vw; transform: rotate(5deg); }
.reviews__item:nth-child(3) { left: 24vw; top: 12vw; width: 40vw; z-index: 2; transform: rotate(-1deg); }
.reviews__item:nth-child(4) { right: 3vw; top: 25vw; width: 51vw; transform: rotate(7deg); }
.reviews__item:hover {
  z-index: 4;
}

/* =============================================================================
   TRAINERS  (comp: one large portrait with prev/next circles)
   ============================================================================= */
.trainers { padding-top: 8.80vw; padding-bottom: 10vw; }
/* comp 68.35px ExtraBold uppercase */
.trainers__title {
  font-size: 6.329vw; font-weight: 800; line-height: 1;
  text-transform: uppercase; color: var(--color-primary); text-align: center;
}

.trainers__viewport { margin-top: 7.97vw; }

.trainers__track {
  display: flex;
  /* `stretch` est ce qui rend le glissement fluide : les biographies vont de
     55 a 149 caracteres, et tant que chaque carte avait sa propre hauteur, il
     fallait un script pour animer la hauteur de la piste a chaque geste.
     A hauteur egale, il n'y a plus rien a animer. */
  align-items: stretch;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  gap: 4vw;
  padding: 0 4vw 3vw;
  scrollbar-width: none; -webkit-overflow-scrolling: touch;
}
.trainers__track::-webkit-scrollbar { display: none; }

/* Carte : le nom et le poste ne flottaient sur rien, si bien que rien ne
   disait ou finissait un formateur et ou commencait le suivant. */
.trainer {
  flex: 0 0 78%;
  scroll-snap-align: center;
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid rgba(0, 95, 196, .14);
  border-radius: 4vw;
  overflow: hidden;
  box-shadow: 0 2.5vw 6vw rgba(0, 52, 157, .08);
}
.trainer__photo {
  width: 100%; aspect-ratio: 876 / 1135;
  overflow: hidden;
}
.trainer__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .5s cubic-bezier(.22, .61, .36, 1);
}
.trainer__body {
  flex: 1;
  padding: 5vw 5vw 6vw;
}
.trainer__name {
  font-size: 4.6vw; font-weight: 700; line-height: 1.15;
  color: var(--color-primary);
}
/* Filet : separe l'identite du titre hospitalier. Sur cette page la
   credibilite tient au service et au CHU, autant les distinguer du nom. */
.trainer__name::after {
  content: "";
  width: 7vw; height: 2px;
  margin: 3vw 0 3.2vw;
  display: block;
  background: var(--color-primary);
  opacity: .45;
}
.trainer__role {
  font-size: 3.5vw; font-weight: 400; line-height: 1.5;
  color: var(--color-muted);
}

.trainers__controls {
  margin-top: 6vw;
  display: flex;
  justify-content: center;
  gap: 4vw;
}
.trainers__nav {
  width: 11vw; height: 11vw; border-radius: 50%;
  background: #fff;
  border: 1px solid rgba(0, 95, 196, .3);
  cursor: pointer;
  display: grid; place-items: center;
  transition: background .2s ease, border-color .2s ease, opacity .2s ease;
}
.trainers__nav i {
  width: 2.6vw; height: 2.6vw; display: block;
  border-right: .5vw solid var(--color-primary);
  border-bottom: .5vw solid var(--color-primary);
}
.trainers__nav--prev i { transform: rotate(135deg); margin-left: 1vw; }
.trainers__nav--next i { transform: rotate(-45deg); margin-right: 1vw; }
.trainers__nav:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 3px;
}
.trainers__nav[disabled] { opacity: .3; cursor: default; }

/* =============================================================================
   FOOTER
   NOTE: the Figma comp ends at the trainers section — it contains no footer.
   This is a brand-consistent addition so the page closes properly and so the
   legal/contact links the spec requires have a home.
   ============================================================================= */
.footer {
  background: var(--color-primary-dark); color: #cdd8ee;
  padding: 9vw var(--page-pad) 7vw; font-size: 2.9vw; line-height: 1.7;
}
.footer a { color: #fff; text-decoration: none; }
.footer a:hover { text-decoration: underline; }
.footer__grid { display: grid; gap: 7vw; }
.footer__logo {
  display: block;
  width: min(58vw, 300px);
  margin-bottom: 4vw;
}
.footer__logo img {
  width: 100%;
  height: auto;
}
.footer__heading {
  color: #fff; font-weight: 700; font-size: 3.1vw;
  text-transform: uppercase; letter-spacing: .04em; margin-bottom: 2.5vw;
}
.footer__contact-list {
  display: grid;
  gap: 2.2vw;
}
.footer__contact-list li {
  display: flex;
  align-items: center;
  gap: 3vw;
}
.footer__contact-icon {
  width: 5.2vw;
  height: 5.2vw;
  color: currentColor;
  flex: none;
}
.footer__contact-icon svg {
  width: 100%;
  height: 100%;
  fill: currentColor;
}
.footer__heading--social { margin-top: 5vw; }
.footer__featured-list {
  display: grid;
  gap: 1.5vw;
}
.footer__featured-list li {
  display: grid;
  grid-template-columns: .8em minmax(0, 1fr);
  align-items: start;
  gap: .35em;
}
.footer__featured-list li::before {
  content: "-";
  color: var(--color-accent);
  font-weight: 700;
}
.footer__social {
  display: flex;
  align-items: center;
  gap: 2.2vw;
}
.footer__social a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 10vw;
  height: 10vw;
  border: 1px solid rgba(255, 255, 255, .24);
  border-radius: 50%;
  background: rgba(255, 255, 255, .08);
  color: #fff;
  transition: background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease;
}
.footer__social a:hover {
  background: var(--color-accent);
  border-color: var(--color-accent);
  color: var(--color-primary);
  text-decoration: none;
  transform: translateY(-2px);
}
.footer__social svg {
  width: 4.4vw;
  height: 4.4vw;
  fill: currentColor;
}
.footer__bottom {
  margin-top: 8vw; padding-top: 5vw;
  border-top: 1px solid rgba(255, 255, 255, .18);
  display: flex; flex-wrap: wrap; gap: 2vw 5vw; justify-content: space-between;
}
.footer__cta {
  width: 100%;
  margin-top: 5vw;
  text-transform: uppercase;
}

/* =============================================================================
   FORMS  (registration / suggestion)
   ============================================================================= */
.form { display: grid; gap: 4vw; }
.form__row { display: grid; gap: 4vw; }
.field { display: flex; flex-direction: column; gap: 1.4vw; }
.field label { font-size: 2.9vw; font-weight: 600; color: var(--color-text); }
.field .req { color: #c0392b; }
.field input, .field select, .field textarea {
  font: inherit; font-size: 3.1vw;
  padding: 3vw 3.4vw; border: 2px solid #d8dfe8; border-radius: var(--radius-sm);
  background: #fff; color: var(--color-text); width: 100%;
}
.field input:focus, .field select:focus, .field textarea:focus {
  border-color: var(--color-primary); outline: none;
}
.field[data-invalid="true"] input,
.field[data-invalid="true"] select,
.field[data-invalid="true"] textarea { border-color: #c0392b; }
.field__error { font-size: 2.7vw; color: #c0392b; }

.field--consent { flex-direction: row; flex-wrap: wrap; align-items: flex-start; gap: 2.5vw; }
.field--consent input { width: 5vw; height: 5vw; flex: none; margin-top: .4vw; }
.field--consent label { flex: 1; font-weight: 400; font-size: 2.8vw; line-height: 1.4; }
.field--consent .field__error { flex-basis: 100%; }

.registration-preference {
  display: grid;
  gap: 2.5vw;
  margin: 0;
  padding: 0;
  border: 0;
}
.registration-preference legend {
  margin-bottom: 1vw;
  font-size: 2.9vw;
  font-weight: 600;
  color: var(--color-text);
}
.registration-preference label {
  display: grid;
  grid-template-columns: 5vw minmax(0, 1fr);
  align-items: start;
  gap: 2.5vw;
  font-size: 3vw;
  line-height: 1.35;
  cursor: pointer;
}
.registration-preference input {
  width: 5vw;
  height: 5vw;
  margin: .3vw 0 0;
  accent-color: var(--color-primary);
}

.form__submit { min-height: 11vw; font-size: 3.4vw; width: 100%; }

.alert { padding: 4vw; border-radius: var(--radius-sm); font-size: 3vw; line-height: 1.5; }
.alert--success { background: #e7f6ec; color: #1e6b38; border: 2px solid #b6e3c5; }
.alert--error   { background: #fdecea; color: #96271c; border: 2px solid #f5c4be; }

.registration-page {
  padding: 6vw var(--page-pad);
  display: grid;
  gap: 5vw;
}
.registration-sidebar,
.registration-form-shell {
  min-width: 0;
}
.registration-card {
  padding: 5vw;
  border-radius: var(--radius-md);
  background: var(--color-primary);
  color: #fff;
  box-shadow: var(--shadow-card);
}
.registration-card__eyebrow,
.registration-card__category {
  color: rgba(255, 255, 255, .74);
  font-size: 2.45vw;
  font-weight: 800;
  line-height: 1.2;
  text-transform: uppercase;
}
.registration-card__category {
  margin-top: 3vw;
}
.registration-card h2 {
  margin-top: 1.5vw;
  color: #fff;
  font-size: 5vw;
  font-weight: 800;
  line-height: 1.08;
}
.registration-card p {
  margin-top: 2vw;
  color: rgba(255, 255, 255, .84);
  font-size: 3vw;
  line-height: 1.5;
}
.registration-card__details {
  margin: 4vw 0 0;
  display: grid;
  gap: 2.4vw;
}
.registration-card__details div {
  padding-top: 2.4vw;
  border-top: 1px solid rgba(255, 255, 255, .24);
}
.registration-card__details dt {
  color: rgba(255, 255, 255, .66);
  font-size: 2.3vw;
  font-weight: 800;
  text-transform: uppercase;
}
.registration-card__details dd {
  margin: .8vw 0 0;
  color: #fff;
  font-size: 3vw;
  font-weight: 700;
  line-height: 1.35;
}
.registration-trust {
  margin-top: 3vw;
  display: grid;
  gap: 2vw;
  color: var(--color-muted);
  font-size: 2.8vw;
  line-height: 1.45;
}
.registration-form-shell {
  display: grid;
  gap: 4vw;
}
.registration-upsell {
  margin: 0;
  padding: 4vw;
  border: 1px solid rgba(0, 95, 196, .14);
  border-radius: var(--radius-md);
  background: var(--color-surface-blue);
}
.registration-upsell legend {
  padding-inline: 1.5vw;
  color: var(--color-primary);
  font-size: 3.2vw;
  font-weight: 800;
}
.registration-upsell p {
  margin: 0 0 3vw;
  color: var(--color-muted);
  font-size: 2.8vw;
  line-height: 1.45;
}
.registration-upsell__grid {
  display: grid;
  gap: 12px;
}
.registration-upsell__option {
  display: grid;
  grid-template-columns: 20px minmax(0, 1fr);
  gap: 10px;
  align-items: flex-start;
  padding: 14px;
  border: 1px solid rgba(0, 95, 196, .12);
  border-radius: var(--radius-sm);
  background: #fff;
}
.registration-upsell__option input {
  width: 18px;
  height: 18px;
  margin: 2px 0 0;
}
.registration-upsell__option span {
  display: grid;
  gap: 5px;
}
.registration-upsell__option strong {
  color: var(--color-primary);
  font-size: 13px;
  line-height: 1.25;
}
.registration-upsell__option small {
  color: var(--color-muted);
  font-size: 12px;
  font-weight: 600;
}

/* =============================================================================
   INNER PAGES
   ============================================================================= */
.page-hero {
  background: var(--color-primary-dark); color: #fff;
  padding: 12vw var(--page-pad);
}
.page-hero__inner {
  width: min(100%, var(--container-lg));
  margin-inline: auto;
}
.page-hero h1 { font-size: 6.5vw; font-weight: 800; line-height: 1.1; }
.page-hero p { margin-top: 3vw; font-size: 3.2vw; line-height: 1.5; opacity: .9; }
.page-hero--du-form {
  text-align: center;
}
.page-hero--du-form h1 {
  max-width: 1100px;
  margin-inline: auto;
  font-size: 26px;
  line-height: 1.2;
}
.page-hero--trainers {
  position: relative;
  overflow: hidden;
  background:
    linear-gradient(135deg, rgba(3, 66, 148, .98), rgba(0, 95, 196, .9)),
    var(--color-primary-dark);
}
.page-hero--trainers::after {
  content: "";
  position: absolute;
  inset: auto -16vw -28vw auto;
  width: 58vw;
  aspect-ratio: 1;
  border-radius: 50%;
  background: rgba(245, 224, 42, .16);
  pointer-events: none;
}
.page-hero--trainers .page-hero__inner {
  position: relative;
  z-index: 1;
}
.page-hero--trainers h1::after {
  content: "";
  display: block;
  width: 22vw;
  height: 1vw;
  margin-top: 3vw;
  border-radius: 999px;
  background: var(--color-accent);
}
.page-hero--registration {
  background:
    linear-gradient(135deg, rgba(3, 66, 148, .96), rgba(0, 95, 196, .92)),
    var(--color-hero-overlay);
  color: #fff;
  text-align: center;
  padding-block: 42px 32px;
}
.page-hero--registration h1 {
  color: #fff;
  font-size: 34px;
  font-weight: 800;
}

.trainers-page {
  background: linear-gradient(180deg, #f4f9ff 0%, #fff 34%);
  padding: 9vw 0 12vw;
}
.trainers-page__grid {
  width: min(100% - 38px, 1180px);
  margin-inline: auto;
  display: grid;
  gap: 5vw;
}
.trainer-profile-card {
  position: relative;
  overflow: hidden;
  display: grid;
  border: 1px solid rgba(0, 95, 196, .12);
  border-radius: 8px;
  background: #fff;
  box-shadow: 0 18px 46px rgba(0, 54, 135, .08);
}
.trainer-profile-card::before {
  content: "";
  position: absolute;
  inset: 0 auto 0 0;
  width: 1.2vw;
  background: var(--color-accent);
}
.trainer-profile-card__media {
  margin: 0;
  background: #eaf3ff;
}
.trainer-profile-card__media img {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  object-position: center top;
}
.trainer-profile-card[data-trainer="benjamin-rolland"] .trainer-profile-card__media img {
  object-position: 20% top;
}
.trainer-profile-card__body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 5vw;
}
.trainer-profile-card h2 {
  color: var(--color-primary);
  font-size: 5vw;
  font-weight: 900;
  line-height: 1.08;
}
.trainer-profile-card__role {
  margin-top: 2vw;
  color: var(--color-text);
  font-size: 3.45vw;
  font-weight: 700;
  line-height: 1.34;
}
.trainer-profile-card__bio-list {
  width: 100%;
  margin-top: 4vw;
  margin-bottom: 0;
  padding-top: 4vw;
  padding-left: 0;
  border-top: 1px solid rgba(0, 95, 196, .16);
  color: var(--color-muted);
  font-size: 3.35vw;
  line-height: 1.46;
  list-style: none;
}
.trainer-profile-card__bio-list li {
  position: relative;
  padding-left: 20px;
}
.trainer-profile-card__bio-list li::before {
  content: "";
  position: absolute;
  top: .72em;
  left: 0;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--color-primary);
  transform: translateY(-50%);
}
.trainer-profile-card__bio-list li + li {
  margin-top: 2.2vw;
}
.trainer-profile-card__cta {
  width: 100%;
  min-height: 56px;
  margin-top: 5vw;
  padding: 16px 22px;
  border-radius: 6px;
  font-size: 16px;
  font-weight: 800;
}
.registration-page--simple {
  max-width: none;
  padding-top: 20px;
}
.registration-simple-form {
  width: 100%;
  max-width: 100%;
  gap: 18px;
  padding: 16px;
  border: 1px solid rgba(0, 95, 196, .08);
  border-radius: var(--radius-md);
  background: #fff;
  box-shadow: 0 14px 34px rgba(0, 47, 128, .08);
}
.registration-simple-form .form__row {
  gap: 14px;
}
.registration-simple-form__field {
  gap: 6px;
}
.registration-simple-form__field label:not(.sr-only) {
  color: #878787;
  font-size: 14px;
  font-weight: 400;
}
.registration-simple-form__field input,
.registration-simple-form__field select {
  min-height: 46px;
  border: 2px solid #e2e2e2;
  border-radius: 0;
  color: #262626;
  font-size: 14px;
  font-weight: 400;
  padding-inline: 12px;
}
.registration-simple-form__field input::placeholder {
  color: #8b8b8b;
  opacity: 1;
}
.registration-selected {
  display: grid;
  gap: 8px;
  padding: 12px;
  border-left: 5px solid var(--color-primary);
  background: var(--color-surface-blue);
}
.registration-selected p {
  margin: 0;
  color: var(--color-primary);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}
.registration-selected h2 {
  margin-top: 4px;
  color: var(--color-text);
  font-size: 16px;
  font-weight: 800;
  line-height: 1.15;
}
.registration-selected ul {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.registration-selected li,
.registration-selected__note {
  padding: 6px 8px;
  border-radius: 999px;
  background: #fff;
  color: var(--color-muted);
  font-size: 10px;
  font-weight: 700;
  line-height: 1.2;
}
.registration-discount {
  display: grid;
  gap: 12px;
}
.registration-discount p {
  color: var(--color-text);
  font-size: 17px;
  font-weight: 800;
  line-height: 1.25;
}
.registration-discount__check {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 8px;
  align-items: start;
  color: var(--color-text);
  font-size: 14px;
  line-height: 1.35;
}
.registration-discount__check input {
  width: 17px;
  height: 17px;
  margin: 2px 0 0;
}
.registration-simple-form__notice {
  color: var(--color-muted);
  font-size: 11px;
  line-height: 1.45;
}
.formation-deposit-message {
  margin: 0;
  font-weight: 800;
  line-height: 1.3;
}
.formation-deposit-message--registration {
  padding: 11px 12px;
  border-left: 4px solid var(--color-primary);
  background: var(--color-surface-blue);
  color: var(--color-primary);
  font-size: 13px;
}
.registration-upsell--simple {
  padding: 14px;
  border-color: rgba(0, 95, 196, .16);
  background: linear-gradient(180deg, #f7fbff, #fff);
}
.registration-upsell--simple legend {
  font-size: 15px;
}
.registration-upsell--simple p {
  font-size: 11px;
}
.registration-upsell--simple .registration-upsell__option {
  position: relative;
  border-radius: 10px;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.registration-upsell--simple .registration-upsell__option:has(input:checked) {
  border-color: rgba(0, 95, 196, .55);
  box-shadow: 0 10px 26px rgba(0, 95, 196, .12);
}
.registration-upsell--simple .registration-upsell__option small {
  order: -1;
  color: var(--color-primary);
  font-size: 10px;
  font-style: normal;
  font-weight: 800;
  text-transform: uppercase;
}
.registration-upsell--simple .registration-upsell__option em {
  color: var(--color-muted);
  font-size: 12px;
  font-style: normal;
  font-weight: 700;
}

.community-hero {
  position: relative;
  padding: 64px var(--page-pad);
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, var(--color-primary-dark), var(--color-primary));
  color: #fff;
  text-align: center;
}
.community-hero__inner {
  position: relative;
  z-index: 1;
  max-width: 720px;
  margin-inline: auto;
}
.community-hero__status {
  width: 56px;
  height: 56px;
  margin: 0 auto 20px;
  border: 0;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: var(--color-accent);
  color: var(--color-primary-dark);
  font-size: 32px;
  font-weight: 800;
  line-height: 1;
}
.community-hero h1 {
  margin: 0;
  color: #fff;
  font-size: 34px;
  font-weight: 800;
  line-height: 1.12;
  letter-spacing: 0;
}
.community-hero__rule {
  width: 60px;
  height: 3px;
  margin: 22px auto;
  display: block;
  border-radius: 999px;
  background: var(--color-accent);
}
.community-hero__inner p {
  max-width: 570px;
  margin: 0 auto;
  color: rgba(255, 255, 255, .92);
  font-size: 15px;
  line-height: 1.5;
}
.community-upsell {
  position: relative;
  padding: 42px var(--page-pad) 72px;
  background: #fff;
}
.community-benefit {
  position: relative;
  z-index: 2;
  max-width: 900px;
  min-height: 0;
  margin: 0 auto;
  padding: 22px;
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr);
  align-items: center;
  gap: 16px;
  border: 1px solid rgba(0, 95, 196, .16);
  border-left: 6px solid var(--color-accent);
  border-radius: 8px;
  background: var(--color-surface-blue);
  box-shadow: 0 12px 28px rgba(0, 45, 110, .08);
}
.community-benefit__icon {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: var(--color-accent);
  color: var(--color-primary);
  font-size: 23px;
  font-weight: 900;
  transform: none;
}
.community-benefit p {
  padding-left: 16px;
  border-left: 1px solid rgba(0, 95, 196, .16);
  color: var(--color-text);
  font-size: 14px;
  line-height: 1.45;
}
.community-benefit strong {
  color: var(--color-primary);
  font-weight: 800;
}
.community-upsell__intro {
  max-width: 1320px;
  margin: 44px auto 0;
  text-align: center;
}
.community-upsell__intro h2 {
  margin: 0;
  color: var(--color-primary);
  font-size: 25px;
  font-weight: 800;
  line-height: 1.15;
}
.community-upsell__intro h2::after {
  content: "";
  width: 74px;
  height: 3px;
  margin: 14px auto 0;
  display: block;
  border-radius: 999px;
  background: var(--color-primary);
}
.community-upsell__grid {
  max-width: 1320px;
  margin: 30px auto 0;
  display: grid;
  gap: 20px;
}
.community-upsell__empty {
  max-width: 680px;
  margin: 28px auto 0;
  padding: 24px;
  border-radius: var(--radius-md);
  background: var(--color-surface-blue);
  text-align: center;
}
.community-upsell__empty h2 {
  color: var(--color-primary);
  font-size: 22px;
}
.community-upsell__empty p {
  margin-top: 10px;
  color: var(--color-muted);
  font-size: 15px;
  line-height: 1.55;
}
.community-upsell__empty .btn {
  margin-top: 18px;
}

.breadcrumb { display: none !important; }

.prose { padding: 6vw var(--page-pad); font-size: 3.1vw; line-height: 1.6; }
.prose h2 { font-size: 4.4vw; font-weight: 800; color: var(--color-primary); margin: 6vw 0 3vw; }
.prose h3 { font-size: 3.6vw; font-weight: 700; margin: 5vw 0 2vw; }
.prose p, .prose li { margin-bottom: 2.5vw; }
.prose ul { list-style: disc; padding-left: 5vw; }

/* =============================================================================
   ABOUT PAGE
   ============================================================================= */
.page-hero--about {
  padding: 16vw var(--page-pad) 14vw;
  background:
    linear-gradient(135deg, rgba(0, 95, 196, .95), rgba(4, 43, 121, .98)),
    var(--color-primary);
  color: #fff;
  text-align: center;
}
.about-hero__inner {
  width: min(100%, 980px);
  margin-inline: auto;
}
.about-eyebrow {
  color: rgba(255, 255, 255, .9);
  font-size: 3.4vw;
  font-weight: 800;
  line-height: 1.2;
}
.page-hero--about h1 {
  margin-top: 3vw;
  color: #fff;
  font-size: 9vw;
  font-weight: 900;
  line-height: .98;
  letter-spacing: 0;
}
.about-page {
  width: min(100% - 38px, 920px);
  margin: 9vw auto 12vw;
}
.about-content {
  color: var(--color-muted);
  font-size: 3.55vw;
  line-height: 1.62;
}
.about-content section + section {
  margin-top: 8vw;
}
.about-content h2 {
  margin: 0 0 3.4vw;
  color: var(--color-text);
  font-size: 5.8vw;
  font-weight: 900;
  line-height: 1.08;
  letter-spacing: 0;
}
.about-content p + p {
  margin-top: 4vw;
}
.about-content__quote {
  padding-left: 4vw;
  border-left: 3px solid var(--color-primary);
  color: var(--color-text);
}

.formation-grid {
  display: grid; gap: 5vw;
  padding: 6vw var(--page-pad);
}

/* =============================================================================
   FORMATION DETAIL COMPONENT
   One reusable page system for every /formations/{slug}/ page.
   ============================================================================= */
.formation-detail {
  background: #fff;
  color: var(--color-text);
  /* Réserve juste de quoi dégager le bouton « Je m'inscris » fixé en bas :
     14vw de hauteur + 3vw de décalage. Avec les 10vw de padding bas de
     .formation-detail__body, le contenu garde 20vw de dégagement.
     C'était 24vw ici, soit 34vw au total — près du double du nécessaire, et
     un grand vide blanc entre la galerie et le pied de page sur mobile. */
  padding-bottom: calc(10vw + env(safe-area-inset-bottom));
}
.formation-hero {
  position: relative;
  min-height: 176vw;
  display: flex;
  align-items: flex-end;
  overflow: hidden;
  background: var(--color-primary-dark);
  color: #fff;
}
.formation-hero__image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.formation-hero::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 56%;
  background: linear-gradient(180deg, rgba(0, 95, 196, 0), rgba(0, 55, 155, .98));
}
.formation-hero__content {
  position: relative;
  z-index: 1;
  width: 100%;
  padding: 0 var(--page-pad) 11vw;
}
.formation-hero__kicker {
  color: rgba(255, 255, 255, .78);
  font-size: 2.6vw;
  font-weight: 700;
  text-transform: uppercase;
}
.formation-hero h1 {
  margin-top: 1vw;
  color: #fff;
  font-size: 7vw;
  font-weight: 800;
  line-height: .92;
  text-transform: uppercase;
}
.formation-hero__meta {
  margin-top: 2vw;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 2vw;
  color: rgba(255, 255, 255, .86);
  font-size: 2.5vw;
  font-weight: 700;
  text-transform: uppercase;
}
.formation-hero__actions {
  margin-top: 4vw;
  display: grid;
  gap: 2.6vw;
  width: min(100%, 58vw);
}

@media (max-width: 767px) {
  .formation-detail--fiscalite-centered-hero .formation-hero {
    min-height: clamp(430px, 112vw, 620px);
    align-items: center;
  }

  .formation-detail--fiscalite-centered-hero .formation-hero__content {
    padding-bottom: 0;
  }
}

.formation-detail__cta {
  min-height: 9vw;
  padding-inline: 5vw;
  border-radius: 1.2vw;
  font-size: 2.6vw;
  text-transform: uppercase;
}
.formation-detail__cta--program {
  border-color: rgba(255, 255, 255, .92);
  background: rgba(0, 70, 170, .16);
  color: #fff;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .18);
}
.formation-mobile-sticky-bar {
  position: fixed;
  z-index: 90;
  right: 0;
  bottom: 0;
  left: 0;
  padding: 1.2vw var(--page-pad) .6vw;
  background: #fff;
  box-shadow: none;
}
.formation-mobile-sticky-cta {
  position: static;
  width: 100%;
  min-height: 9.6vw;
  border: 0;
  border-radius: 1.1vw;
  background: #064bb4;
  color: #fff;
  box-shadow: none;
  font-size: 2.9vw;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: uppercase;
}
.formation-mobile-sticky-cta::after {
  content: "\2192";
  margin-left: 1.6vw;
  font-size: 1.45em;
  font-weight: 400;
  line-height: 1;
}
.rolland-mobile-clone {
  display: none;
}
.pocus-mobile-clone {
  display: none;
}
.formation-detail__body {
  padding: 6vw var(--page-pad) 10vw;
}
.formation-detail__desktop-shell,
.formation-detail__desktop-main {
  display: block;
}
.formation-detail__desktop-sidebar {
  display: none;
}
.formation-trainer {
  display: grid;
  gap: 5vw;
}
.formation-trainer__photo {
  margin: 0;
  border-radius: 5vw;
  overflow: hidden;
  box-shadow: 0 14px 36px rgba(0, 65, 150, .12);
}
.formation-trainer__photo img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}
.formation-trainer h2,
.formation-program h2,
.formation-access h2,
.formation-final h2,
.formation-success h2 {
  color: var(--color-primary);
  font-size: 4.6vw;
  font-weight: 800;
  line-height: 1;
  text-transform: uppercase;
}
.formation-trainer p {
  margin-top: 2vw;
  color: var(--color-text-soft);
  font-size: 3vw;
  line-height: 1.45;
}
.formation-trainer__profiles {
  margin-top: 4vw;
}
.formation-trainer__profile + .formation-trainer__profile {
  margin-top: 5vw;
}
.formation-trainer__profile h3 {
  color: var(--color-primary);
  font-size: 3.4vw;
  font-weight: 800;
  line-height: 1.25;
}
.formation-trainer ul,
.formation-access ul,
.formation-program ul {
  margin-top: 3vw;
  padding-left: 4vw;
  list-style: disc;
  color: var(--color-text-soft);
  font-size: 2.85vw;
  line-height: 1.45;
}
.formation-trainer li,
.formation-access li,
.formation-program li {
  margin-bottom: 1.6vw;
}
.countdown {
  margin: 6vw auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2vw;
  text-align: center;
}
.countdown li {
  padding: 3vw 1vw;
  border-radius: 2vw;
  background: var(--color-surface-blue);
}
.countdown strong {
  display: block;
  color: var(--color-text);
  font-size: 5vw;
  line-height: 1;
}
.countdown span {
  display: block;
  margin-top: 1vw;
  color: var(--color-muted-2);
  font-size: 2.2vw;
  text-transform: uppercase;
}
.formation-program {
  margin-top: 6vw;
  padding: 5vw;
  border-radius: 5vw;
  background: var(--color-surface-blue);
}
.formation-program__summary {
  margin-top: 2vw;
  padding-bottom: 3vw;
  border-bottom: 1px solid rgba(0, 95, 196, .24);
  color: var(--color-muted);
  font-size: 2.7vw;
  font-weight: 700;
}
.formation-program__list,
.formation-program__simple {
  margin-top: 4vw;
}
.formation-program__slot {
  padding-block: 3vw;
  border-bottom: 1px solid rgba(0, 95, 196, .12);
}
.formation-program__slot:last-child {
  border-bottom: 0;
}
.formation-program__slot h3 {
  color: var(--color-text);
  font-size: 2.8vw;
  font-weight: 800;
  line-height: 1.2;
}
.formation-program__slot p {
  margin-top: 1vw;
  color: var(--color-text-soft);
  font-size: 2.8vw;
  font-weight: 600;
  line-height: 1.45;
}
.formation-access,
.formation-final,
.formation-success {
  margin-top: 7vw;
}
.formation-access img {
  width: 100%;
  border-radius: 5vw;
}
.formation-access h2 {
  margin-top: 4vw;
}
.formation-final {
  position: relative;
  overflow: hidden;
  padding: 7vw var(--page-pad);
  margin-inline: calc(var(--page-pad) * -1);
  background-image:
    linear-gradient(90deg, rgba(0, 73, 180, .98), rgba(0, 98, 205, .86)),
    var(--formation-final-image, none);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  color: #fff;
}
.formation-final__inner {
  position: relative;
  z-index: 1;
}
.formation-final__facts {
  display: grid;
  gap: 2vw;
  color: #fff;
  font-size: 4vw;
  font-weight: 800;
  line-height: 1.16;
}
.formation-final__facts li {
  display: grid;
  grid-template-columns: 7vw minmax(0, 1fr);
  align-items: center;
  gap: 1.8vw;
}
.formation-final__icon {
  display: block;
  width: 4.8vw;
  height: 4.8vw;
  object-fit: contain;
  color: #fff;
  font-size: 4.4vw;
  filter: brightness(0) invert(1);
  line-height: 1;
  text-align: center;
}
.formation-final__offer {
  margin-top: 4vw;
  display: grid;
  gap: 3vw;
}
.formation-final__price {
  padding: 3vw;
  border: .45vw solid rgba(255, 255, 255, .96);
  border-radius: 2.4vw;
  color: #fff;
  font-size: 4.6vw;
  font-weight: 900;
  line-height: 1.02;
  text-transform: uppercase;
}
.formation-final__price span {
  display: block;
}
.formation-final__price del {
  margin-right: 1vw;
  text-decoration-thickness: .55vw;
}
.formation-final__price strong {
  color: #fff;
}
.formation-final__offer > p {
  color: var(--color-accent);
  font-size: 3.5vw;
  font-style: italic;
  font-weight: 900;
  line-height: 1.08;
}
.formation-offer-packages {
  display: grid;
  gap: 3vw;
}
.formation-offer-package {
  padding: 3vw;
  border: .45vw solid rgba(0, 95, 196, .26);
  border-radius: 2.4vw;
  background: rgba(255, 255, 255, .98);
  color: var(--color-text);
}
.formation-offer-package h3 {
  color: #005FC4;
  font-size: 5vw;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
}
.formation-offer-package__description {
  margin-top: 1.5vw;
  color: var(--color-muted);
  font-size: 3.3vw;
  font-weight: 700;
  line-height: 1.28;
}
.formation-offer-package__price {
  margin-top: 2.4vw;
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 1.4vw 2vw;
  color: var(--color-text);
  line-height: 1;
  text-transform: uppercase;
}
.formation-offer-package__price del {
  color: var(--color-muted);
  font-size: 3.5vw;
  font-weight: 900;
  text-decoration-thickness: .45vw;
}
.formation-offer-package__price span {
  color: var(--color-text);
  font-size: 3.1vw;
  font-weight: 900;
}
.formation-offer-package__price strong {
  flex-basis: 100%;
  color: #005FC4;
  font-size: 7vw;
  font-weight: 900;
}
.formation-offer-package ul {
  margin-top: 2.3vw;
  padding-left: 4.5vw;
  color: var(--color-muted);
  font-size: 3.2vw;
  font-weight: 700;
  line-height: 1.28;
  list-style: disc;
}
.formation-offer-package li + li {
  margin-top: 1.2vw;
}
.formation-offer-package__emphasis,
.formation-offer-package__note {
  margin-top: 2.2vw;
  color: var(--color-primary);
  font-size: 3.1vw;
  font-style: italic;
  font-weight: 800;
  line-height: 1.2;
}
.formation-offer-package__note {
  margin-top: 1.2vw;
  color: var(--color-muted);
  font-size: 2.8vw;
  font-weight: 500;
}
.formation-final__caption {
  margin-top: 3vw;
  color: rgba(255, 255, 255, .92);
  font-size: 2.6vw;
  font-style: italic;
}
.formation-deposit-message--final {
  margin-top: 4vw;
  color: #fff;
  font-size: 3.2vw;
}
.formation-final__cta {
  margin-top: 4vw;
}

/* On mobile, lead with the participation offer before the logistical facts.
   Desktop keeps the existing facts-first composition. */
@media (max-width: 767px) {
  .formation-final__inner {
    display: flex;
    flex-direction: column;
  }
  .formation-final__offer {
    order: 1;
    margin-top: 0;
  }
  .formation-final__offer > p {
    color: rgba(255, 255, 255, .92);
  }
  .formation-final__facts {
    order: 2;
    margin-top: 5vw;
  }
  .formation-final__caption {
    order: 3;
  }
  .formation-deposit-message--final {
    order: 4;
    color: var(--color-accent);
    font-weight: 900;
  }
  .formation-final__cta {
    order: 5;
  }
}
.formation-success {
  text-align: center;
}
.formation-success__grid {
  margin-top: 4vw;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2vw;
}
/* Les galeries sont partagées par formateur, mais leurs photos sources ne sont
   pas toutes au même format : 16:9, carrées, 5:4 ou portrait. On garde une
   grille pleine, sans bandes vides, avec un cadre 4:3 moins agressif que le
   16:9 pour les séries Mahi/Avignon. */
.formation-success__grid img {
  width: 100%;
  /* 4:3 sur mobile, pas 16:9. Deux colonnes sur un écran de 390 px donnent des
     vignettes de 159 px : en 16:9 elles ne feraient que 90 px de haut. */
  aspect-ratio: 4 / 3;
  object-fit: cover;
  object-position: center center;
  border-radius: 1.6vw;
}

/* =============================================================================
   ============================  TABLET  >= 768px  ============================
   Stop scaling with the viewport; switch to px inside a centred container.
   ============================================================================= */
@media (min-width: 768px) {
  :root {
    --page-pad: 40px;
    --radius-sm: 6px; --radius-md: 14px; --radius-lg: 18px;
  }

  .container { max-width: var(--container-lg); padding-inline: var(--page-pad); }
  .section-title { font-size: 40px; }

  /* Header: swap the Menu button for real inline navigation. */
  .header { height: 88px; padding-inline: 40px; }
  .header__logo img,
  .header--hero .header__logo img { width: 250px; }
  .nav-toggle { display: none; }
  .nav { display: flex; align-items: center; gap: 28px; }
  .nav a {
    text-decoration: none; font-size: 15px; font-weight: 600; color: var(--color-text);
    padding: 6px 0; border-bottom: 2px solid transparent;
  }
  .nav a:hover { color: var(--color-primary); }
  .nav a[aria-current="page"] { color: var(--color-primary); border-bottom-color: var(--color-primary); }
  .nav .btn { font-size: 14px; padding: 11px 20px; }
  .nav .btn--primary {
    color: #fff;
  }
  .nav .btn--primary:hover {
    color: #fff;
  }

  .header--hero .nav a {
    color: rgba(255, 255, 255, .92);
    text-shadow: 0 1px 14px rgba(0, 33, 92, .28);
  }
  .header--hero .nav a:hover,
  .header--hero .nav a[aria-current="page"] {
    color: #fff;
    border-bottom-color: rgba(255, 255, 255, .9);
  }
  .header--hero .nav .btn {
    background: var(--color-accent);
    color: var(--color-primary);
    border-bottom-color: transparent;
    text-shadow: none;
  }
  .header--hero .nav .btn:hover {
    background: var(--color-accent);
    color: var(--color-primary);
    border-bottom-color: transparent;
    box-shadow: 0 8px 22px rgba(245, 224, 42, .26);
  }

  .hero {
    min-height: 720px; justify-content: center;
    padding: 118px 40px 74px;
    background: var(--color-primary-deep) url("/assets/images/brand/hero-home-desktop.webp") center / cover no-repeat;
    overflow: hidden;
  }
  .hero::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background: var(--color-hero-overlay);
    opacity: .22;
    pointer-events: none;
  }
  .hero__inner {
    position: relative;
    z-index: 1;
    max-width: 620px;
    margin-inline: 0 auto;
    width: 100%;
    min-height: 528px;
    display: flex; flex-direction: column; justify-content: center;
  }
  .hero__title {
    font-size: 58px; max-width: 620px; margin-bottom: 30px;
    line-height: .96; font-weight: 700;
    text-shadow: 0 10px 34px rgba(0, 41, 116, .24);
    animation: heroFadeUp .72s ease-out both;
  }
  .hero__actions {
    display: flex; flex-wrap: wrap; gap: 12px; width: auto; max-width: 620px;
    animation: heroFadeUp .72s ease-out .08s both;
  }
  .hero__btn {
    min-height: 0; height: 50px; padding: 0 24px;
    font-size: 13px; border-radius: 999px; line-height: 1;
  }
  .hero__btn--primary { background: var(--color-accent); color: var(--color-primary); border-color: var(--color-accent); }
  .hero__btn--outline { background: rgba(255,255,255,.08); color: #fff; border-color: rgba(255,255,255,.72); }
  .hero__btn--solid {
    grid-column: auto;
    min-width: 0;
    background: rgba(4,43,121,.42);
    color: #fff;
    border-color: rgba(255,255,255,.44);
  }

  .hero__desktop-extra {
    display: block;
    margin-top: 24px;
    animation: heroFadeUp .72s ease-out .16s both;
  }

  .hero__partners {
    margin-top: 0;
  }
  .hero__partners-title {
    margin: 0 0 10px;
    color: #fff;
    font-size: 11px;
    font-weight: 800;
    line-height: 1;
    text-transform: uppercase;
    text-decoration: underline;
    text-underline-offset: 3px;
  }
  .hero__partners-row {
    display: flex;
    align-items: center;
    gap: 16px;
  }
  .hero__partners-row img {
    width: auto;
    height: 40px;
    max-width: 118px;
    object-fit: contain;
    filter: brightness(0) invert(1);
  }
  .hero__partners-row .hero__partner--vinatier-wordmark img,
  .hero__partners-row .hero__partner--vinatier-hospital img {
    filter: none;
  }
  .hero__partners-sep {
    width: 1px;
    height: 38px;
    background: rgba(255,255,255,.72);
  }

  .hero__formation-nav {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: auto;
    padding-top: 48px;
    width: min(100vw - 80px, 1160px);
    animation: heroFadeUp .72s ease-out .24s both;
  }
  .hero__formation-nav span {
    color: #fff;
    font-size: 18px;
    font-weight: 700;
    margin-right: 2px;
  }
  .hero__formation-nav a {
    min-height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0 18px;
    border-radius: 999px;
    background: rgba(55, 47, 82, .92);
    color: #fff;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
  }

  .home-page .intro {
    display: none;
  }

  .intro { padding: 56px 40px 0; max-width: var(--container-lg); margin-inline: auto; }
  .intro__lead { font-size: 22px; max-width: 720px; }
  .intro__question { margin-top: 40px; font-size: 24px; }
  .intro__contact { margin-top: 12px; gap: 4px; }
  .intro__contact a { font-size: 18px; }

  .partners__label { margin-top: 48px; font-size: 15px; }
  .partners__row { margin-top: 24px; justify-content: flex-start; gap: 32px; }
  .partners__row li:nth-child(1) img { height: 60px; }
  .partners__row li:nth-child(2) img { height: 56px; }
  .partners__row li:nth-child(3) img { height: 96px; }
  .partners__row li:nth-child(4) img { height: 72px; }
  .partners__sep { width: 2px; height: 64px; }

  .categories { padding: 84px 40px 0; max-width: var(--container-lg); margin-inline: auto; }
  .categories__lead { font-size: 24px; max-width: 760px; }
  .categories__grid { margin-top: 44px; column-gap: 22px; row-gap: 22px; }
  .category-card {
    align-items: center;
    justify-content: center;
    padding: 30px 20px 48px;
    aspect-ratio: auto;
    min-height: 252px;
    border: 1px solid rgba(0, 95, 196, .26);
    border-radius: 18px;
    box-shadow: 0 14px 38px rgba(0, 95, 196, .10);
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
  }
  .category-card:hover {
    transform: translateY(-6px);
    border-color: rgba(0, 95, 196, .44);
    box-shadow: 0 22px 54px rgba(0, 95, 196, .16);
  }
  .category-card::after {
    right: 18px;
    bottom: 16px;
    font-size: 26px;
  }
  .category-card__icon {
    width: 84px;
    height: 92px;
    margin-inline: auto;
    transition: transform .22s ease;
  }
  .category-card:hover .category-card__icon {
    transform: scale(1.06);
  }
  .category-card__label { margin-top: 24px; font-size: 15px; line-height: 1.18; }
  .category-card__text { margin-top: 6px; font-size: 13px; }

  .formations { padding-top: 64px; }
  .formations__title { margin-bottom: 32px; }
  .formation-filters {
    width: calc(100% - 80px);
    max-width: var(--container-lg);
    margin-inline: auto;
    gap: 20px;
  }
  .formation-filter-tabs {
    width: 100%;
    display: flex;
    align-items: end;
    gap: 30px;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
    border-bottom: 1px solid rgba(0, 95, 196, .18);
  }
  .formation-filter-tabs::-webkit-scrollbar {
    display: none;
  }
  .formation-filter-tab {
    flex: none;
    min-height: 48px;
    padding: 0 0 14px;
    border: 0;
    border-radius: 0;
    background: transparent;
    font-size: 15px;
    text-align: left;
    white-space: nowrap;
  }
  .formation-filter-tab[aria-selected="true"] {
    border-color: transparent;
    background: transparent;
  }
  .formation-filters__meta {
    display: flex;
    align-items: end;
    justify-content: space-between;
    gap: 16px;
  }
  .formation-filters__selects {
    flex: 1 1 auto;
    display: grid;
    grid-template-columns: minmax(240px, 1.35fr) minmax(190px, .8fr);
    gap: 12px;
  }
  .formation-select {
    width: min(100%, 320px);
    gap: 5px;
    font-size: 12px;
    letter-spacing: 0;
    text-transform: uppercase;
  }
  .formation-select select {
    min-height: 44px;
    border-radius: 10px;
    background:
      linear-gradient(45deg, transparent 50%, var(--color-primary) 50%) right 18px center / 7px 7px no-repeat,
      linear-gradient(135deg, var(--color-primary) 50%, transparent 50%) right 13px center / 7px 7px no-repeat,
      #fff;
    padding: 0 38px 0 14px;
    font-size: 14px;
    text-transform: none;
  }
  .formation-results {
    flex: 0 0 auto;
    align-self: end;
    margin: 0;
    min-height: 44px;
    padding: 0 14px;
    gap: 9px;
    font-size: 13px;
    color: var(--color-primary);
  }
  .formation-results::before {
    width: 8px;
    height: 8px;
  }
  .formation-browser-grid {
    max-width: var(--container-lg);
    margin-inline: auto;
    padding: 24px 40px 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
  }
  .formation-empty {
    max-width: var(--container-lg);
    margin: 24px auto 0;
    padding: 28px 40px;
    font-size: 16px;
  }
  .home-formation-slider .formations__title {
    margin-bottom: 30px;
  }
  .formation-slider__tabs-wrap {
    width: calc(100% - 80px);
    max-width: var(--container-lg);
    margin-inline: auto;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-width: none;
    border-bottom: 1px solid rgba(0, 95, 196, .18);
  }
  .formation-slider__tabs {
    width: max-content;
    min-width: 100%;
    display: flex;
    align-items: end;
    gap: 30px;
  }
  .formation-slider__tab {
    flex: none;
    min-height: 48px;
    padding: 0 0 14px;
    border: 0;
    border-radius: 0;
    background: transparent;
    font-size: 15px;
    text-align: left;
    white-space: nowrap;
  }
  .formation-slider__tab[aria-selected="true"] {
    border-color: transparent;
    background: transparent;
  }
  .formation-slider__viewport {
    max-width: var(--container-lg);
    margin: 28px auto 0;
  }
  .formation-slider__track {
    gap: 22px;
    scroll-padding-inline: 40px;
    padding: 4px 40px 28px;
  }
  .formation-slider__track .formation-card {
    flex-basis: 43%;
  }
  .home-formation-slider .formation-card__title,
  .home-formation-slider .formation-card[data-pinned="true"] .formation-card__title {
    font-size: 19px;
  }
  .formation-slider__arrow--prev { left: 18px; }
  .formation-slider__arrow--next { right: 18px; }
  .formation-slider__empty {
    max-width: var(--container-lg);
    margin-inline: auto;
    padding-inline: 40px;
  }
  .accordion { max-width: var(--container-lg); margin-inline: auto; padding-inline: 40px; gap: 10px; }
  .accordion__head { min-height: 74px; padding: 20px 28px; gap: 10px; }
  .accordion__label { font-size: 20px; }
  .accordion__chevron { width: 10px; height: 10px; border-width: 2px; }
  .accordion__panel { padding: 0 28px 28px; }
  .accordion__item[data-open="true"] .accordion__panel {
    grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px;
  }

  .formation-card__body { padding: 20px 24px 24px; }
  .formation-card__body {
    display: grid;
    /* La 3e piste (bloc meta) était figée à 64px, calibrée pour l'ancienne
       disposition « date à gauche / bouton à droite ». Depuis que le bouton
       passe en pleine largeur sous la date, et plus encore quand la carte
       affiche le tarif remisé, le contenu dépasse et le bouton se superposait
       au nom du formateur. minmax() garde l'alignement entre cartes d'une même
       ligne tout en laissant la piste grandir. */
    grid-template-rows: 28px 78px minmax(64px, auto) auto minmax(58px, auto);
    align-content: start;
  }
  .formation-card__category {
    margin-bottom: 0;
    font-size: 11px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  .formation-card__title {
    display: -webkit-box;
    min-height: 70px;
    font-size: 19px;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
  }
  .formation-card[data-pinned="true"] .formation-card__body {
    grid-template-rows: 28px auto minmax(52px, auto) auto minmax(58px, auto);
  }
  .formation-card[data-pinned="true"] .formation-card__title {
    display: block;
    min-height: 0;
    font-size: 21px;
    line-height: 1.14;
    overflow: visible;
    -webkit-line-clamp: initial;
  }
  .formation-card__meta {
    margin-top: 0;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }
  .formation-card__when {
    min-width: 0;
    display: flex;
    flex-flow: row wrap;
    align-items: center;
    gap: 7px 9px;
  }
  .formation-card__date { font-size: 16px; line-height: 1.15; }
  .formation-card__city {
    padding: 5px 9px;
    font-size: 11px;
  }
  .formation-card__city::before {
    width: 6px;
    height: 6px;
  }
  .formation-card__cta {
    min-height: 40px;
    width: 100%;
    padding-inline: 14px;
    font-size: 11px;
  }
  .formation-card__divider { height: 2px; margin: 14px 0 12px; }
  .formation-card__trainer { font-size: 14px; }
  .formation-card__trainer span { margin-top: 5px; }

  .stats {
    max-width: var(--container-lg);
    margin: 72px auto 0;
    padding-inline: 40px;
  }
  .stats__trust {
    max-width: 940px;
    padding: 24px 34px;
    grid-template-columns: minmax(250px, .9fr) minmax(0, 1.1fr);
    gap: 34px;
  }
  .stats__trust strong {
    font-size: 82px;
  }
  .stats__trust span {
    font-size: 28px;
  }

  .suggest { margin-top: 72px; padding: 56px 40px; min-height: 0; }
  .suggest__text { font-size: 21px; max-width: 780px; }
  .suggest__cta { margin-top: 28px; min-width: 0; min-height: 52px; padding-inline: 30px; font-size: 16px; }

  .gallery { padding-top: 64px; }
  .gallery--home-end {
    margin-top: 32px;
    padding: 56px 0 64px;
  }
  .gallery__inner {
    width: min(100% - 120px, 1320px);
  }
  .gallery--home-end .section-title {
    font-size: 48px;
    letter-spacing: 0;
  }
  .gallery__featured { margin-top: 40px; }
  .gallery__featured img { aspect-ratio: 16 / 5.8; }
  .gallery__panel {
    margin: 32px auto 0; max-width: var(--container-lg); padding: 26px;
  }
  .gallery--home-end .gallery__panel {
    max-width: none;
    margin: 0;
    padding: 10px;
  }
  .gallery__grid { grid-template-columns: repeat(4, 1fr); column-gap: 16px; row-gap: 16px; }
  .gallery--home-end .gallery__grid { gap: 10px; }
  .gallery__grid img { border-radius: 8px; }
  .gallery--home-end .gallery__grid img { border-radius: 0; }

  .pitch {
    margin-top: 0;
    padding: 136px 0 58px;
  }
  .pitch__inner {
    width: min(100% - 80px, 1280px);
    margin-inline: auto;
  }
  .pitch__prof {
    max-width: 370px;
    border-radius: 34px;
    box-shadow: 0 18px 42px rgba(0, 54, 135, .14);
  }
  .pitch__prof img {
    transform: scale(1.32);
    transform-origin: 38% 24%;
  }
  .pitch__name {
    margin-top: 28px;
    font-size: clamp(30px, 2.35vw, 34px);
    line-height: 1.1;
    white-space: nowrap;
  }
  .pitch__subtitle {
    width: min(100%, 340px);
    margin-top: 12px;
    font-size: 17px;
    line-height: 1.28;
  }
  .pitch__copy {
    margin-top: 6px;
    padding-top: 28px;
    border-top-color: rgba(0, 95, 196, .28);
  }
  .pitch__cta {
    width: 100%;
    min-height: 38px;
    margin-top: 18px;
    padding-inline: 24px;
    border-radius: 999px;
    font-size: 12px;
    white-space: normal;
  }

  .sponsors { padding-top: 64px; }
  .sponsors__title { font-size: 34px; }
  .sponsors__rule { width: 280px; height: 3px; margin-top: 10px; }
  .sponsors__row {
    width: min(100% - 120px, 1180px);
    margin: 40px auto 0;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 22px;
  }
  .sponsors__item {
    min-height: 92px;
    padding: 16px 22px;
    border-radius: 8px;
  }
  .sponsors__row img { max-height: 62px; }

  .reviews { margin-top: 64px; padding: 64px 40px 72px; }
  .reviews__title { font-size: 30px; max-width: 760px; }
  .reviews__collage {
    position: static; height: auto; margin: 32px auto 0;
    max-width: var(--container-lg); padding-inline: 0;
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px;
  }
  .reviews__item,
  .reviews__item:nth-child(1),
  .reviews__item:nth-child(2),
  .reviews__item:nth-child(3),
  .reviews__item:nth-child(4) {
    position: static;
    width: 100%;
    border-radius: 10px;
    transform: none;
  }
  .reviews__item:nth-child(n+5) { display: block; }
  .reviews__item {
    background: #fff;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .22);
    transition: transform .2s ease, box-shadow .2s ease;
  }
  .reviews__item:hover {
    transform: translateY(-6px);
    box-shadow: 0 18px 44px rgba(0, 0, 0, .28);
  }

  .trainers { padding: 72px 40px 64px; max-width: var(--container-lg); margin-inline: auto; }
  .trainers__title { font-size: 44px; }
  .trainers__viewport { margin-top: 40px; }
  .trainers__track {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
    gap: 26px;
    overflow: visible;
    padding: 0;
  }
  .trainer {
    min-width: 0;
    border-radius: 18px;
    box-shadow: 0 14px 34px rgba(0, 52, 157, .07);
    scroll-snap-align: none;
    transition: transform .38s cubic-bezier(.22, .61, .36, 1),
                box-shadow .38s cubic-bezier(.22, .61, .36, 1),
                border-color .38s ease;
  }
  .trainer:hover {
    transform: translateY(-6px);
    border-color: rgba(0, 95, 196, .3);
    box-shadow: 0 26px 54px rgba(0, 52, 157, .15);
  }
  .trainer:hover .trainer__photo img { transform: scale(1.05); }
  .trainer__photo { border-radius: 0; box-shadow: none; }
  .trainer__body { padding: 22px 24px 26px; }
  /* Deux lignes reservees : « Pr. Antoine Avignon » tient sur une ligne,
     « Pr. Melhouf Moulay Abdelilah » sur deux. Sans cette reserve, les filets
     et les intitules de poste ne s'alignent pas d'une carte a l'autre. */
  .trainer__name { margin-top: 0; font-size: 21px; line-height: 1.2; min-height: 2.4em; }
  .trainer__name::after { width: 30px; margin: 12px 0 13px; }
  .trainer__role { margin-top: 0; font-size: 14.5px; max-width: 100%; }
  .trainers__controls { display: none; }

  .footer { padding: 56px 40px 32px; font-size: 15px; }
  .footer__grid {
    max-width: var(--container-lg); margin-inline: auto;
    grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 40px;
  }
  .footer__logo { width: 260px; margin-bottom: 18px; }
  .footer__heading { font-size: 13px; margin-bottom: 14px; }
  .footer__contact-list { gap: 12px; }
  .footer__contact-list li { gap: 12px; }
  .footer__contact-icon { width: 18px; height: 18px; }
  .footer__heading--social { margin-top: 18px; }
  .footer__featured-list { gap: 7px; }
  .footer__social { gap: 10px; }
  .footer__social a { width: 38px; height: 38px; }
  .footer__social svg { width: 17px; height: 17px; }
  .footer__bottom { max-width: var(--container-lg); margin: 40px auto 0; padding-top: 20px; }
  .footer__cta { margin-top: 28px; }

  .form { gap: 20px; max-width: 720px; }
  .form__row { grid-template-columns: 1fr 1fr; gap: 20px; }
  .field { gap: 6px; }
  .field label { font-size: 15px; }
  .field input, .field select, .field textarea { font-size: 16px; padding: 13px 14px; }
  .field__error { font-size: 13px; }
  .field--consent { gap: 12px; }
  .field--consent input { width: 20px; height: 20px; }
  .field--consent label { font-size: 14px; }
  .registration-preference { gap: 10px; }
  .registration-preference legend {
    margin-bottom: 2px;
    font-size: 15px;
  }
  .registration-preference label {
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 10px;
    font-size: 15px;
  }
  .registration-preference input {
    width: 18px;
    height: 18px;
    margin-top: 1px;
  }
  .form__submit { min-height: 54px; font-size: 16px; width: auto; padding-inline: 40px; }
  .alert { padding: 16px 18px; font-size: 15px; }
  .registration-page {
    max-width: var(--container-lg);
    margin-inline: auto;
    padding: 40px;
    grid-template-columns: minmax(280px, 380px) minmax(0, 1fr);
    align-items: start;
    gap: 36px;
  }
  .registration-sidebar {
    position: sticky;
    top: 112px;
  }
  .registration-card {
    padding: 28px;
    border-radius: 16px;
  }
  .registration-card__eyebrow,
  .registration-card__category {
    font-size: 12px;
  }
  .registration-card__category {
    margin-top: 22px;
  }
  .registration-card h2 {
    margin-top: 8px;
    font-size: 28px;
  }
  .registration-card p {
    margin-top: 12px;
    font-size: 15px;
  }
  .registration-card__details {
    margin-top: 24px;
    gap: 14px;
  }
  .registration-card__details div {
    padding-top: 14px;
  }
  .registration-card__details dt {
    font-size: 11px;
  }
  .registration-card__details dd {
    margin-top: 4px;
    font-size: 15px;
  }
  .registration-trust {
    margin-top: 18px;
    gap: 10px;
    font-size: 14px;
  }
  .registration-form-shell {
    gap: 20px;
  }
  .registration-form-shell .form {
    max-width: none;
  }
  .registration-upsell {
    padding: 22px;
    border-radius: 14px;
  }
  .registration-upsell legend {
    padding-inline: 8px;
    font-size: 18px;
  }
  .registration-upsell p {
    margin-bottom: 16px;
    font-size: 14px;
  }
  .registration-upsell__grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }
  .registration-upsell__option {
    grid-template-columns: 18px minmax(0, 1fr);
    gap: 10px;
    padding: 14px;
    border-radius: 10px;
  }
  .registration-upsell__option input {
    width: 18px;
    height: 18px;
    margin-top: 2px;
  }
  .registration-upsell__option span {
    gap: 5px;
  }
  .registration-upsell__option strong {
    font-size: 13px;
  }
  .registration-upsell__option small {
    font-size: 12px;
  }

  .page-hero { padding: 64px 40px; }
  .page-hero h1 { font-size: 40px; }
  .page-hero p { margin-top: 12px; font-size: 17px; }
  .page-hero--du-form h1 { font-size: 36px; }
  .page-hero--trainers {
    padding: 92px 40px 82px;
  }
  .page-hero--trainers h1 {
    font-size: clamp(48px, 4.6vw, 68px);
  }
  .page-hero--trainers h1::after {
    width: 118px;
    height: 6px;
    margin-top: 22px;
  }
  .page-hero--trainers p {
    max-width: 720px;
    font-size: 18px;
  }
  .page-hero--trainers::after {
    inset: auto -180px -360px auto;
    width: 560px;
  }
  .page-hero--registration {
    padding: 36px 40px 30px;
    background:
      linear-gradient(135deg, rgba(3, 66, 148, .96), rgba(0, 95, 196, .92)),
      var(--color-hero-overlay);
    color: #fff;
    text-align: center;
  }
  .page-hero--registration h1 {
    color: #fff;
    font-size: 40px;
  }
  .trainers-page {
    padding: 72px 40px 104px;
  }
  .trainers-page__grid {
    width: min(100%, 1320px);
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 26px;
    align-items: start;
  }
  .trainer-profile-card {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto 1fr;
    align-items: stretch;
    min-height: 0;
    height: 100%;
  }
  .trainer-profile-card::before {
    width: 5px;
  }
  .trainer-profile-card__media img {
    height: auto;
    aspect-ratio: 1 / 1;
  }
  .trainer-profile-card__body {
    padding: 28px;
  }
  .trainer-profile-card h2 {
    font-size: 24px;
  }
  .trainer-profile-card__role {
    margin-top: 10px;
    font-size: 14px;
  }
  .trainer-profile-card__bio-list {
    margin-top: 18px;
    margin-bottom: 22px;
    padding-top: 18px;
    padding-left: 0;
    font-size: 14px;
    line-height: 1.48;
  }
  .trainer-profile-card__bio-list li + li {
    margin-top: 8px;
  }
  .trainer-profile-card__cta {
    width: 100%;
    margin-top: auto;
  }
  .registration-page--simple {
    max-width: 1440px;
    padding: 24px 40px 64px;
    grid-template-columns: minmax(0, 1fr);
    gap: 18px;
  }
  .registration-page--simple .alert {
    max-width: 1180px;
    width: 100%;
    margin-inline: auto;
  }
  .registration-simple-form {
    max-width: 1000px;
    margin-inline: auto;
    gap: 16px;
    padding: 24px;
    border-radius: 12px;
    box-shadow: 0 18px 48px rgba(0, 47, 128, .09);
  }
  .registration-simple-form .form__row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 20px;
  }
  .registration-simple-form__field {
    gap: 7px;
  }
  .registration-simple-form__field label:not(.sr-only) {
    font-size: 16px;
  }
  .registration-simple-form__field input,
  .registration-simple-form__field select {
    min-height: 52px;
    border-width: 2px;
    font-size: 16px;
    padding-inline: 16px;
  }
  .registration-simple-form [data-specialty-field] {
    max-width: calc((100% - 20px) / 2);
  }
  .registration-selected {
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 18px;
    padding: 15px 18px;
    border-left-width: 5px;
  }
  .registration-selected p {
    font-size: 12px;
  }
  .registration-selected h2 {
    margin-top: 4px;
    font-size: 18px;
  }
  .registration-selected ul {
    justify-content: flex-end;
    gap: 7px;
    max-width: 460px;
  }
  .registration-selected li,
  .registration-selected__note {
    padding: 7px 10px;
    font-size: 11px;
  }
  .registration-discount {
    gap: 10px;
  }
  .registration-discount p {
    font-size: 18px;
  }
  .registration-discount__check {
    grid-template-columns: 20px minmax(0, 1fr);
    gap: 10px;
    font-size: 15px;
  }
  .registration-discount__check input {
    width: 19px;
    height: 19px;
    margin-top: 2px;
  }
  .registration-simple-form__notice {
    max-width: 760px;
    font-size: 14px;
  }
  .formation-deposit-message--registration {
    max-width: 760px;
    padding: 14px 18px;
    border-left-width: 5px;
    font-size: 17px;
  }
  .registration-upsell--simple {
    padding: 24px;
  }
  .registration-upsell--simple legend {
    font-size: 22px;
  }
  .registration-upsell--simple p {
    font-size: 14px;
  }
  .registration-upsell--simple .registration-upsell__option {
    min-height: 116px;
    border-radius: 12px;
    padding: 16px;
  }
  .registration-upsell--simple .registration-upsell__option small {
    font-size: 10px;
  }
  .registration-upsell--simple .registration-upsell__option em {
    font-size: 12px;
  }
  .registration-simple-form .form__submit {
    min-height: 52px;
    min-width: 260px;
    padding-inline: 32px;
    border-radius: 8px;
    font-size: 16px;
  }
  .community-hero {
    padding: 92px 40px 78px;
  }
  .community-hero__eyebrow {
    font-size: 13px;
  }
  .community-hero h1 {
    font-size: 56px;
  }
  .community-hero p {
    margin-top: 22px;
    font-size: 18px;
  }
  .community-hero strong {
    margin-top: 24px;
    padding: 13px 20px;
    font-size: 18px;
  }
  .community-upsell {
    padding: 58px 40px 96px;
  }
  .community-upsell__context {
    font-size: 13px;
  }
  .community-upsell__intro h2 {
    font-size: 34px;
  }
  .community-upsell__grid {
    max-width: 1320px;
    margin: 38px auto 0;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px;
  }
  .community-upsell__empty {
    padding: 34px;
  }
  .prose { padding: 32px 40px; font-size: 16px; max-width: 820px; margin-inline: auto; }
  .prose h2 { font-size: 26px; margin: 32px 0 12px; }
  .prose h3 { font-size: 20px; margin: 24px 0 10px; }
  .prose p, .prose li { margin-bottom: 12px; }
  .prose ul { padding-left: 22px; }

  .page-hero--about {
    padding: 84px 40px 92px;
  }
  .about-eyebrow {
    font-size: 18px;
  }
  .page-hero--about h1 {
    margin-top: 18px;
    font-size: clamp(52px, 5vw, 72px);
  }
  .about-page {
    width: min(100% - 80px, 920px);
    margin: 76px auto 104px;
  }
  .about-content {
    font-size: 18px;
    line-height: 1.72;
  }
  .about-content section + section {
    margin-top: 54px;
  }
  .about-content h2 {
    margin-bottom: 18px;
    font-size: 34px;
  }
  .about-content p + p {
    margin-top: 18px;
  }
  .about-content__quote {
    padding-left: 24px;
    font-size: 21px;
    line-height: 1.45;
  }
  .formation-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px;
    padding: 40px; max-width: var(--container-lg); margin-inline: auto;
  }

  .formation-hero {
    min-height: 0;
    height: clamp(560px, 36vw, 760px);
    align-items: center;
    background: #005FC4;
  }
  .formation-hero__image {
    z-index: 0;
    object-fit: cover;
    object-position: center top;
  }
  .formation-hero::before {
    display: none;
  }
  .formation-hero::after {
    display: none;
  }
  .formation-hero__content {
    z-index: 2;
    max-width: 1332px;
    margin-inline: auto;
    padding: 118px 40px 42px;
  }
  .formation-hero__kicker {
    font-size: 15px;
    line-height: 1.2;
  }
  .formation-hero h1 {
    max-width: 690px;
    font-size: clamp(52px, 4.2vw, 74px);
  }
  .formation-hero__meta {
    margin-top: 16px;
    justify-content: flex-start;
    gap: 18px;
    max-width: 700px;
    font-size: 15px;
  }
  .formation-hero__actions {
    margin-top: 28px;
    display: flex;
    align-items: center;
    gap: 16px;
    width: auto;
  }
  .formation-detail__cta {
    min-height: 56px;
    padding-inline: 30px;
    border-radius: 8px;
    font-size: 13px;
  }
  .formation-detail {
    padding-bottom: 0;
  }
  .formation-mobile-sticky-bar {
    display: none;
  }
  .formation-hero__actions .formation-detail__cta--program {
    min-width: 334px;
  }
  .formation-hero__actions .btn--yellow {
    min-width: 278px;
  }
  .formation-detail__body {
    max-width: var(--container-lg);
    margin-inline: auto;
    padding: 56px 40px 80px;
  }
  .formation-trainer {
    grid-template-columns: 360px minmax(0, 1fr);
    align-items: center;
    gap: 48px;
  }
  .formation-trainer__photo {
    border-radius: 24px;
  }
  .formation-trainer h2,
  .formation-program h2,
  .formation-access h2,
  .formation-final h2,
  .formation-success h2 {
    font-size: 30px;
  }
  .formation-trainer p {
    margin-top: 12px;
    font-size: 16px;
  }
  .formation-trainer__profiles {
    margin-top: 18px;
  }
  .formation-trainer__profile + .formation-trainer__profile {
    margin-top: 22px;
  }
  .formation-trainer__profile h3 {
    font-size: 17px;
  }
  .formation-trainer ul,
  .formation-access ul,
  .formation-program ul {
    margin-top: 18px;
    padding-left: 20px;
    font-size: 15px;
  }
  .formation-trainer li,
  .formation-access li,
  .formation-program li {
    margin-bottom: 8px;
  }
  .countdown {
    max-width: 520px;
    margin: 44px auto;
    gap: 12px;
  }
  .countdown li {
    padding: 18px 12px;
    border-radius: 14px;
  }
  .countdown strong {
    font-size: 32px;
  }
  .countdown span {
    margin-top: 6px;
    font-size: 12px;
  }
  /* Bloc programme sur fond GRIS clair et texte sombre, comme en mobile.
     Il était en aplat bleu #005FC4 avec du texte blanc : le programme est le
     contenu principal de la page et doit se lire comme du texte, pas comme une
     bannière. Seule la couleur change, la position reste identique. */
  .formation-program {
    margin: 58px calc(50% - 50vw) 0;
    padding: 56px max(40px, calc((100vw - var(--container-lg)) / 2 + 40px));
    border-radius: 0;
    background: var(--color-surface);
    color: var(--color-text);
  }
  .formation-program h2 {
    color: var(--color-primary);
    font-size: 34px;
  }
  .formation-program__summary {
    margin-top: 12px;
    padding-bottom: 18px;
    border-bottom-color: rgba(0, 95, 196, .24);
    color: var(--color-muted);
    font-size: 15px;
  }
  .formation-program__list,
  .formation-program__simple {
    max-width: 1040px;
    margin-top: 26px;
    display: block;
  }
  .formation-program__slot {
    padding-block: 18px;
    border-bottom-color: rgba(0, 95, 196, .14);
  }
  .formation-program__slot h3 {
    color: var(--color-text);
    font-size: 15px;
  }
  .formation-program__slot p {
    color: var(--color-text-soft);
    font-size: 15px;
  }
  .formation-program ul {
    color: var(--color-text-soft);
    font-size: 15px;
  }
  .formation-access {
    display: grid;
    grid-template-columns: 1fr 1fr;
    align-items: center;
    gap: 36px;
  }
  .formation-access img {
    grid-row: 1 / span 2;
    border-radius: 24px;
  }
  .formation-access h2 {
    grid-column: 2;
    align-self: end;
    margin-top: 0;
  }
  .formation-access ul {
    grid-column: 2;
    align-self: start;
    margin-bottom: 0;
  }
  .formation-final {
    margin: 64px calc(50% - 50vw) 0;
    padding: 42px max(40px, calc((100vw - var(--container-lg)) / 2 + 40px));
    border-radius: 0;
  }
  .formation-final__inner {
    max-width: 1040px;
    margin-inline: 0;
  }
  .formation-final__facts {
    gap: 10px;
    font-size: 24px;
  }
  .formation-final__facts li {
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 12px;
  }
  .formation-final__icon {
    width: 24px;
    height: 24px;
    font-size: 22px;
  }
  .formation-final__offer {
    margin-top: 24px;
    grid-template-columns: minmax(0, 1.25fr) minmax(220px, .75fr);
    align-items: center;
    gap: 26px;
  }
  .formation-final__offer--packages {
    display: block;
  }
  .formation-final__price {
    padding: 18px 24px;
    border-width: 2px;
    border-radius: 14px;
    font-size: 28px;
  }
  .formation-final__price del {
    margin-right: 8px;
    text-decoration-thickness: 3px;
  }
  .formation-final__offer > p {
    padding-left: 24px;
    border-left: 1px solid rgba(255, 255, 255, .62);
    font-size: 18px;
  }
  .formation-offer-packages {
    gap: 16px;
  }
  .formation-offer-packages--final {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .formation-offer-packages--final .formation-offer-package:only-child {
    grid-column: 1 / -1;
  }
  .formation-offer-package {
    padding: 18px 20px;
    border-width: 2px;
    border-radius: 14px;
  }
  .formation-offer-package h3 {
    font-size: 25px;
  }
  .formation-offer-package__description {
    margin-top: 8px;
    font-size: 14px;
  }
  .formation-offer-package__price {
    margin-top: 14px;
    gap: 7px 10px;
  }
  .formation-offer-package__price del {
    font-size: 16px;
    text-decoration-thickness: 3px;
  }
  .formation-offer-package__price span {
    font-size: 13px;
  }
  .formation-offer-package__price strong {
    font-size: 32px;
  }
  .formation-offer-package ul {
    margin-top: 12px;
    padding-left: 20px;
    font-size: 14px;
  }
  .formation-offer-package li + li {
    margin-top: 7px;
  }
  .formation-offer-package__emphasis,
  .formation-offer-package__note {
    margin-top: 14px;
    font-size: 14px;
  }
  .formation-offer-package__note {
    margin-top: 7px;
    font-size: 13px;
  }
  .formation-final__caption {
    margin-top: 14px;
    font-size: 13px;
  }
  .formation-deposit-message--final {
    margin-top: 20px;
    font-size: 16px;
  }
  .formation-final__cta {
    margin-top: 24px;
  }
  .formation-success {
    margin-top: 64px;
  }
  .formation-success__grid {
    margin-top: 28px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
  }
  .formation-success__grid img {
    border-radius: 10px;
  }
}

@media (max-width: 1023px) {
  .formation-page--rolland-clone {
    background: #fff;
  }

  .formation-page--rolland-clone .header {
    display: none;
  }

  .formation-page--rolland-clone .formation-detail--rolland-clone-desktop {
    display: none;
  }

  .formation-page--rolland-clone .formation-detail--rolland-clone-desktop .formation-mobile-sticky-bar {
    display: none;
  }

  .formation-page--rolland-clone .rolland-mobile-clone {
    display: block;
    width: min(100%, 820px);
    margin-inline: auto;
    background: #fff;
    color: #fff;
    overflow: hidden;
  }

  .rolland-poster {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: clamp(18px, 5.5vw, 42px);
    min-height: 142vw;
    padding: clamp(38px, 10vw, 78px) clamp(24px, 7vw, 56px);
    overflow: hidden;
    background: #004eb8;
    isolation: isolate;
  }

  .rolland-poster--blue::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -2;
    background: url("/assets/images/formations/PR-ROLLAND-PDF-ASSETS/rolland-blue-bg.webp") center / cover no-repeat;
  }

  .rolland-poster--blue::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(180deg, rgba(0, 32, 118, .34), rgba(0, 75, 184, .18));
  }

  .rolland-poster__top-strip {
    position: absolute;
    inset: 0 0 auto;
    height: 24px;
    background: url("/assets/images/formations/PR-ROLLAND-PDF-ASSETS/rolland-top-strip.webp") center / auto 24px repeat-x;
    opacity: .9;
  }

  .rolland-poster h1,
  .rolland-poster h2,
  .rolland-poster h3,
  .rolland-poster h4 {
    color: #fff;
    letter-spacing: 0;
    text-transform: uppercase;
  }

  .rolland-poster h2 {
    font-size: clamp(31px, 8.5vw, 58px);
    line-height: 1.05;
    font-weight: 900;
  }

  .rolland-poster h3 {
    font-size: clamp(23px, 6.2vw, 42px);
    line-height: 1.12;
    font-weight: 800;
  }

  .rolland-poster p,
  .rolland-poster li {
    color: #fff;
    font-size: clamp(17px, 4.6vw, 32px);
    line-height: 1.25;
    letter-spacing: 0;
  }

  .rolland-poster strong {
    font-weight: 900;
  }

  .rolland-poster mark {
    display: block;
    background: transparent;
    color: #ffe600;
    font: inherit;
  }

  .rolland-poster__logos {
    display: flex;
    align-items: center;
    gap: clamp(12px, 3.5vw, 28px);
  }

  .rolland-poster__logos--center {
    justify-content: center;
  }

  .rolland-poster__logos img {
    width: auto;
    height: clamp(42px, 12vw, 82px);
    object-fit: contain;
  }

  .rolland-poster__logos span {
    width: 2px;
    height: clamp(42px, 11vw, 74px);
    background: rgba(255,255,255,.8);
  }

  .rolland-poster__footerline {
    display: flex;
    justify-content: space-between;
    gap: 20px;
    margin-top: auto;
    color: #fff;
    font-size: clamp(15px, 4vw, 27px);
    line-height: 1.25;
    letter-spacing: 0;
  }

  .rolland-poster__image,
  .rolland-poster__video {
    width: 100%;
    height: auto;
    object-fit: cover;
  }

  .rolland-poster__image--rounded {
    border: 2px solid rgba(255,255,255,.92);
    border-radius: clamp(20px, 7vw, 56px);
  }

  .rolland-poster__bullets {
    display: grid;
    gap: clamp(12px, 3.6vw, 28px);
    padding-left: 1.1em;
    list-style: disc;
  }

  .rolland-poster__emphasis {
    font-weight: 900;
  }

  .rolland-poster__subline {
    padding-top: 10px;
    border-top: 3px solid rgba(255,255,255,.42);
    font-weight: 700;
  }

  .rolland-poster--hero {
    min-height: 176vw;
    padding-bottom: 0;
    background: #005fc4;
  }

  .rolland-poster__hero-bg {
    position: absolute;
    inset: 0;
    z-index: -2;
    width: 100%;
    height: 84%;
    object-fit: cover;
  }

  .rolland-poster--hero::after {
    content: "";
    position: absolute;
    inset: 0 0 16%;
    z-index: -1;
    background: linear-gradient(180deg, rgba(0, 77, 184, .06), rgba(0, 68, 176, .22));
  }

  .rolland-poster--hero .rolland-poster__logos {
    justify-content: center;
  }

  .rolland-poster__signature {
    width: clamp(120px, 34vw, 230px);
    height: auto;
    align-self: flex-end;
    margin-top: auto;
  }

  .rolland-poster__hero-copy {
    display: grid;
    gap: 12px;
    margin-top: 4vw;
  }

  .rolland-poster__hero-copy p {
    font-size: clamp(28px, 8.2vw, 56px);
    line-height: 1;
    text-transform: uppercase;
  }

  .rolland-poster__hero-copy h2 {
    font-size: clamp(36px, 10vw, 78px);
    line-height: .94;
    font-weight: 900;
  }

  .rolland-poster__hero-copy strong {
    color: #fff;
    font-size: clamp(28px, 8vw, 54px);
    line-height: 1;
    text-align: center;
    text-transform: uppercase;
  }

  .rolland-poster__hero-band {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    margin-inline: calc(-1 * clamp(24px, 7vw, 56px));
    padding: clamp(20px, 5vw, 42px) clamp(24px, 7vw, 56px);
    background: #fff;
    color: #0049b3;
  }

  .rolland-poster__hero-band strong,
  .rolland-poster__hero-band span,
  .rolland-poster__hero-band p {
    color: #0049b3;
  }

  .rolland-poster__hero-band > div:first-child strong {
    display: block;
    font-size: clamp(26px, 7vw, 46px);
    text-transform: uppercase;
  }

  .rolland-poster__hero-band > div:first-child span,
  .rolland-poster__hero-band p {
    font-size: clamp(18px, 4.8vw, 30px);
    line-height: 1.2;
  }

  .rolland-poster__trainer-head {
    display: grid;
    gap: 20px;
  }

  .rolland-poster__trainer-head h2 {
    font-size: clamp(23px, 6.6vw, 48px);
    font-weight: 400;
  }

  .rolland-poster__trainer-head h2 strong {
    display: block;
  }

  .rolland-poster__signature--trainer {
    position: relative;
    z-index: 1;
    margin-top: -18vw;
  }

  .rolland-poster__underline {
    justify-self: center;
    border-bottom: 2px solid #fff;
    font-weight: 900;
    text-align: center;
  }

  .rolland-poster__paragraphs {
    display: grid;
    gap: clamp(18px, 5vw, 38px);
  }

  .rolland-poster__stamp {
    width: min(38vw, 230px);
    height: auto;
    align-self: flex-end;
    opacity: .9;
  }

  .rolland-poster--elearning h2 span {
    display: block;
    font-weight: 300;
  }

  .rolland-poster__date {
    margin-top: -20px;
    padding-top: 10px;
    border-top: 2px solid rgba(255,255,255,.5);
  }

  .rolland-poster__video {
    border-radius: clamp(14px, 4vw, 28px);
  }

  .rolland-poster--program .rolland-poster__program-grid {
    display: grid;
    gap: clamp(22px, 6vw, 48px);
  }

  .rolland-poster__program-grid section {
    padding-left: clamp(18px, 4vw, 34px);
    border-left: 2px solid rgba(255,255,255,.24);
  }

  .rolland-poster__program-grid ul {
    columns: 1;
    margin-top: 12px;
    padding-left: 1em;
    list-style: disc;
  }

  .rolland-poster__phone-row {
    display: grid;
    gap: 12px;
  }

  .rolland-poster__phone-row img {
    width: min(86vw, 560px);
    height: auto;
    justify-self: end;
    margin-top: -10vw;
  }

  .rolland-poster__days-meta {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    color: #fff;
    font-size: clamp(15px, 4vw, 28px);
    line-height: 1.15;
    text-transform: uppercase;
  }

  .rolland-poster__weekend {
    display: grid;
    grid-template-columns: minmax(90px, .42fr) 1fr;
    align-items: stretch;
    border: 2px solid rgba(48, 184, 255, .78);
    color: #fff;
  }

  .rolland-poster__weekend > strong {
    display: flex;
    align-items: center;
    padding: clamp(12px, 3.5vw, 24px);
    background: rgba(18, 188, 255, .75);
    font-size: clamp(19px, 5.2vw, 34px);
    line-height: 1.08;
    text-transform: uppercase;
  }

  .rolland-poster__weekend span {
    padding: clamp(14px, 4vw, 28px);
    font-size: clamp(18px, 4.8vw, 34px);
    line-height: 1.12;
    text-transform: uppercase;
  }

  .rolland-poster__weekend b {
    display: block;
    font-size: clamp(25px, 7vw, 48px);
  }

  .rolland-poster__weekend small {
    font-size: .48em;
  }

  .rolland-poster--pricing h3 {
    text-align: center;
    text-decoration: underline;
    text-underline-offset: .18em;
  }

  .rolland-poster__price-grid {
    display: grid;
    gap: clamp(20px, 6vw, 48px);
  }

  .rolland-poster__price-grid article {
    overflow: hidden;
    border: 2px solid #fff;
    border-radius: clamp(18px, 5.5vw, 36px);
  }

  .rolland-poster__price-grid h4 {
    padding: clamp(16px, 4.5vw, 30px);
    background: #fff;
    color: #0049b3;
    font-size: clamp(25px, 7vw, 44px);
    font-weight: 400;
    text-align: center;
  }

  .rolland-poster__price-grid p,
  .rolland-poster__price-grid ul,
  .rolland-poster__price-grid em,
  .rolland-poster__price-grid small {
    display: block;
    margin: 0;
    padding-inline: clamp(18px, 5vw, 36px);
  }

  .rolland-poster__price-grid p {
    padding-top: clamp(20px, 5vw, 36px);
  }

  .rolland-poster__price-grid del {
    display: block;
    color: #fff;
    font-size: clamp(22px, 6vw, 42px);
  }

  .rolland-poster__price-grid p strong {
    display: block;
    color: #fff;
    font-size: clamp(45px, 12vw, 86px);
    line-height: 1;
  }

  .rolland-poster__price-grid ul {
    display: grid;
    gap: 10px;
    margin-top: 22px;
    padding-left: clamp(34px, 8vw, 60px);
    list-style: disc;
  }

  .rolland-poster__price-grid li {
    font-size: clamp(15px, 4vw, 27px);
  }

  .rolland-poster__price-grid em {
    margin-top: 22px;
    color: #ffe600;
    font-size: clamp(18px, 4.8vw, 30px);
    font-weight: 900;
  }

  .rolland-poster__price-grid small {
    padding-block: 18px 28px;
    color: #fff;
    font-size: clamp(14px, 3.8vw, 24px);
    font-style: italic;
  }

  .rolland-poster__center {
    text-align: center;
  }

  .rolland-poster__center mark {
    display: inline;
    color: #ffe600;
  }
}

/* Rolland mobile/tablet brochure: each section keeps the source A4 proportions. */
@media (max-width: 1023px) {
  .formation-page--rolland-clone .header {
    position: absolute;
    inset: 0 0 auto;
    display: flex;
    background: transparent;
  }

  .formation-page--rolland-clone .rolland-mobile-clone {
    container-type: inline-size;
  }

  .formation-page--rolland-clone .formation-detail--rolland-clone-desktop .formation-mobile-sticky-bar {
    display: none;
  }

  .rolland-poster {
    position: relative;
    display: block;
    width: 100%;
    min-height: 0;
    aspect-ratio: 595.276 / 841.89;
    padding: 0;
    overflow: hidden;
    background: #0759bd;
    color: #fff;
    isolation: isolate;
  }

  .rolland-poster--blue::before {
    inset: 0;
    z-index: 0;
    background: url("/assets/images/formations/PR-ROLLAND-PDF-ASSETS/rolland-blue-bg.webp") center / cover no-repeat;
  }

  .rolland-poster--blue::after {
    display: none;
  }

  .rolland-poster--blue > * {
    position: absolute;
    z-index: 2;
  }

  .rolland-poster h1,
  .rolland-poster h2,
  .rolland-poster h3,
  .rolland-poster h4,
  .rolland-poster p,
  .rolland-poster ul {
    margin: 0;
  }

  .rolland-poster h2 {
    font-size: 4.2cqw;
    line-height: 1.08;
  }

  .rolland-poster h3 {
    font-size: 3.1cqw;
    line-height: 1.12;
  }

  .rolland-poster p,
  .rolland-poster li {
    font-size: 2.45cqw;
    line-height: 1.25;
  }

  .rolland-poster__top-strip {
    inset: 0 0 auto;
    height: 4.6cqw;
    background-size: auto 4.6cqw;
  }

  .rolland-poster__logos {
    gap: 2.2cqw;
  }

  .rolland-poster__logos img {
    height: 7.8cqw;
  }

  .rolland-poster__logos span {
    width: .18cqw;
    height: 7cqw;
  }

  .rolland-poster__image,
  .rolland-poster__video {
    display: block;
    width: auto;
    max-width: none;
    object-fit: cover;
  }

  .rolland-poster__bullets {
    display: grid;
    gap: 2.7cqw;
    padding-left: 1.1em;
  }

  .rolland-poster__footerline {
    display: flex;
    justify-content: space-between;
    margin: 0;
    color: #fff;
    font-size: 2.15cqw;
    line-height: 1.25;
  }

  .rolland-poster--hero {
    min-height: 0;
    background: #0759bd;
  }

  .rolland-poster__hero-bg {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
  }

  .rolland-poster--hero::after {
    display: block;
    inset: 0;
    z-index: 2;
    background: linear-gradient(180deg, rgba(0, 70, 180, .02), rgba(0, 58, 160, .12));
  }

  .rolland-poster--hero > *:not(.rolland-poster__hero-bg) {
    position: absolute;
    z-index: 3;
  }

  .rolland-poster--hero .rolland-poster__logos {
    top: 17.5cqw;
    left: 29.5cqw;
    justify-content: flex-start;
  }

  .rolland-poster--hero .rolland-poster__logos img {
    height: 9.5cqw;
  }

  .rolland-poster--hero .rolland-poster__logos span {
    height: 8.8cqw;
  }

  .rolland-poster__signature {
    top: 64cqw;
    right: 8.5cqw;
    display: grid;
    width: 28cqw;
    margin: 0;
    color: #fff;
    font-family: "Brush Script MT", "Segoe Script", cursive;
    font-size: 4.2cqw;
    font-weight: 400;
    line-height: .9;
    text-align: center;
    transform: rotate(-7deg);
  }

  .rolland-poster__signature span + span {
    margin-left: 6cqw;
  }

  .rolland-poster__hero-copy {
    top: 83.8cqw;
    left: 8.7cqw;
    display: block;
    width: 83cqw;
    margin: 0;
  }

  .rolland-poster__hero-copy p {
    font-size: 4.7cqw;
    line-height: 1;
  }

  .rolland-poster__hero-copy h2 {
    margin-top: 2.2cqw;
    font-size: 7.2cqw;
    line-height: .98;
  }

  .rolland-poster__hero-copy strong {
    display: block;
    margin-top: 2.4cqw;
    font-size: 4.4cqw;
  }

  .rolland-poster__hero-band {
    inset: auto 0 0;
    display: grid;
    grid-template-columns: 1.12fr 1fr;
    gap: 2.5cqw;
    height: 21cqw;
    margin: 0;
    padding: 2.4cqw 8.7cqw;
  }

  .rolland-poster__hero-band > div + div {
    padding-left: 2.5cqw;
    border-left: .3cqw solid #0759bd;
  }

  .rolland-poster__hero-band > div:first-child strong {
    font-size: 3.8cqw;
  }

  .rolland-poster__hero-band > div:first-child span {
    font-size: 2.45cqw;
  }

  .rolland-poster__hero-band p {
    font-size: 1.72cqw;
    line-height: 1.2;
  }

  .rolland-poster--hero .rolland-poster__footerline {
    inset: auto 8.7cqw 3.5cqw;
    font-size: 2.2cqw;
  }

  .rolland-poster--certification .rolland-poster__logos {
    top: 8.8cqw;
    left: 31cqw;
  }

  .rolland-poster--certification h2 {
    top: 24cqw;
    left: 6.5cqw;
    width: 87cqw;
    font-size: 4.1cqw;
    font-weight: 300;
  }

  .rolland-poster--certification h2 mark {
    font-size: 7.1cqw;
    font-weight: 900;
  }

  .rolland-poster--certification .rolland-poster__subline {
    top: 43.5cqw;
    left: 6.5cqw;
    width: 87cqw;
    padding-top: 1.2cqw;
    border-top-width: .3cqw;
    font-size: 2.8cqw;
  }

  .rolland-poster--certification .rolland-poster__image {
    top: 54cqw;
    left: 6.8cqw;
    width: 86.4cqw;
    height: 36cqw;
  }

  .rolland-poster--certification .rolland-poster__bullets {
    top: 94cqw;
    left: 6.5cqw;
    width: 86cqw;
    gap: 3.2cqw;
  }

  .rolland-poster--certification .rolland-poster__emphasis {
    top: 126.5cqw;
    left: 6.5cqw;
    font-size: 2.8cqw;
  }

  .rolland-poster--certification .rolland-poster__footerline {
    inset: auto 6.5cqw 5cqw;
  }

  .rolland-poster--trainer .rolland-poster__trainer-head {
    top: 9.5cqw;
    left: 6.5cqw;
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    width: 87cqw;
  }

  .rolland-poster--trainer .rolland-poster__trainer-head h2 {
    width: 52cqw;
    font-size: 2.35cqw;
  }

  .rolland-poster--trainer .rolland-poster__trainer-head h2 strong {
    font-size: 2.9cqw;
  }

  .rolland-poster--trainer .rolland-poster__image {
    top: 24cqw;
    left: 6.5cqw;
    width: 87cqw;
    height: 48.2cqw;
  }

  .rolland-poster__signature--trainer {
    top: 62cqw;
    right: 7cqw;
    width: 24cqw;
    margin: 0;
  }

  .rolland-poster--trainer > h3 {
    top: 76cqw;
    left: 6.5cqw;
    width: 82cqw;
    padding-bottom: 1cqw;
    border-bottom: .25cqw solid #fff;
    font-size: 2.6cqw;
    font-weight: 400;
  }

  .rolland-poster--trainer > .rolland-poster__bullets {
    top: 87cqw;
    left: 6.5cqw;
    width: 86cqw;
    gap: 2.2cqw;
  }

  .rolland-poster--trainer > .rolland-poster__bullets li {
    font-size: 2.25cqw;
  }

  .rolland-poster--trainer .rolland-poster__underline {
    inset: auto 8cqw 6.5cqw;
    padding-top: 2cqw;
    border-top: .25cqw solid rgba(255,255,255,.45);
    border-bottom: 0;
    font-size: 2.35cqw;
  }

  .rolland-poster--patients > h2 {
    top: 16cqw;
    left: 7cqw;
    width: 86cqw;
    padding-bottom: 2.4cqw;
    border-bottom: .3cqw solid rgba(255,255,255,.55);
    font-size: 4.1cqw;
  }

  .rolland-poster--patients .rolland-poster__paragraphs {
    top: 37cqw;
    left: 7cqw;
    display: grid;
    width: 86cqw;
    gap: 3.4cqw;
  }

  .rolland-poster--patients .rolland-poster__paragraphs p {
    font-size: 2.9cqw;
  }

  .rolland-poster--patients > .rolland-poster__emphasis {
    left: 7cqw;
    width: 86cqw;
    font-size: 2.75cqw;
  }

  .rolland-poster--patients > .rolland-poster__emphasis:nth-of-type(1) {
    top: 89.5cqw;
  }

  .rolland-poster--patients > .rolland-poster__emphasis:nth-of-type(2) {
    top: 103cqw;
  }

  .rolland-poster--patients .rolland-poster__stamp {
    right: 7cqw;
    bottom: 8cqw;
    width: 18cqw;
  }

  .rolland-poster--patients .rolland-poster__footerline {
    left: 8.5cqw;
    bottom: 11cqw;
  }

  .rolland-poster--elearning .rolland-poster__logos {
    top: 5.5cqw;
    left: 31cqw;
  }

  .rolland-poster--elearning h2 {
    top: 22cqw;
    left: 15.5cqw;
    width: 72cqw;
    font-size: 4.1cqw;
  }

  .rolland-poster--elearning h2 span {
    font-size: 4cqw;
  }

  .rolland-poster--elearning .rolland-poster__date {
    top: 32.5cqw;
    left: 15.5cqw;
    width: 72cqw;
    padding-top: .8cqw;
    border-top-width: .25cqw;
    font-size: 2.15cqw;
  }

  .rolland-poster--elearning .rolland-poster__video {
    top: 42cqw;
    left: 7.8cqw;
    width: 87cqw;
    height: 49.5cqw;
    border-radius: 2.5cqw;
  }

  .rolland-poster--elearning h3 {
    top: 102.5cqw;
    left: 7.2cqw;
    width: 85cqw;
    font-size: 2.35cqw;
  }

  .rolland-poster--elearning > p:not(.rolland-poster__date) {
    left: 7.2cqw;
    width: 85cqw;
    font-size: 2.2cqw;
  }

  .rolland-poster--elearning > p:nth-of-type(2) {
    top: 112cqw;
  }

  .rolland-poster--elearning > p:nth-of-type(3) {
    top: 124cqw;
  }

  .rolland-poster--elearning > p:nth-of-type(4) {
    top: 135cqw;
    font-size: 1.9cqw;
  }

  .rolland-poster--program > h2 {
    top: 9cqw;
    left: 8.5cqw;
    font-size: 3.4cqw;
  }

  .rolland-poster--program .rolland-poster__program-grid {
    top: 16cqw;
    left: 8.5cqw;
    display: grid;
    width: 84cqw;
    gap: 2.8cqw;
  }

  .rolland-poster__program-grid section {
    position: relative;
    padding-left: 3cqw;
    border-left-width: .18cqw;
  }

  .rolland-poster__program-grid h3 {
    font-size: 2.9cqw;
  }

  .rolland-poster__program-grid ul {
    columns: 2;
    column-gap: 4.5cqw;
    margin-top: 1.1cqw;
    padding-left: 1.1em;
  }

  .rolland-poster__program-grid li {
    break-inside: avoid;
    font-size: 2.15cqw;
    line-height: 1.18;
  }

  .rolland-poster--program > p:first-of-type {
    top: 73cqw;
    left: 8.5cqw;
    width: 56cqw;
    font-size: 1.8cqw;
  }

  .rolland-poster--program > .rolland-poster__logos {
    top: 84cqw;
    left: 9cqw;
  }

  .rolland-poster--program .rolland-poster__phone-row {
    top: 95cqw;
    left: 0;
    display: block;
    width: 100cqw;
  }

  .rolland-poster__phone-row h2 {
    width: 43cqw;
    margin-left: 8.5cqw;
    font-size: 3.2cqw;
  }

  .rolland-poster__phone-row img {
    position: absolute;
    top: -21cqw;
    right: 7cqw;
    width: 44cqw;
    margin: 0;
  }

  .rolland-poster--program > p:nth-of-type(2) {
    top: 119cqw;
    left: 8.5cqw;
    width: 83cqw;
    font-size: 1.9cqw;
  }

  .rolland-poster--program .rolland-poster__footerline {
    inset: auto 9cqw 6cqw;
  }

  .rolland-poster--days > h2 {
    top: 5cqw;
    left: 7.5cqw;
    font-size: 5.4cqw;
  }

  .rolland-poster__days-meta {
    top: 13cqw;
    left: 8cqw;
    width: 84cqw;
    font-size: 1.65cqw;
  }

  .rolland-poster--days > h3 {
    top: 21cqw;
    left: 7.5cqw;
    width: 71cqw;
    padding-bottom: 1.4cqw;
    border-bottom: .3cqw solid rgba(255,255,255,.6);
    font-size: 3.2cqw;
  }

  .rolland-poster__weekend {
    top: 34cqw;
    left: 7.5cqw;
    width: 85.5cqw;
    height: 12.5cqw;
    grid-template-columns: 17.5cqw 1fr;
    border-width: .18cqw;
  }

  .rolland-poster__weekend + .rolland-poster__weekend {
    top: 50cqw;
  }

  .rolland-poster__weekend > strong {
    padding: 2cqw;
    font-size: 2.25cqw;
  }

  .rolland-poster__weekend span {
    padding: 1.7cqw 2.5cqw;
    font-size: 2.2cqw;
  }

  .rolland-poster__weekend b {
    font-size: 3.2cqw;
  }

  .rolland-poster--days .rolland-poster__image {
    top: 65cqw;
    left: 7cqw;
    width: 86cqw;
    height: 45cqw;
    border-width: .2cqw;
    border-radius: 4cqw;
  }

  .rolland-poster--days .rolland-poster__bullets {
    top: 114cqw;
    left: 7cqw;
    width: 85cqw;
    gap: 3cqw;
  }

  .rolland-poster--days .rolland-poster__bullets li {
    font-size: 2.45cqw;
  }

  .rolland-poster--pricing > h2 {
    top: 15cqw;
    left: 6cqw;
    width: 88cqw;
    font-size: 3.4cqw;
  }

  .rolland-poster--pricing > .rolland-poster__bullets {
    top: 23cqw;
    left: 7.5cqw;
    width: 85cqw;
    gap: 2.1cqw;
  }

  .rolland-poster--pricing > .rolland-poster__bullets li {
    font-size: 2.05cqw;
  }

  .rolland-poster--pricing > h3 {
    top: 54cqw;
    left: 30cqw;
    font-size: 3.1cqw;
  }

  .rolland-poster__price-grid {
    top: 62cqw;
    left: 30cqw;
    display: grid;
    grid-template-columns: 1fr;
    width: 40cqw;
  }

  .rolland-poster__price-grid article {
    position: relative;
    height: 59cqw;
    border-width: .18cqw;
    border-radius: 2cqw;
  }

  .rolland-poster__price-grid h4 {
    padding: 2.4cqw 1cqw;
    font-size: 2.9cqw;
  }

  .rolland-poster__price-grid p,
  .rolland-poster__price-grid ul,
  .rolland-poster__price-grid em,
  .rolland-poster__price-grid small {
    padding-inline: 2.1cqw;
  }

  .rolland-poster__price-grid p {
    padding-top: 3cqw;
  }

  .rolland-poster__price-grid del {
    font-size: 2.5cqw;
  }

  .rolland-poster__price-grid p strong {
    font-size: 5.8cqw;
  }

  .rolland-poster__price-grid ul {
    gap: 1.3cqw;
    margin-top: 3cqw;
    padding-left: 3.8cqw;
  }

  .rolland-poster__price-grid li {
    font-size: 1.45cqw;
  }

  .rolland-poster__price-grid em {
    margin-top: 2cqw;
    font-size: 1.75cqw;
  }

  .rolland-poster__price-grid small {
    padding-block: 1.7cqw;
    font-size: 1.35cqw;
  }

  .rolland-poster--pricing > .rolland-poster__center {
    top: 124cqw;
    left: 8cqw;
    width: 84cqw;
    font-size: 1.7cqw;
    line-height: 1.35;
  }

  .rolland-poster__registration {
    top: 144cqw;
    left: 8cqw;
    width: 84cqw;
    min-height: 10cqw;
    border-radius: 1.4cqw;
    font-size: 3.2cqw;
    font-weight: 900;
    text-transform: uppercase;
  }

  .rolland-poster--pricing {
    height: 160cqw;
    aspect-ratio: auto;
  }
}

@media (min-width: 1024px) {
  .formation-detail__body {
    max-width: 1580px;
  }

  .formation-detail__body > .formation-trainer,
  .formation-detail__body > .countdown,
  .formation-detail__body > .formation-final {
    display: none;
  }

  .formation-detail__desktop-shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(440px, 520px);
    align-items: start;
    gap: 48px;
    position: relative;
  }

  .formation-detail__desktop-main {
    min-width: 0;
  }

  .formation-detail__desktop-main .formation-program {
    margin: 0;
    padding: 46px 44px;
    border-radius: 0;
    background: var(--color-surface);
  }

  .formation-detail__desktop-main .formation-program__list,
  .formation-detail__desktop-main .formation-program__simple {
    max-width: none;
  }

  .formation-detail__desktop-main .formation-access {
    margin-top: 54px;
  }

  .formation-detail__desktop-sidebar {
    display: block;
    position: relative;
    overflow: visible;
  }

  .formation-detail__desktop-sidebar[data-sidebar-stuck="fixed"] {
    position: fixed;
    right: var(--formation-sidebar-right, 40px);
    bottom: 24px;
    width: var(--formation-sidebar-width, 520px);
    z-index: 70;
  }

  .formation-detail__desktop-sidebar[data-sidebar-stuck="end"] {
    position: absolute;
    right: 0;
    bottom: 0;
    width: var(--formation-sidebar-width, 520px);
    z-index: 70;
  }

  .formation-sidebar-card {
    padding: 20px;
    border: 1px solid rgba(0, 95, 196, .12);
    background: #fff;
    box-shadow: 0 18px 56px rgba(0, 54, 135, .1);
  }

  .formation-sidebar-trainer {
    display: grid;
    gap: 16px;
  }

  .formation-sidebar-trainer img {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    object-position: center top;
  }

  .formation-sidebar-trainer h2 {
    color: #005FC4;
    font-size: 28px;
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
  }

  .formation-sidebar-trainer p {
    margin-top: 8px;
    color: var(--color-text-soft);
    font-size: 16px;
    line-height: 1.42;
  }

  .formation-sidebar-trainer .formation-trainer__profiles {
    margin-top: 14px;
  }

  .formation-sidebar-trainer .formation-trainer__profile + .formation-trainer__profile {
    margin-top: 16px;
  }

  .formation-sidebar-trainer .formation-trainer__profile h3 {
    color: var(--color-primary);
    font-size: 15px;
    font-weight: 800;
    line-height: 1.25;
  }

  .formation-sidebar-trainer ul {
    margin-top: 12px;
    padding-left: 20px;
    color: var(--color-muted);
    font-size: 14px;
    line-height: 1.42;
    list-style: disc;
  }

  .formation-sidebar-trainer li {
    margin-bottom: 6px;
  }

  .formation-detail__desktop-sidebar .countdown {
    max-width: none;
    margin: 18px 0;
    gap: 8px;
  }

  .formation-detail__desktop-sidebar .countdown li {
    padding: 14px 8px;
    border-radius: 10px;
  }

  .formation-detail__desktop-sidebar .countdown strong {
    font-size: 30px;
  }

  .formation-detail__desktop-sidebar .countdown span {
    margin-top: 5px;
    font-size: 11px;
  }

  .formation-sidebar-details {
    padding-top: 18px;
    border-top: 1px solid rgba(0, 95, 196, .16);
  }

  .formation-sidebar-details ul {
    display: grid;
    gap: 11px;
  }

  .formation-sidebar-details li {
    display: grid;
    grid-template-columns: 26px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    color: var(--color-text);
    font-size: 16px;
    line-height: 1.25;
  }

  .formation-sidebar-details li span {
    color: #005FC4;
    font-size: 18px;
    line-height: 1;
    text-align: center;
  }

  .formation-sidebar-details li .formation-detail-fact-icon {
    display: block;
    width: 22px;
    height: 22px;
    object-fit: contain;
    filter: none;
  }

  .formation-sidebar-details li strong {
    font-weight: 800;
  }

  .formation-sidebar-price {
    margin-top: 18px;
    padding: 16px;
    border: 2px solid #005FC4;
  }

  .formation-offer-packages--sidebar {
    gap: 12px;
  }

  .formation-offer-packages--sidebar .formation-offer-package {
    padding: 14px;
    border-color: #D4AF37;
    border-radius: 12px;
  }

  .formation-offer-packages--sidebar .formation-offer-package h3 {
    font-size: 20px;
  }

  .formation-offer-packages--sidebar .formation-offer-package__description {
    margin-top: 7px;
    font-size: 13px;
  }

  .formation-offer-packages--sidebar .formation-offer-package__price {
    margin-top: 12px;
  }

  .formation-offer-packages--sidebar .formation-offer-package__price strong {
    font-size: 28px;
  }

  .formation-sidebar-details .formation-offer-package ul {
    display: block;
    margin-top: 11px;
    padding-left: 18px;
    font-size: 13px;
    list-style: disc;
  }

  .formation-sidebar-details .formation-offer-package li {
    display: list-item;
    margin-bottom: 6px;
    color: var(--color-muted);
    font-size: inherit;
    line-height: 1.28;
  }

  .formation-sidebar-price span {
    display: block;
    color: var(--color-text);
    font-size: 15px;
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
  }

  .formation-sidebar-price p {
    margin-top: 8px;
    color: var(--color-text);
    font-size: 29px;
    font-weight: 900;
    line-height: 1.05;
    text-transform: uppercase;
  }

  .formation-sidebar-price del {
    margin-right: 7px;
    text-decoration-thickness: 3px;
  }

  .formation-sidebar-price strong {
    color: #005FC4;
  }

  .formation-sidebar-note {
    margin-top: 14px;
    color: #005FC4;
    font-size: 15px;
    font-style: italic;
    font-weight: 800;
    line-height: 1.25;
  }

  .formation-deposit-message--sidebar {
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid rgba(0, 95, 196, .24);
    color: #005FC4;
    font-size: 14px;
  }

  .formation-sidebar-cta {
    width: 100%;
    margin-top: 18px;
    box-shadow: none;
  }
}

@media (min-width: 1024px) and (max-height: 820px) {
  .formation-sidebar-card {
    padding: 16px;
  }

  .formation-sidebar-trainer img {
    aspect-ratio: 16 / 7.4;
    object-position: center top;
  }

  .formation-sidebar-trainer h2 {
    font-size: 24px;
  }

  .formation-sidebar-trainer p {
    font-size: 14px;
  }

  .formation-sidebar-trainer ul {
    font-size: 12px;
    line-height: 1.3;
  }

  .formation-detail__desktop-sidebar .countdown {
    margin: 14px 0;
  }

  .formation-detail__desktop-sidebar .countdown li {
    padding: 10px 6px;
  }

  .formation-detail__desktop-sidebar .countdown strong {
    font-size: 24px;
  }

  .formation-sidebar-details {
    padding-top: 14px;
  }

  .formation-sidebar-details ul {
    gap: 8px;
  }

  .formation-sidebar-details li {
    font-size: 14px;
  }

  .formation-sidebar-price {
    margin-top: 14px;
    padding: 12px;
  }

  .formation-offer-packages--sidebar {
    gap: 10px;
  }

  .formation-offer-packages--sidebar .formation-offer-package {
    padding: 12px;
  }

  .formation-offer-packages--sidebar .formation-offer-package h3 {
    font-size: 18px;
  }

  .formation-offer-packages--sidebar .formation-offer-package__description,
  .formation-sidebar-details .formation-offer-package ul {
    font-size: 12px;
  }

  .formation-offer-packages--sidebar .formation-offer-package__price strong {
    font-size: 24px;
  }

  .formation-sidebar-price span {
    font-size: 13px;
  }

  .formation-sidebar-price p {
    font-size: 23px;
  }

  .formation-sidebar-note {
    margin-top: 10px;
    font-size: 13px;
  }

  .formation-sidebar-cta {
    min-height: 50px;
    margin-top: 12px;
    font-size: 12px;
  }
}

@media (min-width: 768px) and (max-height: 780px) {
  .page-hero--registration {
    padding: 22px 32px 18px;
  }

  .page-hero--registration h1 {
    font-size: 34px;
  }

  .registration-page--simple {
    padding: 14px 32px 40px;
  }

  .registration-simple-form {
    gap: 12px;
    padding: 18px;
  }

  .registration-selected {
    padding: 12px 14px;
  }

  .registration-selected h2 {
    font-size: 16px;
  }

  .registration-simple-form__field input,
  .registration-simple-form__field select {
    min-height: 48px;
  }

  .registration-discount p {
    font-size: 16px;
  }

  .registration-simple-form .form__submit {
    min-height: 48px;
  }
}

/* Post-registration offer ------------------------------------------------- */
@media (min-width: 768px) {
  .community-hero {
    min-height: 0;
    padding: 82px 40px;
  }

  .community-hero__status {
    width: 64px;
    height: 64px;
    margin-bottom: 24px;
    font-size: 38px;
  }

  .community-hero h1 {
    font-size: 46px;
  }

  .community-hero__rule {
    width: 68px;
    margin-block: 26px;
  }

  .community-hero__inner p {
    margin: 0 auto;
    font-size: 18px;
    line-height: 1.5;
  }

  .community-upsell {
    padding: 56px 40px 100px;
  }

  .community-benefit {
    max-width: 980px;
    min-height: 0;
    margin-top: 0;
    padding: 30px 36px;
    grid-template-columns: 68px minmax(0, 1fr);
    gap: 28px;
  }

  .community-benefit__icon {
    width: 64px;
    height: 64px;
    font-size: 27px;
  }

  .community-benefit p {
    padding-left: 28px;
    font-size: 18px;
  }

  .community-upsell__intro {
    margin-top: 56px;
  }

  .community-upsell__intro h2 {
    font-size: 32px;
  }

  .community-upsell__grid {
    max-width: 1320px;
    margin-top: 34px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px;
  }
}

/* =============================================================================
   ===========================  DESKTOP  >= 1025px  ===========================
   ============================================================================= */
@media (min-width: 1025px) {
  .section-title { font-size: 44px; }

  .trainers-page__grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 30px;
  }

  .header__logo img,
  .header--hero .header__logo img { width: 270px; }
  .nav { gap: 34px; }

  .hero { min-height: 780px; padding: 128px 56px 84px; background-position: center; }
  .hero__inner { max-width: 700px; min-height: 568px; }
  .hero__title { font-size: 68px; max-width: 700px; }
  .hero__btn { height: 54px; padding-inline: 26px; font-size: 14px; }
  .hero__partners-row img { height: 44px; max-width: 132px; }
  .hero__partners-row .hero__partner--vinatier-wordmark img {
    width: 170px;
    height: auto;
    max-width: 170px;
  }
  .hero__partners-row .hero__partner--vinatier-hospital img {
    height: 72px;
    max-width: 110px;
  }
  .hero__formation-nav { width: min(100vw - 112px, 1320px); }
  .hero__formation-nav span { font-size: 20px; }
  .hero__formation-nav a { min-height: 40px; padding-inline: 22px; font-size: 15px; }

  .intro__lead { font-size: 24px; max-width: 780px; }

  /* Spec: six category cards in a single row on desktop. */
  .categories { max-width: 1320px; }
  .categories__lead { font-size: 28px; max-width: 840px; }
  .categories__grid { grid-template-columns: repeat(6, minmax(0, 1fr)); column-gap: 18px; }
  .category-card { min-height: 270px; padding: 32px 16px 50px; border-radius: 20px; }
  .category-card__icon { width: 92px; height: 100px; }
  .category-card__label { font-size: 14px; }

  .formation-filters,
  .formation-results,
  .formation-browser-grid,
  .formation-empty {
    max-width: 1320px;
  }
  .formation-filters { max-width: 1320px; }
  .formation-browser-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .formation-slider__track {
    gap: 24px;
    scroll-padding-inline: 2px;
    padding-inline: 2px;
  }
  .formation-slider__track .formation-card {
    flex-basis: calc((100% - 72px) / 4);
  }
  .home-formation-slider .formation-card__body {
    padding: 20px 22px 24px;
  }
  .home-formation-slider .formation-card__title,
  .home-formation-slider .formation-card[data-pinned="true"] .formation-card__title {
    font-size: 18px;
    line-height: 1.2;
  }
  .formation-slider__arrow {
    width: 50px;
    height: 50px;
    font-size: 28px;
  }
  .formation-slider__arrow--prev { left: -18px; }
  .formation-slider__arrow--next { right: -18px; }

  /* Spec: three formation cards per row on desktop. */
  .accordion__item[data-open="true"] .accordion__panel { grid-template-columns: repeat(3, 1fr); }

  .stats__trust {
    max-width: 1040px;
    padding: 28px 42px;
  }
  .stats__trust strong { font-size: 92px; }
  .stats__trust span { font-size: 30px; }

  /* Spec: suggestion text left, CTA right. */
  .suggest {
    display: flex; align-items: center; justify-content: space-between;
    gap: 40px; text-align: left; padding: 64px 40px;
  }
  .suggest__inner { max-width: var(--container-lg); margin-inline: auto; width: 100%;
    display: flex; align-items: center; justify-content: space-between; gap: 40px; }
  .suggest__text { margin-inline: 0; max-width: 760px; font-size: 22px; }
  .suggest__cta { margin-top: 0; flex: none; }

  .reviews__collage {
    max-width: 1320px;
    grid-template-columns: repeat(8, minmax(0, 1fr));
    gap: 16px;
  }

  /* Trois par ligne, pas quatre : il y a six formateurs. A quatre colonnes,
     la seconde ligne n'en portait que deux et laissait un vide de la moitie
     de la largeur. A trois, les deux lignes sont pleines. */
  .trainers__track { grid-template-columns: repeat(3, minmax(0, 1fr)); }

  .formation-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (min-width: 1440px) {
  .hero { min-height: 900px; padding-inline: 68px; }
  .hero__inner { max-width: 760px; min-height: 666px; }
  .hero__title { font-size: 79px; max-width: 760px; }
  .hero__formation-nav { width: min(100vw - 136px, 1320px); }
  .formation-hero__content {
    padding-top: 132px;
  }
  .formation-hero h1 {
    max-width: 720px;
  }
  .categories { max-width: 1480px; }
  .categories__grid { column-gap: 24px; }
  .category-card { min-height: 300px; padding: 38px 16px 56px; }
  .category-card__icon { width: 108px; height: 118px; }
  .category-card__label { font-size: 16px; }
  .formation-filters,
  .formation-results,
  .formation-browser-grid,
  .formation-empty {
    max-width: 1480px;
  }
  .formation-filters { max-width: 1480px; }
  .formation-browser-grid {
    max-width: 1320px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 28px;
  }
}

/* =============================================================================
   DIPLÔME UNIVERSITAIRE NUTRITION & DIABÉTOLOGIE
   ============================================================================= */
.du-page {
  --du-blue: #005FC4;
  --du-blue-dark: #034294;
  --du-yellow: #F5E02A;
  --du-ink: #101828;
  background: #fff;
}

.du-page .footer {
  margin-top: 0;
}

.du-hero {
  position: relative;
  min-height: 720px;
  isolation: isolate;
  display: flex;
  align-items: flex-end;
  padding: 118px 24px 34px;
  overflow: hidden;
  color: #fff;
  background: var(--du-blue-dark);
}

.du-hero__media {
  position: absolute;
  inset: 0;
  z-index: -2;
  background:
    linear-gradient(180deg, rgba(3, 66, 148, .16) 0%, rgba(3, 66, 148, .08) 46%, rgba(0, 95, 196, .80) 100%),
    url("/assets/images/du/du-nutrition-diabetologie-hero-mobile.webp") center top / cover no-repeat;
  transform: none;
  animation: duHeroIn .85s ease both;
}

.du-hero::after {
  content: "";
  position: absolute;
  inset: auto 0 0;
  height: 62%;
  z-index: -1;
  background: linear-gradient(180deg, rgba(0, 36, 104, 0), rgba(0, 65, 160, .78) 34%, rgba(0, 75, 175, .98));
}

.du-hero__content {
  width: min(100%, 520px);
  animation: heroFadeUp .42s ease both;
}

.du-hero__eyebrow {
  max-width: 250px;
  font-size: 12px;
  font-weight: 800;
  line-height: 1.1;
  text-transform: uppercase;
}

.du-hero__partner {
  max-width: 280px;
  margin-top: 4px;
  color: var(--du-yellow);
  font-size: 13px;
  font-weight: 800;
  line-height: 1.1;
  text-transform: uppercase;
}

.du-hero__title {
  margin-top: 14px;
  font-size: clamp(32px, 10vw, 48px);
  font-weight: 900;
  line-height: .92;
  text-transform: uppercase;
}

.du-hero__title span {
  display: block;
  color: var(--du-yellow);
}

.du-hero__meta {
  margin-top: 12px;
  font-size: 14px;
  font-weight: 800;
  text-transform: uppercase;
}

.du-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 46px;
  padding: 0 22px;
  border-radius: 8px;
  text-decoration: none;
  text-align: center;
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
  transition: transform .16s ease, box-shadow .16s ease, filter .16s ease;
}

.du-cta:hover {
  transform: translateY(-1px);
}

.du-cta--yellow {
  margin-top: 18px;
  background: var(--du-yellow);
  color: var(--du-blue-dark);
  box-shadow: 0 14px 30px rgba(0, 0, 0, .18);
}

.du-cta--yellow:hover {
  filter: brightness(.98);
}

.du-section {
  width: min(100% - 38px, 1120px);
  margin: 0 auto;
  padding: 42px 0;
}

.du-intro {
  padding-top: 34px;
}

.du-image-card,
.du-video-card,
.du-phone-card {
  overflow: hidden;
  border-radius: 20px;
  box-shadow: 0 16px 40px rgba(0, 63, 132, .12);
  background: #f3f7fc;
}

.du-image-card img,
.du-video-card img,
.du-phone-card img {
  width: 100%;
}

.du-copy {
  margin-top: 24px;
}

.du-kicker {
  color: var(--du-blue);
  font-size: 13px;
  font-weight: 900;
  line-height: 1.15;
  text-transform: uppercase;
}

.du-kicker--light {
  color: #fff;
}

.du-copy h2,
.du-presence h2,
.du-responsable h2,
.du-impact h2,
.du-fees h2 {
  margin-top: 8px;
  color: var(--du-blue);
  font-size: clamp(28px, 8vw, 40px);
  font-weight: 900;
  line-height: 1.05;
}

.du-copy p {
  margin-top: 14px;
  color: #334155;
  font-size: 16px;
  line-height: 1.68;
}

.du-checks,
.du-price-card ul,
.du-responsable ul {
  margin-top: 18px;
  display: grid;
  gap: 12px;
}

.du-checks li,
.du-price-card li,
.du-responsable li {
  position: relative;
  padding-left: 22px;
  color: #344054;
  font-size: 15px;
  line-height: 1.55;
}

.du-checks li::before,
.du-price-card li::before,
.du-responsable li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .65em;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--du-yellow);
  box-shadow: 0 0 0 4px rgba(245, 224, 42, .18);
}

.du-presence,
.du-responsable {
  background: var(--du-blue);
  color: #fff;
}

.du-presence__inner,
.du-responsable__inner,
.du-reels__inner,
.du-why__inner,
.du-impact__inner {
  width: min(100% - 38px, 1120px);
  margin: 0 auto;
}

/* DU — « Pourquoi investir », version desktop -------------------------------
   Sur mobile ces arguments sont déjà dans la section tarif (.du-fees), qui est
   masquée à partir de 1024px. Ce bloc prend le relais côté desktop ; il reste
   masqué en dessous pour ne pas afficher deux fois le même texte. */
.du-why {
  display: none;
}

/* DU — photos de promotion, pleine largeur, l'une sous l'autre --------------- */
.du-photos {
  display: grid;
  gap: 16px;
  margin-top: 30px;
}
.du-photos img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--radius-md);
}

/* DU — vidéos verticales (format reel) -------------------------------------- */
.du-media-faq {
  background:
    #0759bd
    url("/assets/images/formations/DU-PDF-ASSETS/du-page-background.webp")
    center top / cover no-repeat;
  color: #fff;
}

.du-promotions {
  padding: 46px 0 12px;
}

.du-promotions__inner {
  display: grid;
  gap: 30px;
  width: min(100% - 38px, 1120px);
  margin: 0 auto;
}

.du-promotions__group {
  margin: 0;
}

.du-promotions__group figcaption {
  margin-bottom: 12px;
  color: #fff;
  font-size: clamp(20px, 2.1vw, 28px);
  font-weight: 800;
  line-height: 1.2;
}

.du-promotions__group img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--radius-md);
}

.du-reels {
  padding: 46px 0;
  background: transparent;
}
.du-reels h2 {
  margin: 0;
  color: #fff;
}
.du-reels__lead {
  margin: 10px 0 0;
  color: rgba(255, 255, 255, .84);
}
.du-reels__track {
  /* Mobile : une vidéo par ligne, empilées. Le carrousel horizontal qu'il y
     avait ici cachait cinq des six témoignages derrière un geste que rien
     n'annonçait — en vertical, on les voit toutes en faisant défiler la page.

     Largeur bornée : plein cadre, un format 9/16 ferait 700 px de haut par
     vidéo, soit plus de 4 000 px rien que pour cette section. */
  margin: 24px auto 0;
  padding: 0;
  list-style: none;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 22px;
  justify-items: center;
}
.du-reels__item {
  width: min(100%, 320px);
}
.du-reels__video {
  display: block;
  width: 100%;
  aspect-ratio: 9 / 16;
  object-fit: cover;
  border-radius: var(--radius-md);
  background: #000;
  box-shadow: var(--shadow-card);
}

.du-promotion-gallery {
  padding: 4px 0 50px;
  background: transparent;
}

.du-promotion-gallery__inner {
  width: min(100% - 38px, 1120px);
  margin-inline: auto;
}

.du-promotion-gallery h2 {
  margin: 0 0 24px;
  color: #fff;
}

.du-promotion-gallery__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: 12px;
}

.du-promotion-gallery figure {
  min-width: 0;
  margin: 0;
}

.du-promotion-gallery img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-card);
}

/* DU — questions fréquentes, après les témoignages ------------------------- */
.du-faq {
  padding: 50px 0 64px;
  background: transparent;
}

.du-faq__inner {
  width: min(100% - 38px, 1120px);
  margin-inline: auto;
}

.du-faq h2 {
  max-width: 820px;
  margin: 0;
  color: #fff;
  font-size: clamp(21px, 5.4vw, 30px);
  font-weight: 900;
  line-height: 1.08;
}

.du-faq__list {
  margin-top: 28px;
  border-top: 1px solid rgba(255, 255, 255, .38);
}

.du-faq__item {
  border-bottom: 1px solid rgba(255, 255, 255, .38);
}

.du-faq__item summary {
  position: relative;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) 24px;
  gap: 10px;
  align-items: start;
  padding: 20px 2px;
  color: #fff;
  font-size: clamp(16px, 3.8vw, 18px);
  font-weight: 800;
  line-height: 1.3;
  cursor: pointer;
  list-style: none;
}

.du-faq__item summary::-webkit-details-marker {
  display: none;
}

.du-faq__item summary::after {
  content: "+";
  color: var(--du-yellow);
  font-size: 28px;
  font-weight: 400;
  line-height: .8;
  text-align: center;
  transition: transform .2s ease;
}

.du-faq__item[open] summary::after {
  transform: rotate(45deg);
}

.du-faq__number {
  color: var(--du-yellow);
}

.du-faq__answer {
  display: grid;
  gap: 12px;
  padding: 0 36px 22px;
}

.du-faq__answer p {
  margin: 0;
  color: rgba(255, 255, 255, .9);
  font-size: clamp(15px, 3.9vw, 18px);
  line-height: 1.58;
}

@media (min-width: 768px) {
  /* Deux par ligne, pas trois. Sur desktop cette page s'affiche dans une
     colonne principale étroite (~600px) à côté de la sidebar : à trois
     colonnes chaque vidéo tombait à 177px de large, trop petit pour du 9:16.
     À deux, on est à ~273px de large. */
  .du-reels__track {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    justify-items: stretch;
  }
  .du-reels__item { width: 100%; }
  .du-promotions__inner { gap: 36px; }
  .du-promotion-gallery__grid { gap: 18px; }
  .du-photos { gap: 22px; }
}

.du-presence {
  padding: 46px 0;
}

.du-presence h2 {
  color: #fff;
}

.du-day-grid {
  margin-top: 24px;
  display: grid;
  gap: 14px;
}

.du-day-card {
  min-height: 104px;
  padding: 18px;
  border-radius: 16px;
  background: #fff;
  color: var(--du-blue-dark);
  box-shadow: 0 16px 36px rgba(0, 24, 74, .16);
}

.du-day-card time {
  display: block;
  font-size: 18px;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase;
}

.du-day-card strong {
  display: block;
  margin-top: 10px;
  color: #475467;
  font-size: 13px;
  font-weight: 800;
  line-height: 1.35;
  text-transform: uppercase;
}

.du-video-card {
  position: relative;
}

.du-video-card span {
  position: absolute;
  inset: 50% auto auto 50%;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: rgba(255, 255, 255, .94);
  transform: translate(-50%, -50%);
  box-shadow: 0 10px 28px rgba(0, 33, 90, .24);
}

.du-video-card span::before {
  content: "";
  position: absolute;
  left: 23px;
  top: 18px;
  border-block: 11px solid transparent;
  border-left: 17px solid var(--du-blue);
}

.du-phone-card {
  border-radius: 24px;
  box-shadow: none;
  background: var(--du-blue-dark);
}

.du-responsable {
  padding: 46px 0;
}

.du-responsable figure {
  overflow: hidden;
  border-radius: 20px;
}

.du-responsable img {
  width: 100%;
}

.du-responsable__body {
  margin-top: 24px;
}

.du-responsable h2 {
  color: #fff;
}

.du-responsable p,
.du-responsable li {
  color: rgba(255, 255, 255, .86);
}

.du-responsable p {
  margin-top: 12px;
  font-size: 16px;
  line-height: 1.6;
}

.du-impact {
  padding: 42px 0;
  text-align: center;
}

.du-impact__number {
  color: var(--du-blue);
  font-size: clamp(72px, 20vw, 128px);
  font-weight: 900;
  line-height: .84;
}

.du-impact h2 {
  margin-top: 6px;
  color: var(--du-blue-dark);
  font-size: clamp(22px, 6vw, 34px);
  text-transform: uppercase;
}

.du-impact p {
  max-width: 680px;
  margin: 14px auto 0;
  color: #475467;
  font-size: 16px;
  line-height: 1.65;
}

.du-fees {
  padding-bottom: 56px;
}

.du-price-card {
  margin-top: 26px;
  padding: 24px;
  border-radius: 20px;
  color: #fff;
  background:
    linear-gradient(180deg, rgba(0, 95, 196, .96), rgba(3, 66, 148, 1)),
    var(--du-blue-dark);
  box-shadow: 0 20px 48px rgba(0, 63, 132, .18);
}

.du-price-card span {
  display: block;
  font-size: 13px;
  font-weight: 800;
  text-transform: uppercase;
}

.du-price-card strong {
  display: block;
  margin-top: 6px;
  color: var(--du-yellow);
  font-size: clamp(38px, 10vw, 58px);
  font-weight: 900;
  line-height: 1;
}

.du-price-card p {
  margin-top: 10px;
  font-size: 15px;
  line-height: 1.55;
}

.du-price-card li {
  color: rgba(255, 255, 255, .88);
}

@keyframes duHeroIn {
  from {
    opacity: .82;
    transform: scale(1.025);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

@media (min-width: 768px) {
  .du-hero {
    min-height: 760px;
    padding: 150px 48px 58px;
  }

  .du-hero__media {
    background:
      linear-gradient(90deg, rgba(3, 66, 148, .92) 0%, rgba(3, 66, 148, .66) 38%, rgba(3, 66, 148, .18) 72%),
      linear-gradient(180deg, rgba(3, 66, 148, .12) 0%, rgba(0, 95, 196, .72) 100%),
      url("/assets/images/du/du-nutrition-diabetologie-hero-mobile.webp") center top / cover no-repeat;
  }

  .du-hero__content {
    width: min(100%, 780px);
    max-width: 780px;
  }

  .du-hero__eyebrow,
  .du-hero__partner {
    max-width: none;
    font-size: 15px;
  }

  .du-hero__title {
    font-size: clamp(58px, 5.8vw, 86px);
  }

  .du-hero__meta {
    font-size: 18px;
  }

  .du-cta {
    min-height: 52px;
    padding-inline: 28px;
    font-size: 13px;
  }

  .du-section,
  .du-presence__inner,
  .du-responsable__inner,
  .du-impact__inner {
    width: min(100% - 80px, 1180px);
  }

  .du-section {
    padding-block: 72px;
  }

  .du-intro,
  .du-split,
  .du-fees {
    display: grid;
    grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
    align-items: center;
    gap: 48px;
  }

  .du-split--reverse .du-copy {
    order: 2;
  }

  .du-copy,
  .du-price-card {
    margin-top: 0;
  }

  .du-copy h2,
  .du-presence h2,
  .du-responsable h2,
  .du-fees h2 {
    font-size: 42px;
  }

  .du-day-grid {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }

  .du-day-card {
    min-height: 170px;
    padding: 0;
    overflow: hidden;
  }

  .du-day-card time {
    min-height: 54px;
    padding: 18px 12px 12px;
    background: #EAF1FA;
    color: var(--du-blue-dark);
    font-size: 18px;
  }

  .du-day-card__body {
    min-height: 116px;
    padding: 22px 16px;
    display: grid;
    align-content: center;
  }

  .du-day-card__body span {
    color: #95A9C4;
    font-size: 12px;
    line-height: 1;
    text-transform: uppercase;
  }

  .du-day-card strong {
    margin-top: 8px;
    color: var(--du-blue-dark);
    font-size: 13px;
    line-height: 1.12;
  }

  .du-responsable__inner {
    display: grid;
    grid-template-columns: .9fr 1.1fr;
    align-items: center;
    gap: 48px;
  }

  .du-responsable__body {
    margin-top: 0;
  }

  .du-impact {
    padding: 70px 0;
  }

  .du-impact .du-impact__number {
    font-size: 148px;
  }
}

@media (min-width: 1280px) {
  .du-hero {
    min-height: 860px;
    padding-inline: 72px;
  }

  .du-hero__content {
    width: min(100%, 860px);
    max-width: 860px;
  }

  .du-hero__title {
    font-size: 88px;
  }
}

/* DU mobile reference clone ------------------------------------------------ */
.du-mobile-block,
.du-final-cta {
  width: min(100% - 38px, 1120px);
  margin-inline: auto;
}

.du-elearning-image {
  overflow: hidden;
}

@media (min-width: 768px) {
  .du-hero__poster {
    width: min(100%, 860px);
    animation: heroFadeUp .42s ease both;
  }

  .du-hero__title span {
    color: #fff;
  }

  .du-hero__title small {
    display: block;
    margin-top: 10px;
    color: var(--du-yellow);
    font-size: 44px;
    font-weight: 700;
    line-height: 1;
   }

  .du-hero__partner-band {
    width: fit-content;
    margin-top: 18px;
    padding: 12px 18px;
    background: #fff;
    color: var(--du-blue-dark);
    text-transform: uppercase;
  }

  .du-hero__partner-band span,
  .du-hero__partner-band strong {
    display: block;
    font-size: 18px;
    line-height: 1.05;
  }

  .du-hero__info-band {
    width: fit-content;
    min-width: 520px;
    padding: 18px 22px 22px;
    background: rgba(3, 66, 148, .92);
    color: #fff;
    text-transform: uppercase;
  }

  .du-hero__info-band strong,
  .du-hero__info-band span {
    display: block;
  }

  .du-hero__info-band strong {
    font-size: 20px;
    line-height: 1.1;
  }

  .du-hero__info-band span {
    margin-top: 4px;
    font-size: 15px;
  }

  .du-hero__logos {
    margin-top: 16px;
    display: flex;
    align-items: center;
    gap: 14px;
  }

  .du-hero__logos img {
    width: 128px;
  }

  .du-hero__logos i {
    width: 1px;
    height: 38px;
    background: rgba(255, 255, 255, .8);
  }

  .du-hero__faculty-logo {
    width: 142px;
  }
}

@media (max-width: 767px) {
  .du-page {
    background: #fff;
    overflow-x: hidden;
  }

  .du-page .header {
    height: 13.8vw;
    padding-inline: 3.1vw 4.1vw;
  }

  .du-page .header__logo img {
    width: 41.6vw;
  }

  .du-page .nav-toggle {
    gap: 1.75vw;
    padding: 1.1vw;
    font-size: 4.25vw;
    font-weight: 700;
  }

  .du-page .nav-toggle__bars {
    gap: .78vw;
  }

  .du-page .nav-toggle__bars i {
    width: 5.5vw;
    height: .5vw;
  }

  .du-hero {
    display: block;
    min-height: 165vw;
    padding: 0;
    background: #034294;
  }

  .du-hero__media {
    inset: 0;
    background:
      linear-gradient(180deg, rgba(3, 66, 148, .04) 0%, rgba(3, 66, 148, .16) 55%, rgba(3, 66, 148, .78) 100%),
      url("/assets/images/du/du-nutrition-diabetologie-hero-mobile.webp") center top / cover no-repeat;
    animation: none;
  }

  .du-hero::after {
    display: none;
  }

  .du-hero__poster {
    position: absolute;
    inset: auto 0 0;
    color: #fff;
  }

  .du-hero__title {
    margin: 0;
    padding: 0 6.4vw 2vw;
    color: #fff;
    font-size: 8vw;
    font-weight: 900;
    line-height: .86;
    letter-spacing: 0;
    text-transform: uppercase;
    text-shadow: 0 2px 14px rgba(0, 27, 86, .22);
    overflow-wrap: anywhere;
  }

  .du-hero__title span {
    display: block;
    color: #fff;
  }

  .du-hero__title small {
    display: block;
    margin-top: 1.2vw;
    font-size: 5.25vw;
    font-weight: 500;
    line-height: .94;
    color: #fff;
  }

  .du-hero__partner-band {
    min-height: 13.2vw;
    padding: 2.1vw 6.2vw 1.8vw;
    display: grid;
    align-content: center;
    background: #fff;
    color: #001a72;
    text-transform: uppercase;
  }

  .du-hero__partner-band span {
    font-size: 3.85vw;
    font-weight: 400;
    line-height: .95;
  }

  .du-hero__partner-band strong {
    margin-top: .7vw;
    font-size: 3.85vw;
    font-weight: 900;
    line-height: .95;
  }

  .du-hero__info-band {
    min-height: 30.8vw;
    padding: 3.1vw 6.2vw 4.8vw;
    background: #034294;
    color: #fff;
    text-transform: uppercase;
  }

  .du-hero__info-band strong,
  .du-hero__info-band span {
    display: block;
  }

  .du-hero__info-band strong {
    font-size: 4.05vw;
    font-weight: 900;
    line-height: 1.14;
    max-width: 78vw;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .du-hero__info-band span {
    margin-top: .5vw;
    font-size: 3.35vw;
    font-weight: 500;
    line-height: 1;
  }

  .du-hero__logos {
    margin-top: 2.7vw;
    display: flex;
    align-items: center;
    gap: 2.4vw;
  }

  .du-hero__logos img {
    width: 23.2vw;
  }

  .du-hero__logos i {
    width: .35vw;
    height: 5.4vw;
    background: rgba(255, 255, 255, .86);
  }

  .du-hero__faculty-logo {
    width: 24vw !important;
    max-width: none;
  }

  .du-mobile-block {
    width: 100%;
    padding: 7.6vw 6.1vw;
    background: #fff;
  }

  .du-mobile-block--intro {
    padding-top: 8.5vw;
  }

  .du-image-card,
  .du-elearning-image,
  .du-phone-card {
    border-radius: 5vw;
    box-shadow: none;
    background: transparent;
  }

  .du-image-card img,
  .du-elearning-image img,
  .du-phone-card img {
    width: 100%;
  }

  .du-mobile-copy {
    margin-top: 5.3vw;
  }

  .du-kicker {
    color: #005FC4;
    font-size: 3.15vw;
    font-weight: 900;
    line-height: .98;
    text-transform: uppercase;
  }

  .du-mobile-copy h2,
  .du-presence h2,
  .du-responsable h2,
  .du-fees h2 {
    margin-top: 1vw;
    color: #005FC4;
    font-size: 5.2vw;
    font-weight: 900;
    line-height: 1.02;
    letter-spacing: 0;
    text-transform: uppercase;
  }

  .du-mobile-copy p {
    margin-top: 3.2vw;
    color: #263349;
    font-size: 3.25vw;
    font-weight: 400;
    line-height: 1.45;
  }

  .du-mobile-copy .du-live-note {
    color: #005FC4;
    font-style: italic;
    font-weight: 600;
  }

  .du-bullets,
  .du-responsable ul,
  .du-price-card ul {
    margin-top: 3.6vw;
    display: grid;
    gap: 2.4vw;
  }

  .du-bullets li,
  .du-responsable li,
  .du-price-card li {
    position: relative;
    padding-left: 4.4vw;
    color: #263349;
    font-size: 3.05vw;
    line-height: 1.42;
  }

  .du-bullets li::before,
  .du-responsable li::before,
  .du-price-card li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 1.3vw;
    width: 1.4vw;
    height: 1.4vw;
    border-radius: 50%;
    background: #005FC4;
    box-shadow: none;
  }

  .du-presence {
    padding: 10.8vw 6.9vw 13.9vw;
    background:
      radial-gradient(circle at 50% 50%, rgba(0, 127, 255, .24), rgba(0, 95, 196, 0) 54%),
      linear-gradient(180deg, #034294 0%, #005FC4 100%);
  }

  .du-presence__inner {
    width: 100%;
  }

  .du-presence__header {
    text-align: left;
  }

  .du-presence .du-kicker {
    color: #fff;
    text-align: left;
    font-size: 5.55vw;
    font-weight: 900;
    line-height: .88;
    text-shadow: 0 .4vw 1vw rgba(0, 16, 86, .24);
  }

  .du-presence__subtitle {
    max-width: 74vw;
    margin-top: 1.1vw;
    padding-bottom: 1.25vw;
    border-bottom: .3vw solid rgba(255, 255, 255, .92);
    color: #fff;
    font-size: 2.2vw;
    font-weight: 700;
    line-height: 1.16;
    text-transform: uppercase;
  }

  .du-presence__place {
    margin-top: 1.05vw;
    color: #fff;
    font-size: 2.2vw;
    font-weight: 800;
    line-height: 1;
    text-transform: uppercase;
  }

  .du-presence h2 {
    max-width: 66vw;
    margin: 8.2vw auto 0;
    color: #fff;
    font-size: 4.15vw;
    font-weight: 900;
    line-height: 1.12;
    text-align: center;
    text-transform: none;
    text-shadow: 0 .45vw 1.2vw rgba(0, 18, 98, .25);
  }

  .du-day-grid {
    margin-top: 7.7vw;
    gap: 4.65vw;
  }

  .du-day-card {
    min-height: 25vw;
    padding: 0;
    overflow: hidden;
    border-radius: 4.55vw;
    display: block;
    background: #fff;
    color: #005FC4;
    text-align: center;
    box-shadow: 0 3.4vw 8vw rgba(0, 29, 118, .18);
  }

  .du-day-card time {
    min-height: 8.3vw;
    padding: 2.55vw 2vw 1.7vw;
    display: block;
    background: #EAF1FA;
    color: #00349D;
    font-size: 4vw;
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
  }

  .du-day-card__body {
    min-height: 16.6vw;
    padding: 3.3vw 6vw 3.8vw;
    display: grid;
    align-content: center;
  }

  .du-day-card__body span {
    display: block;
    color: #95A9C4;
    font-size: 2.45vw;
    font-weight: 400;
    line-height: 1;
    text-transform: uppercase;
  }

  .du-day-card strong {
    display: block;
    margin-top: .9vw;
    color: #00349D;
    font-size: 2.75vw;
    font-weight: 900;
    line-height: 1.05;
    text-transform: uppercase;
  }

  .du-elearning-image {
    margin-top: 6vw;
    margin-inline: -3vw;
    width: calc(100% + 6vw);
    padding: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  .du-elearning-image img {
    width: 100%;
    margin-inline: auto;
    border-radius: 2.4vw;
  }

  .du-app-block .du-phone-card {
    margin-top: 4vw;
    border-radius: 0;
    background: transparent;
  }

  .du-responsable {
    padding: 8.6vw 6.1vw 9.5vw;
    background: #005FC4;
  }

  .du-responsable__inner {
    width: 100%;
  }

  .du-responsable figure {
    border-radius: 4.8vw;
    overflow: hidden;
  }

  .du-responsable__body {
    margin-top: 5vw;
  }

  .du-responsable h2,
  .du-responsable .du-kicker {
    color: #fff;
  }

  .du-responsable p,
  .du-responsable li {
    color: rgba(255, 255, 255, .92);
  }

  .du-responsable p {
    margin-top: 2.8vw;
    font-size: 3.2vw;
    line-height: 1.45;
  }

  .du-responsable li::before {
    background: #fff;
  }

  .du-impact {
    padding: 8vw 6.1vw;
  }

  .du-impact__inner {
    width: 100%;
  }

  .du-impact__number {
    color: #005FC4;
    font-size: 18vw;
    font-weight: 900;
    line-height: .78;
  }

  .du-impact h2 {
    color: #005FC4;
    font-size: 4.2vw;
    font-weight: 900;
    line-height: 1.05;
    text-transform: uppercase;
  }

  .du-impact p {
    margin-top: 4vw;
    color: #263349;
    font-size: 3.1vw;
    line-height: 1.48;
  }

  .du-fees {
    padding-top: 2vw;
    padding-bottom: 7vw;
  }

  .du-price-card {
    margin-top: 5vw;
    padding: 4.4vw;
    border-radius: 4vw;
    background: #005FC4;
    box-shadow: none;
    color: #fff;
    text-align: center;
  }

  .du-price-card span {
    font-size: 3.2vw;
    font-weight: 900;
    text-transform: uppercase;
  }

  .du-price-card strong {
    margin-top: 1.5vw;
    color: #FFE925;
    font-size: 7.6vw;
    font-weight: 900;
  }

  .du-price-card p {
    margin-top: 1.8vw;
    font-size: 3vw;
    line-height: 1.35;
  }

  .du-price-card ul {
    text-align: left;
  }

  .du-price-card li {
    color: #fff;
  }

  .du-price-card li::before {
    background: #FFE925;
  }

  .du-cta {
    min-height: 11.2vw;
    padding-inline: 5.5vw;
    border-radius: 1.3vw;
    font-size: 3.35vw;
    font-weight: 900;
  }

  .du-cta--yellow {
    margin-top: 4.6vw;
    background: #FFE925;
    color: #005FC4;
    box-shadow: none;
  }

  .du-final-cta {
    width: 100%;
    padding: 2vw 6.1vw 8vw;
    background: #fff;
    text-align: center;
  }

  .du-final-cta figure {
    overflow: hidden;
    border-radius: 4.8vw;
  }

  .du-final-cta img {
    width: 100%;
  }

  .du-mobile-block {
    background:
      radial-gradient(circle at 48% 52%, rgba(0, 127, 255, .22), rgba(0, 95, 196, 0) 56%),
      linear-gradient(180deg, #034294 0%, #005FC4 100%);
    color: #fff;
  }

  .du-mobile-block--pdf-text .du-image-card {
    display: none;
  }

  .du-mobile-block--pdf-text .du-mobile-copy {
    margin-top: 0;
  }

  .du-mobile-block .du-kicker,
  .du-mobile-block .du-subkicker,
  .du-mobile-block .du-mobile-copy h2,
  .du-mobile-block .du-mobile-copy h3,
  .du-mobile-block .du-mobile-copy p,
  .du-mobile-block .du-bullets li,
  .du-mobile-block .du-checks li {
    color: #fff;
    max-width: 100%;
    overflow-wrap: anywhere;
  }

  .du-mobile-block .du-subkicker {
    margin-top: 1.8vw;
    padding-top: 1.9vw;
    border-top: .3vw solid rgba(255, 255, 255, .55);
    font-size: 4.6vw;
    font-weight: 400;
    line-height: 1;
    text-transform: uppercase;
  }

  .du-mobile-block .du-mobile-copy h2 {
    margin-top: 3.8vw;
    font-size: 7.5vw;
    line-height: 1.04;
    overflow-wrap: anywhere;
  }

  .du-mobile-block--intro .du-mobile-copy h2 {
    font-size: 7.65vw;
  }

  .du-mobile-block .du-mobile-copy h3 {
    margin-top: 7vw;
    font-size: 4.95vw;
    font-weight: 900;
    line-height: 1.22;
  }

  .du-mobile-block .du-mobile-copy p {
    font-size: 4.25vw;
    line-height: 1.28;
  }

  .du-mobile-block .du-mobile-copy .du-lead-strong {
    margin-top: 6vw;
    font-size: 5vw;
    font-weight: 900;
    line-height: 1.18;
  }

  .du-mobile-block .du-bullets,
  .du-mobile-block .du-checks {
    gap: 4vw;
    margin-top: 6vw;
  }

  .du-mobile-block .du-bullets li,
  .du-mobile-block .du-checks li {
    padding-left: 5.2vw;
    font-size: 4.05vw;
    line-height: 1.4;
  }

  .du-mobile-block .du-bullets li::before,
  .du-mobile-block .du-checks li::before {
    top: 1.8vw;
    background: #fff;
  }

  .du-mobile-block .du-live-note {
    margin-top: 5.2vw;
    color: rgba(255, 255, 255, .9);
    font-size: 4vw;
    line-height: 1.2;
  }

  .du-elearning-block .du-mobile-copy h2 {
    margin-top: 1.4vw;
  }

  .du-elearning-block .du-mobile-copy .du-elearning-edition {
    margin-top: 1.5vw;
    font-size: 4.2vw;
    font-weight: 900;
    line-height: 1.1;
    text-transform: uppercase;
  }

  .du-elearning-block .du-mobile-copy .du-elearning-edition strong {
    display: block;
    margin-top: .8vw;
    color: inherit;
  }

  .du-elearning-block .du-mobile-copy p {
    margin-top: 6vw;
    font-size: 4.55vw;
    font-weight: 900;
    line-height: 1.26;
    text-transform: uppercase;
  }

  .du-elearning-block .du-elearning-image {
    margin-top: 0;
    margin-bottom: 7vw;
    order: -1;
  }

  .du-app-block .du-mobile-copy {
    margin-top: 6vw;
  }

  .du-app-block .du-phone-card {
    margin-top: 0;
    order: -1;
  }

  .du-impact {
    padding: 0 0 9vw;
    background: linear-gradient(180deg, #005FC4 0%, #034294 100%);
  }

  .du-impact__inner {
    width: 100%;
    color: #fff;
  }

  .du-impact .du-photos {
    margin: 0;
    gap: 2vw;
    opacity: 1;
  }

  .du-impact .du-photos img {
    width: 100%;
    border-radius: 0;
    filter: none;
  }

  .du-impact .du-impact__number {
    width: min(100% - 12vw, 520px);
    margin: 8vw auto 0;
    color: var(--du-yellow);
    font-size: 18vw;
    font-weight: 900;
    line-height: .85;
    text-shadow: 0 .5vw 2vw rgba(0, 30, 100, .28);
  }

  .du-impact h2 {
    width: min(100% - 12vw, 520px);
    margin: 2.2vw auto 0;
    color: #fff;
    font-size: 6.8vw;
    line-height: 1.04;
    text-wrap: balance;
  }

  .du-fees {
    padding-top: 8vw;
  }

  .du-price-card {
    border: .45vw solid rgba(255, 255, 255, .9);
    background: rgba(0, 48, 140, .22);
  }

  .du-price-card strong {
    color: #fff;
  }

  .du-price-card .du-price-card__media {
    margin-top: 4.6vw;
    color: #fff;
    font-size: 3.8vw;
    font-weight: 700;
    line-height: 1.15;
  }

  .du-final-cta {
    display: none;
  }

  .du-reels h2 {
    color: #fff;
  }

  .du-reels__lead {
    color: rgba(255, 255, 255, .86);
  }
}

@media (min-width: 768px) {
  .du-mobile-block,
  .du-final-cta {
    width: min(100% - 80px, 1180px);
    padding-block: 72px;
  }

  .du-mobile-block {
    display: grid;
    grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
    align-items: center;
    gap: 48px;
  }

  .du-elearning-block {
    display: block;
    max-width: 1046px;
    padding-top: 100px;
    padding-bottom: 96px;
  }

  .du-elearning-block .du-kicker {
    font-size: 32px;
    font-weight: 400;
    line-height: 1;
    letter-spacing: .04em;
  }

  .du-elearning-block .du-mobile-copy h2 {
    max-width: 900px;
    margin-top: 20px;
    font-size: 54px;
    line-height: 1.08;
  }

  .du-elearning-block .du-mobile-copy p {
    max-width: 930px;
    margin-top: 36px;
    font-size: 32px;
    line-height: 1.55;
  }

  .du-mobile-block--intro {
    padding-top: 72px;
  }

  .du-mobile-copy {
    margin-top: 0;
  }

  .du-mobile-copy h2 {
    margin-top: 8px;
    color: var(--du-blue);
    font-size: 42px;
    font-weight: 900;
    line-height: 1.05;
    text-transform: uppercase;
  }

  .du-mobile-copy p {
    margin-top: 14px;
    color: #334155;
    font-size: 16px;
    line-height: 1.68;
  }

  .du-mobile-copy .du-live-note {
    color: var(--du-blue);
    font-style: italic;
    font-weight: 600;
  }

  .du-bullets {
    margin-top: 18px;
    display: grid;
    gap: 12px;
  }

  .du-bullets li {
    position: relative;
    padding-left: 22px;
    color: #344054;
    font-size: 15px;
    line-height: 1.55;
  }

  .du-bullets li::before {
    content: "";
    position: absolute;
    left: 0;
    top: .65em;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--du-yellow);
  }

  .du-elearning-image {
    margin-top: 58px;
    padding: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  .du-elearning-image img {
    width: 100%;
    margin-inline: auto;
    border-radius: 22px;
  }

  .du-final-cta img {
    border-radius: 18px;
  }

  .du-app-block .du-mobile-copy {
    order: 2;
  }

  .du-final-cta {
    display: grid;
    gap: 28px;
    text-align: center;
  }
}

.du-desktop-sidebar {
  display: none;
}

@media (min-width: 1024px) {
  .du-hero {
    min-height: clamp(620px, 40vw, 760px);
    align-items: center;
    padding: 144px max(56px, calc((100vw - 1560px) / 2 + 56px)) 76px;
    background: #034294;
  }

  .du-hero__media {
    background: url("/assets/images/formations/hero-desktop/avignon-01.webp") center top / cover no-repeat;
  }

  .du-hero::after {
    display: none;
  }

  .du-hero__poster {
    width: min(46vw, 720px);
  }

  .du-hero__title {
    margin-top: 0;
    font-size: clamp(58px, 5.9vw, 98px);
    line-height: .88;
    text-shadow: 0 4px 24px rgba(0, 34, 94, .2);
  }

  .du-hero__title small {
    margin-top: 14px;
    color: #fff;
    font-size: clamp(28px, 2.3vw, 42px);
  }

  .du-hero__partner-band {
    margin-top: 22px;
  }

  .du-hero__info-band {
    min-width: min(560px, 100%);
  }

  .du-desktop-shell {
    width: min(100% - 80px, 1560px);
    margin: 72px auto 0;
    display: grid;
    grid-template-columns: minmax(0, 600px) minmax(430px, 520px);
    align-items: start;
    justify-content: center;
    gap: 48px;
  }

  .du-desktop-main {
    min-width: 0;
    display: grid;
    gap: 40px;
  }

  .du-desktop-main > :not(.du-pdf-mobile):not(.du-media-faq) {
    display: none;
  }

  .du-desktop-main > .du-media-faq {
    width: 100%;
  }

  .du-desktop-main .du-faq {
    width: 100%;
    padding: 34px 0 44px;
  }

  .du-desktop-main .du-faq__inner {
    width: calc(100% - 38px);
  }

  .du-desktop-main .du-faq h2 {
    font-size: 27px;
    line-height: 1.1;
  }

  .du-desktop-main .du-faq__list {
    margin-top: 22px;
  }

  .du-desktop-main .du-faq__item summary {
    padding-block: 15px;
    font-size: 15.5px;
  }

  .du-desktop-main .du-faq__answer {
    padding: 0 34px 20px;
  }

  .du-desktop-main .du-faq__answer p {
    font-size: 14px;
  }

  .du-desktop-main > .du-pdf-mobile {
    width: 100%;
    max-width: 600px;
    overflow: hidden;
  }

  .du-desktop-main .du-pdf-sheet--investment {
    height: auto;
    min-height: 0;
    padding-bottom: 8cqw;
  }

  .du-desktop-main .du-pdf-fee-heading,
  .du-desktop-main .du-pdf-fee-row {
    display: none;
  }

  .du-desktop-main > .du-mobile-block,
  .du-desktop-main > .du-final-cta {
    width: 100%;
    margin: 0;
  }

  .du-desktop-main > .du-mobile-block {
    padding: 0;
    display: block;
  }

  .du-desktop-main > .du-mobile-block--intro {
    padding-top: 0;
  }

  .du-desktop-main .du-image-card,
  .du-desktop-main .du-phone-card,
  .du-desktop-main .du-elearning-image {
    width: 100%;
    overflow: hidden;
    border-radius: 16px;
    box-shadow: 0 16px 42px rgba(0, 63, 132, .1);
  }

  .du-desktop-main .du-image-card img,
  .du-desktop-main .du-phone-card img,
  .du-desktop-main .du-elearning-image img {
    width: 100%;
    display: block;
    height: auto;
  }

  .du-desktop-main .du-mobile-copy {
    margin-top: 20px;
  }

  .du-desktop-main .du-kicker {
    font-size: 12px;
    line-height: 1;
  }

  .du-desktop-main .du-mobile-copy h2,
  .du-desktop-main .du-presence h2,
  .du-desktop-main .du-responsable h2,
  .du-desktop-main .du-fees h2 {
    margin-top: 8px;
    font-size: clamp(28px, 2.7vw, 34px);
    line-height: 1.04;
  }

  .du-desktop-main .du-mobile-copy p {
    margin-top: 12px;
    font-size: 16px;
    line-height: 1.58;
  }

  .du-desktop-main .du-bullets {
    margin-top: 16px;
    gap: 10px;
  }

  .du-desktop-main .du-bullets li,
  .du-desktop-main .du-responsable li {
    font-size: 14px;
    line-height: 1.46;
  }

  .du-desktop-main .du-app-block .du-mobile-copy {
    order: initial;
  }

  .du-desktop-main > .du-presence,
  .du-desktop-main > .du-responsable,
  .du-desktop-main > .du-impact,
  .du-desktop-main > .du-fees {
    width: 100%;
    margin: 0;
  }

  .du-desktop-main .du-presence__inner,
  .du-desktop-main .du-responsable__inner,
  .du-desktop-main .du-impact__inner {
    width: 100%;
  }

  .du-desktop-main .du-presence {
    padding: 34px 28px 38px;
    border-radius: 18px;
  }

  .du-desktop-main .du-presence__subtitle {
    max-width: 420px;
    font-size: 12px;
    line-height: 1.25;
  }

  .du-desktop-main .du-presence__place {
    font-size: 12px;
  }

  .du-desktop-main .du-presence h2 {
    max-width: 440px;
    margin: 28px auto 0;
    font-size: 24px;
    line-height: 1.14;
  }

  .du-desktop-main .du-day-grid {
    margin-top: 28px;
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .du-desktop-main .du-day-card {
    min-height: 96px;
    border-radius: 14px;
  }

  .du-desktop-main .du-day-card time {
    min-height: 46px;
    padding: 15px 12px 11px;
    font-size: 17px;
  }

  .du-desktop-main .du-day-card__body {
    min-height: 70px;
    padding: 16px 20px 18px;
  }

  .du-desktop-main .du-day-card__body span {
    font-size: 11px;
  }

  .du-desktop-main .du-day-card strong {
    margin-top: 6px;
    font-size: 13px;
    line-height: 1.14;
  }

  .du-desktop-main .du-responsable {
    padding: 34px 28px 38px;
    border-radius: 18px;
  }

  .du-desktop-main .du-responsable__inner {
    display: block;
  }

  .du-desktop-main .du-responsable__body {
    margin-top: 20px;
  }

  .du-desktop-main .du-responsable p {
    margin-top: 10px;
    font-size: 15px;
    line-height: 1.5;
  }

  .du-desktop-main .du-elearning-block {
    max-width: none;
    padding: 0;
  }

  .du-desktop-main .du-elearning-block .du-mobile-copy h2 {
    max-width: 560px;
    font-size: clamp(30px, 2.8vw, 36px);
    line-height: 1.06;
  }

  .du-desktop-main .du-elearning-block .du-mobile-copy p {
    max-width: 560px;
    margin-top: 14px;
    font-size: 17px;
    line-height: 1.62;
  }

  .du-desktop-main .du-elearning-image {
    margin-top: 24px;
    margin-inline: 0;
    padding: 0;
    background: transparent;
  }

  .du-desktop-main .du-app-block .du-phone-card {
    margin-top: 24px;
  }

  .du-desktop-main .du-impact {
    padding: 38px 28px;
  }

  .du-desktop-main .du-impact__number {
    font-size: 94px;
  }

  .du-desktop-main .du-impact h2 {
    font-size: 24px;
  }

  .du-desktop-main .du-impact p {
    font-size: 15px;
    line-height: 1.52;
  }

  .du-desktop-main .du-fees,
  .du-desktop-main .du-final-cta {
    display: none;
  }

  .du-why {
    display: block;
    padding: 30px 0 6px;
  }

  .du-why h2 {
    margin: 8px 0 0;
    color: var(--color-primary);
    font-size: clamp(28px, 2.7vw, 34px);
    line-height: 1.04;
  }

  .du-desktop-sidebar {
    display: block;
    position: sticky;
    top: 8px;
  }

  .du-sidebar-card {
    padding: 0 18px 18px;
    overflow: hidden;
    border-radius: 0;
    border: 1px solid rgba(0, 95, 196, .12);
    background: #fff;
    box-shadow: 0 18px 56px rgba(0, 54, 135, .1);
  }

  .du-sidebar-trainer {
    margin-inline: -18px;
    overflow: hidden;
    aspect-ratio: 16 / 9;
    border-radius: 0 !important;
    clip-path: inset(0);
  }

  .du-sidebar-trainer img {
    width: 100%;
    height: 100%;
    max-height: none;
    object-fit: cover;
    object-position: center top;
    display: block;
    border-radius: 0 !important;
    transform: scale(1.08);
    transform-origin: center center;
  }

  .du-sidebar-copy {
    margin-top: 14px;
  }

  .du-sidebar-kicker {
    color: #005FC4;
    font-size: 13px;
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
  }

  .du-sidebar-copy h2 {
    margin-top: 8px;
    color: #005FC4;
    font-size: 28px;
    font-weight: 900;
    line-height: 1.02;
    text-transform: uppercase;
  }

  .du-sidebar-copy p {
    margin-top: 7px;
    color: var(--color-text-soft);
    font-size: 16px;
    line-height: 1.42;
  }

  .du-sidebar-facts {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid rgba(0, 95, 196, .16);
    display: grid;
    gap: 9px;
  }

  .du-sidebar-facts li {
    display: grid;
    grid-template-columns: 26px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    color: var(--color-text);
    font-size: 16px;
    line-height: 1.24;
  }

  .du-sidebar-facts span {
    color: #005FC4;
    font-size: 18px;
    line-height: 1;
    text-align: center;
  }

  .du-sidebar-facts .du-sidebar-fact-icon {
    display: block;
    width: 22px;
    height: 22px;
    object-fit: contain;
  }

  .du-sidebar-facts strong {
    font-weight: 800;
  }

  .du-sidebar-dates {
    margin-top: 14px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
  }

  .du-sidebar-dates span {
    padding: 9px 8px;
    border-radius: 10px;
    background: #eef7fc;
    color: #005FC4;
    font-size: 13px;
    font-weight: 900;
    line-height: 1.15;
    text-align: center;
    text-transform: uppercase;
  }

  .du-sidebar-price {
    margin-top: 14px;
    padding: 14px 16px;
    border: 2px solid #005FC4;
  }

  .du-sidebar-price span {
    display: block;
    color: var(--color-text);
    font-size: 15px;
    font-weight: 900;
    line-height: 1;
    text-transform: uppercase;
  }

  .du-sidebar-price strong {
    display: block;
    margin-top: 8px;
    color: #005FC4;
    font-size: 33px;
    font-weight: 900;
    line-height: 1;
  }

  .du-sidebar-price p {
    margin-top: 8px;
    color: var(--color-muted);
    font-size: 14px;
    font-weight: 700;
    line-height: 1.25;
  }

  .du-sidebar-cta {
    display: inline-flex;
    width: 100%;
    min-height: 54px;
    margin-top: 14px;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: var(--du-yellow);
    color: #005FC4;
    font-size: 14px;
    font-weight: 900;
    line-height: 1;
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
    transition: transform .16s ease, filter .16s ease;
  }

  .du-sidebar-cta:hover {
    transform: translateY(-1px);
    filter: brightness(.98);
  }
}

@media (min-width: 1024px) and (max-height: 820px) {
  .du-desktop-shell {
    margin-top: 8px;
  }

  .du-desktop-sidebar {
    top: 8px;
  }

  .du-sidebar-card {
    padding: 0 14px 14px;
  }

  .du-sidebar-trainer {
    margin-inline: -14px;
    aspect-ratio: 16 / 8;
  }

  .du-sidebar-trainer img {
    height: 100%;
    object-fit: cover;
    object-position: center top;
  }

  .du-sidebar-copy {
    margin-top: 10px;
  }

  .du-sidebar-copy h2 {
    font-size: 23px;
  }

  .du-sidebar-copy p,
  .du-sidebar-facts li {
    font-size: 14px;
  }

  .du-sidebar-facts {
    margin-top: 12px;
    padding-top: 12px;
    gap: 7px;
  }

  .du-sidebar-dates {
    margin-top: 12px;
  }

  .du-sidebar-dates span {
    padding: 7px 6px;
    font-size: 11px;
  }

  .du-sidebar-price {
    margin-top: 12px;
    padding: 12px;
  }

  .du-sidebar-price span {
    font-size: 13px;
  }

  .du-sidebar-price strong {
    font-size: 27px;
  }

  .du-sidebar-price p {
    font-size: 12px;
  }

  .du-sidebar-cta {
    min-height: 50px;
    margin-top: 10px;
    font-size: 12px;
  }
}

/* Desktop testimonials keep their original screenshot proportions in a
   single, loose collage instead of being forced into equal cards. */
@media (min-width: 1024px) {
  .reviews {
    padding-inline: 28px;
  }

  .reviews__collage {
    position: relative;
    width: min(100%, 1780px);
    max-width: 1780px;
    height: auto;
    margin: 34px auto 0;
    padding: 42px 22px 60px;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    gap: 0;
    overflow: visible;
  }

  .reviews__item,
  .reviews__item:nth-child(1),
  .reviews__item:nth-child(2),
  .reviews__item:nth-child(3),
  .reviews__item:nth-child(4),
  .reviews__item:nth-child(5),
  .reviews__item:nth-child(6),
  .reviews__item:nth-child(7),
  .reviews__item:nth-child(8) {
    position: relative;
    inset: auto;
    width: clamp(145px, 13.5vw, 235px);
    flex: 0 0 clamp(145px, 13.5vw, 235px);
    margin: 0 0 0 -28px;
    overflow: hidden;
    border-radius: 8px;
    background: transparent;
    transform-origin: center top;
    box-shadow: 0 14px 34px rgba(0, 0, 0, .25);
    transition: transform .2s ease, box-shadow .2s ease;
  }

  .reviews__item:first-child {
    margin-left: 0;
  }

  .reviews__item img {
    display: block;
    width: 100%;
    height: auto;
    object-fit: contain;
    object-position: center top;
  }

  .reviews__item:nth-child(1) { transform: translateY(18px) rotate(-2.5deg); }
  .reviews__item:nth-child(2) { transform: translateY(6px) rotate(2deg); }
  .reviews__item:nth-child(3) { transform: translateY(30px) rotate(-1.5deg); }
  .reviews__item:nth-child(4) { transform: translateY(10px) rotate(2.4deg); }
  .reviews__item:nth-child(5) { transform: translateY(34px) rotate(-2deg); }
  .reviews__item:nth-child(6) { transform: translateY(6px) rotate(1.8deg); }
  .reviews__item:nth-child(7) { transform: translateY(26px) rotate(-1.2deg); }
  .reviews__item:nth-child(8) { transform: translateY(12px) rotate(2.2deg); }

  .reviews__item:hover {
    z-index: 10;
    transform: translateY(-8px) scale(1.035);
    box-shadow: 0 20px 46px rgba(0, 0, 0, .34);
  }
}

/* Participant reviews on formation pages: the mobile layout mirrors the
   homepage's four-image collage; larger screens keep every review visible. */
.formation-testimonials {
  margin: 0 calc(var(--page-pad) * -1);
  padding: 8vw 0 4vw;
  overflow: hidden;
  background: #0049B4;
  color: #fff;
}

.formation-testimonials__inner {
  width: 100%;
  margin-inline: auto;
}

.formation-testimonials h2 {
  padding-inline: var(--page-pad);
  color: #fff;
  font-size: 5.2vw;
  font-weight: 800;
  line-height: 1.08;
  text-align: center;
  text-transform: uppercase;
}

.formation-testimonials__viewport {
  margin-top: 4vw;
  overflow: hidden;
}

.formation-testimonials__viewport::-webkit-scrollbar {
  display: none;
}

.formation-testimonials__track {
  position: relative;
  width: 100%;
  height: 125vw;
}

.formation-testimonials__item {
  position: absolute;
  margin: 0;
  overflow: hidden;
  border-radius: 1vw;
  background: #fff;
  box-shadow: 0 2.5vw 7vw rgba(0, 25, 82, .34);
  cursor: pointer;
}

.formation-testimonials__item:nth-child(1) {
  top: 0;
  left: 2vw;
  width: 38vw;
  transform: rotate(-4deg);
}
.formation-testimonials__item:nth-child(2) {
  top: 1vw;
  right: 2vw;
  width: 39vw;
  transform: rotate(5deg);
}
.formation-testimonials__item:nth-child(3) {
  z-index: 2;
  top: 13vw;
  left: 24vw;
  width: 42vw;
  transform: rotate(-1deg);
}
.formation-testimonials__item:nth-child(4) {
  top: 27vw;
  right: 2vw;
  width: 52vw;
  transform: rotate(7deg);
}

.formation-testimonials__item:nth-child(n + 5) {
  display: none;
}

.formation-testimonials__item:hover,
.formation-testimonials__item:focus {
  z-index: 5;
}

.formation-testimonials__item:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}

.formation-testimonials__item img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: contain;
}

@media (min-width: 768px) {
  .formation-testimonials--mobile-only {
    display: none;
  }

  .formation-testimonials {
    margin: 64px calc(50% - 50vw) 0;
    padding: 60px 40px 76px;
    background: var(--color-primary);
  }

  .formation-testimonials__inner {
    max-width: 1180px;
  }

  .formation-testimonials h2 {
    padding-inline: 0;
    font-size: 34px;
  }

  .formation-testimonials__viewport {
    margin-top: 36px;
    overflow: visible;
  }

  .formation-testimonials__track {
    position: static;
    height: auto;
    width: auto;
    padding: 18px 10px 28px;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    gap: 34px 30px;
  }

  .formation-testimonials__item,
  .formation-testimonials__item:nth-child(1),
  .formation-testimonials__item:nth-child(2),
  .formation-testimonials__item:nth-child(3),
  .formation-testimonials__item:nth-child(4) {
    position: static;
    inset: auto;
    width: 100%;
    border-radius: 10px;
    box-shadow: 0 18px 46px rgba(0, 25, 82, .3);
    transition: transform .2s ease, box-shadow .2s ease;
  }

  .formation-testimonials__item:nth-child(n + 5) {
    display: block;
  }

  .formation-testimonials__item:nth-child(odd) {
    transform: translateY(14px) rotate(-1.1deg);
  }

  .formation-testimonials__item:nth-child(even) {
    transform: translateY(0) rotate(1.1deg);
  }

  .formation-testimonials__item:hover {
    z-index: 2;
    transform: translateY(-7px) scale(1.015);
    box-shadow: 0 24px 58px rgba(0, 25, 82, .38);
  }
}

@media (min-width: 1024px) {
  .formation-testimonials__inner {
    max-width: 1600px;
  }

  .formation-testimonials__track {
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 18px;
  }

  .formation-testimonials__item:nth-child(odd) {
    transform: translateY(8px) rotate(-.7deg);
  }

  .formation-testimonials__item:nth-child(even) {
    transform: translateY(0) rotate(.7deg);
  }

  .formation-testimonials__item:hover {
    transform: translateY(-7px) scale(1.015);
  }
}
