.elementor-2123 .elementor-element.elementor-element-66549e13{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-2123 .elementor-element.elementor-element-1945f7b4{padding:80px 0px 0px 0px;}.elementor-2123 .elementor-element.elementor-element-1945f7b4 .elementor-heading-title{font-family:var( --e-global-typography-secondary-font-family ), Chivo;font-size:var( --e-global-typography-secondary-font-size );}.elementor-2123 .elementor-element.elementor-element-70434550{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2123 .elementor-element.elementor-element-1e92e1eb{--grid-columns:2;--grid-row-gap:24px;--grid-column-gap:24px;}.elementor-2123 .elementor-element.elementor-element-809353c{margin:40px 0px calc(var(--kit-widget-spacing, 0px) + 060px) 0px;padding:10px 0px 10px 0px;}.elementor-2123 .elementor-element.elementor-element-809353c span.post-navigation__prev--label{color:var( --e-global-color-text );}.elementor-2123 .elementor-element.elementor-element-809353c span.post-navigation__next--label{color:var( --e-global-color-text );}.elementor-2123 .elementor-element.elementor-element-809353c span.post-navigation__prev--label:hover{color:#F5F5F400;}.elementor-2123 .elementor-element.elementor-element-809353c span.post-navigation__next--label:hover{color:#F5F5F400;}.elementor-2123 .elementor-element.elementor-element-809353c span.post-navigation__prev--label, .elementor-2123 .elementor-element.elementor-element-809353c span.post-navigation__next--label{font-family:var( --e-global-typography-9738e6f-font-family ), Chivo;font-size:var( --e-global-typography-9738e6f-font-size );}.elementor-2123 .elementor-element.elementor-element-809353c span.post-navigation__prev--title, .elementor-2123 .elementor-element.elementor-element-809353c span.post-navigation__next--title{color:#F5F5F4;font-family:var( --e-global-typography-9738e6f-font-family ), Chivo;font-size:var( --e-global-typography-9738e6f-font-size );}.elementor-2123 .elementor-element.elementor-element-809353c span.post-navigation__prev--title:hover, .elementor-2123 .elementor-element.elementor-element-809353c span.post-navigation__next--title:hover{color:#F5F5F400;}.elementor-2123 .elementor-element.elementor-element-809353c .post-navigation__arrow-wrapper{color:var( --e-global-color-accent );fill:var( --e-global-color-accent );font-size:30px;}.elementor-2123 .elementor-element.elementor-element-809353c .elementor-post-navigation__link a {gap:12px;}@media(max-width:1024px){.elementor-2123 .elementor-element.elementor-element-1945f7b4{padding:050px 0px 0px 0px;}.elementor-2123 .elementor-element.elementor-element-1945f7b4 .elementor-heading-title{font-size:var( --e-global-typography-secondary-font-size );}.elementor-2123 .elementor-element.elementor-element-1e92e1eb{--grid-columns:2;--grid-row-gap:14px;--grid-column-gap:14px;}.elementor-2123 .elementor-element.elementor-element-809353c{margin:40px 0px calc(var(--kit-widget-spacing, 0px) + 80px) 0px;}.elementor-2123 .elementor-element.elementor-element-809353c span.post-navigation__prev--label, .elementor-2123 .elementor-element.elementor-element-809353c span.post-navigation__next--label{font-size:var( --e-global-typography-9738e6f-font-size );}.elementor-2123 .elementor-element.elementor-element-809353c span.post-navigation__prev--title, .elementor-2123 .elementor-element.elementor-element-809353c span.post-navigation__next--title{font-size:var( --e-global-typography-9738e6f-font-size );}}@media(min-width:768px){.elementor-2123 .elementor-element.elementor-element-66549e13{--content-width:85vw;}}@media(max-width:767px){.elementor-2123 .elementor-element.elementor-element-66549e13{--padding-top:050px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2123 .elementor-element.elementor-element-1945f7b4{padding:30px 0px 0px 0px;}.elementor-2123 .elementor-element.elementor-element-1945f7b4 .elementor-heading-title{font-size:var( --e-global-typography-secondary-font-size );}.elementor-2123 .elementor-element.elementor-element-1e92e1eb{--grid-columns:1;--grid-column-gap:0px;}.elementor-2123 .elementor-element.elementor-element-809353c{width:100%;max-width:100%;margin:20px 0px calc(var(--kit-widget-spacing, 0px) + 50px) 0px;}.elementor-2123 .elementor-element.elementor-element-809353c span.post-navigation__prev--label, .elementor-2123 .elementor-element.elementor-element-809353c span.post-navigation__next--label{font-size:var( --e-global-typography-9738e6f-font-size );}.elementor-2123 .elementor-element.elementor-element-809353c span.post-navigation__prev--title, .elementor-2123 .elementor-element.elementor-element-809353c span.post-navigation__next--title{font-size:var( --e-global-typography-9738e6f-font-size );}.elementor-2123 .elementor-element.elementor-element-809353c .post-navigation__arrow-wrapper{font-size:300px;}}/* Start custom CSS for loop-grid, class: .elementor-element-1e92e1eb *//* =========================
   GRID LOOP (7 colonnes)
========================= */
.elementor-2123 .elementor-element.elementor-element-1e92e1eb .elementor-loop-container,
.elementor-2123 .elementor-element.elementor-element-1e92e1eb .e-loop-container,
.elementor-2123 .elementor-element.elementor-element-1e92e1eb .elementor-posts-container {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.elementor-2123 .elementor-element.elementor-element-1e92e1eb .elementor-loop-container .elementor-element { 
    width: 100%; 
    height: auto; 
    aspect-ratio: 16 / 9; 
    overflow: hidden; }
    
/* =========================
   TEMPLATE RÉPÉTABLE (cycle 4)
   - (4n+1) et (4n+2) = rangée du haut
   - (4n+3) et (4n+4) = rangée du bas
   - Largeurs: 3,2,2,3 (comme ton exemple)
========================= */

/* 1er du bloc (haut) -> span 3 */
.elementor-2123 .elementor-element.elementor-element-1e92e1eb .e-loop-item:nth-child(2) {
  grid-column: span 3;
  grid-row: span 1;      /* 1 ligne */
  align-self: start;
}

/* 2e du bloc (haut) -> span 2 */
.elementor-2123 .elementor-element.elementor-element-1e92e1eb .e-loop-item:nth-child(3) {
  grid-column: span 2;
  grid-row: span 1;
  align-self: start;
}

/* 3e du bloc (bas) -> span 2 */
.elementor-2123 .elementor-element.elementor-element-1e92e1eb .e-loop-item:nth-child(4n + 4) {
  grid-column: span 2;
  grid-row: span 1;
  align-self: end;
}

/* 4e du bloc (bas) -> span 3 */
.elementor-2123 .elementor-element.elementor-element-1e92e1eb .e-loop-item:nth-child(4n + 5) {
  grid-column: span 3;
  grid-row: span 1;
  align-self: end;
}

/* 5e du bloc (bas) -> span 2 */
.elementor-2123 .elementor-element.elementor-element-1e92e1eb .e-loop-item:nth-child(4n + 6) {
  grid-column: span 3;
  grid-row: span 1;
  align-self: end;
}

/* 6e du bloc (bas) -> span 3 */
.elementor-2123 .elementor-element.elementor-element-1e92e1eb .e-loop-item:nth-child(4n + 7) {
  grid-column: span 2;
  grid-row: span 1;
  align-self: end;
}

/* =========================
   TABLETTE (<=1024px) : 2 colonnes
========================= */
@media (max-width: 1024px) {
  .elementor-2123 .elementor-element.elementor-element-1e92e1eb .elementor-loop-container,
  .elementor-2123 .elementor-element.elementor-element-1e92e1eb .e-loop-container,
  .elementor-2123 .elementor-element.elementor-element-1e92e1eb .elementor-posts-container {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  /* reset spans desktop */
  .elementor-2123 .elementor-element.elementor-element-1e92e1eb .e-loop-item {
    grid-column: auto !important;
    align-self: stretch;
  }

  /* pattern tablette: alternance pleine largeur / demi largeur */
  .elementor-2123 .elementor-element.elementor-element-1e92e1eb .e-loop-item:nth-child(3n + 1) {
    grid-column: span 2 !important; /* full width */
  }
  .elementor-2123 .elementor-element.elementor-element-1e92e1eb .e-loop-item:nth-child(3n + 2),
  .elementor-2123 .elementor-element.elementor-element-1e92e1eb .e-loop-item:nth-child(3n + 3) {
    grid-column: span 1 !important; /* 2 colonnes */
  }
}

/* =========================
   TABLETTE (<=1024px) : 2 colonnes
========================= */
@media (max-width: 767px) {
  .elementor-2123 .elementor-element.elementor-element-1e92e1eb .elementor-loop-container,
  .elementor-2123 .elementor-element.elementor-element-1e92e1eb .e-loop-container,
  .elementor-2123 .elementor-element.elementor-element-1e92e1eb .elementor-posts-container {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  /* reset spans desktop */
  .elementor-2123 .elementor-element.elementor-element-1e92e1eb .e-loop-item {
    grid-column: auto !important;
    align-self: stretch;
  }

  /* pattern tablette: alternance pleine largeur / demi largeur */
  .elementor-2123 .elementor-element.elementor-element-1e92e1eb .e-loop-item:nth-child(3n + 1) {
    grid-column: span 2 !important; /* full width */
  }
  .elementor-2123 .elementor-element.elementor-element-1e92e1eb .e-loop-item:nth-child(3n + 2),
  .elementor-2123 .elementor-element.elementor-element-1e92e1eb .e-loop-item:nth-child(3n + 3) {
    grid-column: span 2 !important; /* 2 colonnes */
  }
}/* End custom CSS */
/* Start custom CSS for post-navigation, class: .elementor-element-809353c *//* =========================================
   VARIABLES (ton dégradé)
========================================= */
.elementor-2123 .elementor-element.elementor-element-809353c {
  --grad-start: #DA27B3; /* magenta */
  --grad-end: #FE5E54;   /* corail */
}

/* =========================================
   BASE LINK ALIGNMENT (fix centrage)
========================================= */

/* Précédent à gauche */
.elementor-2123 .elementor-element.elementor-element-809353c .elementor-post-navigation__link__prev {
  justify-content: flex-start;
}

/* Suivant à droite */
.elementor-2123 .elementor-element.elementor-element-809353c .elementor-post-navigation__link__next {
  justify-content: flex-end;
}

/* =========================================
   FLEX SAFETY (évite que flex casse la width)
========================================= */
.elementor-2123 .elementor-element.elementor-element-809353c .post-navigation__arrow-next,
.elementor-2123 .elementor-element.elementor-element-809353c .post-navigation__arrow-prev {
  flex: 0 0 auto;
  max-width: none;
  min-width: 40px;
}

/* =========================================
   ARROW NEXT (pointe visible à droite)
========================================= */

/* Wrapper NEXT */
.elementor-2123 .elementor-element.elementor-element-809353c .post-navigation__arrow-next {
  width: 40px;
  overflow: hidden;
  transition: width 0.3s ease;
  display: inline-block;
  vertical-align: middle;
  will-change: width;
}

/* SVG NEXT */
.elementor-2123 .elementor-element.elementor-element-809353c .post-navigation__arrow-next svg {
  width: 120px;
  max-width: none;
  height: auto;
  display: block;
  transform: translateX(-80px); /* 120 - 40 */
  transition: transform 0.3s ease;
  will-change: transform;
}

/* Hover NEXT Desktop & Tablet
   -> IMPORTANT: on couvre plusieurs wrappers qui peuvent recevoir le hover
*/
@media (min-width: 768px) {
  .elementor-2123 .elementor-element.elementor-element-809353c :is(.elementor-post-navigation__next, .elementor-post-navigation__link__next):hover .post-navigation__arrow-next {
    width: 90px !important;
  }

  .elementor-2123 .elementor-element.elementor-element-809353c :is(.elementor-post-navigation__next, .elementor-post-navigation__link__next):hover .post-navigation__arrow-next svg {
    transform: translateX(-30px) !important; /* 120 - 90 */
  }
}

/* Hover NEXT Mobile */
@media (max-width: 767px) {
  .elementor-2123 .elementor-element.elementor-element-809353c :is(.elementor-post-navigation__next, .elementor-post-navigation__link__next):hover .post-navigation__arrow-next {
    width: 75px !important;
  }

  /* FIX: tu avais ".elementor-2123 .elementor-element.elementor-element-809353c:hover ..." ce qui ne match pas forcément le bon hover */
  .elementor-2123 .elementor-element.elementor-element-809353c :is(.elementor-post-navigation__next, .elementor-post-navigation__link__next):hover .post-navigation__arrow-next svg {
    transform: translateX(-45px) !important; /* 120 - 75 */
  }
}

/* =========================================
   ARROW PREVIOUS (pointe visible à gauche)
========================================= */

/* Wrapper PREVIOUS */
.elementor-2123 .elementor-element.elementor-element-809353c .post-navigation__arrow-prev {
  width: 40px;
  overflow: hidden;
  transition: width 0.3s ease;
  display: inline-block;
  vertical-align: middle;
  will-change: width;
}

/* SVG PREVIOUS */
.elementor-2123 .elementor-element.elementor-element-809353c .post-navigation__arrow-prev svg {
  width: 120px;
  max-width: none;
  height: auto;
  display: block;
  transform: translateX(0);
  transition: transform 0.3s ease;
  will-change: transform;
}

/* Hover PREVIOUS Desktop & Tablet */
@media (min-width: 768px) {
  .elementor-2123 .elementor-element.elementor-element-809353c :is(.elementor-post-navigation__prev, .elementor-post-navigation__link__prev):hover .post-navigation__arrow-prev {
    width: 90px !important;
  }
}

/* Hover PREVIOUS Mobile */
@media (max-width: 767px) {
  .elementor-2123 .elementor-element.elementor-element-809353c :is(.elementor-post-navigation__prev, .elementor-post-navigation__link__prev):hover .post-navigation__arrow-prev {
    width: 75px !important;
  }
}

/* =========================================
   GRADIENT ON ARROWS (hover)
========================================= */

/* Etat normal : flèches grises */
.elementor-2123 .elementor-element.elementor-element-809353c .post-navigation__arrow-next svg :is(path, line, polyline, polygon),
.elementor-2123 .elementor-element.elementor-element-809353c .post-navigation__arrow-prev svg :is(path, line, polyline, polygon) {
  fill: #71717A;
  stroke: #71717A; /* au cas où ta flèche est en stroke */
  transition: fill .3s ease, stroke .3s ease;
}

/* FIX: ton code appliquait le dégradé tout le temps (mêmes sélecteurs, pas de :hover)
   -> on le met UNIQUEMENT au hover du lien
*/
.elementor-2123 .elementor-element.elementor-element-809353c .elementor-post-navigation__link:hover .post-navigation__arrow-next svg :is(path, line, polyline, polygon),
.elementor-2123 .elementor-element.elementor-element-809353c .elementor-post-navigation__link:hover .post-navigation__arrow-prev svg :is(path, line, polyline, polygon) {
  fill: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><linearGradient id='g' x1='0' y1='0' x2='1' y2='0'><stop stop-color='%23DA27B3' offset='0'/><stop stop-color='%23FE5E54' offset='1'/></linearGradient></svg>#g");
  stroke: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><linearGradient id='g' x1='0' y1='0' x2='1' y2='0'><stop stop-color='%23DA27B3' offset='0'/><stop stop-color='%23FE5E54' offset='1'/></linearGradient></svg>#g");
}

/* =========================================
   TEXT LOGIC (label <-> title)
========================================= */

.elementor-2123 .elementor-element.elementor-element-809353c .post-navigation__next--label,
.elementor-2123 .elementor-element.elementor-element-809353c .post-navigation__prev--label {
  text-transform: none;
}

.elementor-2123 .elementor-element.elementor-element-809353c .post-navigation__next--title,
.elementor-2123 .elementor-element.elementor-element-809353c .post-navigation__prev--title {
  display: none;
}

/* Hover : on montre le titre, on cache le label */
.elementor-2123 .elementor-element.elementor-element-809353c .elementor-post-navigation__link:hover .post-navigation__next--title,
.elementor-2123 .elementor-element.elementor-element-809353c .elementor-post-navigation__link:hover .post-navigation__prev--title {
  display: inline;
}

.elementor-2123 .elementor-element.elementor-element-809353c .elementor-post-navigation__link:hover .post-navigation__next--label,
.elementor-2123 .elementor-element.elementor-element-809353c .elementor-post-navigation__link:hover .post-navigation__prev--label {
  display: none;
}

/* =========================================
   GRADIENT ON TITLE (hover)
========================================= */

/* Etat normal : titre en couleur classique (si jamais il s'affiche) */
.elementor-2123 .elementor-element.elementor-element-809353c .post-navigation__next--title,
.elementor-2123 .elementor-element.elementor-element-809353c .post-navigation__prev--title {
  color: inherit;
}

/* Hover : titre en dégradé (CSS background-clip) */
.elementor-2123 .elementor-element.elementor-element-809353c .elementor-post-navigation__link:hover .post-navigation__next--title,
.elementor-2123 .elementor-element.elementor-element-809353c .elementor-post-navigation__link:hover .post-navigation__prev--title {
  background: radial-gradient(159.38% 141.42% at 100% 0%, #FE5E54 0%, #DA27B3 130%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}/* End custom CSS */
/* Start custom CSS for container, class: .elementor-element-66549e13 */.elementor-2123 .elementor-element.elementor-element-66549e13 {
    max-width: 1200px;
}/* End custom CSS */