/* ===================================
   IMPORTS DES FICHIERS CSS
   =================================== */

/* Import des styles de blocs */

/**
 * Bloc Avant/Après - Comparateur d'images
 * Styles pour le comparateur d'images avec curseur glissant
 */

.before-after {
    --before-after-border-radius: 8px;
    --before-after-shadow: 0 10px 30px rgba(0, 0, 0, 0.15);
    --before-after-scroller-size: 50px;
    --before-after-scroller-border: 4px solid #fff;
    --before-after-scroller-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
    --before-after-label-bg: rgba(0, 0, 0, 0.7);
    --before-after-label-color: #fff;
    --before-after-label-padding: 8px 16px;
    --before-after-label-border-radius: 20px;
    --before-after-line-color: #fff;
    --before-after-line-width: 2px;
    
    margin: 2rem 0;
}

.before-after__container  {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 1rem;
}

.before-after__title {
    font-size: 2rem;
    font-weight: 700;
    text-align: center;
    margin-bottom: 1rem;
    color: var(--color-heading, #333);
}

.before-after__subtitle {
    text-align: center;
    margin-bottom: 2rem;
    color: var(--color-text, #666);
    line-height: 1.6;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}

.before-after__wrapper {
    position: relative;
    width: 100%;
    max-width: 900px;
    margin: 0 auto;
    border-radius: var(--before-after-border-radius);
    overflow: hidden;
    box-shadow: var(--before-after-shadow);
    background-color: #f8f9fa;
    /* Fallback si aspect-ratio non supporté */
    height: auto;
}

/* S'assurer que le wrapper garde la hauteur des images si pas d'aspect-ratio inline */

.before-after__wrapper::before {
    content: '';
    display: block;
    padding-top: 56.25%; /* 16/9 par défaut, sera écrasé par aspect-ratio inline */
}

.before-after__image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.before-after__image--before {
    z-index: 1;
}

.before-after__image--after {
    z-index: 2;
    width: 50%; /* Position initiale */
}

.before-after__content-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    /* Aligner le contenu sur la gauche pour éviter l'effet de glissement en réduisant la largeur */
    -o-object-position: left center;
       object-position: left center;
    display: block;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
    -webkit-user-drag: none;
}

/* Renforcer l'ancrage à gauche sur la couche "après" */

.before-after__image--after .before-after__content-image {
    -o-object-position: left center;
       object-position: left center;
}

/* Optionnel: même ancrage sur la couche "avant" pour une symétrie parfaite */

.before-after__image--before .before-after__content-image {
    -o-object-position: left center;
       object-position: left center;
}

/* Performance hint pour le redimensionnement de la couche "après" */

.before-after__image--after {
    will-change: width;
}

.before-after__label {
    position: absolute;
    top: 12px;
    padding: var(--before-after-label-padding);
    background: var(--before-after-label-bg);
    color: var(--before-after-label-color);
    border-radius: var(--before-after-label-border-radius);
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    z-index: 10; /* au-dessus des images et de la ligne du scroller */
    pointer-events: none; /* ne pas gêner le drag du scroller */
}

.before-after__label--after,
.before-after__label--before {
    left: 12px;
    width: -moz-fit-content;
    width: fit-content;
}

.before-after__scroller {
    position: absolute;
    top: 50%;
    left: calc(50% - 25px);
    width: var(--before-after-scroller-size);
    height: var(--before-after-scroller-size);
    transform: translateY(-50%);
    background: transparent;
    border: var(--before-after-scroller-border);
    border-radius: 50%;
    cursor: grab;
    z-index: 20;
    box-shadow: var(--before-after-scroller-shadow);
    transition: all 0.2s ease;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
    touch-action: none;
}

.before-after__scroller:hover {
    transform: translateY(-50%) scale(1.1);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.4);
}

.before-after__scroller--active {
    cursor: grabbing;
    transform: translateY(-50%) scale(1.1);
}

.before-after__scroller-thumb {
    width: 100%;
    height: 100%;
    padding: 8px;
    box-sizing: border-box;
}

.before-after__scroller-line {
    position: absolute;
    top: 100%;
    left: 50%;
    width: var(--before-after-line-width);
    height: 9999px;
    background: var(--before-after-line-color);
    transform: translateX(-50%);
    z-index: 15;
}

.before-after__scroller-line::before {
    content: '';
    position: absolute;
    bottom: 100%;
    left: 50%;
    width: var(--before-after-line-width);
    height: 9999px;
    background: var(--before-after-line-color);
    transform: translateX(-50%);
}

.before-after__instructions {
    text-align: center;
    margin-top: 1.5rem;
    color: var(--color-text-muted, #888);
    font-size: 0.875rem;
    font-style: italic;
}

.before-after__error {
    padding: 2rem;
    background: #f8d7da;
    border: 1px solid #f5c6cb;
    border-radius: var(--before-after-border-radius);
    color: #721c24;
    text-align: center;
}

/* Responsive Design */

@media (max-width: 768px) {
    .before-after__title {
        font-size: 1.5rem;
    }
    
    .before-after__subtitle {
        font-size: 0.9rem;
        margin-bottom: 1.5rem;
    }
    
    .before-after__wrapper {
        max-width: 100%;
        border-radius: 6px;
    }
    
    .before-after__label {
        top: 10px;
        padding: 6px 12px;
        font-size: 0.75rem;
    }
    
    .before-after__label--before {
        left: 10px;
    }
    
    .before-after__label--after {
        right: 10px;
    }
    
    .before-after__scroller {
        width: 40px;
        height: 40px;
        border-width: 3px;
    }
    
    .before-after__scroller-thumb {
        padding: 6px;
    }
    
    .before-after__instructions {
        font-size: 0.8rem;
        margin-top: 1rem;
    }
}

@media (max-width: 480px) {
    .before-after__title {
        font-size: 1.25rem;
    }
    
    .before-after__subtitle {
        font-size: 0.85rem;
        margin-bottom: 1rem;
    }
    
    .before-after__label {
        top: 8px;
        padding: 4px 8px;
        font-size: 0.7rem;
    }
    
    .before-after__label--before {
        left: 8px;
    }
    
    .before-after__label--after {
        right: 8px;
    }
    
    .before-after__scroller {
        width: 36px;
        height: 36px;
        border-width: 2px;
    }
    
    .before-after__scroller-thumb {
        padding: 5px;
    }
}

/* États de focus pour l'accessibilité */

.before-after__scroller:focus {
    outline: 2px solid var(--color-primary, #007cba);
    outline-offset: 2px;
}

.before-after__scroller:focus:not(:focus-visible) {
    outline: none;
}

/* Animation d'entrée */

.before-after__wrapper {
    animation: before-after-fade-in 0.6s ease-out;
}

@keyframes before-after-fade-in {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Support pour le mode sombre */

@media (prefers-color-scheme: dark) {
    .before-after {
        --before-after-label-bg: rgba(255, 255, 255, 0.9);
        --before-after-label-color: #333;
        --before-after-scroller-shadow: 0 4px 12px rgba(0, 0, 0, 0.5);
    }
    
    .before-after__title {
        color: var(--color-heading-dark, #fff);
    }
    
    .before-after__subtitle {
        color: var(--color-text-dark, #ccc);
    }
    
    .before-after__instructions {
        color: var(--color-text-muted-dark, #aaa);
    }
}

/* Support pour les préférences de réduction de mouvement */

@media (prefers-reduced-motion: reduce) {
    .before-after__scroller {
        transition: none;
    }
    
    .before-after__wrapper {
        animation: none;
    }
    
    .before-after__scroller:hover {
        transform: translateY(-50%);
    }
}

/* ===================================
   BLOG — LATEST POSTS
   =================================== */

.blog-latest {
    background-color: #ffffff;
}

.blog-latest__container {
    margin: 0 auto;
    max-width: 1280px; /* max-w-7xl */
    padding: 5rem 1.5rem; /* py-20 px-6 */
}

/* Titre */

.blog-latest__title {
    text-align: center;
    font-size: 1.875rem; /* text-3xl */
    font-weight: 600; /* font-semibold */
    letter-spacing: -0.025em; /* tracking-tight */
    color: #111827; /* text-gray-900 */
    margin: 0 0 3rem 0; /* mb-12 */
    line-height: 1.2;
}

/* Grille des articles */

.blog-latest__grid {
    display: grid;
    gap: 2rem; /* gap-8 */
    grid-template-columns: 1fr;
}

@media (min-width: 640px) {
    .blog-latest__grid {
        grid-template-columns: repeat(2, 1fr); /* sm:grid-cols-2 */
    }
}

@media (min-width: 1024px) {
    .blog-latest__grid {
        grid-template-columns: repeat(3, 1fr); /* lg:grid-cols-3 */
    }
}

/* Article individuel */

.blog-latest__article {
    background-color: #ffffff;
    border-radius: 1rem; /* rounded-2xl */
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); /* shadow-md */
    border: 1px solid #e5e7eb; /* border */
    overflow: hidden;
    transition: all 0.2s ease;
    height: -moz-fit-content;
    height: fit-content;
}

.blog-latest__article:hover {
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); /* hover:shadow-xl */
    transform: translateY(-4px);
}

/* Image de l'article */

.blog-latest__image {
    width: 100%;
    height: 12rem; /* h-48 */
    overflow: hidden;
}

.blog-latest__image-link {
    display: block;
    width: 100%;
    height: 100%;
}

.blog-latest__thumbnail {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    transition: transform 0.2s ease;
}

.blog-latest__article:hover .blog-latest__thumbnail {
    transform: scale(1.05);
}

/* Contenu de l'article */

.blog-latest__content {
    padding: 1.5rem; /* p-6 */
}

/* Métadonnées */

.blog-latest__meta {
    display: flex;
    align-items: center;
    gap: 0.75rem; /* gap-3 */
    margin-bottom: 0.75rem; /* mb-3 */
    flex-wrap: wrap;
}

.blog-latest__date {
    font-size: 0.75rem; /* text-xs */
    color: #6b7280; /* text-gray-500 */
    font-weight: 500;
}

.blog-latest__category {
    font-size: 0.75rem; /* text-xs */
    font-weight: 600; /* font-semibold */
    color: var(--accent-color); /* text-indigo-600 */
    background-color: #eef2ff; /* bg-indigo-50 */
    padding: 0.25rem 0.5rem; /* py-1 px-2 */
    border-radius: 0.375rem; /* rounded-md */
}

/* Titre de l'article */

.blog-latest__article-title {
    margin: 0 0 0.75rem 0; /* mb-3 */
}

.blog-latest__article-link {
    font-size: 1.125rem; /* text-lg */
    font-weight: 600; /* font-semibold */
    color: #111827; /* text-gray-900 */
    text-decoration: none;
    line-height: 1.3;
    transition: color 0.2s ease;
}

.blog-latest__article-link:hover {
    color: var(--accent-color); /* hover:text-indigo-600 */
    text-decoration: none;
}

.blog-latest__article-link:focus {
    outline: 2px solid var(--accent-color);
    outline-offset: 2px;
    border-radius: 0.25rem;
}

/* Extrait de l'article */

.blog-latest__excerpt {
    color: #4b5563; /* text-gray-600 */
    line-height: 1.6;
    margin: 0 0 1rem 0; /* mb-4 */
    font-size: 0.875rem; /* text-sm */
}

/* Lien "Lire la suite" */

.blog-latest__read-more {
    margin-top: auto;
}

.blog-latest__link {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem; /* gap-1 */
    font-size: 0.875rem; /* text-sm */
    font-weight: 600; /* font-semibold */
    color: var(--accent-color); /* text-indigo-600 */
    text-decoration: none;
    transition: all 0.2s ease;
}

.blog-latest__link:hover {
    color: var(--accent-hover); /* hover:text-indigo-500 */
    text-decoration: none;
    gap: 0.5rem; /* Animation du gap */
}

.blog-latest__link:focus {
    outline: 2px solid var(--accent-color);
    outline-offset: 2px;
    border-radius: 0.25rem;
}

/* Bouton d'action */

.blog-latest__action {
    text-align: center;
    margin-top: 3rem; /* mt-12 */
}

.blog-latest__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.375rem; /* rounded-md */
    background-color: #111827; /* bg-gray-900 */
    padding: 0.75rem 1.5rem; /* py-3 px-6 */
    font-size: 0.875rem; /* text-sm */
    font-weight: 600; /* font-semibold */
    color: #ffffff;
    text-decoration: none;
    transition: all 0.2s ease;
    border: 2px solid transparent;
}

.blog-latest__button:hover {
    background-color: #1f2937; /* hover:bg-gray-800 */
    text-decoration: none;
    transform: translateY(-1px);
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

.blog-latest__button:focus {
    outline: 2px solid var(--accent-color);
    outline-offset: 2px;
}

.blog-latest__button:active {
    transform: translateY(0);
}

/* État vide */

.blog-latest__empty {
    text-align: center;
    padding: 3rem;
    background-color: #f9fafb;
    border: 2px dashed #d1d5db;
    border-radius: 1rem;
    color: #6b7280;
}

.blog-latest__empty p {
    margin: 0;
    font-weight: 500;
}

/* Responsive mobile */

@media (max-width: 640px) {
    .blog-latest__container {
        padding: 3rem 1rem;
    }
    
    .blog-latest__title {
        font-size: 1.5rem;
        margin-bottom: 2rem;
    }
    
    .blog-latest__grid {
        gap: 1.5rem;
    }
    
    .blog-latest__content {
        padding: 1.25rem;
    }
    
    .blog-latest__image {
        height: 10rem;
    }
    
    .blog-latest__meta {
        flex-direction: column;
        align-items: flex-start;
        gap: 0.5rem;
    }
    
    .blog-latest__action {
        margin-top: 2rem;
    }
    
    .blog-latest__button {
        width: 100%;
        max-width: 300px;
    }
}

/* Grille adaptative selon le nombre d'articles */

.blog-latest__grid[data-count="1"] {
    grid-template-columns: 1fr;
    max-width: 400px;
    margin: 0 auto;
}

.blog-latest__grid[data-count="2"] {
    grid-template-columns: 1fr;
}

@media (min-width: 640px) {
    .blog-latest__grid[data-count="2"] {
        grid-template-columns: repeat(2, 1fr);
        max-width: 800px;
        margin: 0 auto;
    }
}

/* Accessibilité */

@media (prefers-reduced-motion: reduce) {
    .blog-latest__article,
    .blog-latest__thumbnail,
    .blog-latest__link,
    .blog-latest__button {
        transition: none;
    }
    
    .blog-latest__article:hover,
    .blog-latest__button:hover,
    .blog-latest__button:active {
        transform: none;
    }
    
    .blog-latest__article:hover .blog-latest__thumbnail {
        transform: none;
    }
}

/**
 * Carousel avec Lightbox - Styles CSS
 * Utilise Swiper.js
 * 
 * @package Npru\Theme
 * @since 1.0.0
 */

/* ====================
   Variables CSS
   ==================== */

:root {
  --carousel-gap: 20px;
  --carousel-border-radius: 8px;
  --carousel-overlay-bg: rgba(0, 0, 0, 0.3);
  --carousel-overlay-hover-bg: rgba(0, 0, 0, 0.5);
  --carousel-nav-size: 44px;
  --carousel-nav-color: #fff;
  --carousel-nav-bg: rgba(0, 0, 0, 0.7);
  --carousel-nav-hover-bg: rgba(0, 0, 0, 0.9);
  --lightbox-bg: rgba(0, 0, 0, 0.95);
  --lightbox-nav-size: 60px;
  --lightbox-close-size: 40px;
  --lightbox-z-index: 9999;
  --transition-fast: 0.2s ease;
  --transition-normal: 0.3s ease;
}

/* ====================
   Bloc Carousel
   ==================== */

.carousel-lightbox {
  margin: 2rem 0;
}

.carousel-lightbox__container {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 1rem;
}

.carousel-lightbox__title {
  font-size: 2rem;
  font-weight: 600;
  margin-bottom: 1.5rem;
  text-align: center;
  color: #333;
}

.carousel-lightbox__wrapper {
  position: relative;
}

/* ====================
   Swiper Customization
   ==================== */

.carousel-lightbox .swiper {
  padding: 0;
  margin: 0;
  overflow: hidden; /* Cache les slides adjacentes */
}

.carousel-lightbox .swiper-wrapper {
  display: flex;
  align-items: stretch;
}

.carousel-lightbox .swiper-slide {
  height: auto;
  display: flex;
}

/* ====================
   Slides du Carousel
   ==================== */

.carousel-lightbox__slide {
  position: relative;
  width: 100%;
  height: 300px;
  border-radius: var(--carousel-border-radius);
  overflow: hidden;
  background: #f5f5f5;
  transition: transform var(--transition-fast);
}

.carousel-lightbox__slide:hover {
  transform: translateY(-2px);
}

.carousel-lightbox__image-button {
  position: relative;
  width: 100%;
  height: 100%;
  border: none;
  background: none;
  padding: 0;
  cursor: pointer;
  display: block;
  overflow: hidden;
}

.carousel-lightbox__image {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  transition: transform var(--transition-normal);
}

.carousel-lightbox__image-button:hover .carousel-lightbox__image {
  transform: scale(1.05);
}

/* ====================
   Overlay et icône zoom
   ==================== */

.carousel-lightbox__overlay {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: var(--carousel-overlay-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity var(--transition-fast);
}

.carousel-lightbox__image-button:hover .carousel-lightbox__overlay,
.carousel-lightbox__image-button:focus .carousel-lightbox__overlay {
  opacity: 1;
}

.carousel-lightbox__zoom-icon {
  width: 48px;
  height: 48px;
  color: white;
  filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.3));
}

/* ====================
   Légendes des slides
   ==================== */

.carousel-lightbox__slide-caption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.7));
  color: white;
  padding: 1rem;
  transform: translateY(100%);
  transition: transform var(--transition-fast);
}

.carousel-lightbox__slide:hover .carousel-lightbox__slide-caption {
  transform: translateY(0);
}

.carousel-lightbox__slide-caption p {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.4;
}

/* ====================
   Navigation Swiper
   ==================== */

.carousel-lightbox__nav {
  position: absolute;
  width: var(--carousel-nav-size);
  height: var(--carousel-nav-size);
  background: var(--carousel-nav-bg);
  border-radius: 50%;
  color: var(--carousel-nav-color);
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all var(--transition-fast);
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
}

.carousel-lightbox__nav:hover {
  background: var(--carousel-nav-hover-bg);
  transform: translateY(-50%) scale(1.1);
}

.carousel-lightbox__nav::after {
  font-size: 18px;
  font-weight: bold;
}

.carousel-lightbox__nav.swiper-button-disabled {
  opacity: 0.3;
  cursor: not-allowed;
}

.carousel-lightbox__nav.swiper-button-disabled:hover {
  background: var(--carousel-nav-bg);
  transform: translateY(-50%) scale(1);
}

/* ====================
   Pagination Swiper
   ==================== */

.carousel-lightbox__pagination {
  position: relative;
  margin-top: 1.5rem;
  text-align: center;
}

.carousel-lightbox__pagination .swiper-pagination-bullet {
  width: 12px;
  height: 12px;
  background: #ccc;
  opacity: 1;
  transition: all var(--transition-fast);
}

.carousel-lightbox__pagination .swiper-pagination-bullet-active {
  background: #007cba;
  transform: scale(1.2);
}

/* ====================
   Lightbox Modal
   ==================== */

.carousel-lightbox__modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: var(--lightbox-z-index);
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--transition-normal), visibility var(--transition-normal);
}

.carousel-lightbox__modal[aria-hidden="false"] {
  opacity: 1;
  visibility: visible;
}

.carousel-lightbox__modal-backdrop {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--lightbox-bg);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2rem;
}

.carousel-lightbox__modal-content {
  position: relative;
  max-width: 90vw;
  max-height: 90vh;
  display: flex;
  flex-direction: column;
  align-items: center;
}

/* ====================
   Bouton fermer lightbox
   ==================== */

.carousel-lightbox__modal-close {
  position: absolute;
  top: -60px;
  right: 0;
  width: var(--lightbox-close-size);
  height: var(--lightbox-close-size);
  background: rgba(255, 255, 255, 0.9);
  border: none;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all var(--transition-fast);
  z-index: 10;
}

.carousel-lightbox__modal-close:hover {
  background: white;
  transform: scale(1.1);
}

.carousel-lightbox__close-icon {
  width: 20px;
  height: 20px;
  color: #333;
}

/* ====================
   Navigation lightbox
   ==================== */

.carousel-lightbox__modal-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: var(--lightbox-nav-size);
  height: var(--lightbox-nav-size);
  background: rgba(255, 255, 255, 0.9);
  border: none;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all var(--transition-fast);
  z-index: 10;
}

.carousel-lightbox__modal-nav:hover {
  background: white;
  transform: translateY(-50%) scale(1.1);
}

.carousel-lightbox__modal-nav--prev {
  left: -80px;
}

.carousel-lightbox__modal-nav--next {
  right: -80px;
}

.carousel-lightbox__modal-nav svg {
  width: 24px;
  height: 24px;
  color: #333;
}

/* ====================
   Image lightbox
   ==================== */

.carousel-lightbox__modal-image-container {
  position: relative;
  max-width: 100%;
  max-height: 70vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

.carousel-lightbox__modal-image {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  border-radius: var(--carousel-border-radius);
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.3);
}

/* ====================
   Légende et compteur lightbox
   ==================== */

.carousel-lightbox__modal-caption {
  margin-top: 1rem;
  max-width: 600px;
  text-align: center;
}

.carousel-lightbox__modal-caption p {
  color: white;
  font-size: 1rem;
  line-height: 1.5;
  margin: 0;
}

.carousel-lightbox__modal-counter {
  margin-top: 0.5rem;
  color: rgba(255, 255, 255, 0.8);
  font-size: 0.9rem;
  font-weight: 500;
}

/* ====================
   État body avec modal ouverte
   ==================== */

body.carousel-lightbox-modal-open {
  overflow: hidden;
}

/* ====================
   Empty state
   ==================== */

.carousel-lightbox__empty {
  padding: 3rem;
  text-align: center;
  background: #f8f9fa;
  border-radius: var(--carousel-border-radius);
  border: 2px dashed #dee2e6;
}

.carousel-lightbox__empty p {
  margin: 0;
  color: #6c757d;
  font-style: italic;
}

/* ====================
   Responsive Design
   ==================== */

@media (max-width: 768px) {
  .carousel-lightbox .swiper {
    padding: 0 30px;
    margin: 0 -30px;
  }
  
  .carousel-lightbox__nav {
    width: 36px;
    height: 36px;
  }
  
  .carousel-lightbox__nav::after {
    font-size: 14px;
  }
  
  .carousel-lightbox__modal-backdrop {
    padding: 1rem;
  }
  
  .carousel-lightbox__modal-close {
    top: -50px;
    width: 36px;
    height: 36px;
  }
  
  .carousel-lightbox__close-icon {
    width: 18px;
    height: 18px;
  }
  
  .carousel-lightbox__modal-nav {
    width: 48px;
    height: 48px;
  }
  
  .carousel-lightbox__modal-nav--prev {
    left: -60px;
  }
  
  .carousel-lightbox__modal-nav--next {
    right: -60px;
  }
  
  .carousel-lightbox__modal-image-container {
    max-height: 60vh;
  }
  
  .carousel-lightbox__slide {
    height: 200px;
  }
}

@media (max-width: 480px) {
  .carousel-lightbox .swiper {
    padding: 0 20px;
    margin: 0 -20px;
  }
  
  .carousel-lightbox__nav {
    width: 32px;
    height: 32px;
  }
  
  .carousel-lightbox__modal-nav--prev {
    left: 10px;
  }
  
  .carousel-lightbox__modal-nav--next {
    right: 10px;
  }
  
  .carousel-lightbox__modal-close {
    top: 10px;
    right: 10px;
  }
  
  .carousel-lightbox__slide {
    height: 180px;
  }
  
  .carousel-lightbox__title {
    font-size: 1.5rem;
  }
}

/* ====================
   Focus et accessibilité
   ==================== */

.carousel-lightbox__image-button:focus,
.carousel-lightbox__nav:focus,
.carousel-lightbox__modal-close:focus,
.carousel-lightbox__modal-nav:focus {
  outline: 2px solid #007cba;
  outline-offset: 2px;
}

/* Animation d'apparition de la modal */

.carousel-lightbox__modal[aria-hidden="false"] .carousel-lightbox__modal-content {
  animation: lightboxFadeIn 0.3s ease;
}

@keyframes lightboxFadeIn {
  from {
    opacity: 0;
    transform: scale(0.9);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

/* ===================================
   CONTENT — SPLIT (TEXT + MEDIA)
   =================================== */

.content-split {
    background-color: #ffffff;
}

.content-split__container {
    margin: 0 auto;
    max-width: 1280px; /* max-w-7xl */
    display: grid;
    align-items: center;
    gap: 3rem; /* gap-12 */
    padding: 5rem 1.5rem; /* py-20 px-6 */
}

@media (min-width: 1024px) {
    .content-split__container {
        grid-template-columns: 1fr 1fr; /* lg:grid-cols-2 lg:items-center */
    }
}

/* Contenu texte */

.content-split__content {
    order: 1;
}

@media (min-width: 1024px) {
    .content-split__content {
        order: unset;
    }
}

/* Titre */

.content-split__title {
    font-size: 1.875rem; /* text-3xl */
    font-weight: 600; /* font-semibold */
    letter-spacing: -0.025em; /* tracking-tight */
    color: #111827; /* text-gray-900 */
    margin: 0;
    line-height: 1.2;
}

/* Contenu WYSIWYG */

.content-split__wysiwyg {
    margin-top: 1.5rem; /* mt-6 */
    max-width: none;
    color: #374151; /* text-gray-700 */
}

/* Styles prose pour le WYSIWYG */

.content-split__wysiwyg > * {
    margin-bottom: 1rem;
}

.content-split__wysiwyg > *:last-child {
    margin-bottom: 0;
}

.content-split__wysiwyg p {
    line-height: 1.7;
    margin-bottom: 1rem;
}

.content-split__wysiwyg h2,
.content-split__wysiwyg h3,
.content-split__wysiwyg h4 {
    font-weight: 600;
    color: #111827;
    margin-top: 1.5rem;
    margin-bottom: 0.5rem;
    line-height: 1.3;
}

.content-split__wysiwyg h2 {
    font-size: 1.5rem;
}

.content-split__wysiwyg h3 {
    font-size: 1.25rem;
}

.content-split__wysiwyg h4 {
    font-size: 1.125rem;
}

.content-split__wysiwyg ul,
.content-split__wysiwyg ol {
    padding-left: 1.5rem;
    margin-bottom: 1rem;
}

.content-split__wysiwyg li {
    margin-bottom: 0.5rem;
}

.content-split__wysiwyg a {
    color: var(--accent-color);
    text-decoration: underline;
}

.content-split__wysiwyg a:hover {
    color: var(--accent-hover);
}

.content-split__wysiwyg strong {
    font-weight: 600;
    color: #111827;
}

.content-split__wysiwyg blockquote {
    border-left: 4px solid #e5e7eb;
    padding-left: 1rem;
    margin: 1.5rem 0;
    font-style: italic;
    color: #6b7280;
}

/* Action (bouton) */

.content-split__action {
    margin-top: 2rem; /* mt-8 */
}

.content-split__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.375rem; /* rounded-md */
    background-color: #111827; /* bg-gray-900 */
    padding: 0.5rem 1rem; /* py-2 px-4 */
    font-size: 0.875rem; /* text-sm */
    font-weight: 600; /* font-semibold */
    color: #ffffff;
    text-decoration: none;
    transition: all 0.2s ease;
    border: 2px solid transparent;
}

.content-split__button:hover {
    background-color: #1f2937; /* hover:bg-gray-800 */
    text-decoration: none;
    transform: translateY(-1px);
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

.content-split__button:focus {
    outline: 2px solid var(--accent-color);
    outline-offset: 2px;
}

.content-split__button:active {
    transform: translateY(0);
}

/* Section média */

.content-split__media {
    position: relative;
    order: 0;
}

@media (min-width: 1024px) {
    .content-split__media {
        order: unset;
    }
}

.content-split__image {
    width: 100%;
    border-radius: 0.75rem; /* rounded-xl */
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); /* shadow */
    border: 1px solid rgba(17, 24, 39, 0.1); /* ring-1 ring-gray-900/10 */
}

/* Placeholder image */

.content-split__image-placeholder {
    width: 100%;
    height: 300px;
    background-color: #f3f4f6;
    border-radius: 0.75rem;
    border: 2px dashed #d1d5db;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #6b7280;
    font-weight: 500;
}

.content-split__image-placeholder p {
    margin: 0;
}

/* Responsive mobile */

@media (max-width: 1024px) {
    .content-split__container {
        padding: 3rem 1rem;
        gap: 2rem;
    }
    
    .content-split__title {
        font-size: 1.5rem;
    }
    
    .content-split__wysiwyg {
        margin-top: 1rem;
    }
    
    .content-split__action {
        margin-top: 1.5rem;
    }
    
    .content-split__button {
        width: 100%;
        max-width: 300px;
        padding: 0.75rem 1.5rem;
    }
}

/* Accessibilité */

@media (prefers-reduced-motion: reduce) {
    .content-split__button {
        transition: none;
    }
    
    .content-split__button:hover,
    .content-split__button:active {
        transform: none;
    }
}

/* ===================================
   CALL TO ACTION — CENTERED
   =================================== */

.cta-centered {
    background-color: var(--accent-color); /* bg-indigo-600 */
    color: #ffffff;
}

.cta-centered__container {
    margin: 0 auto;
    max-width: 768px; /* max-w-3xl */
    padding: 4rem 1.5rem; /* py-16 px-6 */
    text-align: center;
}

/* Titre */

.cta-centered__title {
    font-size: 1.875rem; /* text-3xl */
    font-weight: 600; /* font-semibold */
    letter-spacing: -0.025em; /* tracking-tight */
    color: #ffffff;
    margin: 0;
    line-height: 1.2;
}

/* Texte */

.cta-centered__text {
    margin-top: 0.75rem; /* mt-3 */
    color: #c7d2fe; /* text-indigo-100 */
    line-height: 1.6;
    margin-bottom: 0;
}

/* Section bouton */

.cta-centered__action {
    margin-top: 2rem; /* mt-8 */
}

/* Bouton */

.cta-centered__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.375rem; /* rounded-md */
    background-color: #ffffff;
    padding: 0.75rem 1.25rem; /* py-3 px-5 */
    font-size: 0.875rem; /* text-sm */
    font-weight: 600; /* font-semibold */
    color: var(--accent-hover); /* text-indigo-700 */
    text-decoration: none;
    transition: all 0.2s ease;
    border: 2px solid transparent;
}

.cta-centered__button:hover {
    background-color: #eef2ff; /* hover:bg-indigo-50 */
    text-decoration: none;
    transform: translateY(-1px);
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

.cta-centered__button:focus {
    outline: 2px solid #ffffff;
    outline-offset: 2px;
}

.cta-centered__button:active {
    transform: translateY(0);
}

/* Placeholder pour l'éditeur */

.cta-centered--placeholder {
    background-color: #f3f4f6;
    color: #374151;
    padding: 2rem;
    text-align: center;
    border: 2px dashed #d1d5db;
    border-radius: 0.5rem;
}

.cta-centered--placeholder p {
    margin: 0;
    font-weight: 500;
}

/* Responsive mobile */

@media (max-width: 640px) {
    .cta-centered__container {
        padding: 3rem 1rem;
    }
    
    .cta-centered__title {
        font-size: 1.5rem;
    }
    
    .cta-centered__button {
        width: 100%;
        max-width: 300px;
        padding: 1rem 1.5rem;
    }
}

/* Accessibilité */

@media (prefers-reduced-motion: reduce) {
    .cta-centered__button {
        transition: none;
    }
    
    .cta-centered__button:hover {
        transform: none;
    }
    
    .cta-centered__button:active {
        transform: none;
    }
}

/* ===================================
   FAQ — DETAILS NATIFS
   =================================== */

.faq-details {
    background-color: #ffffff;
}

.faq-details__container {
    margin: 0 auto;
    max-width: 768px; /* max-w-3xl */
    padding: 5rem 1.5rem; /* py-20 px-6 */
}

/* Titre */

.faq-details__title {
    font-size: 1.875rem; /* text-3xl */
    font-weight: 600; /* font-semibold */
    letter-spacing: -0.025em; /* tracking-tight */
    color: #111827; /* text-gray-900 */
    margin: 0 0 2rem 0; /* mb-8 */
    line-height: 1.2;
}

/* Liste des questions */

.faq-details__items {
    display: flex;
    flex-direction: column;
    gap: 1rem; /* space-y-4 */
}

/* Question individuelle (élément details) */

.faq-details__item {
    border-radius: 0.5rem; /* rounded-lg */
    border: 1px solid #e5e7eb; /* border */
    padding: 1rem; /* p-4 */
    background-color: #ffffff;
    transition: all 0.2s ease;
}

.faq-details__item:hover {
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

.faq-details__item[open] {
    border-color: var(--accent-color);
    box-shadow: 0 0 0 1px var(--accent-color);
}

/* Question (élément summary) */

.faq-details__question {
    cursor: pointer;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none; /* select-none */
    font-size: 0.875rem; /* text-sm */
    font-weight: 600; /* font-semibold */
    color: #111827; /* text-gray-900 */
    line-height: 1.4;
    padding-right: 1rem; /* Pour laisser de la place au chevron natif */
    list-style: none; /* Supprime le triangle par défaut sur certains navigateurs */
}

/* Suppression du triangle par défaut */

.faq-details__question::-webkit-details-marker {
    display: none;
}

.faq-details__question::marker {
    content: none;
}

/* Chevron personnalisé */

.faq-details__question::after {
    content: "▼";
    position: absolute;
    right: 1rem;
    top: 50%;
    transform: translateY(-50%);
    font-size: 0.75rem;
    color: #6b7280;
    transition: transform 0.2s ease;
}

.faq-details__item {
    position: relative;
}

.faq-details__item[open] .faq-details__question::after {
    transform: translateY(-50%) rotate(180deg);
    color: var(--accent-color);
}

/* Survol de la question */

.faq-details__question:hover {
    color: var(--accent-color);
}

/* Réponse */

.faq-details__answer {
    margin-top: 0.5rem; /* mt-2 */
    font-size: 0.875rem; /* text-sm */
    color: #4b5563; /* text-gray-600 */
    line-height: 1.6;
    padding-right: 1rem; /* Pour éviter le chevauchement avec le chevron */
}

.faq-details__answer p {
    margin: 0.5rem 0;
}

.faq-details__answer p:first-child {
    margin-top: 0;
}

.faq-details__answer p:last-child {
    margin-bottom: 0;
}

.faq-details__answer ul,
.faq-details__answer ol {
    margin: 0.5rem 0;
    padding-left: 1.5rem;
}

.faq-details__answer li {
    margin: 0.25rem 0;
}

/* État vide */

.faq-details__empty {
    text-align: center;
    padding: 3rem;
    background-color: #f9fafb;
    border: 2px dashed #d1d5db;
    border-radius: 1rem;
    color: #6b7280;
}

.faq-details__empty p {
    margin: 0;
    font-weight: 500;
}

/* Responsive mobile */

@media (max-width: 640px) {
    .faq-details__container {
        padding: 3rem 1rem;
    }
    
    .faq-details__title {
        font-size: 1.5rem;
    }
    
    .faq-details__item {
        padding: 0.75rem;
    }
    
    .faq-details__question::after {
        right: 0.75rem;
    }
    
    .faq-details__answer {
        padding-right: 0.75rem;
    }
}

/* Accessibilité */

@media (prefers-reduced-motion: reduce) {
    .faq-details__item,
    .faq-details__question::after {
        transition: none;
    }
}

/* Focus visible pour l'accessibilité */

.faq-details__question:focus-visible {
    outline: 2px solid var(--accent-color);
    outline-offset: 2px;
    border-radius: 0.25rem;
}

/* Amélioration pour les lecteurs d'écran */

.faq-details__question[aria-expanded="true"]::after {
    transform: translateY(-50%) rotate(180deg);
}

/* Animation d'ouverture/fermeture (optionnel) */

@media (prefers-reduced-motion: no-preference) {
    .faq-details__answer {
        animation: fadeInUp 0.3s ease-out;
    }
}

@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ===================================
   FEATURES — GRID WITH ICONS
   =================================== */

.features-grid {
    background-color: #ffffff;
}

.features-grid__container {
    margin: 0 auto;
    max-width: 1280px; /* max-w-7xl */
    padding: 5rem 1.5rem; /* py-20 px-6 */
}

/* En-tête */

.features-grid__header {
    margin: 0 auto;
    max-width: 672px; /* max-w-2xl */
    text-align: center;
}

.features-grid__title {
    font-size: 2.25rem; /* text-4xl */
    font-weight: 600; /* font-semibold */
    letter-spacing: -0.025em; /* tracking-tight */
    color: #111827; /* text-gray-900 */
    margin: 0;
    line-height: 1.1;
}

.features-grid__intro {
    margin-top: 1rem; /* mt-4 */
    color: #4b5563; /* text-gray-600 */
    margin-bottom: 0;
    line-height: 1.6;
}

/* Grille des éléments */

.features-grid__items {
    margin-top: 3rem; /* mt-12 */
    display: grid;
    gap: 2rem; /* gap-8 */
    grid-template-columns: 1fr;
}

@media (min-width: 640px) {
    .features-grid__items {
        grid-template-columns: repeat(2, 1fr); /* sm:grid-cols-2 */
    }
}

@media (min-width: 1024px) {
    .features-grid__items {
        grid-template-columns: repeat(3, 1fr); /* lg:grid-cols-3 */
    }
}

/* Élément individuel */

.features-grid__item {
    border-radius: 1rem; /* rounded-2xl */
    border: 1px solid #e5e7eb; /* border */
    padding: 2rem; /* p-8 */
    background-color: #ffffff;
    transition: all 0.2s ease;
}

.features-grid__item:hover {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    transform: translateY(-2px);
}

/* Icône */

.features-grid__icon {
    margin-bottom: 1rem; /* mb-4 */
}

.features-grid__emoji {
    font-size: 3rem; /* text-3xl */
    line-height: 1;
    display: inline-block;
}

.features-grid__image {
    width: 48px;
    height: 48px;
    -o-object-fit: cover;
       object-fit: cover;
    border-radius: 0.5rem;
}

/* Titre de l'élément */

.features-grid__item-title {
    margin-top: 1rem; /* mt-4 */
    font-size: 1.125rem; /* text-lg */
    font-weight: 600; /* font-semibold */
    color: #111827; /* text-gray-900 */
    margin-bottom: 0;
    line-height: 1.4;
}

/* Texte de l'élément */

.features-grid__item-text {
    margin-top: 0.5rem; /* mt-2 */
    font-size: 0.875rem; /* text-sm */
    color: #4b5563; /* text-gray-600 */
    line-height: 1.5;
    margin-bottom: 0;
}

/* État vide */

.features-grid__empty {
    margin-top: 3rem;
    text-align: center;
    padding: 3rem;
    background-color: #f9fafb;
    border: 2px dashed #d1d5db;
    border-radius: 1rem;
    color: #6b7280;
}

.features-grid__empty p {
    margin: 0;
    font-weight: 500;
}

/* Placeholder pour l'éditeur */

.features-grid--placeholder {
    background-color: #f3f4f6;
    color: #374151;
    padding: 2rem;
    text-align: center;
    border: 2px dashed #d1d5db;
    border-radius: 0.5rem;
}

.features-grid--placeholder p {
    margin: 0;
    font-weight: 500;
}

/* Responsive mobile */

@media (max-width: 640px) {
    .features-grid__container {
        padding: 3rem 1rem;
    }
    
    .features-grid__title {
        font-size: 1.875rem;
    }
    
    .features-grid__items {
        margin-top: 2rem;
        gap: 1.5rem;
    }
    
    .features-grid__item {
        padding: 1.5rem;
    }
    
    .features-grid__emoji {
        font-size: 2.5rem;
    }
}

/* Accessibilité */

@media (prefers-reduced-motion: reduce) {
    .features-grid__item {
        transition: none;
    }
    
    .features-grid__item:hover {
        transform: none;
    }
}

/* ===================================
   FEATURES — WITH SCREENSHOT
   =================================== */

.features-screenshot {
    background-color: #111827; /* bg-gray-900 */
    color: #ffffff;
}

.features-screenshot__container {
    margin: 0 auto;
    max-width: 1280px; /* max-w-7xl */
    display: grid;
    gap: 3rem; /* gap-12 */
    padding: 6rem 1.5rem; /* py-24 px-6 */
    align-items: center;
}

@media (min-width: 1024px) {
    .features-screenshot__container {
        grid-template-columns: 1fr 1fr; /* lg:grid-cols-2 */
    }
}

/* Contenu texte */

.features-screenshot__content {
    order: 1;
}

@media (min-width: 1024px) {
    .features-screenshot__content {
        order: unset;
    }
}

/* Surtitre */

.features-screenshot__eyebrow {
    font-size: 1rem; /* text-base */
    font-weight: 600; /* font-semibold */
    color: var(--accent-light); /* text-indigo-400 */
    margin: 0;
}

/* Titre principal */

.features-screenshot__title {
    margin-top: 0.5rem; /* mt-2 */
    font-size: 2.25rem; /* text-4xl */
    font-weight: 600; /* font-semibold */
    color: #ffffff;
    line-height: 1.1;
    margin-bottom: 0;
}

/* Introduction */

.features-screenshot__intro {
    margin-top: 1.5rem; /* mt-6 */
    color: #d1d5db; /* text-gray-300 */
    line-height: 1.6;
    margin-bottom: 0;
}

/* Liste des fonctionnalités */

.features-screenshot__features {
    margin-top: 2.5rem; /* mt-10 */
    display: flex;
    flex-direction: column;
    gap: 1.5rem; /* space-y-6 */
}

/* Fonctionnalité individuelle */

.features-screenshot__feature {
    position: relative;
    padding-left: 1.75rem; /* pl-7 */
}

/* Bullet point */

.features-screenshot__bullet {
    position: absolute;
    left: 0;
    top: 0.25rem; /* top-1 */
    display: inline-block;
    width: 1rem; /* size-4 */
    height: 1rem; /* size-4 */
    border-radius: 0.25rem;
    background-color: var(--accent-opacity-30); /* bg-indigo-400/30 */
}

/* Titre de la fonctionnalité */

.features-screenshot__feature-title {
    font-weight: 600; /* font-semibold */
    color: #ffffff;
    margin: 0;
    line-height: 1.4;
}

/* Texte de la fonctionnalité */

.features-screenshot__feature-text {
    margin-top: 0.25rem;
    color: #d1d5db; /* text-gray-300 */
    line-height: 1.5;
    margin-bottom: 0;
}

/* Section image */

.features-screenshot__image {
    order: 0;
}

@media (min-width: 1024px) {
    .features-screenshot__image {
        order: -1; /* lg:order-first */
        justify-self: end; /* lg:justify-self-end */
    }
}

.features-screenshot__img {
    max-width: 100%;
    border-radius: 0.75rem; /* rounded-xl */
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); /* shadow */
    border: 1px solid rgba(255, 255, 255, 0.1); /* ring-1 ring-white/10 */
}

/* Placeholder image */

.features-screenshot__img-placeholder {
    max-width: 100%;
    height: 300px;
    background-color: #374151;
    border-radius: 0.75rem;
    border: 2px dashed #6b7280;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #9ca3af;
    font-weight: 500;
}

.features-screenshot__img-placeholder p {
    margin: 0;
}

/* Placeholder pour l'éditeur */

.features-screenshot--placeholder {
    background-color: #f3f4f6;
    color: #374151;
    padding: 2rem;
    text-align: center;
    border: 2px dashed #d1d5db;
    border-radius: 0.5rem;
}

.features-screenshot--placeholder p {
    margin: 0;
    font-weight: 500;
}

/* Responsive mobile */

@media (max-width: 1024px) {
    .features-screenshot__container {
        padding: 4rem 1rem;
        gap: 2rem;
    }
    
    .features-screenshot__title {
        font-size: 1.875rem;
    }
    
    .features-screenshot__features {
        margin-top: 2rem;
        gap: 1.25rem;
    }
}

/* ===================================
   GALLERY — MASONRY SIMPLE (CSS GRID)
   =================================== */

.gallery-grid {
    background-color: #ffffff;
}

.gallery-grid__container {
    margin: 0 auto;
    max-width: 1280px; /* max-w-7xl */
    padding: 5rem 1.5rem; /* py-20 px-6 */
}

/* Titre */

.gallery-grid__title {
    text-align: center;
    font-size: 1.875rem; /* text-3xl */
    font-weight: 600; /* font-semibold */
    letter-spacing: -0.025em; /* tracking-tight */
    color: #111827; /* text-gray-900 */
    margin: 0 0 3rem 0; /* mb-12 */
    line-height: 1.2;
}

/* Grille masonry */

.gallery-grid__grid {
    display: grid;
    gap: 1rem; /* gap-4 */
    grid-template-columns: repeat(2, 1fr);
}

.gallery-grid__grid--2-cols {
    grid-template-columns: repeat(2, 1fr);
}

.gallery-grid__grid--3-cols {
    grid-template-columns: repeat(2, 1fr);
}

.gallery-grid__grid--4-cols {
    grid-template-columns: repeat(2, 1fr);
}

.gallery-grid__grid--5-cols {
    grid-template-columns: repeat(2, 1fr);
}

@media (min-width: 640px) {
    .gallery-grid__grid--2-cols {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .gallery-grid__grid--3-cols {
        grid-template-columns: repeat(3, 1fr);
    }
    
    .gallery-grid__grid--4-cols {
        grid-template-columns: repeat(3, 1fr);
    }
    
    .gallery-grid__grid--5-cols {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (min-width: 1024px) {
    .gallery-grid__grid--2-cols {
        grid-template-columns: repeat(2, 1fr);
    }
    
    .gallery-grid__grid--3-cols {
        grid-template-columns: repeat(3, 1fr);
    }
    
    .gallery-grid__grid--4-cols {
        grid-template-columns: repeat(4, 1fr);
    }
    
    .gallery-grid__grid--5-cols {
        grid-template-columns: repeat(5, 1fr);
    }
}

/* Item de la galerie */

.gallery-grid__item {
    position: relative;
    border-radius: 0.75rem; /* rounded-xl */
    overflow: hidden;
    background-color: #f3f4f6; /* bg-gray-100 */
    cursor: pointer;
    transition: all 0.2s ease;
}

.gallery-grid__item:hover {
    transform: scale(1.02);
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

/* Bouton image (pour l'accessibilité) */

.gallery-grid__image-button {
    display: block;
    width: 100%;
    height: 100%;
    border: none;
    background: none;
    padding: 0;
    cursor: pointer;
    position: relative;
}

.gallery-grid__image-button:focus {
    outline: 2px solid var(--accent-color);
    outline-offset: 2px;
}

/* Image */

.gallery-grid__image {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    transition: all 0.2s ease;
}

.gallery-grid__item:hover .gallery-grid__image {
    transform: scale(1.05);
}

/* Overlay au survol */

.gallery-grid__overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: all 0.2s ease;
}

.gallery-grid__item:hover .gallery-grid__overlay {
    opacity: 1;
}

.gallery-grid__zoom-icon {
    width: 2rem; /* w-8 */
    height: 2rem; /* h-8 */
    color: #ffffff;
}

/* Légende */

.gallery-grid__caption {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.8), transparent);
    color: #ffffff;
    padding: 1rem;
    transform: translateY(100%);
    transition: transform 0.2s ease;
}

.gallery-grid__item:hover .gallery-grid__caption {
    transform: translateY(0);
}

.gallery-grid__caption p {
    margin: 0;
    font-size: 0.875rem; /* text-sm */
    line-height: 1.4;
}

/* Modal pour l'affichage en grand */

.gallery-grid__modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 9999;
    display: none; /* Cachée par défaut */
}

.gallery-grid__modal[aria-hidden="false"] {
    display: flex;
}

.gallery-grid__modal-backdrop {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.9);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.gallery-grid__modal-content {
    position: relative;
    max-width: 90vw;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
}

.gallery-grid__modal-close {
    position: absolute;
    top: -3rem;
    right: 0;
    background: none;
    border: none;
    color: #ffffff;
    font-size: 1.5rem;
    cursor: pointer;
    padding: 0.5rem;
    border-radius: 0.375rem;
    transition: background-color 0.2s ease;
}

.gallery-grid__modal-close:hover {
    background-color: rgba(255, 255, 255, 0.1);
}

.gallery-grid__modal-close:focus {
    outline: 2px solid #ffffff;
    outline-offset: 2px;
}

.gallery-grid__close-icon {
    width: 1.5rem;
    height: 1.5rem;
}

.gallery-grid__modal-image {
    max-width: 100%;
    max-height: 80vh;
    -o-object-fit: contain;
       object-fit: contain;
    border-radius: 0.5rem;
}

.gallery-grid__modal-caption {
    margin-top: 1rem;
    text-align: center;
    color: #ffffff;
}

.gallery-grid__modal-caption p {
    margin: 0;
    font-size: 1rem;
    line-height: 1.5;
}

/* État vide */

.gallery-grid__empty {
    text-align: center;
    padding: 3rem;
    background-color: #f9fafb;
    border: 2px dashed #d1d5db;
    border-radius: 1rem;
    color: #6b7280;
}

.gallery-grid__empty p {
    margin: 0;
    font-weight: 500;
}

/* Responsive mobile */

@media (max-width: 640px) {
    .gallery-grid__container {
        padding: 3rem 1rem;
    }
    
    .gallery-grid__title {
        font-size: 1.5rem;
        margin-bottom: 2rem;
    }
    
    .gallery-grid__grid {
        gap: 0.75rem;
    }
    
    .gallery-grid__modal-content {
        max-width: 95vw;
    }
    
    .gallery-grid__modal-close {
        top: -2.5rem;
        font-size: 1.25rem;
    }
    
    .gallery-grid__modal-image {
        max-height: 70vh;
    }
}

/* Accessibilité */

@media (prefers-reduced-motion: reduce) {
    .gallery-grid__item,
    .gallery-grid__image,
    .gallery-grid__overlay,
    .gallery-grid__caption,
    .gallery-grid__modal-close {
        transition: none;
    }
    
    .gallery-grid__item:hover {
        transform: none;
    }
    
    .gallery-grid__item:hover .gallery-grid__image {
        transform: none;
    }
}

/* Styles pour masquer le scrollbar du body quand modal ouverte */

body.gallery-modal-open {
    overflow: hidden;
}

/* Animation d'ouverture de la modal */

.gallery-grid__modal[aria-hidden="false"] .gallery-grid__modal-backdrop {
    animation: fadeIn 0.2s ease-out;
}

.gallery-grid__modal[aria-hidden="false"] .gallery-grid__modal-content {
    animation: scaleIn 0.2s ease-out;
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes scaleIn {
    from {
        transform: scale(0.9);
        opacity: 0;
    }
    to {
        transform: scale(1);
        opacity: 1;
    }
}

/* Désactiver les animations si préférence utilisateur */

@media (prefers-reduced-motion: reduce) {
    .gallery-grid__modal-backdrop,
    .gallery-grid__modal-content {
        animation: none;
    }
}

/* =========================================
   Block: Gallery Slider
   ========================================= */

/* Couleurs converties :
   - Titre  #2D413C à 60%  → sur fond blanc : mix(#2D413C, #fff, 60%) ≈ #7E9691
     Calcul : R=45+(255-45)*0.4=129→81  G=65+(255-65)*0.4=141→8D  B=60+(255-60)*0.4=136→88
     → #81908C  (valeur opaque équivalente sur blanc)
   - Puce inactive #B2B2B1 à 34% → sur fond blanc : mix(#B2B2B1, #fff, 34%)
     R=178+(255-178)*0.66=228→E4  G=178+(255-178)*0.66=228→E4  B=177+(255-177)*0.66=228→E4
     → #E4E4E3
*/

.block-gallery-slider {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    /* Pas d'overflow:hidden ici : les flèches doivent pouvoir dépasser.
       Le masquage des slides est géré par le .swiper lui-même. */
    overflow: visible;
    padding-top: 2rem;
  }

@media (min-width: 768px) {

    .block-gallery-slider {
        padding-top: 100px;
    }
}

/* --- Viewport : ancre les flèches hors du .swiper --- */

.gallery-slider__viewport {
    position: relative;
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

/* --- Swiper container --- */

.gallery-slider-swiper {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    position: relative;
    overflow: hidden; /* masque les slides hors-champ */
  }

/* --- Slide / figure --- */

.gallery-slider__figure {
    margin: 0;
    width: 100%;
  }

.gallery-slider__img {
    width: 100%;
    height: auto;
    display: block;
    -o-object-fit: cover;
       object-fit: cover;

    aspect-ratio: 1267 / 585;
  }

/* --- Caption / Titre --- */

.gallery-slider__caption {
    /* font-primary — remplacez par votre variable ou classe si besoin */
    font-family: var(--font-primary, inherit);
    font-size: 18px;
    font-weight: 400; /* regular */
    color: #81908C; /* #2D413C à 60% opacité sur blanc */
    margin-top: 12px;
    line-height: 1.4;
  }

/* --- Pagination (puces) --- */

.gallery-slider-pagination {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 8px;
    margin-top: 16px;
    position: relative !important; /* override Swiper absolute */
    bottom: auto !important;
    margin-top: 1rem;
    padding-bottom: 50px !important;
  }

@media (min-width: 768px) {

    .gallery-slider-pagination {
        margin-top: -1rem !important;
        padding-bottom: 75px !important;
    }
}

/* Puce de base (inactive) */

.gallery-slider-pagination .swiper-pagination-bullet {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background-color: #E4E4E3; /* #B2B2B1 à 34% sur blanc */
    opacity: 1; /* on ne laisse pas Swiper gérer l'opacité */
    transition: background-color 0.25s ease;
    cursor: pointer;
  }

/* Puce active */

.gallery-slider-pagination .swiper-pagination-bullet-active {
    background-color: #707070;
  }

/* Lien cliquable (lightbox) */

.gallery-slider__link {
    display: block;
    width: 100%;
    cursor: zoom-in;
  }

/* --- Flèches de navigation --- */

.gallery-slider__nav {
    position: absolute;
    top: 50%;
    z-index: 10;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    padding: 0;
    margin: 0;
    transform: translateY(-50%);
    border: none;
    border-radius: 50%;
    background-color: rgba(255, 255, 255, 0.85);
    color: #2D413C;
    cursor: pointer;
    transition: background-color 0.25s ease, color 0.25s ease, opacity 0.25s ease;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
  }

.gallery-slider__nav:hover {
    background-color: #2D413C;
    color: #fff;
  }

.gallery-slider__nav svg {
    width: 24px;
    height: 24px;
    display: block;
  }

.gallery-slider__nav--prev {
    left: -32px;
  }

.gallery-slider__nav--next {
    right: -32px;
  }

.gallery-slider__nav--prev,
  .gallery-slider__nav--next {
    opacity: .5;
  }

.gallery-slider__nav--prev:hover,
  .gallery-slider__nav--next:hover {
    opacity: .85;
  }

.logo-slider-pagination {
    display: none;
  }

.gallery-slider__nav.swiper-button-disabled {
    opacity: 0;
    pointer-events: none;
  }

@media (max-width: 640px) {
    .gallery-slider__nav {
      width: 36px;
      height: 36px;
    }
    .gallery-slider__nav svg {
      width: 20px;
      height: 20px;
    }
    
    .gallery-slider__nav--prev { left: -36px; }
    .gallery-slider__nav--next { right: -36px; }
  }

/* =========================================
   Block: Logo Slider
   ========================================= */

.block-logo-slider {
    width: 100%;
    max-width: 100%;
    overflow: visible;
    padding-top: 0px;
    padding-bottom: 0px;
}

.logo-slider-swiper {
    width: 100%;
    position: relative;
    overflow: hidden; 
}

.logo-slider-swiper .swiper-wrapper {
  display: flex;
  align-items: center;

}

.logo-slider-swiper .swiper-wrapper .swiper-slide {
  max-width: 250px;
  max-height: 150px;
}

.logo-slider__figure {
    margin: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

.logo-slider__img {
    max-width: 100%;
    height: auto;
    max-height: 150px;
    width: auto;
    display: block;
    -o-object-fit: contain !important;
       object-fit: contain !important;
    filter: grayscale(100%);
    opacity: 0.6;
    transition: filter 0.25s ease, opacity 0.25s ease;
}

.logo-slider__img:hover {
    filter: grayscale(0%);
    opacity: 1;
}

/* ===================================
   HERO — CENTERED
   =================================== */

.hero-centered {
    background-color: #111827; /* bg-gray-900 */
    color: #ffffff;
}

.hero-centered__container {
    margin: 0 auto;
    max-width: 768px; /* max-w-3xl */
    padding: 8rem 1.5rem; /* py-32 px-6 */
    text-align: center;
}

/* Surtitre */

.hero-centered__eyebrow {
    font-size: 0.875rem; /* text-sm */
    font-weight: 600; /* font-semibold */
    color: var(--accent-light); /* text-indigo-300 */
    margin: 0;
}

/* Titre principal */

.hero-centered__title {
    margin-top: 0.75rem; /* mt-3 */
    font-size: 3rem; /* text-5xl */
    font-weight: 600; /* font-semibold */
    letter-spacing: -0.025em; /* tracking-tight */
    line-height: 1.1;
    margin-bottom: 0;
}

/* Version responsive du titre */

@media (min-width: 640px) {
    .hero-centered__title {
        font-size: 3.75rem; /* sm:text-6xl */
    }
}

/* Texte d'introduction */

.hero-centered__lead {
    margin-top: 1.5rem; /* mt-6 */
    font-size: 1.125rem; /* text-lg */
    color: #d1d5db; /* text-gray-300 */
    margin-bottom: 0;
    line-height: 1.6;
}

/* Conteneur des boutons */

.hero-centered__actions {
    margin-top: 2.5rem; /* mt-10 */
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem; /* gap-4 */
    flex-wrap: wrap;
}

/* Styles des boutons */

.hero-centered__button {
    text-decoration: none;
    font-size: 0.875rem; /* text-sm */
    font-weight: 600; /* font-semibold */
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.375rem; /* rounded-md */
}

/* Bouton principal */

.hero-centered__button--primary {
    background-color: var(--accent-color); /* bg-indigo-500 */
    color: #ffffff;
    padding: 0.75rem 1.25rem; /* py-3 px-5 */
    border: 2px solid transparent;
}

.hero-centered__button--primary:hover {
    background-color: var(--accent-hover); /* hover:bg-indigo-400 */
    text-decoration: none;
}

.hero-centered__button--primary:focus {
    outline: 2px solid var(--accent-color);
    outline-offset: 2px;
}

/* Bouton secondaire */

.hero-centered__button--secondary {
    color: #ffffff;
    padding: 0.75rem 0;
    background: transparent;
    border: none;
}

.hero-centered__button--secondary:hover {
    color: var(--accent-light); /* text-indigo-300 */
    text-decoration: underline;
}

.hero-centered__button--secondary:focus {
    outline: 2px solid var(--accent-color);
    outline-offset: 2px;
    border-radius: 0.25rem;
}

/* Placeholder pour l'éditeur */

.hero-centered--placeholder {
    background-color: #f3f4f6;
    color: #374151;
    padding: 2rem;
    text-align: center;
    border: 2px dashed #d1d5db;
    border-radius: 0.5rem;
}

.hero-centered--placeholder p {
    margin: 0;
    font-weight: 500;
}

/* Responsive mobile */

@media (max-width: 640px) {
    .hero-centered__container {
        padding: 4rem 1rem; /* Réduction du padding sur mobile */
    }
    
    .hero-centered__title {
        font-size: 2.25rem; /* Plus petit sur mobile */
    }
    
    .hero-centered__actions {
        flex-direction: column;
        gap: 0.75rem;
    }
    
    .hero-centered__button {
        width: 100%;
        max-width: 300px;
        padding: 0.875rem 1.5rem;
    }
}

/* Accessibilité */

@media (prefers-reduced-motion: reduce) {
    .hero-centered__button {
        transition: none;
    }
}

/* Mode sombre (si le thème le supporte) */

@media (prefers-color-scheme: dark) {
    .hero-centered {
        background-color: #000000;
    }
}

/* ===================================
   HERO — SPLIT IMAGE
   =================================== */

.hero-split {        
    background-size: auto 455px;
    background-position: bottom right;
    background-repeat: no-repeat;
    background-color: #F5F5F5;
    padding-bottom: 455px;
    /* Full width */
    width: 100vw;
    margin-left: calc(50% - 50vw);
}

@media screen and (min-width: 968px) {
    .hero-split {
        padding-bottom: 0;
    }
    .home .hero-split {

        background-color: #ffffff;
        background-size: auto 100%; 
        background-position: top right; 
        background-repeat: no-repeat;
        background-color: #F5F5F5;
    }

}

.hero-split__container {
    margin: 0 auto;
    max-width: 1280px; 
    display: grid;
    align-items: center;
    gap: 3rem; 
    padding: 5rem 0; 
}

@media (min-width: 1024px) {
    .hero-split__container {
        grid-template-columns: 1fr 1fr; 
    }
}

@media (max-width: 1280px) {
    .hero-split__container {
        padding: 5rem 2rem; 
    }
}

/* Contenu texte */

.hero-split__content {
    order: 1;
}

@media (min-width: 1024px) {
    .hero-split__content {
        order: unset;
    }
}

/* Surtitre */

.hero-split__eyebrow {
    font-size: 0.875rem; 
    font-weight: 600; 
    color: var(--accent-color); 
    margin: 0;
}

/* Titre principal */

.hero-split__title {
    margin-top: 0.5rem;  
    font-size: 55px;
    line-height: 60px;
    font-weight: 400; 
    color: #000000; 
    margin-bottom: 40px;
}

/* Texte d'introduction */

.hero-split__lead {
    font-family: TT Norms, sans-serif;
    font-size: 22px;
    font-weight: 400;
    line-height: 26px;
}

/* Conteneur des boutons */

.hero-split__actions {
    margin-top: 2rem; 
    display: flex;
    gap: 1rem; 
    flex-wrap: wrap;
}

/* Styles des boutons */

.hero-split__button {
    text-decoration: none;
    font-size: 0.875rem; 
    font-weight: 600; 
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 0.375rem; 
}

/* Bouton principal */

.hero-split__button--primary {
    background-color: #111827; 
    color: #ffffff;
    padding: 0.5rem 1rem; 
    border: 2px solid transparent;
}

.hero-split__button--primary:hover {
    background-color: #1f2937; 
    text-decoration: none;
}

.hero-split__button--primary:focus {
    outline: 2px solid #111827;
    outline-offset: 2px;
}

/* Bouton secondaire */

.hero-split__button--secondary {
    color: #111827; 
    padding: 0.5rem 0;
    background: transparent;
    border: none;
}

.hero-split__button--secondary:hover {
    color: var(--accent-color); 
    text-decoration: underline;
}

.hero-split__button--secondary:focus {
    outline: 2px solid var(--accent-color);
    outline-offset: 2px;
    border-radius: 0.25rem;
}

/* Section image */

.hero-split__image {
    position: relative;
    order: 0;
}

@media (min-width: 1024px) {
    .hero-split__image {
        order: unset;
    }
}

.hero-split__img {
    width: 100%;
    border-radius: 0.75rem; 
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04); 
    border: 1px solid rgba(17, 24, 39, 0.1); 
}

/* Placeholder image */

.hero-split__img-placeholder {
    width: 100%;
    height: 300px;
    background-color: #f3f4f6;
    border-radius: 0.75rem;
    border: 2px dashed #d1d5db;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #6b7280;
    font-weight: 500;
}

.hero-split__img-placeholder p {
    margin: 0;
}

/* Placeholder pour l'éditeur */

.hero-split--placeholder {
    background-color: #f3f4f6;
    color: #374151;
    padding: 2rem;
    text-align: center;
    border: 2px dashed #d1d5db;
    border-radius: 0.5rem;
}

.hero-split--placeholder p {
    margin: 0;
    font-weight: 500;
}

/* Responsive mobile */

@media (max-width: 767px) {
    .hero-split__container {
        padding: 5rem 36px; 
        gap: 2rem;
    }
    
    .hero-split__title {
        font-size: 36px;
        line-height: 46px;
        margin-bottom: 25px;
    }
    
    .hero-split__actions {
        flex-direction: column;
        gap: 0.75rem;
    }
    
    .hero-split__button {
        width: 100%;
        max-width: 300px;
        padding: 0.75rem 1.5rem;
    }
}

/* Accessibilité */

@media (prefers-reduced-motion: reduce) {
    .hero-split__button {
        transition: none;
    }
}

.hero-split__container {
    padding-left: 2.25rem;
    padding-right: 2.25rem;
}

/* ===================================
   BLOC HERO
   =================================== */

.hero-block {
    position: relative;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    color: white;
    overflow: hidden;
}

/* Fond avec overlay */

.hero-block::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(0,0,0,0.3) 0%, rgba(0,0,0,0.6) 100%);
    z-index: 1;
}

/* Contenu du hero */

.hero-block .container {
    position: relative;
    z-index: 2;
}

/* Animations d'entrée */

@keyframes fade-in-up {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-fade-in-up {
    animation: fade-in-up 0.8s ease-out forwards;
}

.hero-block h1 {
    animation-delay: 0.2s;
}

.hero-block p {
    animation-delay: 0.4s;
}

.hero-block a {
    animation-delay: 0.6s;
}

/* Responsive */

@media (max-width: 768px) {
    .hero-block h1 {
        font-size: 2.5rem;
        line-height: 1.2;
    }
    
    .hero-block p {
        font-size: 1.125rem;
        line-height: 1.6;
    }
}

@media (max-width: 480px) {
    .hero-block h1 {
        font-size: 2rem;
    }
    
    .hero-block p {
        font-size: 1rem;
    }
}

/* États de hover pour les boutons */

.hero-block .btn-primary:hover,
.hero-block .btn-secondary:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 25px rgba(0,0,0,0.2);
    transition: all 0.3s ease;
}

.hero-block .btn-outline:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 25px rgba(255,255,255,0.2);
    transition: all 0.3s ease;
}

/* ===================================
   LOGO CLOUD — SIMPLE
   =================================== */

.logo-cloud {
    background-color: #ffffff;
}

.logo-cloud__container {
    margin: 0 auto;
    max-width: 1280px; /* max-w-7xl */
    padding: 4rem 1.5rem; /* py-16 px-6 */
}

/* Surtitre */

.logo-cloud__eyebrow {
    text-align: center;
    font-size: 0.875rem; /* text-sm */
    font-weight: 600; /* font-semibold */
    color: #6b7280; /* text-gray-500 */
    margin: 0 0 2rem 0; /* mb-8 */
    text-transform: uppercase;
    letter-spacing: 0.05em;
}

/* Grille des logos */

.logo-cloud__logos {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* grid-cols-3 par défaut */
    gap: 2rem; /* gap-8 */
    align-items: center;
    justify-items: center;
}

@media (min-width: 640px) {
    .logo-cloud__logos {
        grid-template-columns: repeat(3, 1fr); /* sm:grid-cols-3 */
    }
}

@media (min-width: 1024px) {
    .logo-cloud__logos {
        grid-template-columns: repeat(6, 1fr); /* lg:grid-cols-6 */
    }
}

/* Logo individuel */

.logo-cloud__logo {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 80px;
    transition: all 0.2s ease;
}

.logo-cloud__logo:hover {
    transform: scale(1.05);
}

/* Image du logo */

.logo-cloud__image {
    height: 2rem; /* h-8 */
    width: auto;
    max-width: 100%;
    filter: grayscale(100%);
    opacity: 0.7;
    transition: all 0.2s ease;
    -o-object-fit: contain;
       object-fit: contain;
}

.logo-cloud__logo:hover .logo-cloud__image {
    filter: grayscale(0%);
    opacity: 1;
}

/* État vide */

.logo-cloud__empty {
    text-align: center;
    padding: 3rem;
    background-color: #f9fafb;
    border: 2px dashed #d1d5db;
    border-radius: 1rem;
    color: #6b7280;
}

.logo-cloud__empty p {
    margin: 0;
    font-weight: 500;
}

/* Responsive mobile */

@media (max-width: 640px) {
    .logo-cloud__container {
        padding: 3rem 1rem;
    }
    
    .logo-cloud__logos {
        grid-template-columns: repeat(2, 1fr);
        gap: 1.5rem;
    }
    
    .logo-cloud__logo {
        height: 60px;
    }
    
    .logo-cloud__image {
        height: 1.5rem;
    }
}

/* Variantes selon le nombre de logos */

.logo-cloud__logos[data-count="3"] {
    grid-template-columns: repeat(3, 1fr);
}

.logo-cloud__logos[data-count="4"] {
    grid-template-columns: repeat(4, 1fr);
}

.logo-cloud__logos[data-count="5"] {
    grid-template-columns: repeat(5, 1fr);
}

@media (max-width: 1024px) {
    .logo-cloud__logos[data-count="4"],
    .logo-cloud__logos[data-count="5"],
    .logo-cloud__logos[data-count="6"] {
        grid-template-columns: repeat(3, 1fr);
    }
}

@media (max-width: 640px) {
    .logo-cloud__logos[data-count="3"],
    .logo-cloud__logos[data-count="4"],
    .logo-cloud__logos[data-count="5"],
    .logo-cloud__logos[data-count="6"] {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* Accessibilité */

@media (prefers-reduced-motion: reduce) {
    .logo-cloud__logo,
    .logo-cloud__image {
        transition: none;
    }
    
    .logo-cloud__logo:hover {
        transform: none;
    }
}

/* ===================================
   NEWSLETTER — CENTERED
   =================================== */

.newsletter-centered {
    background-color: #f9fafb; /* bg-gray-50 */
}

.newsletter-centered__container {
    margin: 0 auto;
    max-width: 768px; /* max-w-3xl */
    padding: 5rem 1.5rem; /* py-20 px-6 */
    text-align: center;
}

/* Titre */

.newsletter-centered__title {
    font-size: 1.875rem; /* text-3xl */
    font-weight: 600; /* font-semibold */
    letter-spacing: -0.025em; /* tracking-tight */
    color: #111827; /* text-gray-900 */
    margin: 0;
    line-height: 1.2;
}

/* Texte */

.newsletter-centered__text {
    margin-top: 0.75rem; /* mt-3 */
    color: #4b5563; /* text-gray-600 */
    line-height: 1.6;
    margin-bottom: 0;
}

/* Formulaire */

.newsletter-centered__form {
    margin: 0 auto;
    margin-top: 2rem; /* mt-8 */
    display: flex;
    max-width: 448px; /* max-w-md */
    gap: 0.75rem; /* gap-3 */
    align-items: stretch;
}

/* Champ email */

.newsletter-centered__input {
    min-width: 0;
    flex: 1; /* flex-1 */
    border-radius: 0.375rem; /* rounded-md */
    border: 1px solid #d1d5db;
    padding: 0.5rem 0.75rem; /* py-2 px-3 */
    font-size: 0.875rem; /* text-sm */
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); /* shadow-sm */
    transition: all 0.2s ease;
}

.newsletter-centered__input::-moz-placeholder {
    color: #9ca3af; /* placeholder:text-gray-400 */
}

.newsletter-centered__input::placeholder {
    color: #9ca3af; /* placeholder:text-gray-400 */
}

.newsletter-centered__input:focus {
    outline: none;
    border-color: var(--accent-color);
    box-shadow: 0 0 0 2px rgba(79, 70, 229, 0.1); /* focus:ring-2 focus:ring-indigo-500 */
}

/* Bouton */

.newsletter-centered__button {
    border-radius: 0.375rem; /* rounded-md */
    background-color: var(--accent-color); /* bg-indigo-600 */
    padding: 0.5rem 1rem; /* py-2 px-4 */
    font-size: 0.875rem; /* text-sm */
    font-weight: 600; /* font-semibold */
    color: #ffffff;
    border: none;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.newsletter-centered__button:hover {
    background-color: var(--accent-hover); /* hover:bg-indigo-500 */
    transform: translateY(-1px);
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

.newsletter-centered__button:focus {
    outline: 2px solid var(--accent-color);
    outline-offset: 2px;
}

.newsletter-centered__button:active {
    transform: translateY(0);
}

/* Note */

.newsletter-centered__note {
    margin-top: 1rem;
    color: #6b7280;
    font-style: italic;
}

.newsletter-centered__note small {
    font-size: 0.75rem;
}

/* Responsive mobile */

@media (max-width: 640px) {
    .newsletter-centered__container {
        padding: 3rem 1rem;
    }
    
    .newsletter-centered__title {
        font-size: 1.5rem;
    }
    
    .newsletter-centered__form {
        flex-direction: column;
        gap: 0.75rem;
        max-width: 100%;
    }
    
    .newsletter-centered__input,
    .newsletter-centered__button {
        padding: 0.75rem 1rem;
    }
}

/* États d'envoi (pour JS futur) */

.newsletter-centered__form[data-loading] .newsletter-centered__button {
    opacity: 0.7;
    cursor: not-allowed;
}

.newsletter-centered__form[data-success] {
    opacity: 0.8;
}

.newsletter-centered__form[data-error] .newsletter-centered__input {
    border-color: #dc2626;
}

/* Accessibilité */

.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;
}

@media (prefers-reduced-motion: reduce) {
    .newsletter-centered__input,
    .newsletter-centered__button {
        transition: none;
    }
    
    .newsletter-centered__button:hover,
    .newsletter-centered__button:active {
        transform: none;
    }
}

/* ===================================
   PRICING — 3 TIERS
   =================================== */

.pricing-3 {
    background-color: #ffffff;
}

.pricing-3__container {
    margin: 0 auto;
    max-width: 1280px; /* max-w-7xl */
    padding: 6rem 1.5rem; /* py-24 px-6 */
}

/* En-tête */

.pricing-3__header {
    margin: 0 auto;
    max-width: 672px; /* max-w-2xl */
    text-align: center;
    margin-bottom: 3rem; /* mb-12 */
}

.pricing-3__title {
    font-size: 2.25rem; /* text-4xl */
    font-weight: 600; /* font-semibold */
    letter-spacing: -0.025em; /* tracking-tight */
    color: #111827; /* text-gray-900 */
    margin: 0;
    line-height: 1.1;
}

.pricing-3__intro {
    margin-top: 1rem; /* mt-4 */
    color: #4b5563; /* text-gray-600 */
    margin-bottom: 0;
    line-height: 1.6;
}

/* Grille des formules */

.pricing-3__plans {
    display: grid;
    gap: 1.5rem; /* gap-6 */
    grid-template-columns: 1fr;
}

@media (min-width: 640px) {
    .pricing-3__plans {
        grid-template-columns: repeat(2, 1fr); /* sm:grid-cols-2 */
    }
}

@media (min-width: 1024px) {
    .pricing-3__plans {
        grid-template-columns: repeat(3, 1fr); /* lg:grid-cols-3 */
    }
}

/* Formule individuelle */

.pricing-3__plan {
    border-radius: 1rem; /* rounded-2xl */
    border: 1px solid #e5e7eb; /* border */
    padding: 2rem; /* p-8 */
    background-color: #ffffff;
    transition: all 0.2s ease;
    position: relative;
}

.pricing-3__plan:hover {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    transform: translateY(-2px);
}

/* Formule mise en avant */

.pricing-3__plan--featured {
    border: 1px solid var(--accent-color); /* ring-1 ring-indigo-500 */
    box-shadow: 0 0 0 1px var(--accent-color);
}

.pricing-3__plan--featured::before {
    content: "Recommandé";
    position: absolute;
    top: -0.5rem;
    left: 50%;
    transform: translateX(-50%);
    background-color: var(--accent-color);
    color: #ffffff;
    padding: 0.25rem 0.75rem;
    border-radius: 9999px;
    font-size: 0.75rem;
    font-weight: 600;
}

/* Nom de la formule */

.pricing-3__plan-name {
    font-size: 1rem; /* text-base */
    font-weight: 600; /* font-semibold */
    color: #111827; /* text-gray-900 */
    margin: 0;
    line-height: 1.4;
}

/* Prix */

.pricing-3__plan-price {
    margin-top: 1rem; /* mt-4 */
    font-size: 2.25rem; /* text-4xl */
    font-weight: 600; /* font-semibold */
    color: #111827; /* text-gray-900 */
    margin-bottom: 0;
    line-height: 1.1;
}

/* Liste des fonctionnalités */

.pricing-3__features {
    margin-top: 1.5rem; /* mt-6 */
    display: flex;
    flex-direction: column;
    gap: 0.5rem; /* space-y-2 */
    list-style: none;
    padding: 0;
}

.pricing-3__feature {
    font-size: 0.875rem; /* text-sm */
    color: #4b5563; /* text-gray-600 */
    line-height: 1.5;
    position: relative;
    padding-left: 1.5rem;
}

.pricing-3__feature::before {
    content: "✓";
    position: absolute;
    left: 0;
    color: #10b981; /* text-green-500 */
    font-weight: 600;
}

/* Bouton CTA */

.pricing-3__cta {
    margin-top: 2rem; /* mt-8 */
    display: inline-flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    border-radius: 0.375rem; /* rounded-md */
    background-color: #111827; /* bg-gray-900 */
    padding: 0.5rem 1rem; /* py-2 px-4 */
    font-size: 0.875rem; /* text-sm */
    font-weight: 600; /* font-semibold */
    color: #ffffff;
    text-decoration: none;
    transition: all 0.2s ease;
    border: 2px solid transparent;
}

.pricing-3__cta:hover {
    background-color: #1f2937; /* hover:bg-gray-800 */
    text-decoration: none;
    transform: translateY(-1px);
}

.pricing-3__cta:focus {
    outline: 2px solid var(--accent-color);
    outline-offset: 2px;
}

/* CTA pour formule mise en avant */

.pricing-3__plan--featured .pricing-3__cta {
    background-color: var(--accent-color);
}

.pricing-3__plan--featured .pricing-3__cta:hover {
    background-color: var(--accent-hover);
}

/* État vide */

.pricing-3__empty {
    text-align: center;
    padding: 3rem;
    background-color: #f9fafb;
    border: 2px dashed #d1d5db;
    border-radius: 1rem;
    color: #6b7280;
}

.pricing-3__empty p {
    margin: 0;
    font-weight: 500;
}

/* Responsive mobile */

@media (max-width: 640px) {
    .pricing-3__container {
        padding: 4rem 1rem;
    }
    
    .pricing-3__title {
        font-size: 1.875rem;
    }
    
    .pricing-3__plan {
        padding: 1.5rem;
    }
    
    .pricing-3__plan-price {
        font-size: 2rem;
    }
}

/* Accessibilité */

@media (prefers-reduced-motion: reduce) {
    .pricing-3__plan,
    .pricing-3__cta {
        transition: none;
    }
    
    .pricing-3__plan:hover,
    .pricing-3__cta:hover {
        transform: none;
    }
}

/* ===================================
   BLOC SERVICES
   =================================== */

.services-block {
    padding: 4rem 0;
    background-color: #f9fafb;
}

/* En-tête de section */

.services-block .text-center h2 {
    color: #111827;
    font-size: 2.25rem;
    font-weight: 700;
    margin-bottom: 1rem;
    line-height: 1.2;
}

.services-block .text-center p {
    color: #6b7280;
    font-size: 1.25rem;
    max-width: 42rem;
    margin: 0 auto;
    line-height: 1.6;
}

/* Cartes de services */

.service-card {
    background: white;
    border-radius: 0.5rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    padding: 1.5rem;
    transition: all 0.3s ease;
    transform: translateY(0);
}

.service-card:hover {
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    transform: translateY(-0.5rem);
}

/* Icônes des services */

.service-icon {
    font-size: 2.25rem;
    margin-bottom: 1rem;
    text-align: center;
}

.service-icon img {
    width: 4rem;
    height: 4rem;
    margin: 0 auto;
    -o-object-fit: contain;
       object-fit: contain;
}

.service-icon span {
    font-size: 3.75rem;
    display: block;
}

/* Contenu des services */

.service-content h3 {
    color: #111827;
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 0.75rem;
    line-height: 1.4;
}

.service-content p {
    color: #6b7280;
    margin-bottom: 1rem;
    line-height: 1.6;
}

.service-content a {
    color: #3b82f6;
    font-weight: 500;
    transition: color 0.2s ease;
    text-decoration: none;
}

.service-content a:hover {
    color: #1d4ed8;
}

/* Grilles responsives */

.services-block .grid {
    display: grid;
    gap: 2rem;
}

.services-block .grid-cols-1 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
}

.services-block .md\\:grid-cols-2 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
}

.services-block .lg\\:grid-cols-3 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
}

.services-block .lg\\:grid-cols-4 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
}

/* Responsive */

@media (min-width: 768px) {
    .services-block .md\\:grid-cols-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (min-width: 1024px) {
    .services-block .lg\\:grid-cols-3 {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    
    .services-block .lg\\:grid-cols-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }
}

/* Animations d'entrée */

.service-card {
    opacity: 0;
    animation: fade-in-up 0.6s ease-out forwards;
}

.service-card:nth-child(1) { animation-delay: 0.1s; }

.service-card:nth-child(2) { animation-delay: 0.2s; }

.service-card:nth-child(3) { animation-delay: 0.3s; }

.service-card:nth-child(4) { animation-delay: 0.4s; }

.service-card:nth-child(5) { animation-delay: 0.5s; }

.service-card:nth-child(6) { animation-delay: 0.6s; }

@keyframes fade-in-up {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* ===================================
   STATS — GRID
   =================================== */

.stats-grid {
    background-color: #ffffff;
}

.stats-grid__container {
    margin: 0 auto;
    max-width: 1280px; /* max-w-7xl */
    padding: 4rem 1.5rem; /* py-16 px-6 */
}

/* Grille des statistiques */

.stats-grid__items {
    display: grid;
    grid-template-columns: repeat(2, 1fr); /* grid-cols-2 */
    gap: 2rem; /* gap-8 */
    text-align: center;
}

@media (min-width: 640px) {
    .stats-grid__items {
        grid-template-columns: repeat(4, 1fr); /* sm:grid-cols-4 */
    }
}

/* Statistique individuelle */

.stats-grid__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
}

/* Libellé */

.stats-grid__label {
    font-size: 0.875rem; /* text-sm */
    color: #6b7280; /* text-gray-500 */
    font-weight: 400;
    margin: 0;
    line-height: 1.4;
}

/* Valeur */

.stats-grid__value {
    margin-top: 0.5rem; /* mt-2 */
    font-size: 1.875rem; /* text-3xl */
    font-weight: 600; /* font-semibold */
    color: #111827; /* text-gray-900 */
    margin-bottom: 0;
    line-height: 1.1;
}

/* État vide */

.stats-grid__empty {
    text-align: center;
    padding: 3rem;
    background-color: #f9fafb;
    border: 2px dashed #d1d5db;
    border-radius: 1rem;
    color: #6b7280;
}

.stats-grid__empty p {
    margin: 0;
    font-weight: 500;
}

/* Responsive mobile */

@media (max-width: 640px) {
    .stats-grid__container {
        padding: 3rem 1rem;
    }
    
    .stats-grid__items {
        gap: 1.5rem;
    }
    
    .stats-grid__value {
        font-size: 1.5rem;
    }
}

/* Animation au scroll (optionnel) */

@media (prefers-reduced-motion: no-preference) {
    .stats-grid__value {
        transition: transform 0.2s ease;
    }
    
    .stats-grid__item:hover .stats-grid__value {
        transform: scale(1.05);
    }
}

/* Accessibilité */

@media (prefers-reduced-motion: reduce) {
    .stats-grid__value {
        transition: none;
    }
    
    .stats-grid__item:hover .stats-grid__value {
        transform: none;
    }
}

/* ===================================
   STEPS / HOW IT WORKS
   =================================== */

.steps-horizontal {
    background-color: #ffffff;
}

.steps-horizontal__container {
    margin: 0 auto;
    max-width: 1024px; /* max-w-5xl */
    padding: 5rem 1.5rem; /* py-20 px-6 */
}

/* Titre */

.steps-horizontal__title {
    font-size: 1.875rem; /* text-3xl */
    font-weight: 600; /* font-semibold */
    letter-spacing: -0.025em; /* tracking-tight */
    color: #111827; /* text-gray-900 */
    margin: 0 0 2.5rem 0; /* mb-10 */
    line-height: 1.2;
}

/* Liste des étapes */

.steps-horizontal__steps {
    display: grid;
    gap: 2rem; /* gap-8 */
    grid-template-columns: 1fr;
    list-style: none;
    padding: 0;
    margin: 0;
}

@media (min-width: 640px) {
    .steps-horizontal__steps {
        grid-template-columns: repeat(3, 1fr); /* sm:grid-cols-3 */
    }
}

/* Étape individuelle */

.steps-horizontal__step {
    border-radius: 1rem; /* rounded-2xl */
    border: 1px solid #e5e7eb; /* border */
    padding: 1.5rem; /* p-6 */
    background-color: #ffffff;
    position: relative;
    transition: all 0.2s ease;
}

.steps-horizontal__step:hover {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    transform: translateY(-2px);
}

/* Numéro de l'étape */

.steps-horizontal__step-number {
    font-size: 0.75rem; /* text-xs */
    font-weight: 600; /* font-semibold */
    color: var(--accent-color); /* text-indigo-600 */
    text-transform: uppercase;
    letter-spacing: 0.05em;
    margin-bottom: 0.5rem;
}

/* Titre de l'étape */

.steps-horizontal__step-title {
    margin-top: 0.5rem; /* mt-2 */
    font-size: 1.125rem; /* text-lg */
    font-weight: 600; /* font-semibold */
    color: #111827; /* text-gray-900 */
    margin-bottom: 0;
    line-height: 1.4;
}

/* Texte de l'étape */

.steps-horizontal__step-text {
    margin-top: 0.5rem; /* mt-2 */
    font-size: 0.875rem; /* text-sm */
    color: #4b5563; /* text-gray-600 */
    line-height: 1.5;
    margin-bottom: 0;
}

/* Connecteurs entre les étapes (sur desktop) */

@media (min-width: 640px) {
    .steps-horizontal__step:not(:last-child)::after {
        content: '→';
        position: absolute;
        top: 50%;
        right: -1.5rem;
        transform: translateY(-50%);
        font-size: 1.5rem;
        color: #d1d5db;
        z-index: 1;
    }
}

/* État vide */

.steps-horizontal__empty {
    text-align: center;
    padding: 3rem;
    background-color: #f9fafb;
    border: 2px dashed #d1d5db;
    border-radius: 1rem;
    color: #6b7280;
}

.steps-horizontal__empty p {
    margin: 0;
    font-weight: 500;
}

/* Responsive mobile */

@media (max-width: 640px) {
    .steps-horizontal__container {
        padding: 3rem 1rem;
    }
    
    .steps-horizontal__title {
        font-size: 1.5rem;
        margin-bottom: 2rem;
    }
    
    .steps-horizontal__steps {
        gap: 1.5rem;
    }
    
    .steps-horizontal__step {
        padding: 1.25rem;
    }
    
    /* Connecteurs verticaux sur mobile */
    .steps-horizontal__step:not(:last-child)::after {
        content: '↓';
        position: absolute;
        bottom: -1.25rem;
        left: 50%;
        transform: translateX(-50%);
        font-size: 1.25rem;
        color: #d1d5db;
        z-index: 1;
    }
}

/* Animation d'apparition progressive */

@media (prefers-reduced-motion: no-preference) {
    .steps-horizontal__step:nth-child(1) {
        animation-delay: 0ms;
    }
    
    .steps-horizontal__step:nth-child(2) {
        animation-delay: 100ms;
    }
    
    .steps-horizontal__step:nth-child(3) {
        animation-delay: 200ms;
    }
    
    .steps-horizontal__step:nth-child(4) {
        animation-delay: 300ms;
    }
    
    .steps-horizontal__step:nth-child(5) {
        animation-delay: 400ms;
    }
    
    .steps-horizontal__step:nth-child(6) {
        animation-delay: 500ms;
    }
}

/* Accessibilité */

@media (prefers-reduced-motion: reduce) {
    .steps-horizontal__step {
        transition: none;
    }
    
    .steps-horizontal__step:hover {
        transform: none;
    }
}

/* ===================================
   TESTIMONIALS — CARDS
   =================================== */

.testimonials-cards {
    background-color: #f9fafb; /* bg-gray-50 */
}

.testimonials-cards__container {
    margin: 0 auto;
    max-width: 1280px; /* max-w-7xl */
    padding: 6rem 1.5rem; /* py-24 px-6 */
}

/* Titre */

.testimonials-cards__title {
    text-align: center;
    font-size: 1.875rem; /* text-3xl */
    font-weight: 600; /* font-semibold */
    letter-spacing: -0.025em; /* tracking-tight */
    color: #111827; /* text-gray-900 */
    margin: 0 0 3rem 0; /* mb-12 */
    line-height: 1.2;
}

/* Grille des témoignages */

.testimonials-cards__items {
    display: grid;
    gap: 2rem; /* gap-8 */
    grid-template-columns: 1fr;
}

@media (min-width: 768px) {
    .testimonials-cards__items {
        grid-template-columns: repeat(2, 1fr); /* md:grid-cols-2 */
    }
}

/* Témoignage individuel */

.testimonials-cards__item {
    border-radius: 1rem; /* rounded-2xl */
    background-color: #ffffff;
    padding: 2rem; /* p-8 */
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05); /* shadow-sm */
    border: 1px solid rgba(17, 24, 39, 0.05); /* ring-1 ring-gray-900/5 */
    margin: 0;
    transition: all 0.2s ease;
}

.testimonials-cards__item:hover {
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    transform: translateY(-2px);
}

/* Citation */

.testimonials-cards__quote {
    color: #374151; /* text-gray-700 */
    line-height: 1.6;
    margin: 0;
    font-style: italic;
    position: relative;
}

.testimonials-cards__quote::before {
    content: "\201C";
    font-size: 3rem;
    color: #d1d5db;
    position: absolute;
    top: -1rem;
    left: -0.5rem;
    font-family: serif;
    line-height: 1;
}

/* Auteur */

.testimonials-cards__author {
    margin-top: 1rem; /* mt-4 */
    font-size: 0.875rem; /* text-sm */
    color: #6b7280; /* text-gray-500 */
    margin-bottom: 0;
}

.testimonials-cards__author-name {
    font-weight: 600;
    color: #374151; /* text-gray-700 */
}

.testimonials-cards__author-role {
    font-weight: 400;
}

/* État vide */

.testimonials-cards__empty {
    text-align: center;
    padding: 3rem;
    background-color: #ffffff;
    border: 2px dashed #d1d5db;
    border-radius: 1rem;
    color: #6b7280;
}

.testimonials-cards__empty p {
    margin: 0;
    font-weight: 500;
}

/* Responsive mobile */

@media (max-width: 768px) {
    .testimonials-cards__container {
        padding: 4rem 1rem;
    }
    
    .testimonials-cards__title {
        font-size: 1.5rem;
        margin-bottom: 2rem;
    }
    
    .testimonials-cards__items {
        gap: 1.5rem;
    }
    
    .testimonials-cards__item {
        padding: 1.5rem;
    }
    
    .testimonials-cards__quote::before {
        font-size: 2rem;
        top: -0.5rem;
    }
}

/* Accessibilité */

@media (prefers-reduced-motion: reduce) {
    .testimonials-cards__item {
        transition: none;
    }
    
    .testimonials-cards__item:hover {
        transform: none;
    }
}

/* Variante avec plus de 4 témoignages */

@media (min-width: 1024px) {
    .testimonials-cards__items[data-count="3"],
    .testimonials-cards__items[data-count="6"] {
        grid-template-columns: repeat(3, 1fr);
    }
    
    .testimonials-cards__items[data-count="4"],
    .testimonials-cards__items[data-count="8"] {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* ===================================
   TIMELINE — VERTICAL (ENSA)
   =================================== */

.timeline-vertical {
    /* pas de fond ici : tu gères la section autour */
  }

.timeline-vertical__inner {
    width: 100%;
  }

/* Titre (tu as déjà des styles globaux h2, mais on force le comportement attendu) */

.timeline-vertical__title {
    margin: 0 0 28px 0;
    text-transform: uppercase;
  }

/*
    Layout d’un item :
    [ cartouche (gauche) ] [ rail (axe+dot) ] [ année (droite) ]
  */

.timeline-vertical__timeline {
    display: flex;
    flex-direction: column;
    gap: 18px; /* espace vertical entre items -> crée la discontinuité visuelle */
  }

/* ITEM */

.timeline-vertical__item {
    display: grid;
    grid-template-columns: 1fr 56px 160px;
    align-items: center;
    -moz-column-gap: 0;
         column-gap: 0;
  }

/* Cartouche */

.timeline-vertical__label {
    position: relative;
    padding: 16px 60px 16px 20px;
    text-transform: uppercase;
    font-size: 16px;
    line-height: 20px;
    color: #000;
  }

/* Encoche à droite du cartouche */

.timeline-vertical__label::after {
    content: "";
    position: absolute;
    top: 50%;
    right: -10px;
    transform: translateY(-50%);
    width: 0;
    height: 0;
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
    border-left: 10px solid currentColor; /* sera override via background-color */
  }

/* Rail (axe) */

.timeline-vertical__rail {
    position: relative;
    height: 100%;
    min-height: 44px; /* assure une hauteur exploitable sur petits textes */
  }

/* Segment de ligne par item (donne l'effet discontinu entre rows) */

.timeline-vertical__rail::before {
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: -18px;   /* = gap pour "raccorder" visuellement */
    bottom: -18px;
    width: 1px;
    background: #1a1818;
  }

/* Ne pas dépasser en haut / bas */

.timeline-vertical__item:first-child .timeline-vertical__rail::before {
    top: 0;
  }

.timeline-vertical__item:last-child .timeline-vertical__rail::before {
    bottom: 0;
  }

/* Pastille */

.timeline-vertical__dot {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 10px;
    height: 10px;
    background: #1a1818;
    border-radius: 9999px;
  }

/* Année */

.timeline-vertical__year {
    font-size: 56px;
    line-height: 56px;
    font-weight: 700;
    color: #000;
    letter-spacing: 0;
    padding-left: 6px;
  }

/* Couleurs cartouches */

.timeline-vertical__item--green .timeline-vertical__label {
    background: #BFCF5C;
  }

.timeline-vertical__item--green .timeline-vertical__label::after {
    border-left-color: #BFCF5C;
  }

.timeline-vertical__item--yellow .timeline-vertical__label {
    background: #F1D94E; /* à ajuster si ref exacte */
  }

.timeline-vertical__item--yellow .timeline-vertical__label::after {
    border-left-color: #F1D94E;
  }

.timeline-vertical__item--grey .timeline-vertical__label {
    background: #D9D9D9; /* à ajuster si ref exacte */
  }

.timeline-vertical__item--grey .timeline-vertical__label::after {
    border-left-color: #D9D9D9;
  }

/* Responsive */

@media (max-width: 768px) {
    .timeline-vertical__item {
      grid-template-columns: minmax(0, 400px) 40px 116px;
    }
  
    .timeline-vertical__year {
      font-size: 42px;
      line-height: 42px;
    }
  
  }

@media (max-width: 1023px) {
    .timeline-vertical__label {
        padding: 16px 20px 16px 20px;
        font-size: 15px;
        line-height: 19px;
      } 
  }

.actus-slider {
  width: 100%;
  padding: 70px 0 40px 0;
}

.actus-slider__inner {
  display: block;
  grid-template-columns: 1fr;
  row-gap: 28px;
}

/* Intro */

.actus-slider__intro {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.actus-slider__title {
  margin: 0;
  text-transform: uppercase;
  font-weight: 700;
  line-height: 1.05;
  letter-spacing: 0.02em;
}

.actus-slider__ctas {
  display: flex;
  gap: 16px;
  flex-flow: row wrap;
}

.actus-slider__ctas > p {
  margin: 0;
  width: 100%;
}

.wp-block-image.actus-slider__ctas > p img {
    width: 100%;
  }

.actus-slider__ctas .btn--primary {
  /* min-width: 170px; */
  justify-content: center;
  text-align: center;
  flex: 1 1 0;
  width: 100%;
}

.wp-block-image.actus-slider__ctas .btn--primary img {
    width: 100%;
  }

.actus-slider__rule {
  display: block;
  height: 1px;
  width: 100%;
  background: #000;
  opacity: 0.35;
  margin: 40px 0;
}

/* Content */

.actus-slider__content {
  margin-top: 0;
  position: relative;
}

.actus-slider__swiper {
  position: relative;
  overflow: hidden;
  width: 100%;
}

.actus-slider__swiper .swiper-wrapper {
  display: flex;
  align-items: stretch;
  height: 100%;
  /* min-height: 300px; */
}

.actus-slider__swiper .swiper-slide {
  height: auto;
}

/* Cartes */

.actus-slider__card {
  padding: 0 70px;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: start;
  gap: 0;
  min-height: 100px;
  --tw-text-opacity: 1;
  color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}

.actus-slider__meta time {
  display: inline-block;
  color: #000;
  opacity: 0.5;
  font-size: 12px;
}

@media (min-width: 768px) {

    .actus-slider__meta time {
        font-size: 20px;
    }
}

.actus-slider__card-title {
  margin: 0;
  text-transform: uppercase;
  font-size: 15px;
  font-weight: 400;
  line-height: 24px;
}

@media (min-width: 768px) {

    .actus-slider__card-title {
        font-size: 22px;
        line-height: 30px;
    }
}

.actus-slider__card-title a {
  color: inherit;
  text-decoration: none;
  font-size: 15px;
  font-weight: 500;
  line-height: 24px;
}

@media (min-width: 768px) {

    .actus-slider__card-title a {
        font-size: 22px;
        font-weight: 400;
        line-height: 30px;
    }
}

.actus-slider__excerpt {
  margin: 0;
}

/* Nav (ronds) */

.actus-slider__nav {
  display: flex;
  justify-content: space-between;
  gap: 18px;
  margin-top: 20px;
  width: 100%;
  margin-left: 0;

  position: absolute;
  top: 32px;
  left: 0;
  z-index: 2;
}

.actus-slider__nav-btn {
  width: 30px;
  height: 30px;
  background: transparent;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  cursor: pointer;
}

.actus-slider__prev, 
.actus-slider__next {
  &:hover svg circle {
    fill: #BFCF5C;
    stroke: #BFCF5C;
  }
}

/* Desktop : 4 colonnes 25% / 25% / 25% / 25% */

@media (min-width: 768px) {
  .actus-slider {
    width: 100%;
    padding: 150px 0 55px 0;
  }
  .actus-slider__inner {
    display: grid;
    grid-template-columns: 25% 75%;
    -moz-column-gap: 40px;
         column-gap: 40px;
    align-items: start;
  }
  .actus-slider__nav-btn {
    width: 44px;
    height: 44px;
  }
  .actus-slider__ctas {
    display: flex;
    gap: 0;
    flex-wrap: wrap;
  }
  .actus-slider__intro {
    padding-right: 0;
  }

  .actus-slider__rule {
    display: none;
  }

  .actus-slider__content {
    margin-top: 0;
    padding-left: 40px;
  }

  .actus-slider__swiper .swiper-wrapper {
    border-left: 1px solid rgba(0, 0, 0, 0.35);
    min-height: 300px;
  }

  /* IMPORTANT:
     On veut 3 colonnes d'actus dans les 75%.
     Swiper gère 3 visibles (slidesPerView: 3), ici on force des séparateurs "comme la maquette".
  */
  .actus-slider__slide {
    height: auto;
  }

  .actus-slider__card {
    padding: 0 32px;
    justify-content: start;
    padding-top: 50px;
    gap: 12px;
  }

  /* séparateurs entre les colonnes visibles */
  .actus-slider__slide:not(:first-child) .actus-slider__card {
    border-left: 1px solid rgba(0,0,0,0.35);
  }
  .actus-slider__slide:last-child .actus-slider__card {
    border-right: 1px solid rgba(0, 0, 0, 0.35);
  }
  .actus-slider__nav {
    justify-content: center;
    margin-top: 32px;  
    width: 100vw;
    margin-left: calc(25% - 50vw);
    gap: 70px;
    position: initial;
  }

  .actus-slider__ctas {
    flex-direction: column;
    align-items: flex-start;
  }

  .actus-slider__ctas .btn--primary {
    min-width: 200px;
    flex: 0 0 auto;
  }
}

/* Badge "à la une" */

.badge-une {
  display: inline-block;
  margin-left: 0 !important;
  padding: 2px 8px;
  font-size: 0.65em;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #fff;
  background-color: rgb(45,65,60);
  vertical-align: middle;
  white-space: nowrap;
}

.formations-cards { 
    width: 100%; 
    padding: 38px 0 45px 0;
}

/* Header */

.formations-cards__header {
  display: grid;
  grid-template-columns: 1fr;
  row-gap: 14px;
  padding-bottom: 20px;
}

.formations-cards__title {
  margin: 0;
  /* font-size: 30px;
  line-height: 40px; */
  font-weight: 600;
  color: #000;
  text-transform: uppercase;
}

.formations-cards__header-cta { display: none; }

/* Grid (mobile) */

.formations-cards__grid {
  display: grid;
  grid-template-columns: 1fr;
  align-items: stretch; /* IMPORTANT: même hauteur */
}

/* Card */

.formations-cards__card {
  display: flex;                 /* IMPORTANT: même hauteur */
  flex-flow: column nowrap;      /* IMPORTANT */
  padding: 36px 0 16px 0;
  border-top: 1px solid #707070;
  --tw-text-opacity: 1;
  color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}

.formations-cards__card-title {
    margin-bottom: 2rem;
    font-family: TT Norms, sans-serif;
    font-size: 30px;
    font-weight: 400;
    text-transform: uppercase;
    line-height: 35px;
}

.formations-cards__media {
  width: 100%;
  height: 335px;
  overflow: hidden;
}

.formations-cards__media img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
}

.formations-cards__body {
  position: relative;
  padding-top: 14px;
  flex: 1 1 auto;   /* pousse le CTA en bas si besoin */
  display: flex;
  flex-direction: column;
}

.formations-cards__text { margin: 0; }

.formations-cards__arrow {
  margin-top: auto; /* pousse le bouton vers le bas */
  align-self: flex-end;
  width: 40px;
  height: 40px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

.formations-cards__arrow svg {
  width: 40px;
  height: 40px;
  display: block;
}

.formations-cards__arrow:hover svg circle {
  fill: #BFCF5C;
  stroke: #BFCF5C;
}

/* On n'utilise plus la ligne interne par card (on fait les bordures via la grille) */

.formations-cards__card-rule { display: none; }

/* Footer CTA (mobile) */

.formations-cards__footer-cta { margin-top: 22px; }

/* Desktop : bordures continues + lignes pleine largeur */

@media (min-width: 768px) {
    .formations-cards { 
        padding: 60px 0 85px 0;
    }
    .formations-cards__header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 32px 0;
    }
    .formations-cards__title {
      /* font-size: 40px;
      line-height: 50px; */
    }
    .formations-cards__header-cta { display: block; }
    .formations-cards__footer-cta { display: none; }
  
    .formations-cards__grid {
      grid-template-columns: 1fr 1fr;
      -moz-column-gap: 0;
           column-gap: 0;
      row-gap: 0;
      align-items: stretch;
      /* IMPORTANT : on enlève la ligne centrale en background si tu l’avais */
      background: none;
      background-image: none;
    }
  
    /* Padding “cellule” (comme la maquette) */
    .formations-cards__card {
      display: flex;
      flex-flow: column nowrap;
      padding: 22px 36px 26px 36px;
      border-top: none;
    }
  
    /* On évite de doubler les paddings contre la ligne centrale */
    .formations-cards__card:nth-child(odd) { padding-right: 36px;margin-left: -36px; }
    .formations-cards__card:nth-child(even) { padding-left: 36px;margin-right: -36px; }
  
    /* On n'utilise plus de pseudo éléments précédents */
    .formations-cards__grid::before,
    .formations-cards__grid::after {
      content: none !important;
    }
    :root {
      /* réglages faciles */
      --fc-line: #707070;
      --fc-stroke: 1px;
  
      /* inset horizontal des lignes (pas pleine largeur) */
      --fc-inset-x: 36px;
  
      /* espace vertical entre le contenu et les traits */
      --fc-pad-y: 36px;
  
      /* hauteur de "trou" au croisement (pour la ligne verticale discontinue) */
      --fc-cross-gap: 14px;
    }
  
    .formations-cards__grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 0 !important;
      align-items: stretch;
    }
  
    .formations-cards__card {
      position: relative;
      display: flex;
      flex-flow: column nowrap;
      padding: var(--fc-pad-y) var(--fc-inset-x) 26px var(--fc-inset-x);
    }
  
    /* 1) LIGNES HORIZONTALES (inset) : sous chaque card */
  
    /* Ligne horizontale au-dessus de la 2e rangée (inset) */
    .formations-cards__card::before {
      content: "";
      position: absolute;
      left: var(--fc-inset-x);
      right: var(--fc-inset-x);
      top: 0;
      height: var(--fc-stroke);
      background: var(--fc-line);
      pointer-events: none;
    }
  
    /* 2) LIGNE VERTICALE CENTRALE DISCONTINUE
       On la dessine dans CHAQUE cellule avec un inset haut/bas.
       On laisse volontairement un trou au niveau des lignes horizontales. */
  
    /* Colonne gauche: trait à droite */
    .formations-cards__card:nth-child(odd) {
      padding-right: calc(var(--fc-inset-x) + 18px); /* un peu d’air vers la ligne */
    }
    .formations-cards__card:nth-child(odd)::after {
      content: "";
      position: absolute;
      right: 0;
      top: 36px;
      bottom: 0;
      height: calc(100% - 72px);
      width: var(--fc-stroke);
      background: var(--fc-line);
      pointer-events: none;
    }
  
    /* Colonne droite: trait à gauche */
    .formations-cards__card:nth-child(even) {
      padding-left: calc(var(--fc-inset-x) + 18px);
    }
    /* IMPORTANT : on inset la verticale dans la card, pas sur tout le wrapper
       => on l'applique à un conteneur interne positionné */
    .formations-cards__body {
      position: relative;
      flex: 1 1 auto;
      padding-top: 34px;
      display: flex;
      flex-direction: column;
    }
  
    /* 3) Créer la DISCONTINUITÉ entre les rangées :
       On coupe la verticale près du bas de la 1ère rangée
       et près du haut de la 2e rangée. */
  
    /* 1ère rangée: on remonte le bas du trait (trou avant la ligne du bas) */
    .formations-cards__card:nth-child(-n + 2) .formations-cards__body::before,
    .formations-cards__card:nth-child(-n + 2) .formations-cards__body::after {
      bottom: var(--fc-cross-gap);
    }
  
    /* 2e rangée: on descend le haut du trait (trou après la ligne du haut) */
    .formations-cards__card:nth-child(n + 3) .formations-cards__body::before,
    .formations-cards__card:nth-child(n + 3) .formations-cards__body::after {
      top: var(--fc-cross-gap);
    }
  
    /* 4) On désactive les anciennes bordures si tu en as encore */
    .formations-cards__grid::before,
    .formations-cards__grid::after,
    .formations-cards__card-rule {
      display: none !important;
      content: none !important;
    }
  }

.deux-colonnes {
    --gap: 140px;
    --radius: 13px;
    padding-top: 60px;
    padding-bottom: 60px;
    padding-left: 0px;
    padding-right: 0px;
  }

@media (min-width: 768px) {

    .deux-colonnes {
        padding-top: 100px;
        padding-bottom: 100px;
    }
}

/* Grid = 2 colonnes, même hauteur */

.deux-colonnes__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--gap);
    align-items: stretch;
  }

/* Colonne = card */

.deux-colonnes__col {
    overflow: hidden; 
    min-height: 100%;
    height: 100%;
  }

/* Contenu interne (pour WYSIWYG) */

.deux-colonnes__inner {
    height: 100%;
    padding: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

.deux-colonnes--dark .deux-colonnes__col--right .deux-colonnes__inner {
    /* padding: 0 42px; */
  }

.deux-colonnes__inner h2 {
    margin-top: 0px !important;
    margin-bottom: 32px !important;
}

@media (min-width: 768px) {

    .deux-colonnes__inner h2 {
        margin-bottom: 1rem !important;
    }
}

.card-modernise .deux-colonnes__col--left .deux-colonnes__inner {
    /* padding: 34px 43px; */
  }

/* WYSIWYG - basique */

.deux-colonnes__wysiwyg > *:first-child { margin-top: 0; }

.deux-colonnes__wysiwyg > *:last-child { margin-bottom: 0; }

/* .deux-colonnes__wysiwyg h2 {
    margin-top: 43px !important;
    margin-bottom: 16px !important;
  } */

/* .deux-colonnes__wysiwyg > *:last-child {
    margin-bottom: 43px !important;
  } */

.deux-colonnes__wysiwyg ul {
    list-style: none;
  }

.deux-colonnes__wysiwyg ul li {
    position: relative;
    padding-left: 24px;
  }

.deux-colonnes__wysiwyg ul li::before {
    content: "•";
    position: absolute;
    left: 0;
    font-size: 40px;
    top: -12px;
    line-height: 1;
  }

/* Col type image : l'image prend tout */

.deux-colonnes__media {
    height: 100%;
    width: 100%;
  }

.deux-colonnes__img {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
  }

/* Variante thème */

.deux-colonnes--light {
    background: transparent;
  }

.deux-colonnes--dark {
    background: #000;
    padding: 64px 0;
  }

/* Si le bloc est sur fond noir mais que tu veux que les cards restent maîtrisées */

.deux-colonnes--dark .deux-colonnes__col--type-wysiwyg,
  .deux-colonnes--dark .deux-colonnes__col--type-wysiwyg_bg {
    color: #fff;
  }

@media screen and (max-width: 768px) {
      .deux-colonnes--reverse .deux-colonnes__col--left {
        order: 2;
      }
      .deux-colonnes--reverse .deux-colonnes__col--right {
        order: 1;
      }
  }

/* Empty state (admin) */

.deux-colonnes__empty {
    padding: 16px;
    border: 1px dashed rgba(0,0,0,.25);
    background: rgba(255,255,255,.6);
  }

/* Responsive : 1 colonne */

@media (max-width: 900px) {
    .deux-colonnes__grid {
      grid-template-columns: 1fr;
      gap: 45px;
    }
  
    /* pour éviter des images trop plates en mobile */
    .deux-colonnes__col--type-image .deux-colonnes__media {
      min-height: 260px;
    }
    /* .deux-colonnes--dark {
        padding: 16px 0;
    }
    
    .deux-colonnes--dark .deux-colonnes__col--right .deux-colonnes__inner {
      padding: 0;
    }

    .card-modernise .deux-colonnes__col--right .deux-colonnes__inner,
    .card-modernise .deux-colonnes__col--left .deux-colonnes__inner {
        padding: 0;
    }
    .card-modernise .deux-colonnes__col--left {
        padding: 32px;
    } */
  }

@media (max-width: 1023px) {


  }

.resource-card {
    display: block;
    text-decoration: none;
    background: #BFCF5C;
    width: 571px;
    height: 335px;
    /* max-width: 571px; */
    max-width: 100%;
    outline: none;
  }

.resource-card:hover,
  .resource-card:focus-visible {
    background: #2D413C;
  }

.resource-card__inner {
    height: 100%;
    display: grid;
    grid-template-columns: 1fr;
  }

.resource-card--report .resource-card__inner {
    grid-template-columns: 1fr 200px; /* image 200x335 */
  }

.resource-card__content {
    padding: 28px 28px 24px 28px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    min-width: 0;
  }

.resource-card__title {
    margin: 0;
    font-size: 30px;
    line-height: 35px;
    font-weight: 700;
    color: #000;
    text-transform: uppercase;
  }

.resource-card:hover .resource-card__title,
  .resource-card:focus-visible .resource-card__title {
    color: #fff;
  }

.resource-card .btn--arrow {
    margin-top: 0;
    transform: rotate(-45deg);
  }

.resource-card:hover .btn--arrow,
  .resource-card:focus-visible .btn--arrow {
    --tw-border-opacity: 1;
    border-color: rgb(255 255 255 / var(--tw-border-opacity, 1));
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cg fill='none' stroke='%23FFFFFF' stroke-miterlimit='10'%3E%3Ccircle cx='20' cy='20' r='19.301'/%3E%3Cpath d='M10.598 20.202h17.429'/%3E%3Cpath d='M19.197 11.313c.347.347 8.542 8.83 8.542 8.83l-8.542 8.542'/%3E%3C/g%3E%3C/svg%3E");
}

.resource-card__action {
    display: inline-flex;
    align-items: center;
    gap: 12px;
  }

/* Variante simple ("VOIR") - tu peux remplacer par ta classe btn si tu veux */

.resource-card__see {
    font-size: 20px;
    line-height: 26px;
    font-weight: 400;
    color: #000;
    text-transform: uppercase;
    position: relative;
    padding-left: 46px;
  }

.resource-card__see::before {
    content: "↗";
    position: absolute;
    left: 0;
    top: 0;
    width: 34px;
    height: 34px;
    border: 1px solid #1a1818;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
  }

.resource-card:hover .resource-card__see,
  .resource-card:focus-visible .resource-card__see {
    color: #fff;
  }

.resource-card:hover .resource-card__see::before,
  .resource-card:focus-visible .resource-card__see::before {
    border-color: #fff;
    color: #fff;
  }

/* Variante report : on s'appuie sur ta classe btn--download fournie */

.resource-card__download {
    font-size: 20px;
    line-height: 26px;
    font-weight: 400;
    color: #000;
    text-transform: uppercase;
  }

.btn--download.resource-card__download::before {
      top: 20px;
  }

.resource-card__inner:hover .btn--download.resource-card__download::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24.32' height='20.684' viewBox='0 0 24.32 20.684'%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='none' stroke='%23FFFFFF' stroke-width='1.5' d='M0 0h24.32v20.684H0z' data-name='Rectangle 307'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg data-name='Groupe 392'%3E%3Cg data-name='Groupe 390'%3E%3Cg fill='none' stroke='%23FFFFFF' stroke-miterlimit='10' clip-path='url(%23a)' data-name='Groupe 389'%3E%3Cpath d='M12.027 0v15.302' data-name='Ligne 411'/%3E%3Cpath d='M19.786 7.816c-.3.3-7.753 7.5-7.753 7.5l-7.5-7.5' data-name='Tracé 514'/%3E%3Cpath stroke-width='1.5' d='M.109 16.848v3.727h24.1v-3.727' data-name='Tracé 515'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  }

.resource-card:hover .resource-card__download,
  .resource-card:focus-visible .resource-card__download {
    color: #fff;
  }

/* Image */

.resource-card__media {
    width: 200px;
    height: 335px;
    overflow: hidden;
  }

.resource-card__media img {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    display: block;


    /* object-fit: contain;
    display: block;
    background-color: #FFF; */
  }

.resource-card__action {
    margin-top: auto;
    display: inline-flex;
    align-items: center;
    gap: 14px;
  }

.resource-card__label {
    font-size: 20px;
    line-height: 26px;
    font-weight: 400;
    text-transform: uppercase;
    color: #000;
  }

.resource-card:hover .resource-card__label,
  .resource-card:focus-visible .resource-card__label {
    color: #fff;
  }

/* Responsive : en dessous d'une certaine largeur, on passe en 100% */

@media (max-width: 1024px) {
    .resource-card {
      width: 100%;
      height: auto;
      /* min-height: 335px; */
    }
  
    .resource-card__inner {
      height: 100%;
    }
  
    .resource-card--report .resource-card__inner {
      grid-template-columns: 1fr;
      grid-template-rows: 1fr;
    }
  
    .resource-card__media {
      width: 100%;
      height: auto;
    }
  
    .resource-card__media img {
      height: 100%;
    }
    .resource-card__title {
        font-size: 20px;
        line-height: 30px;
    }
    .resource-card__action .btn--download {
        padding-left: 36px;
    }
    .resource-card__action .btn--download::before {
        left: 0px;
    }
    .resource-card__download {
        font-size: 16px;
        line-height: 26px;
    }
    .resource-card {
        max-width: 400px;
    }
  }

@media (min-width: 1024px) and (max-width: 1280px) {
    .resource-card__title {
        font-size: 22px;
        line-height: 26px;
    }
    .resource-card__media {
        width: 200px;
        height: 100%;
    }
    .resource-card {
        height: 250px;
        max-width: 100%;
    }
  }

/* ===================================
   KEY FIGURES — COLONNES
   =================================== */

.key-figures {
    margin-top: 2rem;
}

.key-figures__inner {
    width: 100%;
  }

/* Grid: 1 mobile / 2 tablette / 4 desktop */

.key-figures__grid {
    display: grid;
    grid-template-columns: 1fr;
  }

@media (min-width: 768px) {
    .key-figures__grid {
      grid-template-columns: repeat(2, 1fr);
    }
  }

@media (min-width: 1024px) {
    .key-figures__grid {
      grid-template-columns: repeat(4, 1fr);
    }
  }

.key-figures__item {
    padding: 16px 0;
  }

/* Séparateurs verticaux — tablette (colonne de droite) */

@media (min-width: 768px) and (max-width: 1023px) {
      .key-figures__item:nth-child(even) {
          border-left: 1px solid #707070;
        }
        .key-figures__item {
            padding: 32px;
        }
    }

/* Séparateurs verticaux — desktop (entre colonnes) */

@media (min-width: 1024px) {
      .key-figures__item:not(:first-child) {
        border-left: 1px solid #707070;
      }
      .key-figures__item {
          padding: 0 36px;
      }
    }

@media screen and (min-width: 1280px) {
        .key-figures__item {
            padding: 0 60px;
        }
    }

/* Le chiffre (typo demandée) */

.key-figures__value {
    font-family: var(--font-primary, inherit);
    font-size: 60px;
    line-height: 1;
    font-weight: 500; /* Medium */
    color: #000;
    margin: 0 0 14px 0;
  }

@media (min-width: 1024px) {
    .key-figures__value {
      font-size: 90px;
    }
  }

/*
    Label + details : on n’y touche pas typographiquement.
    (On évite font-size / line-height ici.)
  */

.key-figures__label {
    margin: 0;
    text-transform: uppercase;
  }

.key-figures__details {
    margin: 0;
  }

.key-figures__empty {
    margin: 0;
  }

/* ===================================
   ENSA — TABS (full width + accordion mobile)
   =================================== */

.ensa-tabs {
    position: relative;
    background: transparent;
  }

.ensa-tabs__inner {
    margin: 0 auto;
  }

@media screen and (max-width: 767px) {
    .ensa-tabs__inner {
      width: 100vw;
      left: -36px;
      padding-left: 36px;
      padding-right: 36px;
      position: relative;
      background-color: rgba(245, 245, 245, 1);
    }
    .ensa-tabs__nav {
      width: calc(100% - 72px);
      margin: auto;
      padding-left: 36px;
      padding-right: 36px;
    }
  }

/* Nav */

.ensa-tabs__nav {
    position: relative;
    display: flex;
    align-items: stretch;
    gap: 0;
    margin: 0;
    width: 100%; 
    background: transparent; 
  }

/* Tab button */

.ensa-tabs__tab {
    position: relative;
    z-index: 2; 
    -webkit-appearance: none; 
       -moz-appearance: none; 
            appearance: none;
    border: 0;
    cursor: pointer;
    background: rgba(245, 245, 245, 0.5);
    padding: 34px 70px;
    line-height: 1;
    text-transform: uppercase;
    border-right: 2px solid white;
  }

.ensa-tabs__tab.is-active,
  .ensa-tabs__tab[aria-selected="true"] {
    background: #F5F5F5;
    margin-bottom: -1px; 
    font-weight: 700;
  }

.ensa-tabs__tab:first-child {
    border-left: 2px solid white;
  }

.ensa-tabs__tab:first-child.is-active, 
  .ensa-tabs__tab:first-child[aria-selected="true"] {
    border-left: 2px solid transparent;
  }

/* Panels */

.ensa-tabs__panels {
    position: relative;
    z-index: 1;
    padding-bottom: 60px;
  }

/* Full-bleed background */

.ensa-tabs__panels::before {
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    top: 0;
    bottom: 0;
    background: #F5F5F5;
    z-index: -1;
  }

/* ===================================
     Accordion (mobile)
     =================================== */

.ensa-tabs.is-accordion .ensa-tabs__nav {
    display: none;
  }

/* Boutons accordéon */

.ensa-tabs__acc-btn {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
  
    -webkit-appearance: none;
  
       -moz-appearance: none;
  
            appearance: none;
    border: 0;
    cursor: pointer;
  
    background: rgba(245, 245, 245, 0.5);
    padding: 22px 18px;
    text-transform: uppercase;
  
  }

/* icône flèche (simple, sans image) */

.ensa-tabs__acc-icon {
    width: 12px;
    height: 12px;
    display: inline-block;
    border-right: 2px solid #1A1818;
    border-bottom: 2px solid #1A1818;
    transform: rotate(45deg);
    margin-left: 16px;
  }

.ensa-tabs__acc-btn[aria-expanded="true"] .ensa-tabs__acc-icon {
    transform: rotate(-135deg);
  }

.ensa-tabs.is-accordion .ensa-tabs__panels {
    padding-top: 0;
    padding-bottom: 0;
  }

/* Panels dans l'accordéon */

.ensa-tabs.is-accordion .ensa-tabs__panel {
    padding-top: 24px;
    padding-bottom: 30px;
  }

/* Mobile spacing */

@media (max-width: 767px) {
    .ensa-tabs {
        background: #F5F5F5;
    }
    .ensa-tabs__acc-btn {
        padding: 22px 18px 22px 0;position: relative;
    }

    .ensa-tabs__acc-btn::before {
        position: absolute;
        content: '';
        width: 100vw;
        height: 2px;
        background: white;
        right: 0;
        left: 0;
        margin-left: calc(50% - 50vw);
        top: 0;
        bottom: 100%;
    }
  }

/* Background color left of the first tab */

.ensa-tabs__nav {
    position: relative;
  }

.ensa-tabs__nav::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    right: 100%; 
    width: 100vw; 
    background: #F5F5F5;
    z-index: 0;
  }

.ensa-tabs__tab {
    position: relative;
    z-index: 2;
  }

.ensa-tabs__nav::after {
    z-index: 1;
  }

/* ===================================
   TEAM (listing enseignants) — CSS complet
   Bordures inspirées de formations-cards
   Objectifs :
   - 2 colonnes desktop (colonnes indépendantes = la colonne en face ne bouge pas)
   - 1 colonne mobile
   - bordures : horizontales inset + verticale centrale segmentée + "trou" au croisement
   =================================== */

.team{
    width: 100%;
    padding: 38px 0 45px 0;
  }

/* Inner : garde ton container global (ne pas gérer ici) */

.team__inner{
    width: 100%;
  }

/* -----------------------------
     Variables (comme formations)
  ----------------------------- */

:root{
    --tc-line: #707070;
    --tc-stroke: 1px;
  
    /* inset horizontal des lignes (pas pleine largeur) */
    --tc-inset-x: 36px;
  
    /* espace vertical entre le contenu et les traits */
    --tc-pad-y: 36px;
  
    /* espace entre contenu et ligne centrale */
    --tc-mid-pad: 18px;
  
    /* trou au croisement (gap avec la ligne horizontale) */
    --tc-cross-gap: 14px;
  }

/* -----------------------------
     Layout colonnes
     IMPORTANT : 2 colonnes indépendantes (pas un grid de cards)
  ----------------------------- */

.team__cols{
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
    position: relative;
  }

/* On désactive absolument toute ligne centrale globale */

.team__cols::before{ content: none !important; }

.team__col{
    display: flex;
    flex-direction: column;
  }

/* -----------------------------
     Cards
  ----------------------------- */

.team__card{
    position: relative;
    display: flex;
    flex-direction: column;
    padding: var(--tc-pad-y) var(--tc-inset-x) 26px var(--tc-inset-x);
  }

/* Top */

.team__top{
    display: flex;
    gap: 18px;
    align-items: flex-start;
    flex-flow: row wrap;
  }

@media screen and (min-width: 1024px) {
    .team__top {
      flex-flow: row nowrap;
    }
  }

.team__photo{
    width: 305px;
    flex: 0 0 220px;
  }

.team__photo img{
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    display: block;
  }

/* Meta */

.team__meta{
    flex: 1 1 auto;
  }

.team__name{
    margin: 0 0 6px 0;
  }

.team__role{
    margin: 0;
  }

/* Bottom */

.team__bottom{
    margin-top: auto;
    display: flex;
    flex-direction: column;
  }

.team__toggle{
    margin-top: 10px;
    align-self: flex-end;
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    background: transparent;
    border: 0;
    cursor: pointer;
  }

.team__toggle svg{
    width: 40px;
    height: 40px;
    display: block;
  }

.team__panel{
    margin-top: 14px;
  }

.team__desc{
    margin: 32px 0 0 0;
  }

/* Gestion icônes + / - (si tu l’utilises) */

.team__toggle-icon.is-minus{ display: none; }

.team__toggle[aria-expanded="true"] .team__toggle-icon.is-plus{ display: none; }

.team__toggle[aria-expanded="true"] .team__toggle-icon.is-minus{ display: block; }

/* -----------------------------
     Desktop / Tablet : 2 colonnes
  ----------------------------- */

@media (min-width: 1024px){
    .team{
      padding: 60px 0 85px 0;
    }
  
    .team__cols{
      grid-template-columns: 1fr 1fr;
      gap: 0;
      align-items: start;
    }
  
    /* =========================================================
       BORDURES (copié logique formations-cards)
       1) Horizontales inset : sur chaque card sauf la 1ère de sa colonne
       2) Verticale centrale segmentée : dessinée sur chaque card
          - colonne gauche : trait à droite
          - colonne droite : trait à gauche
       3) "Trou" au croisement : quand une card a une séparation au-dessus,
          on décale le top de la verticale pour ne pas toucher la ligne
       ========================================================= */
  
    /* 1) horizontales inset (par colonne) */
    .team__col .team__card + .team__card::before{
      content: "";
      position: absolute;
      left: var(--tc-inset-x);
      right: var(--tc-inset-x);
      top: 0;
      height: var(--tc-stroke);
      background: var(--tc-line);
      pointer-events: none;
    }
  
    /* 2) verticale segmentée (par colonne) */
    .team__col--left .team__card{
      padding-right: calc(var(--tc-inset-x) + var(--tc-mid-pad));
      min-height: 288px;
    }
    .team__col--left .team__card::after{
      content: "";
      position: absolute;
      right: -1px;
      top: var(--tc-pad-y);
      bottom: var(--tc-pad-y);
      width: var(--tc-stroke);
      background: var(--tc-line);
      pointer-events: none;
    }
  
    .team__col--right .team__card{
      padding-left: calc(var(--tc-inset-x) + var(--tc-mid-pad));
      min-height: 288px;
    }
    .team__col--right .team__card::after{
      content: "";
      position: absolute;
      left: 0;
      top: var(--tc-pad-y);
      bottom: var(--tc-pad-y);
      width: var(--tc-stroke);
      background: var(--tc-line);
      pointer-events: none;
    }
  
    /* 3) trou au croisement : si une card a une ligne au-dessus */
    .team__col .team__card + .team__card::after{
      top: calc(var(--tc-pad-y) + var(--tc-cross-gap));
    }
  }

/* -----------------------------
     Mobile : 1 colonne + séparateurs simples
     (on garde ta logique mobile formations : border-top plein)
  ----------------------------- */

@media (max-width: 1023px){
    .team__cols{
      grid-template-columns: 1fr;
    }
  
    /* en mobile, on préfère un séparateur simple plein */
    .team__card{
      padding: 36px 0 16px 0;
      border-top: 1px solid #707070;
    }
  
    /* on coupe les pseudo bordures desktop */
    .team__card::before,
    .team__card::after{
      content: none !important;
    }
  
    /* photo plus petite */
    .team__photo{
      width: 100px;
      flex: 0 0 100px;
      height: 100px;
    }
  }

@media (min-width: 1023px){
    .team__photo{
      flex: 0 0 165px;
      height: 150px;
    }
  }

.parallaxe {

    position: relative;
    left: 50%;
    width: 100vw;
    margin-left: -50vw;
    margin-right: 0;
  
    overflow-x: clip;
  
    height: var(--parallaxe-h-desktop, 420px);
  
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
  
    background-attachment: fixed;
  }

@supports not (overflow: clip) {
    .parallaxe {
      overflow-x: hidden;
    }
  }

@media (max-width: 900px) {
    .parallaxe {
      height: var(--parallaxe-h-mobile, 260px);
      background-attachment: scroll; 
      margin-top: 32px;
    }
  }

.parallaxe__empty {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
  
    padding: 16px;
    border: 1px dashed rgba(0,0,0,.25);
    background: rgba(255,255,255,.6);
  }

.listing-posts {
  --lp-line: #707070;
  --lp-stroke: 1px;
  --lp-inset-x: 36px;
  --lp-pad-y: 50px;
  --lp-mid-pad: 18px;
  --lp-cross-gap: 14px;
  --lp-pad-bottom: 50px;
  --lp-arrow-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='37.11' height='37.11' viewBox='0 0 37.11 37.11'%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='none' stroke='%23707070' d='M0 0h37.11v37.11H0z' data-name='Rectangle 132'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg fill='none' stroke='%231a1818' stroke-miterlimit='10' clip-path='url(%23a)' data-name='Groupe 195'%3E%3Ccircle cx='17.906' cy='17.906' r='17.906' data-name='Ellipse 42' transform='translate(.649 .649)'/%3E%3Cpath d='M9.832 18.742h16.17' data-name='Ligne 204'/%3E%3Cpath d='M17.81 10.496c.322.322 7.925 8.192 7.925 8.192l-7.925 7.925' data-name='Tracé 387'/%3E%3C/g%3E%3C/svg%3E");
  width: 100%;
  padding-top: 40px;
  /* padding-bottom: 80px; */
}

.listing-posts__inner {
  width: 100%;
}

/* ---------------------------------
   Featured conférence
--------------------------------- */

.listing-posts__featured {
  margin-bottom: 24px;
}

.listing-posts__featured-card {
  padding-top: 0;
  padding-bottom: 50px;
  border-bottom: 1px solid var(--lp-line);
}

#listing-posts--type-conference .listing-posts__featured-content {
  display: contents !important;
  min-height: 100%;
}

.listing-posts__featured-title {
  margin: 0 0 24px;
  font-family: var(--wp--preset--font-family--primary, inherit);
  font-size: 3rem;
  line-height: 1.15;
  font-weight: 400;
  color: #000;
}

.listing-posts__featured-title a {
  color: inherit;
  text-decoration: none;
}

.listing-posts__featured-media {
  display: block;
  margin-bottom: 24px;
  text-decoration: none;
}

.listing-posts__featured-image {
  display: block;
  width: 100%;
  height: 335px;
  -o-object-fit: cover;
     object-fit: cover;
}

.listing-posts__featured-date {
  margin: 0 0 16px;
  font-family: TT Norms, sans-serif;
  font-size: 1.125rem;
  line-height: 1.75rem;
  text-transform: uppercase;
  font-weight: 400;
  color: rgba(0, 0, 0, 0.5);
}

.listing-posts__featured-excerpt {
  margin-top: 0;
}

.listing-posts__featured-excerpt p {
  margin: 0;
  font-family: TT Norms, sans-serif;
  font-size: 1.125rem;
  line-height: 1.75rem;
  font-weight: 400;
  color: #000;
}

.listing-posts__featured-footer {
  display: flex;
  justify-content: flex-end;
  margin-top: auto;
  padding-top: 24px;
}

.listing-posts--type-conference .listing-posts__footer {
  justify-content: space-between;
  padding-top: 0;
}

/* ---------------------------------
 Travaux étudiants : onglets style ENSA tabs
--------------------------------- */

.listing-posts__tabs {
  margin-bottom: 0;
}

.listing-posts__tabs.ensa-tabs {
  background: transparent;
}

.listing-posts__tabs .ensa-tabs__inner {
  margin: 0;
}

.listing-posts__tabs .ensa-tabs__nav {
  position: relative;
  display: flex;
  align-items: stretch;
  gap: 0;
  margin: 0;
  width: 100%;
  background: transparent;
}

.listing-posts__tabs .ensa-tabs__nav::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  right: 100%;
  width: 100vw;
  background: #f5f5f5;
  z-index: 0;
}

.listing-posts__tabs .ensa-tabs__tab {
  position: relative;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  text-decoration: none;
  cursor: pointer;
  border: 0;
  background: rgba(245, 245, 245, 0.5);
  padding: 34px 70px;
  line-height: 1;
  color: #1a1818;
  text-transform: uppercase;
  border-right: 2px solid #fff;
  font-family: var(--wp--preset--font-family--primary, inherit);
  font-size: 22px;
  font-weight: 400;
}

.listing-posts__tabs .ensa-tabs__tab:first-child {
  border-left: 2px solid #fff;
}

.listing-posts__tabs .ensa-tabs__tab.is-active,
.listing-posts__tabs .ensa-tabs__tab[aria-current="page"] {
  background: #f5f5f5;
  margin-bottom: -1px;
  font-weight: 700;
}

.listing-posts__tabs .ensa-tabs__tab:first-child.is-active,
.listing-posts__tabs .ensa-tabs__tab:first-child[aria-current="page"] {
  border-left: 2px solid transparent;
}

/* ---------------------------------
   Grid
--------------------------------- */

.listing-posts__grid {
  display: grid;
  gap: 0;
}

.listing-posts--cols-1 .listing-posts__grid {
  grid-template-columns: 1fr;
}

.listing-posts--cols-2 .listing-posts__grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.listing-posts--cols-3 .listing-posts__grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 768px) {
  .listing-posts--cols-3 .listing-posts__grid,
  .listing-posts--cols-2 .listing-posts__grid,
  .listing-posts--cols-1 .listing-posts__grid {
    grid-template-columns: 1fr;
  }
  
}

.listing-posts__card {
  position: relative;
  min-width: 0;
}

.listing-posts__content {
  display: flex;
  flex-direction: column;
  min-height: 100%;
}

/* ---------------------------------
   Cartes
--------------------------------- */

.listing-posts__title {
  margin: 0 0 24px;
  font-family: var(--wp--preset--font-family--primary, inherit);
  font-size: 30px;
  line-height: 35px;
  font-weight: 400;
  color: #000;
}

.listing-posts__title a {
  color: inherit;
  text-decoration: none;
  font-size: 30px;
  line-height: 35px;
  font-weight: 400;
  color: #000;
}

.listing-posts__media {
  display: block;
  margin-bottom: 24px;
  text-decoration: none;
}

.listing-posts__image {
  display: block;
  width: 100%;
  height: 335px;
  -o-object-fit: cover;
     object-fit: cover;
}

.listing-posts__date {
  margin: 0 0 16px;
  font-family: var(--wp--preset--font-family--primary, inherit);
  font-size: 2.3rem;
  line-height: 3.4rem;
  font-weight: 400;
  color: rgba(0, 0, 0, 0.5);
}

.listing-posts__excerpt {
  margin-top: 0;
}

.listing-posts__excerpt p {
  margin: 0;
  font-family: var(--wp--preset--font-family--primary, inherit);
  font-size: 22px;
  line-height: 28px;
  font-weight: 400;
  color: #000;
}

.listing-posts__footer {
  display: flex;
  justify-content: flex-end;
  margin-top: auto;
  padding-top: 24px;
}

/* ---------------------------------
   Boutons flèche
--------------------------------- */

.listing-posts__cta,
.listing-posts__featured-cta,
.listing-posts__pagination-arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 37px;
  height: 37px;
  text-decoration: none;
  flex: 0 0 37px;
}

.listing-posts__cta-icon,
.listing-posts__featured-cta-icon,
.listing-posts__pagination-arrow-icon {
  display: block;
  width: 37px;
  height: 37px;
  background-image: var(--lp-arrow-icon);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 37px 37px;
}

.listing-posts__pagination-arrow--prev .listing-posts__pagination-arrow-icon,
.listing-posts__pagination-arrow.is-prev .listing-posts__pagination-arrow-icon {
  transform: rotate(180deg);
}

/* ---------------------------------
   Pagination
--------------------------------- */

.listing-posts__pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 18px;
  margin-top: 56px;
  padding-bottom: 80px;
}

.listing-posts__pagination-center {
  display: flex;
  align-items: center;
  gap: 18px;
}

.listing-posts__pagination-label {
  font-family: var(--wp--preset--font-family--primary, inherit);
  font-size: 23px;
  line-height: 34px;
  font-weight: 400;
  color: rgba(0, 0, 0, 0.5);
  text-transform: uppercase;
}

.listing-posts__pagination-pages {
  display: flex;
  align-items: center;
  gap: 14px;
}

.listing-posts__pagination-page {
  font-family: var(--wp--preset--font-family--primary, inherit);
  font-size: 23px;
  line-height: 34px;
  font-weight: 400;
  color: rgba(0, 0, 0, 0.5);
  text-decoration: none;
}

.listing-posts__pagination-page.is-active {
  color: #000;
}

.listing-posts__pagination-arrow.is-disabled {
  opacity: 0.5;
  pointer-events: none;
}

.listing-posts__pagination > .listing-posts__pagination-arrow:first-child .listing-posts__pagination-arrow-icon {
  transform: rotate(180deg);
}

/* ---------------------------------
   Empty
--------------------------------- */

.listing-posts__empty {
  padding: 32px 0;
}

.type-travaux_etudiants .single-post__date {
  display: none;
}

/* ---------------------------------
   Séparateurs type maquette
   optimisés pour le layout 2 colonnes
--------------------------------- */

@media (min-width: 768px) {
  .listing-posts--cols-2 .listing-posts__card {
    padding-top: var(--lp-pad-y);
    padding-bottom: var(--lp-pad-bottom);
  }

  .listing-posts--cols-2 .listing-posts__card:nth-child(odd) {
    padding-left: 0;
    padding-right: calc(var(--lp-inset-x) + var(--lp-mid-pad));
  }

  .listing-posts--cols-2 .listing-posts__card:nth-child(even) {
    padding-left: calc(var(--lp-inset-x) + var(--lp-mid-pad));
    padding-right: 0;
  }

  /* lignes horizontales inset à partir de la 2e row */
  .listing-posts--cols-2 .listing-posts__card:nth-child(n + 3)::before {
    content: "";
    position: absolute;
    top: 0;
    height: var(--lp-stroke);
    background: var(--lp-line);
    pointer-events: none;
  }

  .listing-posts--cols-2 .listing-posts__card:nth-child(odd):nth-child(n + 3)::before {
    left: 0;
    right: var(--lp-inset-x);
  }

  .listing-posts--cols-2 .listing-posts__card:nth-child(even):nth-child(n + 3)::before {
    left: var(--lp-inset-x);
    right: 0;
  }

  /* verticale centrale segmentée */
  .listing-posts--cols-2 .listing-posts__card:nth-child(odd)::after {
    content: "";
    position: absolute;
    right: 0;
    top: var(--lp-pad-y);
    bottom: var(--lp-pad-y);
    width: var(--lp-stroke);
    background: var(--lp-line);
    pointer-events: none;
  }

  /* trou au croisement pour les rows suivantes */
  .listing-posts--cols-2 .listing-posts__card:nth-child(odd):nth-child(n + 3)::after {
    top: calc(var(--lp-pad-y) + var(--lp-cross-gap));
  }

  /* 1 colonne : simple séparation horizontale */
  .listing-posts--cols-1 .listing-posts__card {
    padding: 40px 0;
    border-top: 1px solid var(--lp-line);
  }

  .listing-posts--cols-1 .listing-posts__card:first-child {
    border-top: 0;
    padding-top: 0;
  }

  /* 3 colonnes : fallback simple */
  .listing-posts--cols-3 .listing-posts__card {
    padding: 40px 20px;
    border-top: 1px solid var(--lp-line);
  }
}

@media (max-width: 767px) {
  .listing-posts {
    padding-top: 56px;
  }

  .listing-posts__featured {
    margin-bottom: 8px;
  }

  .listing-posts__featured-card {
    padding-bottom: 36px;
  }
  
  .listing-posts__featured-image,
  .listing-posts__image {
    height: 240px;
  }

  .listing-posts__card {
    padding: 36px 0 16px;
    border-top: 1px solid var(--lp-line);
  }

  .listing-posts__card::before,
  .listing-posts__card::after {
    content: none !important;
  }

  .listing-posts__card:first-child {
    border-top: 0;
    padding-top: 0;
  }

  .listing-posts__pagination {
    gap: 12px;
    margin-top: 36px;
  }

  .listing-posts__pagination-center {
    gap: 12px;
  }

  .listing-posts__pagination-pages {
    gap: 10px;
  }

  .listing-posts__tabs.ensa-tabs {
      background: #f5f5f5;
  }
  
  .listing-posts__tabs .ensa-tabs__nav {
      flex-direction: column;
      align-items: stretch;
      padding: 0;
  }

  .listing-posts--type-travaux_etudiants .listing-posts__tabs .ensa-tabs__nav {
    padding: 0 0 32px 0;
  }

  .listing-posts--type-travaux_etudiants .listing-posts__grid {
    border-top: 1px solid #707070;
    padding-top: 32px;
  }
  
  .listing-posts__tabs .ensa-tabs__nav::before {
      display: none;
  }
  
  .listing-posts__tabs .ensa-tabs__tab {
      justify-content: space-between;
      width: 100%;
      padding: 22px 18px 22px 0;
      border: 0;
      border-top: 2px solid #fff;
      margin: 0;
      text-transform: uppercase;
  }
  
  .listing-posts__tabs .ensa-tabs__tab:first-child {
      border-left: 0;
  }
  
  .listing-posts__tabs .ensa-tabs__tab.is-active,
  .listing-posts__tabs .ensa-tabs__tab[aria-current="page"] {
      margin-bottom: 0;
  }
}

.listing-posts.is-loading {
  opacity: 0.6;
  pointer-events: none;
}

.listing-posts .bandeau-block .full-width {
  background-repeat: no-repeat;
  background-size: cover;
  left: 50%;
  margin-left: -50vw;
  margin-right: -50vw;
  position: relative;
  right: 50%;
  width: 100vw;
  padding-bottom: 80px;
}

/* ==========================================================
Listing posts – Conférences (vidéo)
À ajouter à la suite de _listing-posts.css
========================================================== */

/* ----------------------------------------------------------
 Curseur "play" sur les vignettes cliquables
 ---------------------------------------------------------- */

.listing-posts__video-trigger {
cursor: pointer;
position: relative;
display: block;
}

/* ----------------------------------------------------------
Featured conférence – mise en avant
Layout : titre + date au-dessus, image en dessous (full)
---------------------------------------------------------- */

.listing-posts__featured {
    padding-top: 2rem;
    padding-bottom: 2rem;
}

@media (min-width: 768px) {

    .listing-posts__featured {
        padding-top: 100px;
        padding-bottom: 145px;
    }
}

.listing-posts--type-conference .listing-posts__featured {
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    width: 100vw;
    --tw-bg-opacity: 1;
    background-color: rgb(245 245 245 / var(--tw-bg-opacity, 1));
}

.listing-posts--type-conference .listing-posts__grid {
padding-top: 50px;
}

.listing-posts__featured-card {
padding: 0;
border-bottom: none; /* le border est sur .listing-posts__featured */
}

.listing-posts__featured-content {
display: flex;
flex-direction: column;
gap: 0;
}

/* Titre featured */

.listing-posts__featured-title {
margin: 0 0 10px;
font-family: var(--wp--preset--font-family--primary, inherit);
font-size: 2.2rem;
line-height: 1.2;
font-weight: 400;
color: #000;
text-transform: uppercase;
letter-spacing: 0.01em;
}

.listing-posts__featured-title a {
color: inherit;
text-decoration: none;
}

.listing-posts__featured-title a:hover {
text-decoration: underline;
text-underline-offset: 3px;
}

.listing-posts--type-conference .listing-posts__featured-title a {
    font-size: 30px;
    line-height: 30px;
    text-decoration-line: none !important;
}

.listing-posts--type-conference .listing-posts__title a {
    font-size: 22px;
    line-height: 28px;
    text-decoration-line: none !important;
}

/* Image / vignette featured : pleine largeur */

.listing-posts__featured-media {
display: block;
width: 100%;
text-decoration: none;
overflow: hidden;
}

.listing-posts__featured-image {
display: block;
width: 100%;
height: auto;
aspect-ratio: 16 / 9;
-o-object-fit: cover;
   object-fit: cover;
transition: transform 0.35s ease;
}

.listing-posts__featured-media:hover .listing-posts__featured-image {
transform: scale(1.015);
}

/* ----------------------------------------------------------
Cards vidéo dans la grille
---------------------------------------------------------- */

/* La vignette dans les cards reste au ratio standard du listing */

.listing-posts__card--video .listing-posts__media {
overflow: hidden;
}

.listing-posts__card--video .listing-posts__image {
transition: transform 0.35s ease;
}

.listing-posts__card--video .listing-posts__media:hover .listing-posts__image {
transform: scale(1.015);
}

/* ----------------------------------------------------------
Responsive
---------------------------------------------------------- */

@media (max-width: 767px) {
.listing-posts__featured {
    margin-bottom: 32px;
    padding-bottom: 36px;
}

.listing-posts__featured-title {
    font-size: 1.8rem;
}
}

#glightbox-body .gprev, 
#glightbox-body .gnext {
display: none;
}

.listing-posts__featured-player {
position: relative;
width: 100%;
aspect-ratio: 16 / 9;
background: #000;
}

.listing-posts__featured-player iframe {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
border: 0;
}

/* Badge "à la une" */

.badge-une {
display: inline-block;
margin-left: 8px;
padding: 2px 8px;
font-size: 0.65em;
font-weight: 600;
line-height: 1.4;
letter-spacing: 0.06em;
text-transform: uppercase;
color: #fff;
background-color: rgb(45,65,60);
vertical-align: middle;
white-space: nowrap;
}

/* ==========================================================================
   Block: Text Image Full
   Fichier : resources/css/blocks/_text-image-full.css
   ========================================================================== */

/* --------------------------------------------------------------------------
   Variables locales (surchargeables depuis le thème)
   -------------------------------------------------------------------------- */

.block-text-image-full {
    --tif-container:   1312px;
    --tif-max-width:   1920px;
    --tif-color-title: #1a3a8c;
    --tif-color-text:  #1a1a2e;
    --tif-color-cta:   #1a6fd4;
    --tif-gap:         0px;
    --tif-section-py:  80px;
    --tif-header-pb:   48px;
}

/* --------------------------------------------------------------------------
   Évasion du container parent
   .container global = max-width: 82rem (≈1312px) + padding-inline: 1rem

   margin-inline: calc(50% - 50vw) pousse le bloc jusqu'aux bords du viewport.
   width: 100vw lui donne la pleine largeur.
   overflow: hidden empêche le scroll horizontal.
   -------------------------------------------------------------------------- */

.block-text-image-full {
    margin-inline: calc(50% - 50vw);
    width: 100vw;
    overflow: hidden;
    background-color: #F5F5F5;
}

/* --------------------------------------------------------------------------
   Wrapper interne : plafond 1920px, centré au-delà
   -------------------------------------------------------------------------- */

.tif__outer {
    width: 100%;
    max-width: var(--tif-max-width);
    margin-inline: auto;
}

/* --------------------------------------------------------------------------
   tif__container : reproduit l'alignement exact du .container global.

   Le bloc est maintenant en 100vw. Pour que le texte s'aligne sur le bord
   gauche du .container parent (max-width: 1280px centré), on utilise
   la même recette que le container global :
     max-width: 1280px + margin-inline: auto + padding-inline identique (1rem).
   -------------------------------------------------------------------------- */

.tif__container {
    width: 100%;
    max-width: var(--tif-container);
    margin-inline: auto;
    padding-inline: 1rem;
}

/* --------------------------------------------------------------------------
   En-tête : titre dans le container 1280px
   -------------------------------------------------------------------------- */

.tif__header {
    padding-bottom: var(--tif-header-pb);
}

.tif__title {
    font-weight: 900;
    color: var(--tif-color-title);
    line-height: 1.15;
    margin: 0;
}

/* --------------------------------------------------------------------------
   Corps : layout deux colonnes
   -------------------------------------------------------------------------- */

.tif__body {
    display: flex;
    align-items: stretch;
    gap: var(--tif-gap);
}

/* --------------------------------------------------------------------------
   Colonne gauche

   Elle occupe 50% du viewport (= 50vw).
   Le tif__container à l'intérieur est max-width: 640px (= 1280/2),
   calé à droite de la colonne (margin-left: auto / margin-right: 0).

   Résultat : le texte commence exactement là où commence le contenu
   d'un .container 1280px centré, aligné pixel-perfect avec les
   autres sections de la page.
   -------------------------------------------------------------------------- */

.tif__col-left {
    flex: 0 0 50%;
    width: 50%;
    display: flex;
    align-items: center;
}

.tif__col-left .tif__container {
    max-width: calc(var(--tif-container) / 2); /* 640px */
    margin-inline: auto 0;  /* calé à droite dans la colonne gauche */
    padding-right: 36px;
    padding-left: 36px;     /* aligné sur le padding du .container global */
}

/* --------------------------------------------------------------------------
   Ligne interne : décorations + texte
   -------------------------------------------------------------------------- */

.tif__content-row {
    display: flex;
    position: relative;
    align-items: flex-start;
    gap: 0;
}

.tif__text {
    flex: 1;
    z-index: 1;
}

.tif__wysiwyg {
    --tw-text-opacity: 1;
    color: rgb(26 58 122 / var(--tw-text-opacity, 1));
    font-size: 1.25rem;
    line-height: 1.5;
}

.tif__wysiwyg h1 {
    margin-bottom: 36px;
    margin-top: 36px;
}

.tif__wysiwyg p {
    margin-block: 0 24px;
}

.tif__wysiwyg p:last-child {
    margin-bottom: 0;
}

.tif__cta {
    display: inline-block;
    margin-top: 1.5rem;
    color: var(--tif-color-cta);
    font-weight: 700;
    font-size: 1rem;
    text-decoration: none;
    transition: opacity 0.2s ease;
}

.tif__cta:hover,
.tif__cta:focus-visible {
    opacity: 0.75;
    text-decoration: underline;
}

/* --------------------------------------------------------------------------
   Colonne droite : image collée au bord droit du viewport
   -------------------------------------------------------------------------- */

.tif__col-right {
    flex: 1 1 auto;
    min-width: 0;
    position: relative;
    max-height: 600px;
}

.tif__image-wrap {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 420px;
    margin-top: 5rem;
}

@media (min-width: 1024px) {

    .tif__image-wrap {
        margin-top: 0px;
    }
}

.tif__image {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    /* object-position: center; */
    -o-object-position: bottom;
       object-position: bottom;
}

.tif__image-caption {
    position: absolute;
    right: 16px;
    bottom: 12px;
    z-index: 2;
    margin: 0;
    padding: 4px 12px;
    background-color: rgba(0, 0, 0, 0.55);
    color: #fff;
    font-size: 0.75rem;
    line-height: 1.4;
    text-align: right;
}

/* --------------------------------------------------------------------------
   >= 1920px : tif__outer plafonné à 1920px et centré.
   Deux colonnes égales de 960px.
   Le texte reste aligné sur les 640px droits du container 1280px.
   -------------------------------------------------------------------------- */

@media (min-width: 1920px) {
    .tif__col-left {
        flex: 0 0 50%;
        width: 50%;
    }

    .tif__col-right {
        flex: 0 0 50%;
        width: 50%;
    }

    .tif__col-left .tif__container {
        max-width: calc(var(--tif-container) / 2);
        margin-inline: auto 0;
        padding-right: 100px;
        padding-left: 16px;
    }
}

@media (min-width: 1280px) {
    .tif__col-left .tif__container {
        padding-left: 16px;
    }
}

/* --------------------------------------------------------------------------
   Responsive tablette
   -------------------------------------------------------------------------- */

@media (max-width: 1024px) {
    .block-text-image-full {
        --tif-section-py: 60px;
        --tif-header-pb:  32px;
    }

    .tif__body {
        flex-direction: column;
    }

    .tif__col-left,
    .tif__col-right {
        width: 100%;
        flex: 0 0 auto;
    }

    .tif__col-left .tif__container {
        max-width: var(--tif-container);
        margin-inline: auto;
        padding-inline: 36px;
    }
    .tif__image-wrap {
        max-height: 400px;
        min-height: 400px;
    }
    .tif__image {
        display: block;
        width: 100%;
        height: 400px;
        -o-object-fit: cover;
           object-fit: cover;
        -o-object-position: bottom;
           object-position: bottom;
    }
}

/* --------------------------------------------------------------------------
   Responsive mobile
   -------------------------------------------------------------------------- */

@media (max-width: 640px) {
    .block-text-image-full {
        --tif-section-py: 48px;
        --tif-header-pb:  24px;
    }

    .tif__content-row {
        flex-direction: column;
        gap: 24px;
    }
    .tif__image-wrap {
        max-height: 250px;
        min-height: 250px;
    }
    .tif__image {
        height: 250px;
    }
    .tif__image-caption {
        left: 16px;
    }
}

.tif__content-row::before,
.tif__content-row::after {
    position: absolute;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    z-index: 0;
}

@media (min-width: 1280px) {
    .tif__content-row::after {
        bottom: -112px;
        left: 40px;
    }
}

/* ==========================================================================
   Block: Text Carrousel Full
   Fichier : resources/css/blocks/_text-carrousel-full.css

   Copie de "Text Image Full" — même disposition, mêmes styles, même responsive.
   Seule différence : la colonne droite affiche un carrousel Swiper (fondu,
   auto, boucle) au lieu d'une image unique.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Variables locales (surchargeables depuis le thème)
   -------------------------------------------------------------------------- */

.block-text-carrousel-full {
    --tcf-container:   1312px;
    --tcf-max-width:   1920px;
    --tcf-color-title: #1a3a8c;
    --tcf-color-text:  #1a1a2e;
    --tcf-color-cta:   #1a6fd4;
    --tcf-gap:         0px;
    --tcf-section-py:  80px;
    --tcf-header-pb:   48px;
}

/* --------------------------------------------------------------------------
   Évasion du container parent
   .container global = max-width: 82rem (≈1312px) + padding-inline: 1rem

   margin-inline: calc(50% - 50vw) pousse le bloc jusqu'aux bords du viewport.
   width: 100vw lui donne la pleine largeur.
   overflow: hidden empêche le scroll horizontal.
   -------------------------------------------------------------------------- */

.block-text-carrousel-full {
    margin-inline: calc(50% - 50vw);
    width: 100vw;
    overflow: hidden;
    background-color: #F5F5F5;
}

/* --------------------------------------------------------------------------
   Wrapper interne : plafond 1920px, centré au-delà
   -------------------------------------------------------------------------- */

.tcf__outer {
    width: 100%;
    max-width: var(--tcf-max-width);
    margin-inline: auto;
}

/* --------------------------------------------------------------------------
   tcf__container : reproduit l'alignement exact du .container global.

   Le bloc est maintenant en 100vw. Pour que le texte s'aligne sur le bord
   gauche du .container parent (max-width: 1280px centré), on utilise
   la même recette que le container global :
     max-width: 1280px + margin-inline: auto + padding-inline identique (1rem).
   -------------------------------------------------------------------------- */

.tcf__container {
    width: 100%;
    max-width: var(--tcf-container);
    margin-inline: auto;
    padding-inline: 1rem;
}

/* --------------------------------------------------------------------------
   En-tête : titre dans le container 1280px
   -------------------------------------------------------------------------- */

.tcf__header {
    padding-bottom: var(--tcf-header-pb);
}

.tcf__title {
    font-weight: 900;
    color: var(--tcf-color-title);
    line-height: 1.15;
    margin: 0;
}

/* --------------------------------------------------------------------------
   Corps : layout deux colonnes
   -------------------------------------------------------------------------- */

.tcf__body {
    display: flex;
    align-items: stretch;
    gap: var(--tcf-gap);
}

/* --------------------------------------------------------------------------
   Colonne gauche

   Elle occupe 50% du viewport (= 50vw).
   Le tcf__container à l'intérieur est max-width: 640px (= 1280/2),
   calé à droite de la colonne (margin-left: auto / margin-right: 0).

   Résultat : le texte commence exactement là où commence le contenu
   d'un .container 1280px centré, aligné pixel-perfect avec les
   autres sections de la page.
   -------------------------------------------------------------------------- */

.tcf__col-left {
    flex: 0 0 50%;
    width: 50%;
    display: flex;
    align-items: center;
}

.tcf__col-left .tcf__container {
    max-width: calc(var(--tcf-container) / 2); /* 640px */
    margin-inline: auto 0;  /* calé à droite dans la colonne gauche */
    padding-right: 36px;
    padding-left: 36px;     /* aligné sur le padding du .container global */
}

/* --------------------------------------------------------------------------
   Ligne interne : décorations + texte
   -------------------------------------------------------------------------- */

.tcf__content-row {
    display: flex;
    position: relative;
    align-items: flex-start;
    gap: 0;
}

.tcf__text {
    flex: 1;
    z-index: 1;
}

.tcf__wysiwyg {
    --tw-text-opacity: 1;
    color: rgb(26 58 122 / var(--tw-text-opacity, 1));
    font-size: 1.25rem;
    line-height: 1.5;
}

.tcf__wysiwyg h1 {
    margin-bottom: 36px;
    margin-top: 36px;
}

.tcf__wysiwyg p {
    margin-block: 0 24px;
}

.tcf__wysiwyg p:last-child {
    margin-bottom: 0;
}

.tcf__cta {
    display: inline-block;
    margin-top: 1.5rem;
    color: var(--tcf-color-cta);
    font-weight: 700;
    font-size: 1rem;
    text-decoration: none;
    transition: opacity 0.2s ease;
}

.tcf__cta:hover,
.tcf__cta:focus-visible {
    opacity: 0.75;
    text-decoration: underline;
}

/* --------------------------------------------------------------------------
   Colonne droite : carrousel collé au bord droit du viewport
   -------------------------------------------------------------------------- */

.tcf__col-right {
    flex: 1 1 auto;
    min-width: 0;
    position: relative;
    max-height: 600px;
}

.tcf__image-wrap {
    position: relative;
    width: 100%;
    height: 100%;
    min-height: 420px;
    margin-top: 5rem;
}

@media (min-width: 1024px) {

    .tcf__image-wrap {
        margin-top: 0px;
    }
}

/* --------------------------------------------------------------------------
   Carrousel Swiper : occupe exactement la place de l'ancienne image.
   Effet fondu -> les slides sont empilés (position absolute par Swiper).
   -------------------------------------------------------------------------- */

.tcf__swiper {
    width: 100%;
    height: 100%;
    position: absolute;
    inset: 0;
}

.tcf__swiper .swiper-wrapper {
    height: 100%;
}

.tcf__slide {
    position: relative;
    height: 100%;
}

/* L'effet fondu (opacité + crossFade) est géré nativement par Swiper
   via effect: 'fade'. Aucune règle d'opacité ici pour ne pas le casser. */

.tcf__image {
    display: block;
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    /* object-position: center; */
    -o-object-position: bottom;
       object-position: bottom;
}

.tcf__image-caption {
    position: absolute;
    right: 16px;
    bottom: 12px;
    z-index: 2;
    margin: 0;
    padding: 4px 12px;
    background-color: rgba(0, 0, 0, 0.55);
    color: #fff;
    font-size: 0.75rem;
    line-height: 1.4;
    text-align: right;
}

/* --------------------------------------------------------------------------
   >= 1920px : tcf__outer plafonné à 1920px et centré.
   Deux colonnes égales de 960px.
   Le texte reste aligné sur les 640px droits du container 1280px.
   -------------------------------------------------------------------------- */

@media (min-width: 1920px) {
    .tcf__col-left {
        flex: 0 0 50%;
        width: 50%;
    }

    .tcf__col-right {
        flex: 0 0 50%;
        width: 50%;
    }

    .tcf__col-left .tcf__container {
        max-width: calc(var(--tcf-container) / 2);
        margin-inline: auto 0;
        padding-right: 100px;
        padding-left: 16px;
    }
}

@media (min-width: 1280px) {
    .tcf__col-left .tcf__container {
        padding-left: 16px;
    }
}

/* --------------------------------------------------------------------------
   Responsive tablette
   -------------------------------------------------------------------------- */

@media (max-width: 1024px) {
    .block-text-carrousel-full {
        --tcf-section-py: 60px;
        --tcf-header-pb:  32px;
    }

    .tcf__body {
        flex-direction: column;
    }

    .tcf__col-left,
    .tcf__col-right {
        width: 100%;
        flex: 0 0 auto;
    }

    .tcf__col-left .tcf__container {
        max-width: var(--tcf-container);
        margin-inline: auto;
        padding-inline: 36px;
    }
    .tcf__image-wrap {
        max-height: 400px;
        min-height: 400px;
    }
    .tcf__image {
        display: block;
        width: 100%;
        height: 400px;
        -o-object-fit: cover;
           object-fit: cover;
        -o-object-position: bottom;
           object-position: bottom;
    }
}

/* --------------------------------------------------------------------------
   Responsive mobile
   -------------------------------------------------------------------------- */

@media (max-width: 640px) {
    .block-text-carrousel-full {
        --tcf-section-py: 48px;
        --tcf-header-pb:  24px;
    }

    .tcf__content-row {
        flex-direction: column;
        gap: 24px;
    }
    .tcf__image-wrap {
        max-height: 250px;
        min-height: 250px;
    }
    .tcf__image {
        height: 250px;
    }
    .tcf__image-caption {
        left: 16px;
    }
}

.tcf__content-row::before,
.tcf__content-row::after {
    position: absolute;
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    z-index: 0;
}

@media (min-width: 1280px) {
    .tcf__content-row::after {
        bottom: -112px;
        left: 40px;
    }
}

/* Import des styles globaux */

/* TT Norms - Regular (400) */

@font-face {
  font-family: "TT Norms";
  src:
    local("TT Norms Regular"),
    local("TTNorms-Regular"),
    url("/wp-content/themes/ensa-theme/fonts/TTNorms-Regular.woff2") format("woff2"),
    url("/wp-content/themes/ensa-theme/fonts/TTNorms-Regular.woff") format("woff"),
    url("/wp-content/themes/ensa-theme/fonts/TTNorms-Regular.ttf") format("ttf");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* TT Norms - Medium (500) */

@font-face {
  font-family: "TT Norms";
  src:
    local("TT Norms Medium"),
    local("TTNorms-Medium"),
    url("/wp-content/themes/ensa-theme/fonts/TTNorms-Medium.woff2") format("woff2"),
    url("/wp-content/themes/ensa-theme/fonts/TTNorms-Medium.woff") format("woff"),
    url("/wp-content/themes/ensa-theme/fonts/TTNorms-Medium.ttf") format("ttf");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

/* TT Norms - Bold (700) */

@font-face {
  font-family: "TT Norms";
  src:
    local("TT Norms Bold"),
    local("TTNorms-Bold"),
    url("/wp-content/themes/ensa-theme/fonts/TTNorms-Bold.woff2") format("woff2"),
    url("/wp-content/themes/ensa-theme/fonts/TTNorms-Bold.woff") format("woff"),
    url("/wp-content/themes/ensa-theme/fonts/TTNorms-Bold.ttf") format("ttf");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* ==========================================================================
   ENSA — base.css (WordPress + Gutenberg + ACF)
   Objectif: styles globaux stables, le layout reste dans les blocs.
   ========================================================================== */

/* ------------------------------
   Base document
------------------------------ */

html {
    overflow-x: hidden;
  }

html, body {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
    font-family: TT Norms, sans-serif;
    --tw-text-opacity: 1;
    color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}

.contact-form html,.contact-form  body {
    background: white;
    border-radius: 0.5rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    padding: 2rem;
}

.contact-info html,.contact-info  body {
    background: white;
    border-radius: 0.5rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    padding: 2rem;
}

.contact-block html.rounded-lg.shadow-lg,.contact-block  body.rounded-lg.shadow-lg {
    background: white;
    border-radius: 0.5rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    overflow: hidden;
}

@media (max-width: 768px) {
    
    .contact-form html,
    .contact-info html,.contact-form  body,
    .contact-info  body {
        padding: 1.5rem;
    }
}

@media (max-width: 480px) {
    
    .contact-form html,
    .contact-info html,.contact-form  body,
    .contact-info  body {
        padding: 1.25rem;
    }
}

body {
    font-size: 1rem;
    line-height: 1.5rem;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* Garder une base homogène sur les médias */

img, svg, video {
    height: auto;
    max-width: 100%;
}

a {
    transition-duration: 0s !important;
  }

/* ------------------------------
     Layout helpers
  ------------------------------ */

.container-ensa {
    /* Ajuste les valeurs si tu as un container Tailwind/Theme.json */
    /* @apply w-full max-w-[1440px] mx-auto px-4 md:px-10; */
  }

.section-ensa {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
}

@media (min-width: 768px) {

    .section-ensa {
        padding-top: 4rem;
        padding-bottom: 4rem;
    }
}

/* ------------------------------
     Headings (hors WYSIWYG)
     NB: On évite de styliser globalement h1/h2/h3/h4 car Gutenberg/WYSIWYG.
     On préfère des classes explicites dans les blocs (recommandé).
     Mais on garde une base pour les titres “simples” dans main.
  ------------------------------ */

/* main h1 {
    @apply font-primary text-[32px] md:text-[100px] md:leading-[110px] font-normal uppercase;
  }
  
  main h2 {
    @apply font-primary text-[30px] leading-[40px] md:text-[40px] md:leading-[50px] font-bold uppercase;
  }
  
  main h3 {
    @apply font-primary text-[40px] leading-[50px] font-bold;
  }
  
  main h4 {
    @apply font-primary text-[30px] leading-[35px] font-normal mb-4 lg:mb-[50px];
  }
  .hero-breadcrumb + #primary #main h1 {
    @apply py-8 lg:pt-[90px] lg:pb-[100px] text-[#2D413C] text-[36px] leading-[40px] md:text-[100px] md:leading-[110px];
  }  */

/* Toutes les tailles revues*/

main h1 {
    font-family: TT Norms, sans-serif;
    font-size: 36px;
    font-weight: 400;
    text-transform: uppercase;
    line-height: 36px;
}

@media (min-width: 768px) {

    main h1 {
        font-size: 60px;
        line-height: 60px;
    }
}

main h1 {
    /* overflow-wrap: anywhere; */
  }

main h2 {
    font-family: TT Norms, sans-serif;
    font-size: 25px;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 32px;
}

@media (min-width: 768px) {

    main h2 {
        font-size: 36px;
        line-height: 40px;
    }
}

main h2 {
    /* overflow-wrap: anywhere; */
  }

main h3 {
    font-family: TT Norms, sans-serif;
    font-size: 22px;
    font-weight: 700;
    line-height: 28px;
}

@media (min-width: 768px) {

    main h3 {
        font-size: 32px;
        line-height: 36px;
    }
}

#cmplz-document .cmplz-subtitle {
    margin-bottom: 1rem;
    font-family: TT Norms, sans-serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 26px;
}

@media (min-width: 768px) {

    #cmplz-document .cmplz-subtitle {
        font-size: 24px;
        line-height: 30px;
    }
}

main h4 {
    margin-bottom: 1rem;
    font-family: TT Norms, sans-serif;
    font-size: 20px;
    font-weight: 400;
    line-height: 26px;
}

@media (min-width: 768px) {

    main h4 {
        font-size: 24px;
        line-height: 30px;
    }
}

@media (min-width: 1024px) {

    main h4 {
        margin-bottom: 50px;
    }
}

.hero-breadcrumb + #primary #main h1 {
    padding-top: 2rem;
    padding-bottom: 2rem;
    font-size: 36px;
    line-height: 36px;
    --tw-text-opacity: 1;
    color: rgb(45 65 60 / var(--tw-text-opacity, 1));
}

@media (min-width: 768px) {

    .hero-breadcrumb + #primary #main h1 {
        font-size: 60px;
        line-height: 60px;
    }
}

@media (min-width: 1024px) {

    .hero-breadcrumb + #primary #main h1 {
        padding-top: 45px;
        padding-bottom: 60px;
    }
}

:where(.wp-block-columns) {
    margin-bottom: 36px;
  }

/* ------------------------------
     Texte courant (scope dans main)
  ------------------------------ */

#cmplz-document p,
  #cmplz-document span,
  #cmplz-document a,
  #cmplz-document ul,
  #cmplz-document ol,
  #cmplz-document li,
  #cmplz-document textarea,
  #cmplz-document input,
  #cmplz-document button,
  #cmplz-document label,
  #cmplz-document div,
  main p,
  main ul,
  main ol,
  main li,
  main a,
  main span,
  main textarea,
  main input,
  main button,
  main label,
  main select,
  main option {
    font-family: TT Norms, sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 20px;
}

@media (min-width: 768px) {

    #cmplz-document p,
  #cmplz-document span,
  #cmplz-document a,
  #cmplz-document ul,
  #cmplz-document ol,
  #cmplz-document li,
  #cmplz-document textarea,
  #cmplz-document input,
  #cmplz-document button,
  #cmplz-document label,
  #cmplz-document div,
  main p,
  main ul,
  main ol,
  main li,
  main a,
  main span,
  main textarea,
  main input,
  main button,
  main label,
  main select,
  main option {
        font-size: 18px;
        line-height: 22px;
    }
}

.chapeau {
    font-family: TT Norms, sans-serif;
    font-size: 22px;
    font-weight: 400;
    line-height: 28px;
}

@media (min-width: 768px) {

    .chapeau {
        font-size: 22px;
        line-height: 28px;
    }
}

hr {
    border-color: #707070;
    border-width: 1px;
    border-style: solid;
    margin-top: 36px;
    margin-bottom: 20px;
  }

/* Liens */

main a {
    text-decoration-line: underline;
    text-underline-offset: 2px;
}

a:focus {
    outline: none !important;
    box-shadow: none !important;
  }

a:focus-visible {
    outline: 2px solid #3b82f6 !important;
    outline-offset: 2px !important;
  }

#main * {
    scroll-margin-top: 104px;
  }

/* ------------------------------
     Gutenberg / WYSIWYG (rich text)
     Applique ces styles dans tes templates sur un wrapper .rte
     Exemple: <div class="rte"><?php echo wp_kses_post($content); ?></div>
  ------------------------------ */

.rte > *:first-child { margin-top: 0; }

.rte > *:last-child  { margin-bottom: 0; }

/* Espacements de base */

.wp-block-column p,
  .rte p {
    margin-top: 1rem;
    margin-bottom: 1rem;
}

/* Listes */

.rte ul,
  .rte ol {
    margin-top: 1rem;
    margin-bottom: 1rem;
    padding-left: 1.5rem;
}

.rte ul { list-style: disc; }

.rte ol { list-style: decimal; }

.rte li {
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}

/* Titres dans WYSIWYG: éviter les énormes H1 dans un texte éditorial */

.rte h1 {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
    font-family: TT Norms, sans-serif;
    font-size: 40px;
    font-weight: 400;
    text-transform: uppercase;
    line-height: 46px;
}

.rte h2 {
    margin-top: 1.5rem;
    margin-bottom: 1.5rem;
    font-family: TT Norms, sans-serif;
    font-size: 40px;
    font-weight: 500;
    line-height: 46px;
}

.rte h3 {
    margin-top: 1.25rem;
    margin-bottom: 1.25rem;
    font-family: TT Norms, sans-serif;
    font-size: 30px;
    font-weight: 700;
    line-height: 36px;
}

.rte h4 {
    margin-top: 1rem;
    margin-bottom: 1rem;
    font-family: TT Norms, sans-serif;
    font-size: 24px;
    font-weight: 400;
    line-height: 30px;
}

/* Mise en forme */

.rte strong {
    font-weight: 700;
}

.rte em {
    font-style: italic;
}

main ul,
  main ol {
    list-style: disc;
    list-style-position: inside;
    margin: 0;
  }

main li {
    margin: 0.25rem 0;
  }

/* ------------------------------
     Header nav
  ------------------------------ */

#site-header nav a {
    margin: 0px;
    font-size: 15px;
    text-transform: uppercase;
    --tw-text-opacity: 1;
    color: rgb(0 0 0 / var(--tw-text-opacity, 1));
    text-decoration-line: none;
}

#site-header nav a.active {
    font-weight: 700;
}

/* ------------------------------
     Buttons / CTAs
     Stratégie: classe sur le lien/bouton directement: .btn .btn--primary, etc.
     Tu peux toujours conserver tes wrappers .cta-* pour compat.
  ------------------------------ */

.btn,
  .btn:visited {
    margin-top: 1rem;
    display: inline-block;
    width: -moz-fit-content;
    width: fit-content;
    max-width: 100%;
    padding-left: 47px;
    padding-right: 47px;
    padding-top: 14px;
    padding-bottom: 14px;
    font-family: TT Norms, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    text-transform: uppercase;
    text-decoration-line: none;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

.footer-bandeau-content .btn,.footer-bandeau-content 
  .btn:visited {
    font-size: 0.75rem;
}

@media (min-width: 768px) {

    .btn,
  .btn:visited {
        font-size: 18px;
    }
}

/* Variantes */

.btn--primary {
    --tw-bg-opacity: 1;
    background-color: rgb(191 207 92 / var(--tw-bg-opacity, 1));
    --tw-text-opacity: 1;
    color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}

.btn--primary:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(45 65 60 / var(--tw-bg-opacity, 1));
    --tw-text-opacity: 1 !important;
    color: rgb(255 255 255 / var(--tw-text-opacity, 1)) !important;
}

.btn--secondary {
    --tw-bg-opacity: 1;
    background-color: rgb(45 65 60 / var(--tw-bg-opacity, 1));
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.btn--secondary:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
    --tw-text-opacity: 1;
    color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}

.btn--tertiary {
    --tw-bg-opacity: 1;
    background-color: rgb(191 207 92 / var(--tw-bg-opacity, 1));
    --tw-text-opacity: 1;
    color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}

.btn--tertiary:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}

/* Compat wrappers existants */

.actus-slider__ctas .cta-primary a {
  /* min-width: 170px; */
  justify-content: center;
  text-align: center;
  flex: 1 1 0;
  width: 100%;
}

.wp-block-image.actus-slider__ctas .cta-primary a img {
    width: 100%;
  }

@media (min-width: 768px) {

  .actus-slider__ctas .cta-primary a {
    min-width: 200px;
    flex: 0 0 auto;
  }
}

.cta-primary a,.cta-primary a:visited {
    margin-top: 1rem;
    display: inline-block;
    width: -moz-fit-content;
    width: fit-content;
    max-width: 100%;
    padding-left: 47px;
    padding-right: 47px;
    padding-top: 14px;
    padding-bottom: 14px;
    font-family: TT Norms, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    text-transform: uppercase;
    text-decoration-line: none;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

.footer-bandeau-content .cta-primary a,.footer-bandeau-content .cta-primary a:visited {
    font-size: 0.75rem;
}

@media (min-width: 768px) {

    .cta-primary a,.cta-primary a:visited {
        font-size: 18px;
    }
}

.cta-primary a,.cta-primary a:visited {
    margin-top: 1rem;
    display: inline-block;
    width: -moz-fit-content;
    width: fit-content;
    max-width: 100%;
    padding-left: 47px;
    padding-right: 47px;
    padding-top: 14px;
    padding-bottom: 14px;
    font-family: TT Norms, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    text-transform: uppercase;
    text-decoration-line: none;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

.footer-bandeau-content .cta-primary a,.footer-bandeau-content .cta-primary a:visited {
    font-size: 0.75rem;
}

@media (min-width: 768px) {

    .cta-primary a,.cta-primary a:visited {
        font-size: 18px;
    }
}

.cta-primary a {
    --tw-bg-opacity: 1;
    background-color: rgb(191 207 92 / var(--tw-bg-opacity, 1));
    --tw-text-opacity: 1;
    color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}

.cta-primary a:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(45 65 60 / var(--tw-bg-opacity, 1));
    --tw-text-opacity: 1 !important;
    color: rgb(255 255 255 / var(--tw-text-opacity, 1)) !important;
}

.download-list-item p.cta-primary a.btn--download {
  margin: 0;
}

.cta-secondary a,.cta-secondary a:visited {
    margin-top: 1rem;
    display: inline-block;
    width: -moz-fit-content;
    width: fit-content;
    max-width: 100%;
    padding-left: 47px;
    padding-right: 47px;
    padding-top: 14px;
    padding-bottom: 14px;
    font-family: TT Norms, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    text-transform: uppercase;
    text-decoration-line: none;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

.footer-bandeau-content .cta-secondary a,.footer-bandeau-content .cta-secondary a:visited {
    font-size: 0.75rem;
}

@media (min-width: 768px) {

    .cta-secondary a,.cta-secondary a:visited {
        font-size: 18px;
    }
}

.cta-secondary a,.cta-secondary a:visited {
    margin-top: 1rem;
    display: inline-block;
    width: -moz-fit-content;
    width: fit-content;
    max-width: 100%;
    padding-left: 47px;
    padding-right: 47px;
    padding-top: 14px;
    padding-bottom: 14px;
    font-family: TT Norms, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    text-transform: uppercase;
    text-decoration-line: none;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

.footer-bandeau-content .cta-secondary a,.footer-bandeau-content .cta-secondary a:visited {
    font-size: 0.75rem;
}

@media (min-width: 768px) {

    .cta-secondary a,.cta-secondary a:visited {
        font-size: 18px;
    }
}

.cta-secondary a {
    --tw-bg-opacity: 1;
    background-color: rgb(45 65 60 / var(--tw-bg-opacity, 1));
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.cta-secondary a:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
    --tw-text-opacity: 1;
    color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}

.download-list-item p.cta-secondary a.btn--download {
  margin: 0;
}

.cta-tertiary a,.cta-tertiary a:visited {
    margin-top: 1rem;
    display: inline-block;
    width: -moz-fit-content;
    width: fit-content;
    max-width: 100%;
    padding-left: 47px;
    padding-right: 47px;
    padding-top: 14px;
    padding-bottom: 14px;
    font-family: TT Norms, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    text-transform: uppercase;
    text-decoration-line: none;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

.footer-bandeau-content .cta-tertiary a,.footer-bandeau-content .cta-tertiary a:visited {
    font-size: 0.75rem;
}

@media (min-width: 768px) {

    .cta-tertiary a,.cta-tertiary a:visited {
        font-size: 18px;
    }
}

.cta-tertiary a,.cta-tertiary a:visited {
    margin-top: 1rem;
    display: inline-block;
    width: -moz-fit-content;
    width: fit-content;
    max-width: 100%;
    padding-left: 47px;
    padding-right: 47px;
    padding-top: 14px;
    padding-bottom: 14px;
    font-family: TT Norms, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    text-transform: uppercase;
    text-decoration-line: none;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

.footer-bandeau-content .cta-tertiary a,.footer-bandeau-content .cta-tertiary a:visited {
    font-size: 0.75rem;
}

@media (min-width: 768px) {

    .cta-tertiary a,.cta-tertiary a:visited {
        font-size: 18px;
    }
}

.cta-tertiary a {
    --tw-bg-opacity: 1;
    background-color: rgb(191 207 92 / var(--tw-bg-opacity, 1));
    --tw-text-opacity: 1;
    color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}

.cta-tertiary a:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}

.download-list-item p.cta-tertiary a.btn--download {
  margin: 0;
}

/* Download button (variante) */

.btn--download {
    position: relative;
    --tw-bg-opacity: 1;
    background-color: rgb(191 207 92 / var(--tw-bg-opacity, 1));
    --tw-text-opacity: 1;
    color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}

.btn--download:hover {
    --tw-text-opacity: 1;
    color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}

.btn--download {
    padding: 16px 20px 16px 60px;
  }

.btn--download a {
    text-decoration: none;
    --tw-text-opacity: 1;
    color: rgb(0 0 0 / var(--tw-text-opacity, 1));
  }

.btn--download a:hover {
    --tw-text-opacity: 1;
    color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}

.btn--download a {
    font-size: 18px;
  }

.btn--download::before {
    content: '';
    position: absolute;
    left: 18px;
    top: 20px;
    width: 24px;
    height: 20px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24.32' height='20.684' viewBox='0 0 24.32 20.684'%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='none' stroke='%23707070' stroke-width='1.5' d='M0 0h24.32v20.684H0z' data-name='Rectangle 307'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg data-name='Groupe 392'%3E%3Cg data-name='Groupe 390'%3E%3Cg fill='none' stroke='%231a1818' stroke-miterlimit='10' clip-path='url(%23a)' data-name='Groupe 389'%3E%3Cpath d='M12.027 0v15.302' data-name='Ligne 411'/%3E%3Cpath d='M19.786 7.816c-.3.3-7.753 7.5-7.753 7.5l-7.5-7.5' data-name='Tracé 514'/%3E%3Cpath stroke-width='1.5' d='M.109 16.848v3.727h24.1v-3.727' data-name='Tracé 515'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  }

.btn--download:hover::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24.32' height='20.684' viewBox='0 0 24.32 20.684'%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='none' stroke='%23FFFFFF' stroke-width='1.5' d='M0 0h24.32v20.684H0z' data-name='Rectangle 307'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg data-name='Groupe 392'%3E%3Cg data-name='Groupe 390'%3E%3Cg fill='none' stroke='%23FFFFFF' stroke-miterlimit='10' clip-path='url(%23a)' data-name='Groupe 389'%3E%3Cpath d='M12.027 0v15.302' data-name='Ligne 411'/%3E%3Cpath d='M19.786 7.816c-.3.3-7.753 7.5-7.753 7.5l-7.5-7.5' data-name='Tracé 514'/%3E%3Cpath stroke-width='1.5' d='M.109 16.848v3.727h24.1v-3.727' data-name='Tracé 515'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  }

.download-list-item .btn--download:hover::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24.32' height='20.684' viewBox='0 0 24.32 20.684'%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='none' stroke='%23707070' stroke-width='1.5' d='M0 0h24.32v20.684H0z' data-name='Rectangle 307'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg data-name='Groupe 392'%3E%3Cg data-name='Groupe 390'%3E%3Cg fill='none' stroke='%231a1818' stroke-miterlimit='10' clip-path='url(%23a)' data-name='Groupe 389'%3E%3Cpath d='M12.027 0v15.302' data-name='Ligne 411'/%3E%3Cpath d='M19.786 7.816c-.3.3-7.753 7.5-7.753 7.5l-7.5-7.5' data-name='Tracé 514'/%3E%3Cpath stroke-width='1.5' d='M.109 16.848v3.727h24.1v-3.727' data-name='Tracé 515'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  }

/* Compat: ton ancien .cta-download a */

.actus-slider__ctas .cta-download a {
  /* min-width: 170px; */
  justify-content: center;
  text-align: center;
  flex: 1 1 0;
  width: 100%;
}

.wp-block-image.actus-slider__ctas .cta-download a img {
    width: 100%;
  }

@media (min-width: 768px) {

  .actus-slider__ctas .cta-download a {
    min-width: 200px;
    flex: 0 0 auto;
  }
}

.cta-download a.resource-card__download::before {
      top: 20px;
  }

.resource-card__inner:hover .cta-download a.resource-card__download::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24.32' height='20.684' viewBox='0 0 24.32 20.684'%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='none' stroke='%23FFFFFF' stroke-width='1.5' d='M0 0h24.32v20.684H0z' data-name='Rectangle 307'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg data-name='Groupe 392'%3E%3Cg data-name='Groupe 390'%3E%3Cg fill='none' stroke='%23FFFFFF' stroke-miterlimit='10' clip-path='url(%23a)' data-name='Groupe 389'%3E%3Cpath d='M12.027 0v15.302' data-name='Ligne 411'/%3E%3Cpath d='M19.786 7.816c-.3.3-7.753 7.5-7.753 7.5l-7.5-7.5' data-name='Tracé 514'/%3E%3Cpath stroke-width='1.5' d='M.109 16.848v3.727h24.1v-3.727' data-name='Tracé 515'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  }

@media (max-width: 1024px) {
    .resource-card__action .cta-download a {
        padding-left: 36px;
    }
    .resource-card__action .cta-download a::before {
        left: 0px;
    }
  }

.cta-download a,.cta-download a:visited {
    margin-top: 1rem;
    display: inline-block;
    width: -moz-fit-content;
    width: fit-content;
    max-width: 100%;
    padding-left: 47px;
    padding-right: 47px;
    padding-top: 14px;
    padding-bottom: 14px;
    font-family: TT Norms, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    text-transform: uppercase;
    text-decoration-line: none;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

.footer-bandeau-content .cta-download a,.footer-bandeau-content .cta-download a:visited {
    font-size: 0.75rem;
}

@media (min-width: 768px) {

    .cta-download a,.cta-download a:visited {
        font-size: 18px;
    }
}

.cta-download a,.cta-download a:visited {
    margin-top: 1rem;
    display: inline-block;
    width: -moz-fit-content;
    width: fit-content;
    max-width: 100%;
    padding-left: 47px;
    padding-right: 47px;
    padding-top: 14px;
    padding-bottom: 14px;
    font-family: TT Norms, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    text-transform: uppercase;
    text-decoration-line: none;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

.footer-bandeau-content .cta-download a,.footer-bandeau-content .cta-download a:visited {
    font-size: 0.75rem;
}

@media (min-width: 768px) {

    .cta-download a,.cta-download a:visited {
        font-size: 18px;
    }
}

.cta-download a {
    --tw-bg-opacity: 1;
    background-color: rgb(191 207 92 / var(--tw-bg-opacity, 1));
    --tw-text-opacity: 1;
    color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}

.cta-download a:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(45 65 60 / var(--tw-bg-opacity, 1));
    --tw-text-opacity: 1 !important;
    color: rgb(255 255 255 / var(--tw-text-opacity, 1)) !important;
}

.cta-download a {
    position: relative;
    --tw-bg-opacity: 1;
    background-color: rgb(191 207 92 / var(--tw-bg-opacity, 1));
    --tw-text-opacity: 1;
    color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}

.cta-download a:hover {
    --tw-text-opacity: 1;
    color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}

.cta-download a {
    padding: 16px 20px 16px 60px;
  }

.cta-download a a {
    text-decoration: none;
    --tw-text-opacity: 1;
    color: rgb(0 0 0 / var(--tw-text-opacity, 1));
  }

.cta-download a a:hover {
    --tw-text-opacity: 1;
    color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}

.cta-download a a {
    font-size: 18px;
  }

.cta-download a::before {
    content: '';
    position: absolute;
    left: 18px;
    top: 20px;
    width: 24px;
    height: 20px;
    background-size: contain;
    background-repeat: no-repeat;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24.32' height='20.684' viewBox='0 0 24.32 20.684'%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='none' stroke='%23707070' stroke-width='1.5' d='M0 0h24.32v20.684H0z' data-name='Rectangle 307'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg data-name='Groupe 392'%3E%3Cg data-name='Groupe 390'%3E%3Cg fill='none' stroke='%231a1818' stroke-miterlimit='10' clip-path='url(%23a)' data-name='Groupe 389'%3E%3Cpath d='M12.027 0v15.302' data-name='Ligne 411'/%3E%3Cpath d='M19.786 7.816c-.3.3-7.753 7.5-7.753 7.5l-7.5-7.5' data-name='Tracé 514'/%3E%3Cpath stroke-width='1.5' d='M.109 16.848v3.727h24.1v-3.727' data-name='Tracé 515'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  }

.cta-download a:hover::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24.32' height='20.684' viewBox='0 0 24.32 20.684'%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='none' stroke='%23FFFFFF' stroke-width='1.5' d='M0 0h24.32v20.684H0z' data-name='Rectangle 307'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg data-name='Groupe 392'%3E%3Cg data-name='Groupe 390'%3E%3Cg fill='none' stroke='%23FFFFFF' stroke-miterlimit='10' clip-path='url(%23a)' data-name='Groupe 389'%3E%3Cpath d='M12.027 0v15.302' data-name='Ligne 411'/%3E%3Cpath d='M19.786 7.816c-.3.3-7.753 7.5-7.753 7.5l-7.5-7.5' data-name='Tracé 514'/%3E%3Cpath stroke-width='1.5' d='M.109 16.848v3.727h24.1v-3.727' data-name='Tracé 515'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  }

.download-list-item .cta-download a:hover::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24.32' height='20.684' viewBox='0 0 24.32 20.684'%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='none' stroke='%23707070' stroke-width='1.5' d='M0 0h24.32v20.684H0z' data-name='Rectangle 307'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg data-name='Groupe 392'%3E%3Cg data-name='Groupe 390'%3E%3Cg fill='none' stroke='%231a1818' stroke-miterlimit='10' clip-path='url(%23a)' data-name='Groupe 389'%3E%3Cpath d='M12.027 0v15.302' data-name='Ligne 411'/%3E%3Cpath d='M19.786 7.816c-.3.3-7.753 7.5-7.753 7.5l-7.5-7.5' data-name='Tracé 514'/%3E%3Cpath stroke-width='1.5' d='M.109 16.848v3.727h24.1v-3.727' data-name='Tracé 515'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  }

.resource-card:hover .cta-download a {
    background: #2D413C;
  }

.download-list-item p.cta-download a.btn--download {
  margin: 0;
}

.download-list-item p.btn.cta-download a {
  margin: 0;
}

.cta-download a a {
    font-size: 12px;
}

@media (min-width: 640px) {

    .cta-download a a {
        font-size: 15px;
    }
}

.cta-download a::before {
    top: 16px;
  }

.cta-download a:hover::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24.32' height='20.684' viewBox='0 0 24.32 20.684'%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='none' stroke='%23FFFFFF' stroke-width='1.5' d='M0 0h24.32v20.684H0z' data-name='Rectangle 307'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg data-name='Groupe 392'%3E%3Cg data-name='Groupe 390'%3E%3Cg fill='none' stroke='%23FFFFFF' stroke-miterlimit='10' clip-path='url(%23a)' data-name='Groupe 389'%3E%3Cpath d='M12.027 0v15.302' data-name='Ligne 411'/%3E%3Cpath d='M19.786 7.816c-.3.3-7.753 7.5-7.753 7.5l-7.5-7.5' data-name='Tracé 514'/%3E%3Cpath stroke-width='1.5' d='M.109 16.848v3.727h24.1v-3.727' data-name='Tracé 515'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  }

/* Arrow button (icon-only) */

.btn--arrow {
    display: inline-flex;
    height: 40px;
    width: 40px;
    min-width: 40px;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    border-width: 1px;
    --tw-border-opacity: 1;
    border-color: rgb(26 24 24 / var(--tw-border-opacity, 1));
    padding: 0px;
    background: transparent;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 40px 40px;

    /* SVG noir */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cg fill='none' stroke='%231a1818' stroke-miterlimit='10'%3E%3Ccircle cx='20' cy='20' r='19.301'/%3E%3Cpath d='M10.598 20.202h17.429'/%3E%3Cpath d='M19.197 11.313c.347.347 8.542 8.83 8.542 8.83l-8.542 8.542'/%3E%3C/g%3E%3C/svg%3E");
}

/* Hover / focus-visible : transparent + tout en blanc */

.btn--arrow:hover,
  .btn--arrow:focus-visible {
    --tw-border-opacity: 1;
    border-color: rgb(255 255 255 / var(--tw-border-opacity, 1));
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cg fill='none' stroke='%23FFFFFF' stroke-miterlimit='10'%3E%3Ccircle cx='20' cy='20' r='19.301'/%3E%3Cpath d='M10.598 20.202h17.429'/%3E%3Cpath d='M19.197 11.313c.347.347 8.542 8.83 8.542 8.83l-8.542 8.542'/%3E%3C/g%3E%3C/svg%3E");
}

/* Accessibilité */

.btn--arrow:focus-visible {
    outline: 2px solid #fff; /* ou #1a1818 selon contexte */
    outline-offset: 3px;
  }

.resource-card:hover .btn--download {
    background: #2D413C;
  }

.resource-card .cta-arrow a {
    margin-top: 0;
    transform: rotate(-45deg);
  }

.resource-card:hover .cta-arrow a,
  .resource-card:focus-visible .cta-arrow a {
    --tw-border-opacity: 1;
    border-color: rgb(255 255 255 / var(--tw-border-opacity, 1));
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cg fill='none' stroke='%23FFFFFF' stroke-miterlimit='10'%3E%3Ccircle cx='20' cy='20' r='19.301'/%3E%3Cpath d='M10.598 20.202h17.429'/%3E%3Cpath d='M19.197 11.313c.347.347 8.542 8.83 8.542 8.83l-8.542 8.542'/%3E%3C/g%3E%3C/svg%3E");
}

.cta-arrow a,.cta-arrow a:visited {
    margin-top: 1rem;
    display: inline-block;
    width: -moz-fit-content;
    width: fit-content;
    max-width: 100%;
    padding-left: 47px;
    padding-right: 47px;
    padding-top: 14px;
    padding-bottom: 14px;
    font-family: TT Norms, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    text-transform: uppercase;
    text-decoration-line: none;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

.footer-bandeau-content .cta-arrow a,.footer-bandeau-content .cta-arrow a:visited {
    font-size: 0.75rem;
}

@media (min-width: 768px) {

    .cta-arrow a,.cta-arrow a:visited {
        font-size: 18px;
    }
}

.cta-arrow a,.cta-arrow a:visited {
    margin-top: 1rem;
    display: inline-block;
    width: -moz-fit-content;
    width: fit-content;
    max-width: 100%;
    padding-left: 47px;
    padding-right: 47px;
    padding-top: 14px;
    padding-bottom: 14px;
    font-family: TT Norms, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    text-transform: uppercase;
    text-decoration-line: none;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

.footer-bandeau-content .cta-arrow a,.footer-bandeau-content .cta-arrow a:visited {
    font-size: 0.75rem;
}

@media (min-width: 768px) {

    .cta-arrow a,.cta-arrow a:visited {
        font-size: 18px;
    }
}

.cta-arrow a {
    display: inline-flex;
    height: 40px;
    width: 40px;
    min-width: 40px;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    border-width: 1px;
    --tw-border-opacity: 1;
    border-color: rgb(26 24 24 / var(--tw-border-opacity, 1));
    padding: 0px;
    background: transparent;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 40px 40px;

    /* SVG noir */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cg fill='none' stroke='%231a1818' stroke-miterlimit='10'%3E%3Ccircle cx='20' cy='20' r='19.301'/%3E%3Cpath d='M10.598 20.202h17.429'/%3E%3Cpath d='M19.197 11.313c.347.347 8.542 8.83 8.542 8.83l-8.542 8.542'/%3E%3C/g%3E%3C/svg%3E");
}

.cta-arrow a:hover,.cta-arrow a:focus-visible {
    --tw-border-opacity: 1;
    border-color: rgb(255 255 255 / var(--tw-border-opacity, 1));
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cg fill='none' stroke='%23FFFFFF' stroke-miterlimit='10'%3E%3Ccircle cx='20' cy='20' r='19.301'/%3E%3Cpath d='M10.598 20.202h17.429'/%3E%3Cpath d='M19.197 11.313c.347.347 8.542 8.83 8.542 8.83l-8.542 8.542'/%3E%3C/g%3E%3C/svg%3E");
}

.cta-arrow a:focus-visible {
    outline: 2px solid #fff; /* ou #1a1818 selon contexte */
    outline-offset: 3px;
  }

.download-list-item p.cta-arrow a.btn--download {
  margin: 0;
}

/* ------------------------------
     Forms (base)
  ------------------------------ */

input, textarea, select {
    width: 100%;
    max-width: 100%;
}

input.wp-block-image img, textarea.wp-block-image img, select.wp-block-image img {
    width: 100%;
  }

/* ------------------------------
     Réduction motion (accessibilité)
     Désactivé pour le moment
  ------------------------------ */

/* @media (prefers-reduced-motion: reduce) {
    * {
      scroll-behavior: auto !important;
      transition-duration: 0ms !important;
      animation-duration: 0ms !important;
    }
  } */

.wp-block-create-block-bandeau-block {
    --tw-text-opacity: 1;
    color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}

.wp-block-create-block-bandeau-block > .container {
    padding-left: 2.25rem;
    padding-right: 2.25rem;
}

:where(.wp-block-columns.is-layout-flex) {
    gap: 1rem;
}

@media (min-width: 768px) {

    :where(.wp-block-columns.is-layout-flex) {
        gap: 2rem;
    }
}

@media (min-width: 1280px) {

    :where(.wp-block-columns.is-layout-flex) {
        gap: 90px;
    }
}

.wp-block-image.w-full img {
    width: 100%;
  }

.download-list-item {
    border-bottom-width: 1px;
    --tw-border-opacity: 1;
    border-color: rgb(0 0 0 / var(--tw-border-opacity, 1));
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
}

.download-list-item:last-child {
    border-bottom-width: 0px;
}

.download-list-item p.btn.btn--download {
  margin: 0;
}

.download-list-2 {
    gap: 1.5rem !important;
    padding-bottom: 1.5rem;
}

@media (min-width: 768px) {

    .download-list-2 {
        gap: 45px !important;
        padding-bottom: 46px;
    }
}

.download-list-2:last-of-type {
    border-bottom-width: 0px !important;
}

.btn--download a {
    font-size: 12px;
}

@media (min-width: 640px) {

    .btn--download a {
        font-size: 15px;
    }
}

main a {
  text-decoration: none;
  font-weight: inherit;
}

main a:hover {
  color: inherit !important;
  text-decoration: none;
  font-weight: inherit;
}

.picto-tel,
.picto-insta,
.picto-linkedin,
.picto-facebook{
    padding-left: 55px;
    min-height: 36px;
    background-size: 35px;
    background-repeat: no-repeat;
    background-position: left center;
}

.picto-tel {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='35' height='35' viewBox='0 0 35 35'%3E%3Cdefs%3E%3CclipPath id='clip-path'%3E%3Crect id='Rectangle_78' data-name='Rectangle 78' width='20' height='20' transform='translate(-0.019 -0.019)' fill='%23fff'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg id='Groupe_467' data-name='Groupe 467' transform='translate(-964 -1345)'%3E%3Ccircle id='Ellipse_99' data-name='Ellipse 99' cx='17.5' cy='17.5' r='17.5' transform='translate(964 1345)'/%3E%3Cg id='Groupe_250' data-name='Groupe 250' transform='translate(972.019 1351.737)'%3E%3Cg id='Groupe_85' data-name='Groupe 85' transform='translate(0 0.281)' clip-path='url(%23clip-path)'%3E%3Cpath id='Tracé_334' data-name='Tracé 334' d='M19.5,15l-3.862-2.315a1.48,1.48,0,0,0-1.843.255c-.373.382-.724.785-1.1,1.168a1.406,1.406,0,0,1-1.733.234,15.914,15.914,0,0,1-3.094-2.42A15.845,15.845,0,0,1,5.436,8.735,1.263,1.263,0,0,1,5.7,7.185L7.038,6.017A1.361,1.361,0,0,0,7.344,4.36l-2-3.588A1.513,1.513,0,0,0,3.24.22H3.218C.542,1.813-.95,3.914.674,7.886a21.8,21.8,0,0,0,4.981,7.219,19.849,19.849,0,0,0,6.276,4.353c3.094,1.38,5.442.658,6.934-1.146.329-.425.68-.828,1.01-1.252A1.39,1.39,0,0,0,19.5,15Z' transform='translate(0 -0.216)' fill='%23fff'/%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E%0A");
}

.picto-insta {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='34.205' height='35.436' viewBox='0 0 34.205 35.436'%3E%3Cg data-name='Groupe 468'%3E%3Cg data-name='Groupe 249'%3E%3Cpath d='M17.103 14.146a3.571 3.571 0 1 0 3.574 3.571 3.57 3.57 0 0 0-3.571-3.571' data-name='Tracé 439'/%3E%3Cpath d='M17.102-.001c-9.445 0-17.1 7.932-17.1 17.718s7.657 17.718 17.1 17.718 17.1-7.932 17.1-17.718S26.548-.001 17.102-.001m11.179 24.546a4.687 4.687 0 0 1-4.588 4.754H10.512a4.687 4.687 0 0 1-4.588-4.754V10.889a4.687 4.687 0 0 1 4.588-4.753h13.181a4.687 4.687 0 0 1 4.588 4.753Z' data-name='Tracé 440'/%3E%3Cpath d='M23.074 8.517H11.132a2.72 2.72 0 0 0-2.614 2.8v12.794a2.72 2.72 0 0 0 2.614 2.8h11.942a2.72 2.72 0 0 0 2.614-2.8v-12.8a2.72 2.72 0 0 0-2.614-2.8m-5.97 15.5a6.315 6.315 0 1 1 5.878-6.3 6.1 6.1 0 0 1-5.878 6.3m5.878-10.993a1.609 1.609 0 1 1 1.5-1.606 1.555 1.555 0 0 1-1.5 1.606' data-name='Tracé 441'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
}

.picto-linkedin {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='35' height='35.062' viewBox='0 0 35 35.062'%3E%3Cpath d='M17.5 0A17.531 17.531 0 1 0 35 17.531 17.516 17.516 0 0 0 17.5 0m-5.246 27.413H7.411V12.932h4.843Zm-2.678-15.73A2.683 2.683 0 1 1 12.254 9a2.68 2.68 0 0 1-2.678 2.683m18.388 15.51h-3.681v-8.98a2.85 2.85 0 0 0-.743-2.142 2.49 2.49 0 0 0-1.792-.719 3.41 3.41 0 0 0-2.519 1.11 4.62 4.62 0 0 0-1.081 3.344v7.385h-3.684V12.82h3.358v3.33q1.759-3.628 4.94-3.629a5.78 5.78 0 0 1 3.673 1.2q1.526 1.2 1.526 4.2Z' data-name='Tracé 445'/%3E%3C/svg%3E");
}

.picto-facebook {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='35' height='36' viewBox='0 0 35 36'%3E%3Cg data-name='Groupe 469' transform='translate(-956 -1588)'%3E%3Ccircle cx='17.5' cy='17.5' r='17.5' data-name='Ellipse 98' transform='translate(956 1588)'/%3E%3Cpath fill='%23fff' d='M970.747 1623.961v-10.84a.215.215 0 0 0-.215-.215h-3.808a.215.215 0 0 1-.215-.215v-4.352a.215.215 0 0 1 .214-.215l3.811-.023a.215.215 0 0 0 .214-.215v-3.966s-.186-5.188 4.34-5.239 5.4 0 5.4 0v4.1l-3.15.017a1.233 1.233 0 0 0-1.306 1.119v3.931a.215.215 0 0 0 .217.215l4.022-.024a.215.215 0 0 1 .214.249l-.711 4.434a.215.215 0 0 1-.212.181h-3.31a.215.215 0 0 0-.215.215V1624' data-name='Tracé 444'/%3E%3C/g%3E%3C/svg%3E");
}

.encart .picto-tel,
.encart .picto-mail {
  padding-left: 55px;
  min-height: 28px;
  background-size: 28px;
  background-repeat: no-repeat;
  background-position: left center;
}

.encart .picto-tel {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='27.087' height='28' viewBox='0 0 27.087 28'%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='none' d='M0 0h27.087v28H0z' data-name='Rectangle 90'/%3E%3C/clipPath%3E%3C/defs%3E%3Cg clip-path='url(%23a)' data-name='Groupe 96'%3E%3Cpath d='M5.412 1.042a.97.97 0 0 1 .853.52l2.672 4.964a.9.9 0 0 1-.184 1.057L6.956 9.2l-.021.019a2.84 2.84 0 0 0-.551 3.4v.019a23 23 0 0 0 3.424 4.625 22.4 22.4 0 0 0 4.352 3.518 2.8 2.8 0 0 0 1.51.436 2.9 2.9 0 0 0 2.132-.936c.258-.274.509-.554.749-.825s.477-.533.717-.789l.006-.006a.93.93 0 0 1 .687-.312.87.87 0 0 1 .467.136l5.207 3.21a.927.927 0 0 1 .231 1.341l-.006.006v.006c-.208.283-.429.556-.66.845s-.458.578-.685.879a5.44 5.44 0 0 1-4.4 2.184 8.8 8.8 0 0 1-3.653-.906 25.6 25.6 0 0 1-8.12-5.823 29.15 29.15 0 0 1-6.459-9.669C.942 8.216.793 6.322 1.41 4.776a7.58 7.58 0 0 1 3.207-3.43h.027L4.9 1.19a.96.96 0 0 1 .513-.15M5.408 0a2 2 0 0 0-1.057.305h-.03C.728 2.518-1.275 5.433.9 10.943a30.4 30.4 0 0 0 6.692 10.018A26.7 26.7 0 0 0 16.018 27a9.8 9.8 0 0 0 4.082 1 6.51 6.51 0 0 0 5.223-2.591c.442-.589.914-1.15 1.351-1.738a1.965 1.965 0 0 0-.5-2.858L21 17.6a1.9 1.9 0 0 0-1.021-.3 1.97 1.97 0 0 0-1.456.649c-.5.531-.973 1.09-1.473 1.621a1.87 1.87 0 0 1-1.371.6 1.77 1.77 0 0 1-.957-.276 21.4 21.4 0 0 1-4.153-3.359 22 22 0 0 1-3.272-4.418 1.8 1.8 0 0 1 .353-2.148l1.8-1.62a1.93 1.93 0 0 0 .416-2.3L7.179 1.074A2.01 2.01 0 0 0 5.412 0Z' data-name='Tracé 342'/%3E%3C/g%3E%3C/svg%3E");
}

.encart .picto-mail {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='30' height='20' viewBox='0 0 30 20'%3E%3Cpath d='M1 19.067V1.666L15 14.7l14-13v17.368Zm.833-18.033h26.334L15 13.3ZM0 20h30V0H0Z' data-name='Tracé 629' opacity='.611'/%3E%3C/svg%3E");
}

hr, .wp-block-separator {
  border-bottom: 1px solid #707070;
  width: calc(100% - 16px);
  margin-top: 2rem;
  margin-bottom: 2rem;
}

@media (min-width: 768px) {

    hr, .wp-block-separator {
        margin-top: 70px;
        margin-bottom: 70px;
    }
}

/* WP Tables */

.wp-block-table table th:first-child,
.wp-block-table table td:first-child {
  width: 150px;
}

@media (min-width: 1024px) {
  .wp-block-table table th:first-child,
  .wp-block-table table td:first-child {
    width: 300px;
  }
}

.wp-block-table table th {
  text-align: left;
}

.wp-block-table thead {
  border-bottom: 1px solid !important;
}

/* ===================================
   NAVIGATION ET MENU MOBILE
   =================================== */

/* Menu burger */

.mobile-menu-toggle {
    display: none;
    flex-direction: column;
    justify-content: space-around;
    width: 30px;
    height: 25px;
    background: transparent;
    border: none;
    cursor: pointer;
    padding: 0;
    z-index: 1000;
}

.mobile-menu-toggle span {
    width: 100%;
    height: 3px;
    /* background-color: currentColor; */
    /* border-radius: 2px; */
    transition: all 0.3s ease;
    transform-origin: center;
}

/* Animation du burger en croix */

.mobile-menu-toggle.active span:nth-child(1) {
    width: 100%;
    /* transform: rotate(45deg) translate(6px, 6px); */
}

.mobile-menu-toggle.active span:nth-child(2) {
    /* opacity: 0; */
}

.mobile-menu-toggle.active span:nth-child(3) {
    /* transform: rotate(-45deg) translate(6px, -6px); */
    width: 100%;
}

/* Variables pour le menu */

:root {
    --header-height: 72px;
    --secondary-menu-height: 48px;
}

/* main margin-top est géré dynamiquement par le JavaScript */

/* Menu mobile */

.mobile-menu {
    display: none;
    position: fixed;
    inset: 0;
    width: 100%;
    background-color: #2D413C !important;
    
    z-index: 999;
    transform: translateX(100%);
    transition: transform 0.3s ease-in-out;
    display: flex;
    flex-direction: column;
    
    overflow-y: scroll;
    overflow-x: hidden;
}

.mobile-menu.active {
    transform: translateX(0);
    background-color: #2D413C !important;
}

.mobile-menu-scroll {
    flex: 1;
    height: 100%;
}

.mobile-menu-root {
    height: 100%;
    display: flex;
    flex-direction: column;
    width: 100%;
    max-width: 100%;
}

.mobile-menu .mobile-nav {
    flex: 1;
}

.mobile-menu-list {
    list-style: none;
    margin: 0;
    padding: 32px 24px 16px;
    height: 100%;
    overflow-y: auto;
    width: 100%;
}

.mobile-menu-list > li:not(:last-child) {
    border-bottom: 1px solid rgba(178, 178, 177, 0.35);
}

.mobile-menu-list > li > a {
    display: block;
    width: 100%;
    padding: 18px 0;
    color: #B2B2B1;
    text-decoration: none;
    font-size: 16px;
    font-weight: 500;
    text-transform: uppercase;
    overflow-wrap: anywhere;
}

.mobile-menu-list > li > a:hover,
.mobile-menu-list > li > a:focus {
    color: #ffffff;
}

/* Panneaux plein écran pour sous-menus */

.mobile-menu-panel {
    position: fixed;
    inset: 0;
    width: 100%;
    max-width: 100%;
    background-color: #2D413C;
    transform: translateX(100%);
    transition: transform 0.3s ease-in-out;
    z-index: 10;
    display: none;
    flex-direction: column;
}

.mobile-menu-panel.is-open {
    display: flex;
    transform: translateX(0);
}

.mobile-menu-panel__header {
    padding: 24px;
    border-bottom: 1px solid rgba(178, 178, 177, 0.35);
}

.mobile-menu-panel__body {
    flex: 1;
    padding: 8px 24px 24px;
    overflow-y: auto;
}

.mobile-menu-back {
    width: 100%;
    text-align: left;
    background: transparent;
    border: none;
    color: #B2B2B1;
    font-size: 14px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    cursor: pointer;
}

.mobile-menu-back:hover,
.mobile-menu-back:focus {
    color: #ffffff;
}

.mobile-menu .sub-menu {
    list-style: none;
    margin: 0;
    padding: 0;
}

.mobile-menu .sub-menu li {
    border-bottom: 1px solid rgba(178, 178, 177, 0.35);
}

.mobile-menu .sub-menu a {
    display: block;
    width: 100%;
    padding: 18px 0;
    color: #B2B2B1;
    text-decoration: none;
    font-size: 16px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    overflow-wrap: anywhere;
}

.mobile-menu .sub-menu a:hover,
.mobile-menu .sub-menu a:focus {
    color: #ffffff;
}

.mobile-menu-panel-footer {
    padding: 16px 24px;
    border-top: 1px solid rgba(178, 178, 177, 0.35);
}

.mobile-social-menu {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 12px;
    align-items: center;
}

.mobile-social-item {
    margin: 0;
}

/* Accès rapides */

.quick-actions-rail {
    position: fixed;
    right: 1rem;
    top: 50%;
    transform: translateY(-50%);
    z-index: 100;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.quick-action {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.5rem;
    padding: 1rem;
    background-color: white;
    color: #374151;
    text-decoration: none;
    border-radius: 0.5rem;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
    transition: all 0.2s ease;
    min-width: 80px;
}

.quick-action:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
    background-color: #f3f4f6;
}

.quick-action-icon {
    font-size: 1.5rem;
}

.quick-action-label {
    font-size: 0.75rem;
    font-weight: 500;
    text-align: center;
    line-height: 1.2;
}

/* Accès rapides dans le menu mobile */

.mobile-quick-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin-top: 1rem;
}

.mobile-quick-action {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background-color: rgba(255, 255, 255, 0.1);
    color: white;
    text-decoration: none;
    border-radius: 0.5rem;
    transition: background-color 0.2s ease;
}

.mobile-quick-action:hover {
    background-color: rgba(255, 255, 255, 0.2);
}

.mobile-quick-action .quick-action-icon {
    font-size: 1.25rem;
}

.mobile-quick-action .quick-action-label {
    font-size: 0.875rem;
    color: white;
}

/* Footer du menu mobile */

.mobile-menu .mobile-menu-footer {
    padding-top: 2rem;
    border-top: 1px solid rgba(255, 255, 255, 0.1);
}

/* Accès rapides dans le menu mobile */

.mobile-menu .mobile-quick-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
    margin-top: 1rem;
}

.mobile-menu .mobile-quick-actions .quick-action {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    padding: 0.75rem 1rem;
    background-color: rgba(255, 255, 255, 0.1);
    color: white;
    text-decoration: none;
    border-radius: 0.5rem;
    transition: background-color 0.2s ease;
}

.mobile-menu .mobile-quick-actions .quick-action:hover {
    background-color: rgba(255, 255, 255, 0.2);
}

/* État du body quand le menu est ouvert */

body.menu-open {
    overflow: hidden;
}

/* Header sticky et scroll */

#site-header.is-sticky {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    box-shadow: 0 2px 20px rgba(0, 0, 0, 0.1);
    animation: slideDown 0.3s ease-out;
}

#site-header.header-hidden {
    transform: translateY(-100%);
    transition: transform 0.3s ease-in-out;
}

@keyframes slideDown {
    from {
        transform: translateY(-100%);
    }
    to {
        transform: translateY(0);
    }
}

/* Navigation desktop */

.desktop-nav {
    display: flex;
    align-items: center;
    gap: 1.75rem;
}

.desktop-nav ul {
    display: flex;
    list-style: none;
    margin: 0 !important;
    padding: 0;
}

.desktop-nav ul#menu-menu-principal,
.desktop-nav ul#menu-reseaux-sociaux {
    gap: 0.5rem;
}

.desktop-nav a {
    color: inherit;
    text-decoration: none;
    font-weight: 400;
    transition: color 0.2s ease;
    position: relative;
}

.desktop-nav > ul > li > a {
    display: block;
    transition: all 0.3s ease-in-out;
    transform: translateX(0);
}

#menu-menu-principal > li > a:focus-within,
#menu-menu-principal > li > a:hover,
#menu-menu-principal > li.current-menu-item > a,
#menu-menu-principal > li.current-menu-ancestor > a {
    color:  #000000 !important;
    font-weight: bold;
}

/* Sous-menus desktop */

.desktop-nav .menu-item-has-children {
    position: relative;
}

.desktop-nav .sub-menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 514px;
    background-color: #F5F5F5 !important;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
    padding: 0.5rem 0;
    z-index: 100;
}

.desktop-nav .menu-item-has-children:hover > .sub-menu {
    display: block;
}

/* Sous-sous-menus desktop (menu simple) */

.desktop-nav .sub-menu .menu-item-has-children {
    position: relative;
}

.desktop-nav .sub-menu .sub-menu {
    display: none;
    position: absolute;
    top: 0;
    left: 100%;
    min-width: 200px;
    background-color: #F5F5F5;
    border-radius: 0.5rem;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
    padding: 0.5rem 0;
    z-index: 110;
}

.desktop-nav .sub-menu .sub-menu.clicked-open {
    display: block;
    transform: translateX(-100%);
}

.desktop-nav .sub-menu li {
    margin: 0;
}

.desktop-nav .sub-menu a {
    display: block;
    padding: 0.75rem 1.5rem;
    color: #374151;
    transition: background-color 0.2s ease;
}

.desktop-nav .sub-menu .current_page_parent > a, 
.desktop-nav .sub-menu .current_page_ancestor > a, 
.desktop-nav .sub-menu .current-menu-item > a, 
.desktop-nav .sub-menu > li > a:hover {
    background-color: #f3f4f6;
    color: #BFCF5C !important;
}

#menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap > .sub-menu > li > .sub-menu > li > a {
    color: rgba(0, 0, 0, 0.59) !important;
}

#menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap > .sub-menu > li > .sub-menu > li > a:hover {
    color: #000000 !important;
}

/* ===================================
   HEADER ET NAVIGATION DESKTOP
   =================================== */

/* Structure du header */

#site-header {
    height: 90px;
}

@media (max-width: 1280px) {
    #site-header {
        height: 72px;
    }
}

#site-header > .container, 
#site-header > .container > .flex {
    height: 100%;
}

body {
    font-variant-ligatures: none;
    font-feature-settings: "liga" 0, "clig" 0;
}

/* Ou uniquement sur le texte courant */

p, li, a {
    font-variant-ligatures: none;
    font-feature-settings: "liga" 0, "clig" 0;
}

#menu-reseaux-sociaux-1 .icon-linkedin,
#menu-reseaux-sociaux .icon-linkedin {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 17.322 17.322'%3E%3Cpath fill='%23c6c4bf' d='M8.664 0a8.661 8.661 0 1 0 8.661 8.661A8.66 8.66 0 0 0 8.664 0m-2.6 13.543h-2.4V6.389h2.4ZM4.738 5.772a1.325 1.325 0 1 1 1.326-1.326 1.325 1.325 0 0 1-1.326 1.325m9.1 7.662h-1.822V9a1.4 1.4 0 0 0-.368-1.058 1.23 1.23 0 0 0-.884-.357 1.7 1.7 0 0 0-1.247.548 2.28 2.28 0 0 0-.535 1.652v3.648H7.164v-7.1h1.662v1.646a2.69 2.69 0 0 1 2.438-1.793 2.86 2.86 0 0 1 1.818.591 2.49 2.49 0 0 1 .755 2.074Z' data-name='Tracé 332'/%3E%3C/svg%3E");
}

#menu-reseaux-sociaux-1 .icon-facebook,
#menu-reseaux-sociaux .icon-facebook {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='17.322' height='17.322' viewBox='0 0 17.322 17.322'%3E%3Cpath fill='%23c6c4bf' fill-rule='evenodd' d='M8.661,0 A8.661,8.661 0 1 0 8.661,17.322 A8.661,8.661 0 1 0 8.661,0 Z M7.506,7.160 C7.506,5.413 9.022,4.330 11.115,4.330 C11.765,4.330 12.270,4.388 12.558,4.511 C12.414,5.110 12.125,5.897 11.981,6.373 C11.765,6.315 11.476,6.258 11.115,6.258 C10.393,6.258 10.104,6.553 10.104,7.095 L10.104,8.423 L12.270,8.423 L12.053,10.408 L10.104,10.408 L10.104,15.157 L7.506,15.157 L7.506,10.408 L5.557,10.408 L5.557,8.423 L7.506,8.423 Z'/%3E%3C/svg%3E");
}

#menu-reseaux-sociaux-1 .icon-instagram,
#menu-reseaux-sociaux .icon-instagram {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16.75 16.75'%3E%3Cg fill='%23c6c4bf' data-name='Groupe 438'%3E%3Cpath d='M8.371 6.627a1.749 1.749 0 1 0 1.749 1.749 1.75 1.75 0 0 0-1.749-1.749' data-name='Tracé 329'/%3E%3Cpath d='M8.375 0a8.375 8.375 0 1 0 8.375 8.375A8.375 8.375 0 0 0 8.375 0m5.474 11.6a2.254 2.254 0 0 1-2.247 2.247H5.147A2.253 2.253 0 0 1 2.9 11.6V5.147A2.253 2.253 0 0 1 5.147 2.9h6.455a2.253 2.253 0 0 1 2.247 2.247Z' data-name='Tracé 330'/%3E%3Cpath d='M11.299 4.171H5.453a1.284 1.284 0 0 0-1.28 1.28v5.847a1.284 1.284 0 0 0 1.28 1.28h5.846a1.284 1.284 0 0 0 1.28-1.28V5.451a1.284 1.284 0 0 0-1.28-1.28m-2.923 7.082a2.878 2.878 0 1 1 2.878-2.878 2.88 2.88 0 0 1-2.878 2.878m2.878-5.023a.734.734 0 1 1 .734-.734.734.734 0 0 1-.734.734' data-name='Tracé 331'/%3E%3C/g%3E%3C/svg%3E");
}

#menu-reseaux-sociaux-1 .icon-linkedin,
#menu-reseaux-sociaux .icon-linkedin,
#menu-reseaux-sociaux-1 .icon-facebook,
#menu-reseaux-sociaux-1 .icon-instagram,
#menu-reseaux-sociaux .icon-facebook,
#menu-reseaux-sociaux .icon-instagram {
    width: 20px;
    height: 20px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    margin: 0;
}

#menu-reseaux-sociaux-1 .icon-linkedin a,
#menu-reseaux-sociaux .icon-linkedin a,
#menu-reseaux-sociaux-1 .icon-facebook a,
#menu-reseaux-sociaux-1 .icon-instagram a,
#menu-reseaux-sociaux .icon-facebook a,
#menu-reseaux-sociaux .icon-instagram a {
    text-indent: -9999px;
    overflow: hidden;     
    white-space: nowrap;  
    display: block; 
}

.menu-legal-links a {
    font-size: 0.875rem;
    line-height: 1.25rem;
    --tw-text-opacity: 1;
    color: rgb(248 247 242 / var(--tw-text-opacity, 1));
}

.footer-bandeau-content .menu-legal-links a {
    font-size: 0.875rem;
}

#site-footer .grid {
    grid-template-columns: 2fr 260px 160px !important;
    gap: 32px;
}

@media (min-width: 1280px) {

    #site-footer .grid {
        gap: 90px;
    }
}

#site-footer .footer-column a ,
#site-footer .footer-column p {
    font-size: 0.875rem;
    line-height: 1.25rem;
    --tw-text-opacity: 1;
    color: rgb(248 247 242 / var(--tw-text-opacity, 1));
}

.footer-bandeau-content #site-footer .footer-column a ,.footer-bandeau-content 
#site-footer .footer-column p {
    font-size: 0.875rem;
}

#site-footer .footer-content a:hover,
.menu-legal-links a:hover,
#site-footer .footer-column li:not(.cta-tertiary) a:hover {
    color: #BFCF5C !important;
}

#menu-menu-footer-secondaire,
#menu-menu-footer-secondaire li {
    margin: 0px;
}

#menu-menu-footer-secondaire .cta-tertiary a {
    width: 100%;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-left: 75px;
    padding-right: 75px;
    text-align: center;
}

.services-block #menu-menu-footer-secondaire .cta-tertiary a h2 {
    color: #111827;
    font-size: 2.25rem;
    font-weight: 700;
    margin-bottom: 1rem;
    line-height: 1.2;
}

.services-block #menu-menu-footer-secondaire .cta-tertiary a p {
    color: #6b7280;
    font-size: 1.25rem;
    max-width: 42rem;
    margin: 0 auto;
    line-height: 1.6;
}

.wp-block-image#menu-menu-footer-secondaire .cta-tertiary a img {
    width: 100%;
  }

.contact-block #menu-menu-footer-secondaire .cta-tertiary a h2 {
    color: #111827;
    font-size: 2.25rem;
    font-weight: 700;
    margin-bottom: 1rem;
    line-height: 1.2;
}

.contact-block #menu-menu-footer-secondaire .cta-tertiary a p {
    color: #6b7280;
    font-size: 1.25rem;
    max-width: 42rem;
    margin: 0 auto;
    line-height: 1.6;
}

@media (max-width: 768px) {
    .contact-block #menu-menu-footer-secondaire .cta-tertiary a h2 {
        font-size: 2rem;
    }
    
    .contact-block #menu-menu-footer-secondaire .cta-tertiary a p {
        font-size: 1.125rem;
    }
}

@media (max-width: 480px) {
    .contact-block #menu-menu-footer-secondaire .cta-tertiary a h2 {
        font-size: 1.75rem;
    }
    
    .contact-block #menu-menu-footer-secondaire .cta-tertiary a p {
        font-size: 1rem;
    }
}

#menu-menu-footer-secondaire .cta-tertiary a {
    width: -moz-fit-content;
    width: fit-content;
    --tw-text-opacity: 1 !important;
    color: rgb(0 0 0 / var(--tw-text-opacity, 1)) !important;
}

.footer-column:last-child .footer-content p {
    line-height: 1.75rem !important;
}

@media screen and (max-width: 1023px) {
    #site-footer .grid {
        grid-template-columns: 1fr 1fr !important;
        gap: 16px;
    }
    #site-footer .footer-column {
        grid-column: span 2;
    }
    #site-footer .footer-column:nth-child(3) {
        margin-top: 0;
    }
}

/* Responsive */

@media (max-width: 1279px) {
    .mobile-menu-toggle {
        display: flex;
        width: 100%;
    }
    #site-header .container {
        padding-right: 0;
    }
    .site-logo a {
        display: flex;
        align-items: center;
    }
    .site-logo a img {
        height: calc(100% - 20px);
    }

    .desktop-nav {
        display: none;
    }
    
    .mobile-menu {
        display: block;
    }
    .menu-mobile-btn-container {
        display: flex;
        flex-flow: column nowrap;
        justify-content: flex-start;
        align-items: start;
        padding: 12px 16px;
    }
    .menu-mobile-btn-container p {
        font-size: 10px;
        font-weight: 500;
        line-height: 16px;
        --tw-text-opacity: 1;
        color: rgb(255 255 255 / var(--tw-text-opacity, 1));
    }
    .mobile-menu-toggle span {
        --tw-bg-opacity: 1 !important;
        background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)) !important;
    }
    .mobile-menu-toggle span:nth-child(1) {
        width: 55%;
    }
    .mobile-menu-toggle span:nth-child(2) {
    }
    .mobile-menu-toggle span:nth-child(3) {
        width: 55%;
        text-align: right;
        align-self: end;
    }
    #site-header {
        --tw-bg-opacity: 1 !important;
        background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1)) !important;
    }
    /* body.menu-open, */
    .mobile-menu-panel-footer,
    .mobile-nav, 
    .mobile-menu-root,
    .menu-open #site-header {
        --tw-bg-opacity: 1;
        background-color: rgb(45 65 60 / var(--tw-bg-opacity, 1));
    }
    .menu-open #site-header {
        box-shadow: 5px 0px rgb(45, 65, 60, 1);
    }
    .mobile-nav a,
    .menu-open .menu-item a:hover,
    .menu-open .menu-item a:focus,
    .menu-open .menu-item a:active,
    .menu-open .menu-item a {
        --tw-text-opacity: 1 !important;
        color: rgb(255 255 255 / var(--tw-text-opacity, 1)) !important;
    }
    
    #menu-reseaux-sociaux-1 .icon-linkedin, 
    #menu-reseaux-sociaux .icon-linkedin, 
    #menu-reseaux-sociaux-1 .icon-facebook, 
    #menu-reseaux-sociaux-1 .icon-instagram, 
    #menu-reseaux-sociaux .icon-facebook, 
    #menu-reseaux-sociaux .icon-instagram {
        width: 32px;
        height: 32px;
    }
    .mobile-social-menu {
        justify-content: center;
        gap: 24px;
    }
}

@media (min-width: 1280px) {
    .menu-mobile-btn-container,
    .mobile-menu-toggle {
        display: none;
    }
    
    .desktop-nav {
        display: flex;
    }
    
    .mobile-menu {
        display: none;
    }
    .search-toggle-btn, 
    .search-toggle-btn:hover,
    .search-toggle-btn:focus,
    .lang-switcher .glink,
    .search-toggle-btn:hover,
    .search-toggle-btn:focus,
    .lang-switcher .glink:hover,
    .lang-switcher .glink:focus,
    .lang-switcher .glink.gt-current-lang {
        color: #000000 !important;
    }
}

/* Accessibilité */

.mobile-menu-toggle:focus-visible,
.submenu-toggle:focus-visible {
    outline: 2px solid #3b82f6;
    outline-offset: 2px;
}

/* Animations d'entrée pour les éléments du menu */

.mobile-menu .mobile-nav li {
    opacity: 0;
    transform: translateX(-20px);
    animation: slideInLeft 0.3s ease-out forwards;
}

.mobile-menu .mobile-nav li:nth-child(1) { animation-delay: 0.1s; }

.mobile-menu .mobile-nav li:nth-child(2) { animation-delay: 0.2s; }

.mobile-menu .mobile-nav li:nth-child(3) { animation-delay: 0.3s; }

.mobile-menu .mobile-nav li:nth-child(4) { animation-delay: 0.4s; }

.mobile-menu .mobile-nav li:nth-child(5) { animation-delay: 0.5s; }

@keyframes slideInLeft {
    from {
        opacity: 0;
        transform: translateX(-20px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

/* Styles desktop uniquement */

@media screen and (min-width: 1280px) {
    
    /* Container du header */
    #site-header > .container {
        position: relative;
    }
    
    /* Reset des positions pour éviter les conflits */
    .menu-item, 
    .menu-item a {
        position: initial !important;
    }
    
    .sub-menu {
        transform: none !important;
    }
    
    /* Menu principal */
    #menu-menu-principal {
        height: var(--header-height);
    }
    
    #menu-menu-principal > li {
        height: 100%;
        display: block;
        width: auto;
        margin: 0;
    }
    
    #menu-menu-principal > li > a {
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        min-width: 80px;
    }
    
    /* Sous-menus desktop */
    #menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap {
        --simple-col-1: 25%;
        --simple-col-2: 35%;
        --simple-col-3: 45%;
        /* display: none; */
        position: absolute;
        left: 0;
        right: 0;
        top: 100%;
        color: #fff;
        z-index: 1000;
        width: calc(100% - 32px);
        margin: 0 auto;
        border-radius: 0;
        box-shadow: 0 16px 40px rgba(0, 0, 0, 0.10);
        min-height: 500px;
        padding: 0;
        overflow: hidden;
        
        /* Transition - temporaire, TODO à voir avec DA */
        opacity: 0;
        transform: translateX(-2%);
        transition: all .25s ease-in-out;
        pointer-events: none;
        
        max-width: calc(80rem + 72px);
        padding-left: 1.25rem;
        padding-right: 1.25rem;
        box-shadow: none !important;
    }    
    /* Transition - temporaire, TODO à voir avec DA */
    #menu-menu-principal > li.menu-item-has-children:hover > .simple-submenu-wrap,
    #menu-menu-principal > li.menu-item-has-children:focus-within > .simple-submenu-wrap {
        opacity: 1;
        transform: translateX(0);
        pointer-events: auto;
    }

    #menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap > .sub-menu {
        margin: 0;
        list-style: none;
        position: relative;
        top: auto;
        right: auto;
        left: auto;
        background: transparent;
        box-shadow: none;
        width: 100%;
        min-width: 0;
        z-index: 1;
        display: grid;
        
        /* Layout mega menu en 3 colonnes (menu simple) */
        /* grid-template-columns: minmax(220px, var(--simple-col-1)) minmax(240px, var(--simple-col-2)) minmax(260px, var(--simple-col-3)); */
        grid-template-columns: var(--simple-col-1) var(--simple-col-2) var(--simple-col-3);
        -moz-column-gap: 16px;
             column-gap: 16px;
        row-gap: 0;
        align-items: start;
        align-content: start;
        grid-auto-rows: 60px;
        padding: 80px;
        min-height: 520px;
        background-color: #FFF !important;
    }
    #menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap > .sub-menu * {
        background-color: #FFF !important;
    }
  

    #menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap .simple-submenu-media {
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        width: calc(var(--simple-col-2) + var(--simple-col-3) - 180px);
        overflow: hidden;
        pointer-events: none;
        transition: width 0.3s ease;
        z-index: 1;
        /* background-image: url("../img/menu-illu.jpg"); */
        background-size: cover;
        background-position: right center;
    }
    /* Les variables --simple-menu-image sont injectées dynamiquement en <head>
       (voir ensa_generate_menu_illustrations_css() dans inc/acf-options.php),
       afin d'être pilotables depuis Options du thème > Header. */

    #menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap .simple-submenu-media img {
        width: 100%;
        height: 100%;
        -o-object-fit: cover;
           object-fit: cover;
        display: block;
    }

    #menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap.has-active-submenu .simple-submenu-media {
        width: calc(var(--simple-col-3) - 80px);
    }
    
    /* Affichage au hover/focus */
    /* #menu-menu-principal > li.menu-item-has-children:hover > .simple-submenu-wrap, */
    #menu-menu-principal > li.menu-item-has-children:focus-within > .simple-submenu-wrap {
        display: block;
        opacity: 1;
    }  
    /* Affichage persistant au clic */
    #menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap.clicked-open {
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
    }
    
    /* Items du sous-menu */
    #menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap > .sub-menu > li {
        display: contents;
        margin-bottom: 0;
    }
    
    /* Liens du sous-menu */
    #menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap > .sub-menu > li > a {
        font-family: TT Norms, sans-serif;
        font-size: 1rem;
        line-height: 1.5rem;
        font-weight: 700;
        --tw-text-opacity: 1;
        color: rgb(0 0 0 / var(--tw-text-opacity, 1));
        display: flex;
        align-items: center;
        padding: 16px 0;
        text-decoration: none;
        grid-column: 1;
        position: relative;
        z-index: 1;
        align-self: start;
        height: 100%;
        border-bottom: 1px solid #707070;
    }
    #menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap > .sub-menu > li > a:hover {
        color: #BFCF5C;
    }

    #menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap > .sub-menu > li.is-active a {
        color: #BFCF5C;
    }


    /* Sous-sous-menus en colonne 2 */
    #menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap > .sub-menu > li > .sub-menu {
        position: static;
        grid-column: 2;
        grid-row: 1 / -1;
        margin: 0;
        padding: 0 90px 0 32px;
        list-style: none;
        border-left: 1px solid rgba(255, 255, 255, 0.2);
        background: none;
        box-shadow: none;
        display: none;
        min-width: 0;
        z-index: 1;
        height: 100%;
        align-self: stretch;
        align-content: start;
        grid-auto-rows: 70px;
    }

    /* #menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap > .sub-menu > li:hover > .sub-menu, */
    #menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap > .sub-menu > li:focus-within > .sub-menu,
    #menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap > .sub-menu > li.is-active > .sub-menu {
        display: block !important;
    }

    #menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap > .sub-menu > li > .sub-menu > li {
        margin: 0;
        height: 100%;
        border-left: 1px solid #707070;
        padding-left: 32px;
    }

    #menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap > .sub-menu > li > .sub-menu > li > a {
        font-family: TT Norms, sans-serif;
        font-size: 20px;
        font-weight: 500;
        line-height: 20px;
    }

    #menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap > .sub-menu > li > .sub-menu > li > a:hover {
        --tw-text-opacity: 1;
        color: rgb(0 0 0 / var(--tw-text-opacity, 1));
    }

    #menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap > .sub-menu > li > .sub-menu > li > a {
        display: block;
        color: rgba(0, 0, 0, 0.59);
        text-decoration: none;
        font-size: 0.875rem;
        transition: color 0.2s ease;
        height: 100%;
        padding: 16px 0;
        text-transform: initial;
        align-content: center;
        border-bottom: 1px solid #707070;
    }

    #menu-menu-principal > li.menu-item-has-children > .simple-submenu-wrap > .sub-menu > li > .sub-menu > li:last-child a {
        border-bottom: none;
    }
}

/* ===================================
   SÉLECTEUR DE LANGUE (GTranslate)
   =================================== */

.lang-switcher {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
}

 
#site-header > .container > .lang-switcher {
    height: 100%;
}

@media (max-width: 767px) {
    .footer-bandeau-content .lang-switcher {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
}

.lang-switcher .glink {
    margin: 0px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    padding-left: 8px;
    padding-right: 8px;
    padding-top: 10px;
    padding-bottom: 10px;
    text-align: center;
    font-family: TT Norms, sans-serif;
    font-size: 12px;
    font-weight: 500;
    text-transform: uppercase;
    line-height: 1rem !important;
    --tw-text-opacity: 1;
    color: rgb(0 0 0 / var(--tw-text-opacity, 1));
    text-decoration-line: none;
}

.services-block .lang-switcher .glink h2 {
    color: #111827;
    font-size: 2.25rem;
    font-weight: 700;
    margin-bottom: 1rem;
    line-height: 1.2;
}

.services-block .lang-switcher .glink p {
    color: #6b7280;
    font-size: 1.25rem;
    max-width: 42rem;
    margin: 0 auto;
    line-height: 1.6;
}

.contact-block .lang-switcher .glink h2 {
    color: #111827;
    font-size: 2.25rem;
    font-weight: 700;
    margin-bottom: 1rem;
    line-height: 1.2;
}

.contact-block .lang-switcher .glink p {
    color: #6b7280;
    font-size: 1.25rem;
    max-width: 42rem;
    margin: 0 auto;
    line-height: 1.6;
}

@media (max-width: 768px) {
    .contact-block .lang-switcher .glink h2 {
        font-size: 2rem;
    }
    
    .contact-block .lang-switcher .glink p {
        font-size: 1.125rem;
    }
}

@media (max-width: 480px) {
    .contact-block .lang-switcher .glink h2 {
        font-size: 1.75rem;
    }
    
    .contact-block .lang-switcher .glink p {
        font-size: 1rem;
    }
}

.lang-switcher .glink {
    text-decoration: none !important;
    font-weight: 500 !important;
    border: 1px solid transparent;
}

.lang-switcher .glink:first-child {
    margin-left: 1rem;
}

.lang-switcher .glink.gt-current-lang {
    --tw-border-opacity: 1;
    border-color: rgb(112 112 112 / var(--tw-border-opacity, 1));
}

.lang-switcher .glink img,
.lang-switcher .glink span {
    display: none;
}

.lang-switcher--mobile .glink {
    height: 2rem;
    width: 2rem;
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

/* ===================================
   RECHERCHE DANS LE HEADER
   =================================== */

.search-toggle-wrap {
    position: relative;
    display: flex;
    align-items: center;
}

.search-toggle-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    background: transparent;
    border: none;
    cursor: pointer;
    color: inherit;
    padding: 0;
    flex-shrink: 0;
    transition: opacity 0.2s ease;
}

.search-toggle-btn:hover,
.search-toggle-btn:focus-visible {
    /* opacity: 0.65; */
    outline: none;
}

/* ===== Recherche desktop : modal centré + overlay ===== */

/* Verrouille le scroll de la page quand le modal est ouvert */

body.search-modal-open {
    overflow: hidden;
}

/* Overlay (fond gris foncé) */

.search-toggle-wrap.is-open::before {
    content: "";
    position: fixed;
    inset: 0;
    background: rgba(38, 38, 38, 0.85);
    z-index: 9998;
    animation: header-search-overlay-in 0.2s ease;
}

@keyframes header-search-overlay-in {
    from { opacity: 0; }
    to   { opacity: 1; }
}

/* Boîte du modal (le formulaire) */

.header-search-form {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) scale(0.97);
    display: flex;
    align-items: center;
    gap: 8px;
    width: min(560px, calc(100vw - 32px));
    background: white;
    border: 1px solid #707070;
    border-radius: 4px;
    padding: 8px 8px 8px 16px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
    white-space: nowrap;
    z-index: 9999;
}

.search-toggle-wrap.is-open .header-search-form {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translate(-50%, -50%) scale(1); 
    border-radius: 0;
}

.header-search-input {
    flex: 1;
    border: none;
    outline: none;
    padding: 10px 4px;
    /* 16px : évite le zoom automatique sur iOS à l'ouverture du clavier */
    font-size: 16px;
    background: transparent;
    color: #1a1a1a;
    min-width: 0;
}

.header-search-input::-moz-placeholder {
    color: #999;
}

.header-search-input::placeholder {
    color: #999;
}

.header-search-submit {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: #2D413C;
    border: none;
    cursor: pointer;
    color: #fff;
    flex-shrink: 0;
    transition: background 0.2s ease;
}

.header-search-submit:hover,
.header-search-submit:focus-visible {
    background: #1f2e2a;
    outline: none;
}

/* Recherche mobile */

.mobile-search-wrap {
    padding: 16px 24px;
    border-bottom: 1px solid rgba(178, 178, 177, 0.35);
}

.mobile-search-form {
    display: flex;
    align-items: center;
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(178, 178, 177, 0.35);
}

.mobile-search-input {
    flex: 1;
    background: transparent !important;
    border: none !important;
    outline: none;
    padding: 10px 14px;
    color: white !important;
    font-size: 15px;
    min-width: 0;
}

.mobile-search-input::-moz-placeholder {
    color: #FFF;
}

.mobile-search-input::placeholder {
    color: #FFF;
}

.mobile-search-submit {
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    padding: 10px 12px;
    cursor: pointer;
    /* color: rgba(178, 178, 177, 0.6); */
    color: #FFF !important;
    flex-shrink: 0;
    transition: color 0.2s ease;
}

.mobile-search-submit:hover {
    color: white;
}

/* Bandeau du menu complexe */

.complex-menu-banner {
    background-color: #234C9B;
    color: white;
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
    height: 50px; /* Fixed height */
    z-index: 40; /* Lower z-index than container */
}

@media (max-width: 768px) {
    .complex-menu-banner {
        height: auto;
    }
}

/* Conteneur sticky pour bandeau + header complexe */

.is-sticky-header-container.is-sticky {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 50;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    transition: transform 0.3s ease;
}

/* S'assurer que le header reste dans le flux du conteneur sticky */

.is-sticky-header-container.is-sticky #site-header {
    position: relative;
    z-index: 1;
}

/* Header simple sticky */

header#site-header.is-sticky {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 50;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    transition: transform 0.3s ease;
}

/* Navigation secondaire */

.secondary-nav {
    height: 100%;
    margin: 0;
}

.secondary-nav ul {
    height: 100%;
    padding: 0;
    gap: 16px;
    list-style: none;
    justify-content: center;
    align-items: center;
    margin: auto;
    row-gap: 0;
}

.secondary-menu-item {
    display: inline-block;
    margin: 0;
}

.secondary-menu-item a {
    color: white;
    text-decoration: none;
    padding: 0.5rem 0;
    display: block;
    transition: opacity 0.2s ease;
}

.secondary-menu-item a:hover {
    opacity: 0.8;
}

/* Sous-menus du menu complexe (mega menu 3 niveaux) */

.complex-menu-item {
    position: relative;
}

.complex-submenu {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: white;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-10px);
    transition: all 0.3s ease;
    z-index: 100;
    pointer-events: none;
    padding: 32px 6%;
    margin: 0;
    list-style: none;
    display: grid;
    grid-template-columns: minmax(220px, 28%) minmax(240px, 34%) minmax(260px, 38%);
    -moz-column-gap: 32px;
         column-gap: 32px;
    row-gap: 0;
    min-height: 420px;
    overflow: hidden;
}

.complex-submenu::after {
    content: "";
    grid-column: 3;
    grid-row: 1 / -1;
    background-image: var(--complex-menu-image, url("../img/Bande_logo_Europe.png"));
    background-size: cover;
    background-position: center;
    border-left: 1px solid #e5e7eb;
    pointer-events: none;
}

.complex-menu-item.is-open > .complex-submenu,
.complex-menu-item:focus-within > .complex-submenu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
    pointer-events: auto;
}

.complex-submenu > li {
    display: contents;
}

.complex-submenu > li > a {
    grid-column: 1;
    padding: 12px 0;
    border-bottom: 1px solid #e5e7eb;
    color: #111827;
    text-decoration: none;
    font-size: 0.875rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.02em;
    display: block;
    transition: color 0.2s ease;
    position: relative;
    z-index: 1;
}

.complex-submenu > li > a:hover,
.complex-submenu > li > a:focus,
.complex-submenu > li.is-active > a {
    color: #234C9B;
}

.complex-submenu > li > .sub-menu {
    grid-column: 2;
    grid-row: 1 / -1;
    margin: 0;
    padding: 0 0 0 32px;
    list-style: none;
    border-left: 1px solid #e5e7eb;
    display: none;
    position: relative;
    z-index: 1;
}

.complex-submenu > li.is-active > .sub-menu {
    display: block;
}

.complex-submenu > li > .sub-menu > li {
    margin: 0;
}

.complex-submenu > li > .sub-menu > li > a {
    display: block;
    padding: 8px 0;
    color: #6b7280;
    text-decoration: none;
    font-size: 0.875rem;
    transition: color 0.2s ease;
}

.complex-submenu > li > .sub-menu > li > a:hover,
.complex-submenu > li > .sub-menu > li > a:focus {
    color: #234C9B;
}

/* Responsive pour les sous-menus */

@media (max-width: 1023px) {
    .complex-submenu {
        grid-template-columns: 1fr;
        padding: 24px;
        min-height: auto;
    }

    .complex-submenu > li > .sub-menu {
        grid-column: 1;
        grid-row: auto;
        padding: 12px 0 0;
        border-left: none;
    }

    .complex-submenu::after {
        display: none;
    }
}

/* Animation d'apparition/disparition du conteneur sticky */

.is-sticky-header-container.is-sticky,
header#site-header.is-sticky {
    transition: transform 0.3s ease;
}

/* État caché (scroll vers le bas) */

.is-sticky-header-container.is-sticky.header-hidden,
header#site-header.is-sticky.header-hidden,
.is-sticky-header-container.is-sticky[style*="translateY(-100%)"],
header#site-header.is-sticky[style*="translateY(-100%)"] {
    transform: translateY(-100%);
}

/* État visible (scroll vers le haut ou en haut de page) */

.is-sticky-header-container.is-sticky.header-visible,
header#site-header.is-sticky.header-visible,
.is-sticky-header-container.is-sticky[style*="translateY(0)"],
header#site-header.is-sticky[style*="translateY(0)"] {
    transform: translateY(0);
}

/* ===================================
   BLOG STYLES
   =================================== */

/* Blog Listing */

.blog-listing {
    padding-top: 0;
}

/* Hero Section */

.blog-hero {
    background-color: #111827; /* bg-gray-900 */
    color: #ffffff;
    padding: 3rem 0 2rem;
}

.blog-hero__container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

.blog-hero__title {
    font-size: 2.25rem; /* text-4xl */
    font-weight: 700; /* font-bold */
    margin: 0 0 2rem 0;
    text-align: center;
}

@media (min-width: 768px) {
    .blog-hero__title {
        text-align: left;
        font-size: 3rem; /* md:text-5xl */
    }
}

/* Filtres */

.blog-filters-wrapper {
    margin-top: 1.5rem;
}

.blog-filters-container {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    align-items: flex-start;
}

@media (min-width: 768px) {
    .blog-filters-container {
        flex-direction: row;
        align-items: center;
        gap: 1.5rem;
    }
}

.blog-filters__label {
    font-size: 0.875rem; /* text-sm */
    font-weight: 500;
    color: #d1d5db; /* text-gray-300 */
    white-space: nowrap;
}

.blog-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
    list-style: none;
    margin: 0;
    padding: 0;
}

.blog-filters .filtre {
    cursor: pointer;
    transition: all 0.2s ease;
}

.blog-filters .label-category {
    display: inline-block;
    padding: 0.5rem 1rem;
    background-color: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 0.375rem;
    font-size: 0.875rem;
    font-weight: 500;
    color: #ffffff;
    transition: all 0.2s ease;
}

.blog-filters .filtre:hover .label-category {
    background-color: rgba(255, 255, 255, 0.2);
    border-color: rgba(255, 255, 255, 0.3);
}

.blog-filters .filtre.active .label-category {
    background-color: var(--accent-color); /* bg-indigo-600 */
    border-color: var(--accent-color);
    color: #ffffff;
}

.blog-filters .count {
    opacity: 0.7;
    font-size: 0.75rem;
}

/* Contenu du blog */

.blog-content {
    padding: 4rem 0;
}

.blog-content__container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

/* Grille des articles */

.blog-grid {
    display: grid;
    gap: 2rem;
    grid-template-columns: 1fr;
}

@media (min-width: 768px) {
    .blog-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1024px) {
    .blog-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* Carte d'article */

.blog-card {
    background-color: #ffffff;
    border-radius: 1rem;
    box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    border: 1px solid #e5e7eb;
    overflow: hidden;
    transition: all 0.2s ease;
    height: -moz-fit-content;
    height: fit-content;
}

.blog-card:hover {
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    transform: translateY(-4px);
}

.blog-card__image {
    position: relative;
    width: 100%;
    height: 12rem;
    overflow: hidden;
}

.blog-card__image-link {
    display: block;
    width: 100%;
    height: 100%;
}

.blog-card__thumbnail {
    width: 100%;
    height: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    transition: transform 0.2s ease;
}

.blog-card:hover .blog-card__thumbnail {
    transform: scale(1.05);
}

.blog-card__content {
    padding: 1.5rem;
}

.blog-card__meta {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-bottom: 1rem;
}

@media (min-width: 640px) {
    .blog-card__meta {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }
}

.blog-card__date {
    font-size: 0.875rem;
    color: #6b7280;
    font-weight: 500;
}

.blog-card__categories {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.blog-card__category {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--accent-color);
    background-color: var(--accent-opacity-10);
    padding: 0.25rem 0.5rem;
    border-radius: 0.375rem;
}

.blog-card__title {
    margin: 0 0 0.75rem 0;
}

.blog-card__title-link {
    font-size: 1.25rem;
    font-weight: 600;
    color: #111827;
    text-decoration: none;
    line-height: 1.3;
    transition: color 0.2s ease;
}

.blog-card__title-link:hover {
    color: var(--accent-color);
    text-decoration: none;
}

.blog-card__excerpt {
    color: #4b5563;
    line-height: 1.6;
    margin-bottom: 1rem;
}

.blog-card__excerpt p {
    margin: 0;
    font-size: 0.875rem;
}

.blog-card__footer {
    margin-top: auto;
}

.blog-card__read-more {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--accent-color);
    text-decoration: none;
    transition: all 0.2s ease;
}

.blog-card__read-more:hover {
    color: var(--accent-hover);
    text-decoration: none;
    gap: 0.5rem;
}

/* Pagination */

.blog-pagination {
    margin-top: 3rem;
    text-align: center;
}

.blog-pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2.5rem;
    height: 2.5rem;
    margin: 0 0.25rem;
    padding: 0.5rem;
    border: 1px solid #d1d5db;
    border-radius: 0.375rem;
    background-color: #ffffff;
    color: #374151;
    text-decoration: none;
    font-weight: 500;
    transition: all 0.2s ease;
}

.blog-pagination .page-numbers:hover {
    background-color: #f3f4f6;
    border-color: #9ca3af;
    text-decoration: none;
}

.blog-pagination .page-numbers.current {
    background-color: var(--accent-color);
    border-color: var(--accent-color);
    color: #ffffff;
}

.blog-pagination .page-numbers.prev,
.blog-pagination .page-numbers.next {
    padding: 0.5rem 1rem;
    font-weight: 600;
}

/* Overlay de chargement */

.blog-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
}

.blog-loader {
    background-color: #ffffff;
    padding: 2rem;
    border-radius: 0.5rem;
    text-align: center;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

.spinner {
    width: 2rem;
    height: 2rem;
    border: 2px solid #e5e7eb;
    border-top: 2px solid var(--accent-color);
    border-radius: 50%;
    animation: spin 1s linear infinite;
    margin: 0 auto 1rem;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

article.single-post {
    padding-top: 50px;
}

@media (min-width: 1024px) {
    /* Single Post */
    article.single-post {
        display: grid;
        grid-template-columns: 450px 1fr;
        gap: 36px;
        padding-top: 120px;
    }
}

.single-post__breadcrumb {
    background-color: #111827;
    color: #ffffff;
    padding: 1rem 0;
}

.single-post__breadcrumb-container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

.single-post__back-link {
    color: #ffffff;
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s ease;
}

.single-post__back-link:hover {
    color: #d1d5db;
    text-decoration: none;
}

.single-post__meta-wrapper {
    background-color: #f9fafb;
    padding: 1rem 0;
}

.single-post__meta-container {
    max-width: 800px;
    margin: 0 auto;
    padding: 0 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}

@media (min-width: 768px) {
    .single-post__meta-container {
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
    }
}

.single-post__categories {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.single-post__category {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--accent-color);
    background-color: var(--accent-opacity-10);
    padding: 0.375rem 0.75rem;
    border-radius: 0.375rem;
    border: 1px solid var(--accent-opacity-30);
}

.single-post__date {
    font-size: 20px;
    color: #6b7280;
    font-weight: 500;
    text-transform: uppercase;
    margin-top: 16px;
}

.single-post__header {
    padding: 0 0 2rem;
}

.single-post__title {
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.2;
    color: #111827;
    margin: 0;
}

@media (min-width: 768px) {
    .single-post__title {
        font-size: 40px;
    }
}

.single-post__featured-image {
    margin-bottom: 3rem;
}

.single-post__thumbnail {
    width: 100%;
    height: auto;
    border-radius: 0.75rem;
    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
}

.single-post__content {
    margin-bottom: 3rem;
    min-width: 0;
}

.single-post__content-container {
    margin: 0 auto;
    min-width: 0;
}

/* Styles prose pour le contenu */

.single-post__content-container > * {
    margin-bottom: 1.5rem;
}

.single-post__content-container > *:last-child {
    margin-bottom: 0;
}

.single-post__content-container h2,
.single-post__content-container h3,
.single-post__content-container h4 {
    font-weight: 600;
    color: #111827;
    margin-top: 2rem;
    margin-bottom: 1rem;
    line-height: 1.3;
}

.single-post__content-container h2 {
    font-size: 1.875rem;
}

.single-post__content-container h3 {
    font-size: 1.5rem;
}

.single-post__content-container h4 {
    font-size: 1.25rem;
}

.single-post__content-container ul,
.single-post__content-container ol {
    padding-left: 1.5rem;
}

.single-post__content-container li {
    margin-bottom: 0.5rem;
    line-height: 1.6;
}

.single-post__content-container a {
    color: var(--accent-color);
    text-decoration: none !important;
}

.single-post__content-container a:hover {
    color: var(--accent-hover);
}

.single-post__content-container .block-gallery-slider {
    padding: 32px 0 0 0;
}

.single-post__content-container blockquote {
    border-left: 4px solid #e5e7eb;
    padding-left: 1rem;
    margin: 2rem 0;
    font-style: italic;
    color: #6b7280;
}

/* Partage social */

.single-post__share {
    background-color: #f3f4f6;
    padding: 2rem 0;
}

.single-post__share-container {
    max-width: 1280px;
    margin: 0 auto;
    padding: 0 1.5rem;
}

.single-post__share-content {
    display: flex;
    flex-direction: column;
    gap: 1rem;
    align-items: center;
}

@media (min-width: 768px) {
    .single-post__share-content {
        flex-direction: row;
        justify-content: center;
        gap: 1.5rem;
    }
}

.single-post__share-label {
    font-weight: 600;
    color: #374151;
}

.single-post__share-links {
    display: flex;
    gap: 1rem;
}

.single-post__share-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    background-color: #6b7280;
    color: #ffffff;
    text-decoration: none;
    transition: all 0.2s ease;
}

.single-post__share-link:hover {
    transform: translateY(-2px);
    text-decoration: none;
}

.single-post__share-link--facebook:hover {
    background-color: #1877f2;
}

.single-post__share-link--linkedin:hover {
    background-color: #0a66c2;
}

.single-post__share-link--twitter:hover {
    background-color: #1da1f2;
}

.single-post__share-icon {
    width: 1.25rem;
    height: 1.25rem;
}

/* Responsive */

@media (max-width: 640px) {
    .blog-hero {
        padding: 2rem 0 1.5rem;
    }
    
    .blog-hero__title {
        font-size: 1.875rem;
    }
    
    .blog-content {
        padding: 2rem 0;
    }
    
    .blog-grid {
        gap: 1.5rem;
    }
    
    .single-post__header {
        padding: 2rem 0 1.5rem;
    }
    
    .single-post__title {
        font-size: 1.75rem;
    }
}

/* Accessibilité */

@media (prefers-reduced-motion: reduce) {
    .blog-card,
    .blog-card__thumbnail,
    .blog-card__read-more,
    .single-post__share-link {
        transition: none;
    }
    
    .blog-card:hover,
    .single-post__share-link:hover {
        transform: none;
    }
    
    .blog-card:hover .blog-card__thumbnail {
        transform: none;
    }
    
    .spinner {
        animation: none;
    }
}

/* Composants globaux du thème Zoorit */

/* ===== HEADER ===== */

#site-header {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
    --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
    --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 300ms;
}

.contact-form #site-header {
    background: white;
    border-radius: 0.5rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    padding: 2rem;
}

.contact-info #site-header {
    background: white;
    border-radius: 0.5rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    padding: 2rem;
}

.contact-block #site-header.rounded-lg.shadow-lg {
    background: white;
    border-radius: 0.5rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    overflow: hidden;
}

@media (max-width: 768px) {
    
    .contact-form #site-header,
    .contact-info #site-header {
        padding: 1.5rem;
    }
}

@media (max-width: 480px) {
    
    .contact-form #site-header,
    .contact-info #site-header {
        padding: 1.25rem;
    }
}

#site-header.sticky {
    position: fixed;
    top: 0;
    z-index: 50;
}

#site-header.sticky + .mobile-menu + #main {
    padding-top: 90px;
}

@media (max-width: 1280px) {
    #site-header.sticky + .mobile-menu + #main {
        padding-top: 72px;
    }
}

/* Logo */

.site-logo {
    height: 100%;
}

.site-logo img {
    height: 100%;
    width: auto;
    -o-object-fit: contain;
       object-fit: contain;
}

.site-logo a {
    display: block;
    height: 100%;
    transition-property: opacity;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 200ms;
}

/* Navigation principale */

.main-nav ul {
    display: flex;
    align-items: center;
}

.main-nav ul > :not([hidden]) ~ :not([hidden]) {
    --tw-space-x-reverse: 0;
    margin-right: calc(2rem * var(--tw-space-x-reverse));
    margin-left: calc(2rem * calc(1 - var(--tw-space-x-reverse)));
}

 
#site-header > .container > .main-nav ul {
    height: 100%;
}

@media (max-width: 767px) {
    .footer-bandeau-content .main-nav ul {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    
    .footer-bandeau-content .main-nav ul > * + * {
        margin-left: 0;
        margin-top: 1rem;
    }
}

.main-nav li {
    position: relative;
}

.main-nav a {
    position: relative;
    display: block;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    font-weight: 500;
    --tw-text-opacity: 1;
    color: rgb(55 65 81 / var(--tw-text-opacity, 1));
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 200ms;
}

.main-nav a:hover {
    --tw-text-opacity: 1;
    color: rgb(35 76 155 / var(--tw-text-opacity, 1));
}

.main-nav a::after {
    position: absolute;
    bottom: 0px;
    left: 0px;
    height: 0.125rem;
    width: 0px;
    --tw-bg-opacity: 1;
    background-color: rgb(35 76 155 / var(--tw-bg-opacity, 1));
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 200ms;
    content: '';
}

.main-nav a:hover::after {
    width: 100%;
}

.wp-block-image.main-nav a:hover img::after {
    width: 100%;
  }

/* Sous-menus */

.main-nav .sub-menu {
    visibility: hidden;
    position: absolute;
    top: 100%;
    left: 0px;
    z-index: 50;
    min-width: 12rem;
    border-radius: 0.375rem;
    border-width: 1px;
    --tw-border-opacity: 1;
    border-color: rgb(243 244 246 / var(--tw-border-opacity, 1));
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    opacity: 0;
    --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 200ms;
}

.contact-form .main-nav .sub-menu {
    background: white;
    border-radius: 0.5rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    padding: 2rem;
}

.contact-info .main-nav .sub-menu {
    background: white;
    border-radius: 0.5rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    padding: 2rem;
}

.contact-block .main-nav .sub-menu.rounded-lg.shadow-lg {
    background: white;
    border-radius: 0.5rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    overflow: hidden;
}

.contact-block .bg-white.rounded-lg.main-nav .sub-menu {
    background: white;
    border-radius: 0.5rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    overflow: hidden;
}

@media (max-width: 768px) {
    
    .contact-form .main-nav .sub-menu,
    .contact-info .main-nav .sub-menu {
        padding: 1.5rem;
    }
}

@media (max-width: 480px) {
    
    .contact-form .main-nav .sub-menu,
    .contact-info .main-nav .sub-menu {
        padding: 1.25rem;
    }
}

.group:hover .main-nav .sub-menu {
    visibility: visible;
    opacity: 1;
}

.main-nav .sub-menu li {
    display: block;
}

.main-nav .sub-menu a {
    padding-left: 1rem;
    padding-right: 1rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    font-size: 0.875rem;
    line-height: 1.25rem;
}

.footer-bandeau-content .main-nav .sub-menu a {
    font-size: 0.875rem;
}

.main-nav .sub-menu a:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1));
}

.main-nav .sub-menu a::after {
    display: none;
}

/* Gestion des sous-menus avec CSS pur */

.main-nav .menu-item-has-children {
    position: relative;
}

.main-nav .menu-item-has-children > a::after {
    margin-left: 0.25rem;
    display: inline-block;
    height: 0px;
    width: 0px;
    border-left-width: 4px;
    border-right-width: 4px;
    border-top-width: 4px;
    border-color: transparent;
    --tw-border-opacity: 1;
    border-top-color: rgb(156 163 175 / var(--tw-border-opacity, 1));
    transition-property: transform;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 200ms;
    content: '';
}

.main-nav .menu-item-has-children:hover > a::after {
    --tw-rotate: 180deg;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    --tw-border-opacity: 1;
    border-top-color: rgb(35 76 155 / var(--tw-border-opacity, 1));
}

/* Menu mobile (legacy) */

.legacy-mobile-menu-toggle {
    border-radius: 0.375rem;
    padding: 0.5rem;
    --tw-text-opacity: 1;
    color: rgb(55 65 81 / var(--tw-text-opacity, 1));
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

.legacy-mobile-menu-toggle:hover {
    --tw-text-opacity: 1;
    color: rgb(35 76 155 / var(--tw-text-opacity, 1));
}

.legacy-mobile-menu {
    border-top-width: 1px;
    --tw-border-opacity: 1;
    border-color: rgb(229 231 235 / var(--tw-border-opacity, 1));
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}

.contact-form .legacy-mobile-menu {
    background: white;
    border-radius: 0.5rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    padding: 2rem;
}

.contact-info .legacy-mobile-menu {
    background: white;
    border-radius: 0.5rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    padding: 2rem;
    border-top: 1px solid #e5e7eb;
    margin-top: 2rem;
    padding-top: 1.5rem;
}

.contact-info .legacy-mobile-menu h4 {
    color: #111827;
    font-weight: 500;
    margin-bottom: 0.75rem;
    line-height: 1.4;
}

.contact-info .legacy-mobile-menu p {
    color: #6b7280;
    line-height: 1.6;
    margin: 0;
}

.contact-block .legacy-mobile-menu.rounded-lg.shadow-lg {
    background: white;
    border-radius: 0.5rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    overflow: hidden;
}

@media (max-width: 768px) {
    
    .contact-form .legacy-mobile-menu,
    .contact-info .legacy-mobile-menu {
        padding: 1.5rem;
    }
}

@media (max-width: 480px) {
    
    .contact-form .legacy-mobile-menu,
    .contact-info .legacy-mobile-menu {
        padding: 1.25rem;
    }
}

.legacy-mobile-menu ul > :not([hidden]) ~ :not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-top: calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));
    margin-bottom: calc(0.25rem * var(--tw-space-y-reverse));
}

.legacy-mobile-menu ul {
    padding-top: 1rem;
    padding-bottom: 1rem;
}

.legacy-mobile-menu li {
    display: block;
}

.legacy-mobile-menu a {
    margin-left: 0.5rem;
    margin-right: 0.5rem;
    display: block;
    border-radius: 0.375rem;
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    padding-left: 1rem;
    padding-right: 1rem;
    --tw-text-opacity: 1;
    color: rgb(55 65 81 / var(--tw-text-opacity, 1));
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 200ms;
}

.legacy-mobile-menu a:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1));
    --tw-text-opacity: 1;
    color: rgb(35 76 155 / var(--tw-text-opacity, 1));
}

/* ===== FOOTER ===== */

#site-footer {
    --tw-bg-opacity: 1;
    background-color: rgb(17 24 39 / var(--tw-bg-opacity, 1));
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.footer-column h3 {
    margin-bottom: 1rem;
    font-size: 1.125rem;
    line-height: 1.75rem;
    font-weight: 600;
    --tw-text-opacity: 1;
    color: rgb(35 76 155 / var(--tw-text-opacity, 1));
}

.footer-bandeau-content .footer-column h3 {
    font-weight: 600;
}

.footer-column ul > :not([hidden]) ~ :not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
    margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
}

.footer-column a {
    display: block;
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
    --tw-text-opacity: 1;
    color: rgb(209 213 219 / var(--tw-text-opacity, 1));
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 200ms;
}

.footer-column a:hover {
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

/* ===== ACCÈS RAPIDES ===== */

.acces-rapide {
    display: block;
    display: flex;
    height: 3rem;
    width: 3rem;
    align-items: center;
    justify-content: center;
    border-radius: 9999px;
    --tw-bg-opacity: 1;
    background-color: rgb(35 76 155 / var(--tw-bg-opacity, 1));
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity, 1));
    --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 200ms;
}

 
#site-header > .container > .acces-rapide {
    height: 100%;
}

.contact-block .bg-white.rounded-lg.acces-rapide {
    background: white;
    border-radius: 0.5rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    overflow: hidden;
}

@media (max-width: 767px) {
    .footer-bandeau-content .acces-rapide {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
}

.acces-rapide:hover {
    --tw-scale-x: 1.1;
    --tw-scale-y: 1.1;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
    --tw-bg-opacity: 1;
    background-color: rgb(26 58 122 / var(--tw-bg-opacity, 1));
    --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
    --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.acces-rapide img {
    height: 1.5rem;
    width: 1.5rem;
}

.acces-rapide svg {
    height: 1.5rem;
    width: 1.5rem;
}

/* ===== BOUTONS ===== */

/* .btn-primary {
    @apply inline-flex items-center px-6 py-3 bg-primary hover:bg-primary-dark text-white font-semibold rounded-lg transition-all duration-200 hover:shadow-lg transform hover:scale-105;
}

.btn-secondary {
    @apply inline-flex items-center px-6 py-3 bg-gray-200 hover:bg-gray-300 text-gray-800 font-semibold rounded-lg transition-all duration-200 hover:shadow-lg transform hover:scale-105;
}

.btn-outline {
    @apply inline-flex items-center px-6 py-3 border-2 border-primary text-primary hover:bg-primary hover:text-white font-semibold rounded-lg transition-all duration-200;
} */

/* ===== CARTES ===== */

.card {
    overflow: hidden;
    border-radius: 0.5rem;
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
    --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
    --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    transition-property: box-shadow;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 200ms;
}

.contact-form .card {
    background: white;
    border-radius: 0.5rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    padding: 2rem;
}

.contact-info .card {
    background: white;
    border-radius: 0.5rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    padding: 2rem;
}

.contact-block .card.rounded-lg.shadow-lg {
    background: white;
    border-radius: 0.5rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    overflow: hidden;
}

.contact-block .bg-white.card.shadow-lg {
    background: white;
    border-radius: 0.5rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    overflow: hidden;
}

@media (max-width: 768px) {
    
    .contact-form .card,
    .contact-info .card {
        padding: 1.5rem;
    }
}

@media (max-width: 480px) {
    
    .contact-form .card,
    .contact-info .card {
        padding: 1.25rem;
    }
}

.card:hover {
    --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.card-header {
    border-bottom-width: 1px;
    --tw-border-opacity: 1;
    border-color: rgb(229 231 235 / var(--tw-border-opacity, 1));
    --tw-bg-opacity: 1;
    background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1));
    padding: 1.5rem;
}

.card-body {
    padding: 1.5rem;
}

.card-footer {
    border-top-width: 1px;
    --tw-border-opacity: 1;
    border-color: rgb(229 231 235 / var(--tw-border-opacity, 1));
    --tw-bg-opacity: 1;
    background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1));
    padding: 1.5rem;
}

.contact-info .card-footer {
    border-top: 1px solid #e5e7eb;
    margin-top: 2rem;
    padding-top: 1.5rem;
}

.contact-info .card-footer h4 {
    color: #111827;
    font-weight: 500;
    margin-bottom: 0.75rem;
    line-height: 1.4;
}

.contact-info .card-footer p {
    color: #6b7280;
    line-height: 1.6;
    margin: 0;
}

/* ===== FORMULAIRES ===== */

.form-group {
    margin-bottom: 1rem;
}

.form-label {
    margin-bottom: 0.5rem;
    display: block;
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 500;
    --tw-text-opacity: 1;
    color: rgb(55 65 81 / var(--tw-text-opacity, 1));
}

.footer-bandeau-content .form-label {
    font-size: 0.875rem;
}

.form-input {
    width: 100%;
    border-radius: 0.375rem;
    border-width: 1px;
    --tw-border-opacity: 1;
    border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));
    padding-left: 1rem;
    padding-right: 1rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 200ms;
}

.wp-block-image.form-input img {
    width: 100%;
  }

.form-input:focus {
    border-color: transparent;
    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
    --tw-ring-opacity: 1;
    --tw-ring-color: rgb(35 76 155 / var(--tw-ring-opacity, 1));
    outline: 2px solid transparent;
    outline-offset: 2px;
}

.form-textarea {
    width: 100%;
    resize: vertical;
    border-radius: 0.375rem;
    border-width: 1px;
    --tw-border-opacity: 1;
    border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));
    padding-left: 1rem;
    padding-right: 1rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 200ms;
}

.wp-block-image.form-textarea img {
    width: 100%;
  }

.form-textarea:focus {
    border-color: transparent;
    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
    --tw-ring-opacity: 1;
    --tw-ring-color: rgb(35 76 155 / var(--tw-ring-opacity, 1));
}

.form-textarea {
    min-height: 100px;
}

.form-select {
    width: 100%;
    border-radius: 0.375rem;
    border-width: 1px;
    --tw-border-opacity: 1;
    border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));
    padding-left: 1rem;
    padding-right: 1rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 200ms;
}

.wp-block-image.form-select img {
    width: 100%;
  }

.form-select:focus {
    border-color: transparent;
    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
    --tw-ring-opacity: 1;
    --tw-ring-color: rgb(35 76 155 / var(--tw-ring-opacity, 1));
}

.form-button {
    border-radius: 0.25rem;
    --tw-bg-opacity: 1;
    background-color: rgb(35 76 155 / var(--tw-bg-opacity, 1));
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
    font-weight: 600;
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity, 1));
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 200ms;
}

.footer-bandeau-content .form-button {
    font-weight: 600;
}

.form-button:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(26 58 122 / var(--tw-bg-opacity, 1));
}

/* ===== UTILITAIRES ===== */

.container {
    margin-left: auto;
    margin-right: auto;
    padding-left: 2.25rem;
    padding-right: 2.25rem;
    max-width: calc(80rem + 72px);
}

.section-padding {
    padding-top: 4rem;
    padding-bottom: 4rem;
}

.text-gradient {
    background-image: linear-gradient(to right, var(--tw-gradient-stops));
    --tw-gradient-from: #234C9B var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(35 76 155 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
    --tw-gradient-to: #B7D7EA var(--tw-gradient-to-position);
    -webkit-background-clip: text;
            background-clip: text;
    color: transparent;
}

/* ===== RESPONSIVE ===== */

@media (max-width: 768px) {
    .main-nav {
        display: none;
    }
    
    .legacy-mobile-menu-toggle {
        display: block;
    }
    
    .container {
        padding-left: 2.25rem;
        padding-right: 2.25rem;
    }
    
    .section-padding {
        padding-top: 3rem;
        padding-bottom: 3rem;
    }
}

@media (min-width: 769px) {
    .legacy-mobile-menu-toggle {
        display: none;
    }
    
    .legacy-mobile-menu {
        display: none;
    }
}

/* ===== ANIMATIONS ===== */

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

@keyframes slideInRight {
    from {
        opacity: 0;
        transform: translateX(30px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.animate-fade-in-up {
    animation: fadeInUp 0.6s ease-out;
}

.animate-slide-in-right {
    animation: slideInRight 0.6s ease-out;
}

/* ===== FOCUS STATES ===== */

.focus-visible:focus {
    outline: 2px solid transparent;
    outline-offset: 2px;
    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
    --tw-ring-opacity: 1;
    --tw-ring-color: rgb(35 76 155 / var(--tw-ring-opacity, 1));
    --tw-ring-offset-width: 2px;
}

/* ===== SCROLLBAR ===== */

::-webkit-scrollbar {
    width: 8px;
}

::-webkit-scrollbar-track {
    --tw-bg-opacity: 1;
    background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));
}

::-webkit-scrollbar-thumb {
    border-radius: 9999px;
    --tw-bg-opacity: 1;
    background-color: rgb(156 163 175 / var(--tw-bg-opacity, 1));
}

::-webkit-scrollbar-thumb:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(107 114 128 / var(--tw-bg-opacity, 1));
}

/* ===== PRINT ===== */

@media print {
    .legacy-mobile-menu-toggle,
    .legacy-mobile-menu,
    .acces-rapide {
        display: none;
    }
    
    #site-header {
        position: static;
        --tw-shadow: 0 0 #0000;
        --tw-shadow-colored: 0 0 #0000;
        box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    }
    
    .btn-primary,
    .btn-secondary,
    .btn-outline {
        border-width: 1px;
        --tw-border-opacity: 1;
        border-color: rgb(156 163 175 / var(--tw-border-opacity, 1));
        background-color: transparent;
        --tw-text-opacity: 1;
        color: rgb(31 41 55 / var(--tw-text-opacity, 1));
    }
}

/* ===================================
   PAIRED ROWS
   Logique :
   - 1 bloc Colonnes Gutenberg = 1 ligne
   - 2 colonnes desktop
   - 1 colonne mobile
   - bordures horizontales inset entre les lignes
   - verticale centrale segmentée par ligne
   - trou au croisement
   =================================== */

.paired-rows {
    width: 100%;
  }

/* -----------------------------
     Variables
  ----------------------------- */

:root {
    --pr-line: #707070;
    --pr-stroke: 1px;
  
    /* inset horizontal des lignes */
    --pr-inset-x: 36px;
  
    /* espace vertical entre contenu et traits */
    --pr-pad-y: 50px;
  
    /* espace entre contenu et ligne centrale */
    --pr-mid-pad: 18px;
  
    /* trou au croisement */
    --pr-cross-gap: 14px;
  
    /* padding bottom interne */
    --pr-pad-bottom: 50px;
  }

/* -----------------------------
     Row Gutenberg
  ----------------------------- */

.paired-rows .wp-block-columns {
    position: relative;
    gap: 0;
    margin: 0;
  }

/* reset éventuel Gutenberg */

.paired-rows .wp-block-columns > .wp-block-column {
    position: relative;
    margin: 0 !important;
    min-width: 0;
  }

/* si tu mets un Groupe à l'intérieur de chaque colonne */

.paired-rows .wp-block-columns > .wp-block-column > .wp-block-group,
  .paired-rows .wp-block-columns > .wp-block-column > .wp-block-group__inner-container {
    height: 100%;
  }

.paired-rows .wp-block-columns h3 {
    font-family: TT Norms, sans-serif;
    font-size: 15px;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 20px;
}

@media (min-width: 768px) {

    .paired-rows .wp-block-columns h3 {
        font-size: 22px;
        line-height: 28px;
    }
}

/* -----------------------------
     Desktop / Tablet
  ----------------------------- */

@media (min-width: 768px) {
    .paired-rows .wp-block-columns {
      align-items: stretch;
    }
  
    .paired-rows .wp-block-columns > .wp-block-column {
      padding-top: var(--pr-pad-y);
      padding-bottom: var(--pr-pad-bottom);
    }
  
    /* colonne gauche */
    .paired-rows .wp-block-columns > .wp-block-column:first-child {
      padding-left: 0;
      padding-right: calc(var(--pr-inset-x) + var(--pr-mid-pad));
    }
  
    /* colonne droite */
    .paired-rows .wp-block-columns > .wp-block-column:last-child {
      padding-left: calc(var(--pr-inset-x) + var(--pr-mid-pad));
      padding-right: 0;
    }
  
    /* =========================================
       1) horizontales inset entre les rows
       ========================================= */
    .paired-rows .wp-block-columns + .wp-block-columns > .wp-block-column::before {
      content: "";
      position: absolute;
      top: 0;
      /* left: var(--pr-inset-x);
      right: var(--pr-inset-x); */
      left: 0;
      right: 36px;
      height: var(--pr-stroke);
      background: var(--pr-line);
      pointer-events: none;
    }
    .paired-rows .wp-block-columns + .wp-block-columns > .wp-block-column + .wp-block-column::before {
        left: 36px;
        right: 0;
    }
    /* =========================================
       2) verticale centrale segmentée par row
       ========================================= */
  
    .paired-rows .wp-block-columns > .wp-block-column:first-child::after {
      content: "";
      position: absolute;
      right: 0;
      top: var(--pr-pad-y);
      bottom: var(--pr-pad-y);
      width: var(--pr-stroke);
      background: var(--pr-line);
      pointer-events: none;
    }
  
    .paired-rows .wp-block-columns > .wp-block-column:last-child::after {
      content: "";
      position: absolute;
      left: 0;
      top: var(--pr-pad-y);
      bottom: var(--pr-pad-y);
      width: var(--pr-stroke);
      background: var(--pr-line);
      pointer-events: none;
    }
  
    /* =========================================
       3) trou au croisement
       si la row a une ligne horizontale au-dessus
       ========================================= */
    .paired-rows .wp-block-columns + .wp-block-columns > .wp-block-column::after {
      top: calc(var(--pr-pad-y) + var(--pr-cross-gap));
    }
  
    /* optionnel : gérer proprement les marges internes Gutenberg */
    .paired-rows .wp-block-columns > .wp-block-column > *:first-child {
      margin-top: 0;
    }
  
    .paired-rows .wp-block-columns > .wp-block-column > *:last-child {
      margin-bottom: 0;
    }

    .paired-rows .wp-block-columns > .wp-block-column:last-child::after {
        display: none;
    }
  }

/* -----------------------------
     Mobile
  ----------------------------- */

@media (max-width: 767px) {
    .paired-rows .wp-block-columns {
      gap: 0;
      margin: 0;
    }
  
    .paired-rows .wp-block-columns > .wp-block-column {
      padding: 36px 0 16px 0;
      margin: 0 !important;
      border-top: 1px solid var(--pr-line);
    }
  
    /* coupe les pseudo-éléments desktop */
    .paired-rows .wp-block-columns > .wp-block-column::before,
    .paired-rows .wp-block-columns > .wp-block-column::after {
      content: none !important;
    }
  
    /* si les colonnes Gutenberg conservent un gap inline */
    .paired-rows .wp-block-columns.is-layout-flex {
      gap: 0 !important;
    }
  
    .paired-rows .wp-block-columns.is-layout-grid {
      gap: 0 !important;
    }
  
    .paired-rows .wp-block-columns > .wp-block-column > *:first-child {
      margin-top: 0;
    }
  
    .paired-rows .wp-block-columns > .wp-block-column > *:last-child {
      margin-bottom: 0;
    }
  }

.wp-block-embed-youtube iframe {
    width: 100%;
    aspect-ratio: 16 / 9;
    height: auto;
  }

.flex-vertical-center {
    display: flex;
    flex-flow: column nowrap;
    justify-content: center;
}

/* ===================================
   BLOC CONTACT
   =================================== */

.contact-block {
    padding: 4rem 0;
    background-color: #f9fafb;
}

/* En-tête de section */

.contact-block .text-center h2 {
    color: #111827;
    font-size: 2.25rem;
    font-weight: 700;
    margin-bottom: 1rem;
    line-height: 1.2;
}

.contact-block .text-center p {
    color: #6b7280;
    font-size: 1.25rem;
    max-width: 42rem;
    margin: 0 auto;
    line-height: 1.6;
}

/* Grille principale */

.contact-block .grid {
    display: grid;
    gap: 3rem;
}

.contact-block .lg\\:grid-cols-2 {
    grid-template-columns: repeat(1, minmax(0, 1fr));
}

@media (min-width: 1024px) {
    .contact-block .lg\\:grid-cols-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Formulaire de contact */

.contact-form {
    width: 100%;
}

.contact-form .bg-white {
    background: white;
    border-radius: 0.5rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    padding: 2rem;
}

.contact-form h3 {
    color: #111827;
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 1.5rem;
    line-height: 1.4;
}

/* Informations de contact */

.contact-info {
    width: 100%;
}

.contact-info .bg-white {
    background: white;
    border-radius: 0.5rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    padding: 2rem;
}

.contact-info h3 {
    color: #111827;
    font-size: 1.5rem;
    font-weight: 600;
    margin-bottom: 1.5rem;
    line-height: 1.4;
}

/* Éléments d'information */

.contact-info .space-y-6 > div {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
    margin-bottom: 1.5rem;
}

.contact-info .space-y-6 > div:last-child {
    margin-bottom: 0;
}

.contact-info .flex-shrink-0 {
    flex-shrink: 0;
    font-size: 1.5rem;
    width: 2rem;
    text-align: center;
}

.contact-info .flex-1 h4 {
    color: #111827;
    font-weight: 500;
    margin-bottom: 0.25rem;
    line-height: 1.4;
}

.contact-info .flex-1 a {
    color: #3b82f6;
    font-weight: 500;
    transition: color 0.2s ease;
    text-decoration: none;
}

.contact-info .flex-1 a:hover {
    color: #1d4ed8;
}

.contact-info .flex-1 p {
    color: #6b7280;
    line-height: 1.6;
    margin: 0;
}

/* Adresse complète */

.contact-info .border-t {
    border-top: 1px solid #e5e7eb;
    margin-top: 2rem;
    padding-top: 1.5rem;
}

.contact-info .border-t h4 {
    color: #111827;
    font-weight: 500;
    margin-bottom: 0.75rem;
    line-height: 1.4;
}

.contact-info .border-t p {
    color: #6b7280;
    line-height: 1.6;
    margin: 0;
}

/* Carte */

.contact-block .mt-12 {
    margin-top: 3rem;
}

.contact-block .bg-white.rounded-lg.shadow-lg {
    background: white;
    border-radius: 0.5rem;
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    overflow: hidden;
}

.contact-block .aspect-w-16.aspect-h-9 {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%; /* 16:9 aspect ratio */
}

.contact-block .aspect-w-16.aspect-h-9 iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
}

/* Layouts spécifiques */

.contact-block .max-w-2xl {
    max-width: 42rem;
    margin: 0 auto;
}

.contact-block .max-w-4xl {
    max-width: 56rem;
    margin: 0 auto;
}

/* Animations d'entrée */

.contact-form,
.contact-info {
    opacity: 0;
    animation: fade-in-up 0.6s ease-out forwards;
}

.contact-form {
    animation-delay: 0.1s;
}

.contact-info {
    animation-delay: 0.3s;
}

@keyframes fade-in-up {
    from {
        opacity: 0;
        transform: translateY(20px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Responsive */

@media (max-width: 768px) {
    .contact-block .text-center h2 {
        font-size: 2rem;
    }
    
    .contact-block .text-center p {
        font-size: 1.125rem;
    }
    
    .contact-form .bg-white,
    .contact-info .bg-white {
        padding: 1.5rem;
    }
    
    .contact-form h3,
    .contact-info h3 {
        font-size: 1.25rem;
    }
}

@media (max-width: 480px) {
    .contact-block .text-center h2 {
        font-size: 1.75rem;
    }
    
    .contact-block .text-center p {
        font-size: 1rem;
    }
    
    .contact-form .bg-white,
    .contact-info .bg-white {
        padding: 1.25rem;
    }
}

/* ===================================
   FOOTER
   =================================== */

/* Footer principal */

#site-footer {
    margin-top: auto; /* Pour pousser le footer en bas */
}

/* Colonnes du footer */

.footer-column {
    display: flex;
    flex-direction: column;
}

.footer-content {
    color: #e5e7eb;
}

.footer-content h3 {
    color: white;
    font-size: 1.125rem;
    font-weight: 600;
    margin-bottom: 1rem;
}

.footer-content p {
    color: #d1d5db;
    line-height: 1.6;
}

/* Menus du footer */

.footer-menu {
    margin-top: 1rem;
}

.footer-menu-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.footer-menu-item {
    margin: 0;
}

.footer-menu-link {
    color: #d1d5db;
    text-decoration: none;
    display: block;
    padding: 0.25rem 0;
    transition: color 0.2s ease;
}

.footer-menu-link:hover {
    color: #3b82f6; /* primary color */
}

/* Bandeau de financement */

.footer-bandeau {
    background-color: #111827; /* gray-900 */
    border-top: 1px solid #374151; /* gray-700 */
}

.footer-bandeau-content {
    color: #e5e7eb;
}

.footer-bandeau-content img {
    max-height: 4rem;
    width: auto;
}

.footer-bandeau-content .text-sm {
    font-size: 0.875rem;
}

.footer-bandeau-content .text-xs {
    font-size: 0.75rem;
}

.footer-bandeau-content .font-semibold {
    font-weight: 600;
}

.footer-bandeau-content .text-blue-600 {
    color: #2563eb;
}

/* Copyright */

.footer-copyright {
    border-top: 1px solid #222222; 
}

.footer-copyright p {
    margin: 0;
}

/* Responsive */

@media (max-width: 767px) {
    .footer-bandeau-content .flex {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }
    
    .footer-bandeau-content .space-x-8 > * + * {
        margin-left: 0;
        margin-top: 1rem;
    }
    
    .footer-bandeau-content .space-x-4 > * + * {
        margin-left: 0;
        margin-top: 0.5rem;
    }
    #site-footer .footer-column:last-child .footer-content p {
        font-size: 16px;
    }
}

/* Espacement des colonnes */

.footer-column + .footer-column {
    margin-top: 2rem;
}

@media (min-width: 768px) {
    .footer-column + .footer-column {
        margin-top: 0;
    }
}

/* Liens dans le contenu WYSIWYG */

.footer-content a {
    text-decoration: none !important;
}

/* Images dans le contenu WYSIWYG */

.footer-content img {
    height: auto;
    width: auto;
    justify-self: start;
}

@media screen and (max-width: 640px) {
    .footer-content .grid img {
        max-height: 80px;
        margin: auto;
        max-width: 120px;
    }
}

@media screen and (min-width: 1024px) {
    .footer-content img {
        max-width: 88px;
    }
    .footer-content img:first-child {
        max-width: 100px;
    }
    #site-footer hr {
        display: none;
    }
}

/* Listes dans le contenu WYSIWYG */

.footer-content ul,
.footer-content ol {
    margin: 0.5rem 0;
    padding-left: 1.5rem;
}

.footer-content li {
    margin: 0.25rem 0;
}

/* Pages */

.encart {
    padding: 55px 45px;
}

.encart:not([class*="bg-"]) {
    background-color: #FFF;
}

.encart h3 {
    margin-bottom: 1.25rem;
    max-width: 354px;
    font-family: TT Norms, sans-serif;
    font-size: 22px;
    font-weight: 400;
    text-transform: uppercase;
    line-height: 30px;
}

.encart p {
    line-height: 32px;
}

.post-410 h1 {
    padding-bottom: 0 !important;
    max-width: 612px;
}

.error404 main h1 {
    font-size: 317px;
    line-height: 348px;
    color: #000;
    margin: auto;
    text-align: center;
}

.error404 main p {
    font-size: 66px;
    line-height: 66px;
    color: #000;
    margin: auto;
    text-align: center;
}

.error404 main a {
    margin-left: auto;
    margin-right: auto;
    margin-top: 43px !important;
    text-align: center;
}

.services-block .error404 main a h2 {
    color: #111827;
    font-size: 2.25rem;
    font-weight: 700;
    margin-bottom: 1rem;
    line-height: 1.2;
}

.services-block .error404 main a p {
    color: #6b7280;
    font-size: 1.25rem;
    max-width: 42rem;
    margin: 0 auto;
    line-height: 1.6;
}

.actus-slider__ctas .error404 main a {
  /* min-width: 170px; */
  justify-content: center;
  text-align: center;
  flex: 1 1 0;
  width: 100%;
}

.wp-block-image.actus-slider__ctas .error404 main a img {
    width: 100%;
  }

@media (min-width: 768px) {

  .actus-slider__ctas .error404 main a {
    min-width: 200px;
    flex: 0 0 auto;
  }
}

.error404 main a,.error404 main a:visited {
    margin-top: 1rem;
    display: inline-block;
    width: -moz-fit-content;
    width: fit-content;
    max-width: 100%;
    padding-left: 47px;
    padding-right: 47px;
    padding-top: 14px;
    padding-bottom: 14px;
    font-family: TT Norms, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    text-transform: uppercase;
    text-decoration-line: none;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

.footer-bandeau-content .error404 main a,.footer-bandeau-content .error404 main a:visited {
    font-size: 0.75rem;
}

@media (min-width: 768px) {

    .error404 main a,.error404 main a:visited {
        font-size: 18px;
    }
}

.error404 main a,.error404 main a:visited {
    margin-top: 1rem;
    display: inline-block;
    width: -moz-fit-content;
    width: fit-content;
    max-width: 100%;
    padding-left: 47px;
    padding-right: 47px;
    padding-top: 14px;
    padding-bottom: 14px;
    font-family: TT Norms, sans-serif;
    font-size: 0.75rem;
    line-height: 1rem;
    text-transform: uppercase;
    text-decoration-line: none;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

.footer-bandeau-content .error404 main a,.footer-bandeau-content .error404 main a:visited {
    font-size: 0.75rem;
}

@media (min-width: 768px) {

    .error404 main a,.error404 main a:visited {
        font-size: 18px;
    }
}

.error404 main a {
    --tw-bg-opacity: 1;
    background-color: rgb(191 207 92 / var(--tw-bg-opacity, 1));
    --tw-text-opacity: 1;
    color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}

.error404 main a:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(45 65 60 / var(--tw-bg-opacity, 1));
    --tw-text-opacity: 1 !important;
    color: rgb(255 255 255 / var(--tw-text-opacity, 1)) !important;
}

.download-list-item p.error404 main a.btn--download {
  margin: 0;
}

.contact-block .error404 main a h2 {
    color: #111827;
    font-size: 2.25rem;
    font-weight: 700;
    margin-bottom: 1rem;
    line-height: 1.2;
}

.contact-block .error404 main a p {
    color: #6b7280;
    font-size: 1.25rem;
    max-width: 42rem;
    margin: 0 auto;
    line-height: 1.6;
}

@media (max-width: 768px) {
    .contact-block .error404 main a h2 {
        font-size: 2rem;
    }
    
    .contact-block .error404 main a p {
        font-size: 1.125rem;
    }
}

@media (max-width: 480px) {
    .contact-block .error404 main a h2 {
        font-size: 1.75rem;
    }
    
    .contact-block .error404 main a p {
        font-size: 1rem;
    }
}

.main404 {
    min-height: calc(100vh - 405px);
    padding: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

@media (max-width: 768px) {
    .encart {
        padding: 22px;
    }
    .encart p {
        line-height: 20px;
    }
    .error404 main h1 {
        font-size: 100px;
        line-height: 120px;
    } 
    .error404 main p {
        font-size: 30px;
        line-height: 35px;
    }
}

#cmplz-document h1,
.page-id-394 h1,
.page-id-396 h1,
.page-id-398 h1 {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
    font-family: TT Norms, sans-serif;
    font-size: 30px !important;
    font-weight: 700;
    text-transform: uppercase;
    line-height: 40px !important;
    --tw-text-opacity: 1 !important;
    color: rgb(0 0 0 / var(--tw-text-opacity, 1)) !important;
}

@media (min-width: 768px) {

    #cmplz-document h1,
.page-id-394 h1,
.page-id-396 h1,
.page-id-398 h1 {
        font-size: 36px !important;
        line-height: 50px !important;
    }
}

#cmplz-document h2,
.page-id-394 h2,
.page-id-396 h2,
.page-id-398 h2 {
    font-family: TT Norms, sans-serif;
    font-size: 22px;
    font-weight: 700;
    line-height: 28px;
}

@media (min-width: 768px) {

    #cmplz-document h2,
.page-id-394 h2,
.page-id-396 h2,
.page-id-398 h2 {
        font-size: 32px;
        line-height: 36px;
    }
}

#cmplz-document h2,
.page-id-394 h2,
.page-id-396 h2,
.page-id-398 h2 {
    text-transform: none;
}

#post-394, 
#post-396, 
#post-398 {
    padding-top: 2rem;
    padding-bottom: 2rem;
}

@media (min-width: 768px) {

    #post-394, 
#post-396, 
#post-398 {
        padding-top: 120px;
        padding-bottom: 100px;
    }
}

/* ÉTUDES */

.page-id-376 h1 {
    padding-bottom: 24px !important;
}

.page-id-376 .col-ressources .resource-card {
    margin-bottom: 55px; 
}

.page-id-376 .col-ressources .resource-card__inner,
.page-id-376 .col-ressources .resource-card {
    min-height: 200px;
}

@media screen and (min-width: 768px) {
    .page-id-376 .col-ressources .resource-card {
        min-height: 335px;
    }
}

/* MODALITÉS D'ADMISSION */

.page-id-412 h1 {
    max-width: 661px;
    padding-bottom: 2.25rem !important;
}

@media (min-width: 768px) {

    .page-id-412 h1 {
        padding-bottom: 70px !important;
    }
}

/* Actualités */

.page-id-384 h1 {
    padding-bottom: 1.75rem !important;
}

.page-id-434 h1.title {
    display: none !important;
}

.page-id-434 .content h1.wp-block-heading {
    padding: 0 !important;
}

.page-id-434 .content > div.wp-block-columns {
    gap: 1rem;
    padding-top: 2rem;
    padding-bottom: 2rem;
}

@media (min-width: 768px) {

    .page-id-434 .content > div.wp-block-columns {
        padding-top: 100px;
        padding-bottom: 100px;
    }
}

.page-id-434 .content > div.wp-block-columns p {
    margin: 0;
}

/* ===================================
   PAGE RÉSULTATS DE RECHERCHE
   =================================== */

.page-search #main {
    padding-top: 72px;
    padding-bottom: 50px;
}

/* Titre de page + requête mise en avant */

.page-search h1.title {
    padding-top: 3rem;
    padding-bottom: 0.5rem;
    font-size: 32px;
    line-height: 1.08;
}

.page-search h1.title span {
    /* color: #234C9B;  */
    color: #000;
}

/* Colonne de contenu lisible */

.page-search .content {
    max-width: 820px;
    margin-top: 24px;
}

/* --- Formulaire de recherche --- */

.page-search .search-form {
    margin: 0 0 48px;
}

.page-search .search-block {
    display: flex;
    align-items: stretch;
    border: 1px solid #707070;
    background: #fff;
    overflow: hidden;
}

.page-search .search-field {
    flex: 1;
    min-width: 0;
    border: none;
    outline: none;
    padding: 16px 20px;
    font-size: 18px;
    line-height: 24px;
    color: #1a1818;
    background: transparent;
}

.page-search .search-field::-moz-placeholder {
    color: #9a9a9a;
}

.page-search .search-field::placeholder {
    color: #9a9a9a;
}

.page-search .search-submit {
    flex-shrink: 0;
    width: 62px;
    border: none;
    cursor: pointer;
    background-color: #2D413C; /* vert */
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cline x1='21' y1='21' x2='16.65' y2='16.65'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    background-size: 22px;
    transition: background-color 0.2s ease;
}

.page-search .search-submit:hover {
    /* background-color: rgb(191, 207, 92);  */
}

.page-search .screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* --- Liste des résultats --- */

.page-search .description > article {
    padding: 26px 0;
    border-bottom: 1px solid #e2e2e2;
}

.page-search .description > article:first-of-type {
    border-top: 1px solid #e2e2e2;
}

.page-search .entry-header {
    margin: 0 0 8px;
}

.page-search .entry-title {
    font-family: TT Norms, sans-serif;
    margin: 0;
    font-size: 22px;
    line-height: 28px;
    font-weight: 500;
    text-transform: none;
}

.page-search .entry-title a {
    color: #2D413C; /* vert */
    text-decoration: none;
    transition: color 0.2s ease;
}

.page-search .entry-title a:hover {
    color: #234C9B; /* primary */
    text-decoration: underline;
}

.page-search .entry-summary,
.page-search .entry-summary p {
    color: #4b5563;
    font-size: 16px;
    line-height: 24px;
}

.page-search .entry-summary p {
    margin: 0;
}

/* --- Aucun résultat --- */

.page-search .search-no-results {
    padding: 24px 0;
    font-size: 18px;
    color: #4b5563;
}

.page-search .search-no-results i {
    color: #2D413C; /* vert */
    font-style: italic;
}

/* Responsive */

@media (max-width: 767px) {
    .page-search .search-field {
        padding: 13px 16px;
        font-size: 16px;
    }
    .page-search .search-submit {
        width: 54px;
    }
    .page-search .entry-title {
        font-size: 20px;
        line-height: 26px;
    }
}

.mea-biat .deux-colonnes__media img {
    max-height: 500px;
    -o-object-fit: contain;
       object-fit: contain;
}

@media (max-width: 1279px) { 
    .col-politique-de-confidentialite {
        flex-wrap: wrap !important;
    }
    .col-politique-de-confidentialite > .wp-block-column:first-child {
        flex-basis: 100%;
    }
}

.hero-breadcrumb {
    width: 100%;
  }

/* Image pleine largeur */

.hero-breadcrumb__media {
    width: 100%;
    overflow: hidden;
  }

.hero-breadcrumb__media img {
    width: 100%;
    height: clamp(220px, 28vw, 520px);
    -o-object-fit: cover;
       object-fit: cover;
    display: block;
  }

/* Bandeau */

.hero-breadcrumb__bar {
    background: #2D413C;
  }

.hero-breadcrumb__bar-inner {
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 18px 0;
  }

/* Si tu as une classe container globale, tu peux l’appliquer ici via ton wrapper outer.
     Sinon, tu peux mettre un max-width/padding ici. */

.hero-breadcrumb__bar-inner {
    max-width: calc(1280px + 72px);
    margin: 0 auto;
    padding-left: 36px;
    padding-right: 36px;
  }

.hero-breadcrumb__icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

.hero-breadcrumb__icon svg {
    width: 30.906px;
    height: 30.906px;
    display: block;
  }

/* Trail */

.hero-breadcrumb__trail {
    display: flex;
    align-items: baseline;
    gap: 12px;
    min-width: 0;
  }

/* Typo : tu dis "font-primary", je suppose déjà appliquée globalement.
     On force tailles/casse/couleur ici. */

.hero-breadcrumb__parent {
    text-transform: uppercase;
    font-size: 40px;
    line-height: 50px;
    color: #fff;
    text-decoration: none;
    white-space: nowrap;
    pointer-events: none;
  }

.hero-breadcrumb__parent:hover {
    color: #fff !important;
    text-decoration: none;
    font-weight: inherit;
  }

.hero-breadcrumb__sep {
    color: #fff;
    opacity: 1;
    font-size: 20px;
    line-height: 1;
    margin-right: -8px;
  }

.hero-breadcrumb__current {
    text-transform: uppercase;
    font-size: 20px;
    line-height: 26px;
    color: #fff;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

/* Mobile : on évite que ça casse */

@media (max-width: 767px) {
    .hero-breadcrumb__bar-inner {
      gap: 14px;
      padding-top: 14px;
      padding-bottom: 14px;
    }
  
    .hero-breadcrumb__parent {
      font-size: 26px;
      line-height: 32px;
    }
  
    .hero-breadcrumb__current {
      font-size: 16px;
      line-height: 20px;
    }
  }

/* Directives Tailwind */

*, ::before, ::after {
    --tw-border-spacing-x: 0;
    --tw-border-spacing-y: 0;
    --tw-translate-x: 0;
    --tw-translate-y: 0;
    --tw-rotate: 0;
    --tw-skew-x: 0;
    --tw-skew-y: 0;
    --tw-scale-x: 1;
    --tw-scale-y: 1;
    --tw-pan-x:  ;
    --tw-pan-y:  ;
    --tw-pinch-zoom:  ;
    --tw-scroll-snap-strictness: proximity;
    --tw-gradient-from-position:  ;
    --tw-gradient-via-position:  ;
    --tw-gradient-to-position:  ;
    --tw-ordinal:  ;
    --tw-slashed-zero:  ;
    --tw-numeric-figure:  ;
    --tw-numeric-spacing:  ;
    --tw-numeric-fraction:  ;
    --tw-ring-inset:  ;
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: rgb(59 130 246 / 0.5);
    --tw-ring-offset-shadow: 0 0 #0000;
    --tw-ring-shadow: 0 0 #0000;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    --tw-blur:  ;
    --tw-brightness:  ;
    --tw-contrast:  ;
    --tw-grayscale:  ;
    --tw-hue-rotate:  ;
    --tw-invert:  ;
    --tw-saturate:  ;
    --tw-sepia:  ;
    --tw-drop-shadow:  ;
    --tw-backdrop-blur:  ;
    --tw-backdrop-brightness:  ;
    --tw-backdrop-contrast:  ;
    --tw-backdrop-grayscale:  ;
    --tw-backdrop-hue-rotate:  ;
    --tw-backdrop-invert:  ;
    --tw-backdrop-opacity:  ;
    --tw-backdrop-saturate:  ;
    --tw-backdrop-sepia:  ;
    --tw-contain-size:  ;
    --tw-contain-layout:  ;
    --tw-contain-paint:  ;
    --tw-contain-style:  ;
}

::backdrop {
    --tw-border-spacing-x: 0;
    --tw-border-spacing-y: 0;
    --tw-translate-x: 0;
    --tw-translate-y: 0;
    --tw-rotate: 0;
    --tw-skew-x: 0;
    --tw-skew-y: 0;
    --tw-scale-x: 1;
    --tw-scale-y: 1;
    --tw-pan-x:  ;
    --tw-pan-y:  ;
    --tw-pinch-zoom:  ;
    --tw-scroll-snap-strictness: proximity;
    --tw-gradient-from-position:  ;
    --tw-gradient-via-position:  ;
    --tw-gradient-to-position:  ;
    --tw-ordinal:  ;
    --tw-slashed-zero:  ;
    --tw-numeric-figure:  ;
    --tw-numeric-spacing:  ;
    --tw-numeric-fraction:  ;
    --tw-ring-inset:  ;
    --tw-ring-offset-width: 0px;
    --tw-ring-offset-color: #fff;
    --tw-ring-color: rgb(59 130 246 / 0.5);
    --tw-ring-offset-shadow: 0 0 #0000;
    --tw-ring-shadow: 0 0 #0000;
    --tw-shadow: 0 0 #0000;
    --tw-shadow-colored: 0 0 #0000;
    --tw-blur:  ;
    --tw-brightness:  ;
    --tw-contrast:  ;
    --tw-grayscale:  ;
    --tw-hue-rotate:  ;
    --tw-invert:  ;
    --tw-saturate:  ;
    --tw-sepia:  ;
    --tw-drop-shadow:  ;
    --tw-backdrop-blur:  ;
    --tw-backdrop-brightness:  ;
    --tw-backdrop-contrast:  ;
    --tw-backdrop-grayscale:  ;
    --tw-backdrop-hue-rotate:  ;
    --tw-backdrop-invert:  ;
    --tw-backdrop-opacity:  ;
    --tw-backdrop-saturate:  ;
    --tw-backdrop-sepia:  ;
    --tw-contain-size:  ;
    --tw-contain-layout:  ;
    --tw-contain-paint:  ;
    --tw-contain-style:  ;
}

/* ! tailwindcss v3.4.17 | MIT License | https://tailwindcss.com */

/*
1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)
2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)
*/

*,
::before,
::after {
  box-sizing: border-box; /* 1 */
  border-width: 0; /* 2 */
  border-style: solid; /* 2 */
  border-color: #e5e7eb; /* 2 */
}

::before,
::after {
  --tw-content: '';
}

/*
1. Use a consistent sensible line-height in all browsers.
2. Prevent adjustments of font size after orientation changes in iOS.
3. Use a more readable tab size.
4. Use the user's configured `sans` font-family by default.
5. Use the user's configured `sans` font-feature-settings by default.
6. Use the user's configured `sans` font-variation-settings by default.
7. Disable tap highlights on iOS
*/

html,
:host {
  line-height: 1.5; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
  -moz-tab-size: 4; /* 3 */
  -o-tab-size: 4;
     tab-size: 4; /* 3 */
  font-family: Inter, system-ui, sans-serif; /* 4 */
  font-feature-settings: normal; /* 5 */
  font-variation-settings: normal; /* 6 */
  -webkit-tap-highlight-color: transparent; /* 7 */
}

/*
1. Remove the margin in all browsers.
2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.
*/

body {
  margin: 0; /* 1 */
  line-height: inherit; /* 2 */
}

/*
1. Add the correct height in Firefox.
2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)
3. Ensure horizontal rules are visible by default.
*/

hr {
  height: 0; /* 1 */
  color: inherit; /* 2 */
  border-top-width: 1px; /* 3 */
}

/*
Add the correct text decoration in Chrome, Edge, and Safari.
*/

abbr:where([title]) {
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
}

/*
Remove the default font size and weight for headings.
*/

h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: inherit;
  font-weight: inherit;
}

/*
Reset links to optimize for opt-in styling instead of opt-out.
*/

a {
  color: inherit;
  text-decoration: inherit;
}

/*
Add the correct font weight in Edge and Safari.
*/

b,
strong {
  font-weight: bolder;
}

/*
1. Use the user's configured `mono` font-family by default.
2. Use the user's configured `mono` font-feature-settings by default.
3. Use the user's configured `mono` font-variation-settings by default.
4. Correct the odd `em` font sizing in all browsers.
*/

code,
kbd,
samp,
pre {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace; /* 1 */
  font-feature-settings: normal; /* 2 */
  font-variation-settings: normal; /* 3 */
  font-size: 1em; /* 4 */
}

/*
Add the correct font size in all browsers.
*/

small {
  font-size: 80%;
}

/*
Prevent `sub` and `sup` elements from affecting the line height in all browsers.
*/

sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/*
1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)
2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)
3. Remove gaps between table borders by default.
*/

table {
  text-indent: 0; /* 1 */
  border-color: inherit; /* 2 */
  border-collapse: collapse; /* 3 */
}

/*
1. Change the font styles in all browsers.
2. Remove the margin in Firefox and Safari.
3. Remove default padding in all browsers.
*/

button,
input,
optgroup,
select,
textarea {
  font-family: inherit; /* 1 */
  font-feature-settings: inherit; /* 1 */
  font-variation-settings: inherit; /* 1 */
  font-size: 100%; /* 1 */
  font-weight: inherit; /* 1 */
  line-height: inherit; /* 1 */
  letter-spacing: inherit; /* 1 */
  color: inherit; /* 1 */
  margin: 0; /* 2 */
  padding: 0; /* 3 */
}

/*
Remove the inheritance of text transform in Edge and Firefox.
*/

button,
select {
  text-transform: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Remove default button styles.
*/

button,
input:where([type='button']),
input:where([type='reset']),
input:where([type='submit']) {
  -webkit-appearance: button; /* 1 */
  background-color: transparent; /* 2 */
  background-image: none; /* 2 */
}

/*
Use the modern Firefox focus style for all focusable elements.
*/

:-moz-focusring {
  outline: auto;
}

/*
Remove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)
*/

:-moz-ui-invalid {
  box-shadow: none;
}

/*
Add the correct vertical alignment in Chrome and Firefox.
*/

progress {
  vertical-align: baseline;
}

/*
Correct the cursor style of increment and decrement buttons in Safari.
*/

::-webkit-inner-spin-button,
::-webkit-outer-spin-button {
  height: auto;
}

/*
1. Correct the odd appearance in Chrome and Safari.
2. Correct the outline style in Safari.
*/

[type='search'] {
  -webkit-appearance: textfield; /* 1 */
  outline-offset: -2px; /* 2 */
}

/*
Remove the inner padding in Chrome and Safari on macOS.
*/

::-webkit-search-decoration {
  -webkit-appearance: none;
}

/*
1. Correct the inability to style clickable types in iOS and Safari.
2. Change font properties to `inherit` in Safari.
*/

::-webkit-file-upload-button {
  -webkit-appearance: button; /* 1 */
  font: inherit; /* 2 */
}

/*
Add the correct display in Chrome and Safari.
*/

summary {
  display: list-item;
}

/*
Removes the default spacing and border for appropriate elements.
*/

blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
figure,
p,
pre {
  margin: 0;
}

fieldset {
  margin: 0;
  padding: 0;
}

legend {
  padding: 0;
}

ol,
ul,
menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

/*
Reset default styling for dialogs.
*/

dialog {
  padding: 0;
}

/*
Prevent resizing textareas horizontally by default.
*/

textarea {
  resize: vertical;
}

/*
1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)
2. Set the default placeholder color to the user's configured gray 400 color.
*/

input::-moz-placeholder, textarea::-moz-placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}

input::placeholder,
textarea::placeholder {
  opacity: 1; /* 1 */
  color: #9ca3af; /* 2 */
}

/*
Set the default cursor for buttons.
*/

button,
[role="button"] {
  cursor: pointer;
}

/*
Make sure disabled buttons don't get the pointer cursor.
*/

:disabled {
  cursor: default;
}

/*
1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)
2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)
   This can trigger a poorly considered lint error in some tools but is included by design.
*/

img,
svg,
video,
canvas,
audio,
iframe,
embed,
object {
  display: block; /* 1 */
  vertical-align: middle; /* 2 */
}

/*
Constrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)
*/

img,
video {
  max-width: 100%;
  height: auto;
}

/* Make elements with the HTML hidden attribute stay hidden by default */

[hidden]:where(:not([hidden="until-found"])) {
  display: none;
}

.container {
    width: 100%;
    margin-right: auto;
    margin-left: auto;
    padding-right: 1rem;
    padding-left: 1rem;
}

@media (min-width: 640px) {

    .container {
        max-width: 640px;
    }
}

@media (min-width: 768px) {

    .container {
        max-width: 768px;
    }
}

@media (min-width: 1024px) {

    .container {
        max-width: 1024px;
    }
}

@media (min-width: 1280px) {

    .container {
        max-width: 1280px;
    }
}

/* Utilitaires globaux */

.container {
    margin-left: auto;
    margin-right: auto;
    padding-left: 2.25rem;
    padding-right: 2.25rem;
    max-width: calc(80rem + 72px);
}

.section-padding {
    padding-top: 4rem;
    padding-bottom: 4rem;
}

.text-gradient {
    background-image: linear-gradient(to right, var(--tw-gradient-stops));
    --tw-gradient-from: #234C9B var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(35 76 155 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
    --tw-gradient-to: #B7D7EA var(--tw-gradient-to-position);
    -webkit-background-clip: text;
            background-clip: text;
    color: transparent;
}

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

.visible {
    visibility: visible;
}

.invisible {
    visibility: hidden;
}

.static {
    position: static;
}

.fixed {
    position: fixed;
}

.absolute {
    position: absolute;
}

.relative {
    position: relative;
}

.sticky {
    position: sticky;
}

.inset-0 {
    inset: 0px;
}

.bottom-0 {
    bottom: 0px;
}

.left-0 {
    left: 0px;
}

.right-0 {
    right: 0px;
}

.top-0 {
    top: 0px;
}

.top-full {
    top: 100%;
}

.z-0 {
    z-index: 0;
}

.z-10 {
    z-index: 10;
}

.z-30 {
    z-index: 30;
}

.z-40 {
    z-index: 40;
}

.z-50 {
    z-index: 50;
}

.order-1 {
    order: 1;
}

.order-2 {
    order: 2;
}

.\!m-0 {
    margin: 0px !important;
}

.m-0 {
    margin: 0px;
}

.\!my-8 {
    margin-top: 2rem !important;
    margin-bottom: 2rem !important;
}

.mx-auto {
    margin-left: auto;
    margin-right: auto;
}

.my-4 {
    margin-top: 1rem;
    margin-bottom: 1rem;
}

.my-8 {
    margin-top: 2rem;
    margin-bottom: 2rem;
}

.\!mb-0 {
    margin-bottom: 0px !important;
}

.\!mb-12 {
    margin-bottom: 3rem !important;
}

.\!mb-4 {
    margin-bottom: 1rem !important;
}

.\!mb-8 {
    margin-bottom: 2rem !important;
}

.\!mt-0 {
    margin-top: 0px !important;
}

.\!mt-8 {
    margin-top: 2rem !important;
}

.\!mt-\[43px\] {
    margin-top: 43px !important;
}

.\!mt-auto {
    margin-top: auto !important;
}

.mb-0 {
    margin-bottom: 0px;
}

.mb-1 {
    margin-bottom: 0.25rem;
}

.mb-16 {
    margin-bottom: 4rem;
}

.mb-3 {
    margin-bottom: 0.75rem;
}

.mb-4 {
    margin-bottom: 1rem;
}

.mb-5 {
    margin-bottom: 1.25rem;
}

.mb-6 {
    margin-bottom: 1.5rem;
}

.mb-8 {
    margin-bottom: 2rem;
}

.ml-1 {
    margin-left: 0.25rem;
}

.mt-12 {
    margin-top: 3rem;
}

.mt-4 {
    margin-top: 1rem;
}

.mt-8 {
    margin-top: 2rem;
}

.mt-auto {
    margin-top: auto;
}

.block {
    display: block;
}

.inline-block {
    display: inline-block;
}

.inline {
    display: inline;
}

.flex {
    display: flex;
}

.inline-flex {
    display: inline-flex;
}

.table {
    display: table;
}

.table-cell {
    display: table-cell;
}

.table-row {
    display: table-row;
}

.grid {
    display: grid;
}

.contents {
    display: contents;
}

.list-item {
    display: list-item;
}

.hidden {
    display: none;
}

.h-0 {
    height: 0px;
}

.h-0\.5 {
    height: 0.125rem;
}

.h-10 {
    height: 2.5rem;
}

.h-12 {
    height: 3rem;
}

.h-16 {
    height: 4rem;
}

.h-4 {
    height: 1rem;
}

.h-5 {
    height: 1.25rem;
}

.h-6 {
    height: 1.5rem;
}

.h-8 {
    height: 2rem;
}

.h-\[40px\] {
    height: 40px;
}

.h-full {
    height: 100%;
}

.min-h-screen {
    min-height: 100vh;
}

.w-0 {
    width: 0px;
}

.w-12 {
    width: 3rem;
}

.w-16 {
    width: 4rem;
}

.w-5 {
    width: 1.25rem;
}

.w-6 {
    width: 1.5rem;
}

.w-8 {
    width: 2rem;
}

.w-\[40px\] {
    width: 40px;
}

.w-\[72px\] {
    width: 72px;
}

.w-auto {
    width: auto;
}

.w-fit {
    width: -moz-fit-content;
    width: fit-content;
}

.w-full {
    width: 100%;
}

.min-w-48 {
    min-width: 12rem;
}

.min-w-\[40px\] {
    min-width: 40px;
}

.max-w-2xl {
    max-width: 42rem;
}

.max-w-4xl {
    max-width: 56rem;
}

.max-w-7xl {
    max-width: 80rem;
}

.max-w-\[1440px\] {
    max-width: 1440px;
}

.max-w-\[354px\] {
    max-width: 354px;
}

.max-w-full {
    max-width: 100%;
}

.flex-1 {
    flex: 1 1 0%;
}

.flex-shrink {
    flex-shrink: 1;
}

.flex-shrink-0 {
    flex-shrink: 0;
}

.transform {
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

@keyframes fadeInUp {

    0% {
        opacity: 0;
        transform: translateY(30px);
    }

    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-fade-in-up {
    animation: fadeInUp 0.6s ease-out;
}

.resize {
    resize: both;
}

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

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

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

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

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

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

.flex-row {
    flex-direction: row;
}

.flex-row-reverse {
    flex-direction: row-reverse;
}

.flex-col {
    flex-direction: column;
}

.flex-col-reverse {
    flex-direction: column-reverse;
}

.flex-wrap {
    flex-wrap: wrap;
}

.flex-nowrap {
    flex-wrap: nowrap;
}

.items-start {
    align-items: flex-start;
}

.items-center {
    align-items: center;
}

.justify-end {
    justify-content: flex-end;
}

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

.justify-between {
    justify-content: space-between;
}

.justify-around {
    justify-content: space-around;
}

.justify-items-center {
    justify-items: center;
}

.\!gap-6 {
    gap: 1.5rem !important;
}

.gap-1 {
    gap: 0.25rem;
}

.gap-10 {
    gap: 2.5rem;
}

.gap-12 {
    gap: 3rem;
}

.gap-2 {
    gap: 0.5rem;
}

.gap-3 {
    gap: 0.75rem;
}

.gap-4 {
    gap: 1rem;
}

.gap-5 {
    gap: 1.25rem;
}

.gap-6 {
    gap: 1.5rem;
}

.gap-8 {
    gap: 2rem;
}

.gap-\[24px\] {
    gap: 24px;
}

.gap-\[32px\] {
    gap: 32px;
}

.space-x-2 > :not([hidden]) ~ :not([hidden]) {
    --tw-space-x-reverse: 0;
    margin-right: calc(0.5rem * var(--tw-space-x-reverse));
    margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
}

.space-x-4 > :not([hidden]) ~ :not([hidden]) {
    --tw-space-x-reverse: 0;
    margin-right: calc(1rem * var(--tw-space-x-reverse));
    margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));
}

.space-x-6 > :not([hidden]) ~ :not([hidden]) {
    --tw-space-x-reverse: 0;
    margin-right: calc(1.5rem * var(--tw-space-x-reverse));
    margin-left: calc(1.5rem * calc(1 - var(--tw-space-x-reverse)));
}

.space-x-8 > :not([hidden]) ~ :not([hidden]) {
    --tw-space-x-reverse: 0;
    margin-right: calc(2rem * var(--tw-space-x-reverse));
    margin-left: calc(2rem * calc(1 - var(--tw-space-x-reverse)));
}

.space-y-2 > :not([hidden]) ~ :not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
    margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
}

.space-y-6 > :not([hidden]) ~ :not([hidden]) {
    --tw-space-y-reverse: 0;
    margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));
    margin-bottom: calc(1.5rem * var(--tw-space-y-reverse));
}

.overflow-hidden {
    overflow: hidden;
}

.\!rounded-none {
    border-radius: 0px !important;
}

.rounded {
    border-radius: 0.25rem;
}

.rounded-full {
    border-radius: 9999px;
}

.rounded-lg {
    border-radius: 0.5rem;
}

.rounded-md {
    border-radius: 0.375rem;
}

.rounded-sm {
    border-radius: 0.125rem;
}

.border {
    border-width: 1px;
}

.border-2 {
    border-width: 2px;
}

.border-b {
    border-bottom-width: 1px;
}

.border-l-4 {
    border-left-width: 4px;
}

.border-r-4 {
    border-right-width: 4px;
}

.border-t {
    border-top-width: 1px;
}

.border-t-4 {
    border-top-width: 4px;
}

.border-\[\#1a1818\] {
    --tw-border-opacity: 1;
    border-color: rgb(26 24 24 / var(--tw-border-opacity, 1));
}

.border-\[\#707070\] {
    --tw-border-opacity: 1;
    border-color: rgb(112 112 112 / var(--tw-border-opacity, 1));
}

.border-gray-200 {
    --tw-border-opacity: 1;
    border-color: rgb(229 231 235 / var(--tw-border-opacity, 1));
}

.border-gray-300 {
    --tw-border-opacity: 1;
    border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));
}

.border-gray-400 {
    --tw-border-opacity: 1;
    border-color: rgb(156 163 175 / var(--tw-border-opacity, 1));
}

.border-primary {
    --tw-border-opacity: 1;
    border-color: rgb(35 76 155 / var(--tw-border-opacity, 1));
}

.border-transparent {
    border-color: transparent;
}

.border-white {
    --tw-border-opacity: 1;
    border-color: rgb(255 255 255 / var(--tw-border-opacity, 1));
}

.border-t-gray-400 {
    --tw-border-opacity: 1;
    border-top-color: rgb(156 163 175 / var(--tw-border-opacity, 1));
}

.border-t-primary {
    --tw-border-opacity: 1;
    border-top-color: rgb(35 76 155 / var(--tw-border-opacity, 1));
}

.bg-\[\#BFCF5C\] {
    --tw-bg-opacity: 1;
    background-color: rgb(191 207 92 / var(--tw-bg-opacity, 1));
}

.bg-black {
    --tw-bg-opacity: 1;
    background-color: rgb(0 0 0 / var(--tw-bg-opacity, 1));
}

.bg-blue-600 {
    --tw-bg-opacity: 1;
    background-color: rgb(37 99 235 / var(--tw-bg-opacity, 1));
}

.bg-gray-100 {
    --tw-bg-opacity: 1;
    background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));
}

.bg-gray-200 {
    --tw-bg-opacity: 1;
    background-color: rgb(229 231 235 / var(--tw-bg-opacity, 1));
}

.bg-gray-300 {
    --tw-bg-opacity: 1;
    background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1));
}

.bg-gray-400 {
    --tw-bg-opacity: 1;
    background-color: rgb(156 163 175 / var(--tw-bg-opacity, 1));
}

.bg-gray-50 {
    --tw-bg-opacity: 1;
    background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1));
}

.bg-gray-900 {
    --tw-bg-opacity: 1;
    background-color: rgb(17 24 39 / var(--tw-bg-opacity, 1));
}

.bg-grey {
    --tw-bg-opacity: 1;
    background-color: rgb(245 245 245 / var(--tw-bg-opacity, 1));
}

.bg-indigo-600 {
    --tw-bg-opacity: 1;
    background-color: rgb(79 70 229 / var(--tw-bg-opacity, 1));
}

.bg-primary {
    --tw-bg-opacity: 1;
    background-color: rgb(35 76 155 / var(--tw-bg-opacity, 1));
}

.bg-vert {
    --tw-bg-opacity: 1;
    background-color: rgb(45 65 60 / var(--tw-bg-opacity, 1));
}

.bg-vert-light {
    --tw-bg-opacity: 1;
    background-color: rgb(191 207 92 / var(--tw-bg-opacity, 1));
}

.bg-white {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}

.bg-opacity-50 {
    --tw-bg-opacity: 0.5;
}

.bg-gradient-to-br {
    background-image: linear-gradient(to bottom right, var(--tw-gradient-stops));
}

.bg-gradient-to-r {
    background-image: linear-gradient(to right, var(--tw-gradient-stops));
}

.from-primary {
    --tw-gradient-from: #234C9B var(--tw-gradient-from-position);
    --tw-gradient-to: rgb(35 76 155 / 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.to-secondary {
    --tw-gradient-to: #B7D7EA var(--tw-gradient-to-position);
}

.bg-cover {
    background-size: cover;
}

.bg-clip-text {
    -webkit-background-clip: text;
            background-clip: text;
}

.bg-center {
    background-position: center;
}

.bg-no-repeat {
    background-repeat: no-repeat;
}

.object-cover {
    -o-object-fit: cover;
       object-fit: cover;
}

.\!p-0 {
    padding: 0px !important;
}

.p-0 {
    padding: 0px;
}

.p-2 {
    padding: 0.5rem;
}

.p-4 {
    padding: 1rem;
}

.p-6 {
    padding: 1.5rem;
}

.p-8 {
    padding: 2rem;
}

.\!px-0 {
    padding-left: 0px !important;
    padding-right: 0px !important;
}

.\!py-0 {
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

.px-4 {
    padding-left: 1rem;
    padding-right: 1rem;
}

.px-6 {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

.px-8 {
    padding-left: 2rem;
    padding-right: 2rem;
}

.px-9 {
    padding-left: 2.25rem;
    padding-right: 2.25rem;
}

.px-\[47px\] {
    padding-left: 47px;
    padding-right: 47px;
}

.px-\[75px\] {
    padding-left: 75px;
    padding-right: 75px;
}

.px-\[8px\] {
    padding-left: 8px;
    padding-right: 8px;
}

.py-10 {
    padding-top: 2.5rem;
    padding-bottom: 2.5rem;
}

.py-12 {
    padding-top: 3rem;
    padding-bottom: 3rem;
}

.py-16 {
    padding-top: 4rem;
    padding-bottom: 4rem;
}

.py-2 {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}

.py-3 {
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
}

.py-4 {
    padding-top: 1rem;
    padding-bottom: 1rem;
}

.py-6 {
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
}

.py-8 {
    padding-top: 2rem;
    padding-bottom: 2rem;
}

.py-\[10px\] {
    padding-top: 10px;
    padding-bottom: 10px;
}

.py-\[120px\] {
    padding-top: 120px;
    padding-bottom: 120px;
}

.py-\[14px\] {
    padding-top: 14px;
    padding-bottom: 14px;
}

.py-\[50px\] {
    padding-top: 50px;
    padding-bottom: 50px;
}

.py-\[60px\] {
    padding-top: 60px;
    padding-bottom: 60px;
}

.\!pb-0 {
    padding-bottom: 0px !important;
}

.\!pb-8 {
    padding-bottom: 2rem !important;
}

.\!pb-9 {
    padding-bottom: 2.25rem !important;
}

.\!pt-0 {
    padding-top: 0px !important;
}

.pb-10 {
    padding-bottom: 2.5rem;
}

.pb-6 {
    padding-bottom: 1.5rem;
}

.pb-\[50px\] {
    padding-bottom: 50px;
}

.pt-10 {
    padding-top: 2.5rem;
}

.pt-12 {
    padding-top: 3rem;
}

.pt-6 {
    padding-top: 1.5rem;
}

.pt-\[50px\] {
    padding-top: 50px;
}

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

.font-primary {
    font-family: TT Norms, sans-serif;
}

.\!text-\[30px\] {
    font-size: 30px !important;
}

.text-2xl {
    font-size: 1.5rem;
    line-height: 2rem;
}

.text-4xl {
    font-size: 2.25rem;
    line-height: 2.5rem;
}

.text-6xl {
    font-size: 3.75rem;
    line-height: 1;
}

.text-\[10px\] {
    font-size: 10px;
}

.text-\[12px\] {
    font-size: 12px;
}

.text-\[15px\] {
    font-size: 15px;
}

.text-\[16px\] {
    font-size: 16px;
}

.text-\[20px\] {
    font-size: 20px;
}

.text-\[22px\] {
    font-size: 22px;
}

.text-\[24px\] {
    font-size: 24px;
}

.text-\[25px\] {
    font-size: 25px;
}

.text-\[30px\] {
    font-size: 30px;
}

.text-\[32px\] {
    font-size: 32px;
}

.text-\[36px\] {
    font-size: 36px;
}

.text-\[40px\] {
    font-size: 40px;
}

.text-base {
    font-size: 1rem;
    line-height: 1.5rem;
}

.text-lg {
    font-size: 1.125rem;
    line-height: 1.75rem;
}

.text-sm {
    font-size: 0.875rem;
    line-height: 1.25rem;
}

.text-xl {
    font-size: 1.25rem;
    line-height: 1.75rem;
}

.text-xs {
    font-size: 0.75rem;
    line-height: 1rem;
}

.font-bold {
    font-weight: 700;
}

.font-medium {
    font-weight: 500;
}

.font-normal {
    font-weight: 400;
}

.font-semibold {
    font-weight: 600;
}

.uppercase {
    text-transform: uppercase;
}

.italic {
    font-style: italic;
}

.\!leading-4 {
    line-height: 1rem !important;
}

.\!leading-\[40px\] {
    line-height: 40px !important;
}

.leading-9 {
    line-height: 2.25rem;
}

.leading-\[16px\] {
    line-height: 16px;
}

.leading-\[20px\] {
    line-height: 20px;
}

.leading-\[26px\] {
    line-height: 26px;
}

.leading-\[28px\] {
    line-height: 28px;
}

.leading-\[30px\] {
    line-height: 30px;
}

.leading-\[32px\] {
    line-height: 32px;
}

.leading-\[35px\] {
    line-height: 35px;
}

.leading-\[36px\] {
    line-height: 36px;
}

.leading-\[40px\] {
    line-height: 40px;
}

.leading-\[46px\] {
    line-height: 46px;
}

.leading-\[50px\] {
    line-height: 50px;
}

.leading-relaxed {
    line-height: 1.625;
}

.\!text-black {
    --tw-text-opacity: 1 !important;
    color: rgb(0 0 0 / var(--tw-text-opacity, 1)) !important;
}

.text-\[\#2D413C\] {
    --tw-text-opacity: 1;
    color: rgb(45 65 60 / var(--tw-text-opacity, 1));
}

.text-\[\#F8F7F2\] {
    --tw-text-opacity: 1;
    color: rgb(248 247 242 / var(--tw-text-opacity, 1));
}

.text-black {
    --tw-text-opacity: 1;
    color: rgb(0 0 0 / var(--tw-text-opacity, 1));
}

.text-blue-600 {
    --tw-text-opacity: 1;
    color: rgb(37 99 235 / var(--tw-text-opacity, 1));
}

.text-gray-100 {
    --tw-text-opacity: 1;
    color: rgb(243 244 246 / var(--tw-text-opacity, 1));
}

.text-gray-300 {
    --tw-text-opacity: 1;
    color: rgb(209 213 219 / var(--tw-text-opacity, 1));
}

.text-gray-400 {
    --tw-text-opacity: 1;
    color: rgb(156 163 175 / var(--tw-text-opacity, 1));
}

.text-gray-600 {
    --tw-text-opacity: 1;
    color: rgb(75 85 99 / var(--tw-text-opacity, 1));
}

.text-gray-700 {
    --tw-text-opacity: 1;
    color: rgb(55 65 81 / var(--tw-text-opacity, 1));
}

.text-gray-800 {
    --tw-text-opacity: 1;
    color: rgb(31 41 55 / var(--tw-text-opacity, 1));
}

.text-gray-900 {
    --tw-text-opacity: 1;
    color: rgb(17 24 39 / var(--tw-text-opacity, 1));
}

.text-primary {
    --tw-text-opacity: 1;
    color: rgb(35 76 155 / var(--tw-text-opacity, 1));
}

.text-red-600 {
    --tw-text-opacity: 1;
    color: rgb(220 38 38 / var(--tw-text-opacity, 1));
}

.text-white {
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.underline {
    text-decoration-line: underline;
}

.no-underline {
    text-decoration-line: none;
}

.antialiased {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.opacity-0 {
    opacity: 0;
}

.opacity-75 {
    opacity: 0.75;
}

.opacity-90 {
    opacity: 0.9;
}

.shadow-lg {
    --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.shadow-md {
    --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
    --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.outline-none {
    outline: 2px solid transparent;
    outline-offset: 2px;
}

.outline {
    outline-style: solid;
}

.ring-2 {
    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}

.ring-primary {
    --tw-ring-opacity: 1;
    --tw-ring-color: rgb(35 76 155 / var(--tw-ring-opacity, 1));
}

.blur {
    --tw-blur: blur(8px);
    filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.filter {
    filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}

.transition {
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

.transition-all {
    transition-property: all;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

.transition-colors {
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

.transition-opacity {
    transition-property: opacity;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

.transition-shadow {
    transition-property: box-shadow;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

.transition-transform {
    transition-property: transform;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

.duration-200 {
    transition-duration: 200ms;
}

.duration-300 {
    transition-duration: 300ms;
}

.ease-in-out {
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

.ease-out {
    transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
}

.mobile-only {
    display: block;
}

@media (min-width: 1024px) {

    .mobile-only {
        display: none;
    }
}

.desktop-only {
    display: none;
}

@media (min-width: 1024px) {

    .desktop-only {
        display: block;
    }
}

.tablet-up {
    display: none;
}

@media (min-width: 768px) {

    .tablet-up {
        display: block;
    }
}

.mobile-up {
    display: block;
}

body {
  overflow-x: hidden;
  height: auto;
}

/* ===================================
   STYLES GLOBAUX FULL-WIDTH
   =================================== */

/* Classe pour les sections en pleine largeur */

.cta-centered--full-width,
.features-screenshot--full-width,
.hero-centered--full-width,
.testimonials-cards--full-width,
.newsletter-centered--full-width,
.cards-grid--full-width,
.tabs-simple--full-width {
    width: 100vw;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
}

/* Composants personnalisés */

/* Responsive utilities */

/* Animations personnalisées */

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

.animate-fade-in-up {
  animation: fadeInUp 0.6s ease-out;
}

/* Focus states accessibles */

.focus-visible:focus {
    outline: 2px solid transparent;
    outline-offset: 2px;
    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
    --tw-ring-opacity: 1;
    --tw-ring-color: rgb(35 76 155 / var(--tw-ring-opacity, 1));
    --tw-ring-offset-width: 2px;
}

/* Scrollbar personnalisée */

::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
    --tw-bg-opacity: 1;
    background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));
}

::-webkit-scrollbar-thumb {
    border-radius: 9999px;
    --tw-bg-opacity: 1;
    background-color: rgb(156 163 175 / var(--tw-bg-opacity, 1));
}

::-webkit-scrollbar-thumb:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(107 114 128 / var(--tw-bg-opacity, 1));
}

.hover\:-translate-y-2:hover {
    --tw-translate-y: -0.5rem;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
}

.hover\:bg-gray-100:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(243 244 246 / var(--tw-bg-opacity, 1));
}

.hover\:bg-gray-300:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(209 213 219 / var(--tw-bg-opacity, 1));
}

.hover\:bg-gray-50:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(249 250 251 / var(--tw-bg-opacity, 1));
}

.hover\:bg-primary:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(35 76 155 / var(--tw-bg-opacity, 1));
}

.hover\:bg-primary-dark:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(26 58 122 / var(--tw-bg-opacity, 1));
}

.hover\:bg-vert:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(45 65 60 / var(--tw-bg-opacity, 1));
}

.hover\:bg-white:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
}

.hover\:text-primary:hover {
    --tw-text-opacity: 1;
    color: rgb(35 76 155 / var(--tw-text-opacity, 1));
}

.hover\:text-primary-dark:hover {
    --tw-text-opacity: 1;
    color: rgb(26 58 122 / var(--tw-text-opacity, 1));
}

.hover\:text-white:hover {
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

.hover\:shadow-lg:hover {
    --tw-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.hover\:shadow-xl:hover {
    --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
    --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
}

.focus\:border-transparent:focus {
    border-color: transparent;
}

.focus\:outline-none:focus {
    outline: 2px solid transparent;
    outline-offset: 2px;
}

.focus\:ring-2:focus {
    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}

.focus\:ring-primary:focus {
    --tw-ring-opacity: 1;
    --tw-ring-color: rgb(35 76 155 / var(--tw-ring-opacity, 1));
}

.focus-visible\:outline-none:focus-visible {
    outline: 2px solid transparent;
    outline-offset: 2px;
}

.focus-visible\:ring-2:focus-visible {
    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
}

.focus-visible\:ring-primary:focus-visible {
    --tw-ring-opacity: 1;
    --tw-ring-color: rgb(35 76 155 / var(--tw-ring-opacity, 1));
}

.focus-visible\:ring-offset-2:focus-visible {
    --tw-ring-offset-width: 2px;
}

.group:hover .group-hover\:visible {
    visibility: visible;
}

.group:hover .group-hover\:opacity-100 {
    opacity: 1;
}

@media (min-width: 640px) {

    .sm\:block {
        display: block;
    }

    .sm\:inline-block {
        display: inline-block;
    }

    .sm\:inline {
        display: inline;
    }

    .sm\:flex {
        display: flex;
    }

    .sm\:inline-flex {
        display: inline-flex;
    }

    .sm\:grid {
        display: grid;
    }

    .sm\:hidden {
        display: none;
    }

    .sm\:w-1\/2 {
        width: 50%;
    }

    .sm\:w-1\/3 {
        width: 33.333333%;
    }

    .sm\:w-1\/4 {
        width: 25%;
    }

    .sm\:w-2\/3 {
        width: 66.666667%;
    }

    .sm\:w-full {
        width: 100%;
    }

    .sm\:grid-cols-1 {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }

    .sm\:grid-cols-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

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

    .sm\:grid-cols-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .sm\:grid-cols-5 {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }

    .sm\:grid-cols-6 {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }

    .sm\:flex-row {
        flex-direction: row;
    }

    .sm\:flex-row-reverse {
        flex-direction: row-reverse;
    }

    .sm\:flex-col {
        flex-direction: column;
    }

    .sm\:flex-col-reverse {
        flex-direction: column-reverse;
    }

    .sm\:items-center {
        align-items: center;
    }

    .sm\:justify-center {
        justify-content: center;
    }

    .sm\:justify-between {
        justify-content: space-between;
    }

    .sm\:gap-1 {
        gap: 0.25rem;
    }

    .sm\:gap-10 {
        gap: 2.5rem;
    }

    .sm\:gap-12 {
        gap: 3rem;
    }

    .sm\:gap-2 {
        gap: 0.5rem;
    }

    .sm\:gap-3 {
        gap: 0.75rem;
    }

    .sm\:gap-4 {
        gap: 1rem;
    }

    .sm\:gap-5 {
        gap: 1.25rem;
    }

    .sm\:gap-6 {
        gap: 1.5rem;
    }

    .sm\:gap-8 {
        gap: 2rem;
    }

    .sm\:space-x-8 > :not([hidden]) ~ :not([hidden]) {
        --tw-space-x-reverse: 0;
        margin-right: calc(2rem * var(--tw-space-x-reverse));
        margin-left: calc(2rem * calc(1 - var(--tw-space-x-reverse)));
    }

    .sm\:space-y-2 > :not([hidden]) ~ :not([hidden]) {
        --tw-space-y-reverse: 0;
        margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
        margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
    }

    .sm\:px-4 {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .sm\:px-6 {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }

    .sm\:px-8 {
        padding-left: 2rem;
        padding-right: 2rem;
    }

    .sm\:py-12 {
        padding-top: 3rem;
        padding-bottom: 3rem;
    }

    .sm\:py-16 {
        padding-top: 4rem;
        padding-bottom: 4rem;
    }

    .sm\:py-4 {
        padding-top: 1rem;
        padding-bottom: 1rem;
    }

    .sm\:py-6 {
        padding-top: 1.5rem;
        padding-bottom: 1.5rem;
    }

    .sm\:py-8 {
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .sm\:py-\[120px\] {
        padding-top: 120px;
        padding-bottom: 120px;
    }

    .sm\:py-\[60px\] {
        padding-top: 60px;
        padding-bottom: 60px;
    }

    .sm\:text-left {
        text-align: left;
    }

    .sm\:text-center {
        text-align: center;
    }

    .sm\:text-right {
        text-align: right;
    }

    .sm\:text-\[15px\] {
        font-size: 15px;
    }
}

@media (min-width: 768px) {

    .md\:order-1 {
        order: 1;
    }

    .md\:order-2 {
        order: 2;
    }

    .md\:my-\[70px\] {
        margin-top: 70px;
        margin-bottom: 70px;
    }

    .md\:mb-\[130px\] {
        margin-bottom: 130px;
    }

    .md\:mt-8 {
        margin-top: 2rem;
    }

    .md\:mt-\[75px\] {
        margin-top: 75px;
    }

    .md\:block {
        display: block;
    }

    .md\:inline-block {
        display: inline-block;
    }

    .md\:inline {
        display: inline;
    }

    .md\:flex {
        display: flex;
    }

    .md\:inline-flex {
        display: inline-flex;
    }

    .md\:grid {
        display: grid;
    }

    .md\:hidden {
        display: none;
    }

    .md\:w-1\/2 {
        width: 50%;
    }

    .md\:w-1\/3 {
        width: 33.333333%;
    }

    .md\:w-1\/4 {
        width: 25%;
    }

    .md\:w-2\/3 {
        width: 66.666667%;
    }

    .md\:w-full {
        width: 100%;
    }

    .md\:grid-cols-1 {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }

    .md\:grid-cols-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

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

    .md\:grid-cols-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .md\:grid-cols-5 {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }

    .md\:grid-cols-6 {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }

    .md\:flex-row {
        flex-direction: row;
    }

    .md\:flex-row-reverse {
        flex-direction: row-reverse;
    }

    .md\:flex-col {
        flex-direction: column;
    }

    .md\:flex-col-reverse {
        flex-direction: column-reverse;
    }

    .md\:items-center {
        align-items: center;
    }

    .md\:justify-center {
        justify-content: center;
    }

    .md\:justify-between {
        justify-content: space-between;
    }

    .md\:\!gap-\[45px\] {
        gap: 45px !important;
    }

    .md\:gap-1 {
        gap: 0.25rem;
    }

    .md\:gap-10 {
        gap: 2.5rem;
    }

    .md\:gap-12 {
        gap: 3rem;
    }

    .md\:gap-2 {
        gap: 0.5rem;
    }

    .md\:gap-3 {
        gap: 0.75rem;
    }

    .md\:gap-4 {
        gap: 1rem;
    }

    .md\:gap-5 {
        gap: 1.25rem;
    }

    .md\:gap-6 {
        gap: 1.5rem;
    }

    .md\:gap-8 {
        gap: 2rem;
    }

    .md\:gap-\[45px\] {
        gap: 45px;
    }

    .md\:space-x-8 > :not([hidden]) ~ :not([hidden]) {
        --tw-space-x-reverse: 0;
        margin-right: calc(2rem * var(--tw-space-x-reverse));
        margin-left: calc(2rem * calc(1 - var(--tw-space-x-reverse)));
    }

    .md\:space-y-2 > :not([hidden]) ~ :not([hidden]) {
        --tw-space-y-reverse: 0;
        margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
        margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
    }

    .md\:px-4 {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .md\:px-6 {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }

    .md\:px-8 {
        padding-left: 2rem;
        padding-right: 2rem;
    }

    .md\:py-12 {
        padding-top: 3rem;
        padding-bottom: 3rem;
    }

    .md\:py-16 {
        padding-top: 4rem;
        padding-bottom: 4rem;
    }

    .md\:py-4 {
        padding-top: 1rem;
        padding-bottom: 1rem;
    }

    .md\:py-6 {
        padding-top: 1.5rem;
        padding-bottom: 1.5rem;
    }

    .md\:py-8 {
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .md\:py-\[100px\] {
        padding-top: 100px;
        padding-bottom: 100px;
    }

    .md\:py-\[120px\] {
        padding-top: 120px;
        padding-bottom: 120px;
    }

    .md\:py-\[60px\] {
        padding-top: 60px;
        padding-bottom: 60px;
    }

    .md\:\!pb-\[127px\] {
        padding-bottom: 127px !important;
    }

    .md\:\!pb-\[70px\] {
        padding-bottom: 70px !important;
    }

    .md\:pb-\[100px\] {
        padding-bottom: 100px;
    }

    .md\:pb-\[40px\] {
        padding-bottom: 40px;
    }

    .md\:pb-\[46px\] {
        padding-bottom: 46px;
    }

    .md\:pb-\[50px\] {
        padding-bottom: 50px;
    }

    .md\:pt-0 {
        padding-top: 0px;
    }

    .md\:pt-\[100px\] {
        padding-top: 100px;
    }

    .md\:pt-\[120px\] {
        padding-top: 120px;
    }

    .md\:text-left {
        text-align: left;
    }

    .md\:text-center {
        text-align: center;
    }

    .md\:text-right {
        text-align: right;
    }

    .md\:\!text-\[36px\] {
        font-size: 36px !important;
    }

    .md\:text-5xl {
        font-size: 3rem;
        line-height: 1;
    }

    .md\:text-6xl {
        font-size: 3.75rem;
        line-height: 1;
    }

    .md\:text-\[100px\] {
        font-size: 100px;
    }

    .md\:text-\[18px\] {
        font-size: 18px;
    }

    .md\:text-\[22px\] {
        font-size: 22px;
    }

    .md\:text-\[24px\] {
        font-size: 24px;
    }

    .md\:text-\[32px\] {
        font-size: 32px;
    }

    .md\:text-\[36px\] {
        font-size: 36px;
    }

    .md\:text-\[40px\] {
        font-size: 40px;
    }

    .md\:text-\[60px\] {
        font-size: 60px;
    }

    .md\:text-xl {
        font-size: 1.25rem;
        line-height: 1.75rem;
    }

    .md\:\!leading-\[50px\] {
        line-height: 50px !important;
    }

    .md\:leading-\[110px\] {
        line-height: 110px;
    }

    .md\:leading-\[22px\] {
        line-height: 22px;
    }

    .md\:leading-\[28px\] {
        line-height: 28px;
    }

    .md\:leading-\[30px\] {
        line-height: 30px;
    }

    .md\:leading-\[36px\] {
        line-height: 36px;
    }

    .md\:leading-\[40px\] {
        line-height: 40px;
    }

    .md\:leading-\[50px\] {
        line-height: 50px;
    }

    .md\:leading-\[60px\] {
        line-height: 60px;
    }
}

@media (min-width: 1024px) {

    .lg\:mb-8 {
        margin-bottom: 2rem;
    }

    .lg\:mb-\[50px\] {
        margin-bottom: 50px;
    }

    .lg\:block {
        display: block;
    }

    .lg\:inline-block {
        display: inline-block;
    }

    .lg\:inline {
        display: inline;
    }

    .lg\:flex {
        display: flex;
    }

    .lg\:inline-flex {
        display: inline-flex;
    }

    .lg\:grid {
        display: grid;
    }

    .lg\:hidden {
        display: none;
    }

    .lg\:w-1\/2 {
        width: 50%;
    }

    .lg\:w-1\/3 {
        width: 33.333333%;
    }

    .lg\:w-1\/4 {
        width: 25%;
    }

    .lg\:w-2\/3 {
        width: 66.666667%;
    }

    .lg\:w-full {
        width: 100%;
    }

    .lg\:grid-cols-1 {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }

    .lg\:grid-cols-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

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

    .lg\:grid-cols-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .lg\:grid-cols-5 {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }

    .lg\:grid-cols-6 {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }

    .lg\:flex-row {
        flex-direction: row;
    }

    .lg\:flex-row-reverse {
        flex-direction: row-reverse;
    }

    .lg\:flex-col {
        flex-direction: column;
    }

    .lg\:flex-col-reverse {
        flex-direction: column-reverse;
    }

    .lg\:flex-nowrap {
        flex-wrap: nowrap;
    }

    .lg\:items-center {
        align-items: center;
    }

    .lg\:justify-center {
        justify-content: center;
    }

    .lg\:justify-between {
        justify-content: space-between;
    }

    .lg\:gap-1 {
        gap: 0.25rem;
    }

    .lg\:gap-10 {
        gap: 2.5rem;
    }

    .lg\:gap-12 {
        gap: 3rem;
    }

    .lg\:gap-2 {
        gap: 0.5rem;
    }

    .lg\:gap-3 {
        gap: 0.75rem;
    }

    .lg\:gap-4 {
        gap: 1rem;
    }

    .lg\:gap-5 {
        gap: 1.25rem;
    }

    .lg\:gap-6 {
        gap: 1.5rem;
    }

    .lg\:gap-8 {
        gap: 2rem;
    }

    .lg\:space-x-8 > :not([hidden]) ~ :not([hidden]) {
        --tw-space-x-reverse: 0;
        margin-right: calc(2rem * var(--tw-space-x-reverse));
        margin-left: calc(2rem * calc(1 - var(--tw-space-x-reverse)));
    }

    .lg\:space-y-2 > :not([hidden]) ~ :not([hidden]) {
        --tw-space-y-reverse: 0;
        margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
        margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
    }

    .lg\:border-t {
        border-top-width: 1px;
    }

    .lg\:border-\[\#222222\] {
        --tw-border-opacity: 1;
        border-color: rgb(34 34 34 / var(--tw-border-opacity, 1));
    }

    .lg\:px-4 {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .lg\:px-6 {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }

    .lg\:px-8 {
        padding-left: 2rem;
        padding-right: 2rem;
    }

    .lg\:py-12 {
        padding-top: 3rem;
        padding-bottom: 3rem;
    }

    .lg\:py-16 {
        padding-top: 4rem;
        padding-bottom: 4rem;
    }

    .lg\:py-4 {
        padding-top: 1rem;
        padding-bottom: 1rem;
    }

    .lg\:py-6 {
        padding-top: 1.5rem;
        padding-bottom: 1.5rem;
    }

    .lg\:py-8 {
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .lg\:py-\[120px\] {
        padding-top: 120px;
        padding-bottom: 120px;
    }

    .lg\:py-\[60px\] {
        padding-top: 60px;
        padding-bottom: 60px;
    }

    .lg\:pb-12 {
        padding-bottom: 3rem;
    }

    .lg\:pb-\[100px\] {
        padding-bottom: 100px;
    }

    .lg\:pb-\[50px\] {
        padding-bottom: 50px;
    }

    .lg\:pb-\[60px\] {
        padding-bottom: 60px;
    }

    .lg\:pt-\[45px\] {
        padding-top: 45px;
    }

    .lg\:pt-\[50px\] {
        padding-top: 50px;
    }

    .lg\:pt-\[90px\] {
        padding-top: 90px;
    }

    .lg\:text-left {
        text-align: left;
    }

    .lg\:text-center {
        text-align: center;
    }

    .lg\:text-right {
        text-align: right;
    }

    .lg\:text-2xl {
        font-size: 1.5rem;
        line-height: 2rem;
    }

    .lg\:text-7xl {
        font-size: 4.5rem;
        line-height: 1;
    }
}

@media (min-width: 1280px) {

    .xl\:block {
        display: block;
    }

    .xl\:inline-block {
        display: inline-block;
    }

    .xl\:inline {
        display: inline;
    }

    .xl\:flex {
        display: flex;
    }

    .xl\:inline-flex {
        display: inline-flex;
    }

    .xl\:grid {
        display: grid;
    }

    .xl\:hidden {
        display: none;
    }

    .xl\:w-1\/2 {
        width: 50%;
    }

    .xl\:w-1\/3 {
        width: 33.333333%;
    }

    .xl\:w-1\/4 {
        width: 25%;
    }

    .xl\:w-2\/3 {
        width: 66.666667%;
    }

    .xl\:w-full {
        width: 100%;
    }

    .xl\:grid-cols-1 {
        grid-template-columns: repeat(1, minmax(0, 1fr));
    }

    .xl\:grid-cols-2 {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

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

    .xl\:grid-cols-4 {
        grid-template-columns: repeat(4, minmax(0, 1fr));
    }

    .xl\:grid-cols-5 {
        grid-template-columns: repeat(5, minmax(0, 1fr));
    }

    .xl\:grid-cols-6 {
        grid-template-columns: repeat(6, minmax(0, 1fr));
    }

    .xl\:flex-row {
        flex-direction: row;
    }

    .xl\:flex-row-reverse {
        flex-direction: row-reverse;
    }

    .xl\:flex-col {
        flex-direction: column;
    }

    .xl\:flex-col-reverse {
        flex-direction: column-reverse;
    }

    .xl\:items-center {
        align-items: center;
    }

    .xl\:justify-center {
        justify-content: center;
    }

    .xl\:justify-between {
        justify-content: space-between;
    }

    .xl\:gap-1 {
        gap: 0.25rem;
    }

    .xl\:gap-10 {
        gap: 2.5rem;
    }

    .xl\:gap-12 {
        gap: 3rem;
    }

    .xl\:gap-2 {
        gap: 0.5rem;
    }

    .xl\:gap-3 {
        gap: 0.75rem;
    }

    .xl\:gap-4 {
        gap: 1rem;
    }

    .xl\:gap-5 {
        gap: 1.25rem;
    }

    .xl\:gap-6 {
        gap: 1.5rem;
    }

    .xl\:gap-8 {
        gap: 2rem;
    }

    .xl\:gap-\[90px\] {
        gap: 90px;
    }

    .xl\:space-x-8 > :not([hidden]) ~ :not([hidden]) {
        --tw-space-x-reverse: 0;
        margin-right: calc(2rem * var(--tw-space-x-reverse));
        margin-left: calc(2rem * calc(1 - var(--tw-space-x-reverse)));
    }

    .xl\:space-y-2 > :not([hidden]) ~ :not([hidden]) {
        --tw-space-y-reverse: 0;
        margin-top: calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));
        margin-bottom: calc(0.5rem * var(--tw-space-y-reverse));
    }

    .xl\:px-4 {
        padding-left: 1rem;
        padding-right: 1rem;
    }

    .xl\:px-6 {
        padding-left: 1.5rem;
        padding-right: 1.5rem;
    }

    .xl\:px-8 {
        padding-left: 2rem;
        padding-right: 2rem;
    }

    .xl\:py-12 {
        padding-top: 3rem;
        padding-bottom: 3rem;
    }

    .xl\:py-16 {
        padding-top: 4rem;
        padding-bottom: 4rem;
    }

    .xl\:py-4 {
        padding-top: 1rem;
        padding-bottom: 1rem;
    }

    .xl\:py-6 {
        padding-top: 1.5rem;
        padding-bottom: 1.5rem;
    }

    .xl\:py-8 {
        padding-top: 2rem;
        padding-bottom: 2rem;
    }

    .xl\:py-\[120px\] {
        padding-top: 120px;
        padding-bottom: 120px;
    }

    .xl\:py-\[60px\] {
        padding-top: 60px;
        padding-bottom: 60px;
    }

    .xl\:text-left {
        text-align: left;
    }

    .xl\:text-center {
        text-align: center;
    }

    .xl\:text-right {
        text-align: right;
    }
}