body .wp-block-gallery.has-nested-images {
  --row-h: 364px;
  --gap: 50px;

  display: flex;
  flex-wrap: wrap;
  gap: var(--gap);
  /* width: min(1489px, 80vw); */
  width: 1240px;
  margin-inline: auto;
}

/* Une fois gallery-justify.js exécuté, chaque ligne devient un conteneur flex
   dédié (.ccn-gallery-row) et le conteneur passe en colonne : il n'y a alors
   plus de flex-wrap global, donc plus aucun passage à la ligne imprévu selon
   la résolution d'écran ou le niveau de zoom. */
body .wp-block-gallery.has-nested-images.ccn-js-justified {
  flex-direction: column;
  flex-wrap: nowrap;
}

body .wp-block-gallery.has-nested-images .ccn-gallery-row {
  display: flex;
  gap: var(--gap);
  height: var(--row-h);
}

body .wp-block-gallery.has-nested-images figure.wp-block-image:not(#x) {
  --ratio: 1.5;
  width: auto;
  min-width: 0;
  margin: 0;
  border-radius: 16px;
  overflow: hidden;
}

/* Largeur de secours avant exécution du JS : regroupement approximatif via le
   flex-wrap natif du conteneur (remplacé dès que gallery-justify.js tourne). */
body .wp-block-gallery.has-nested-images:not(.ccn-js-justified) > figure.wp-block-image:not(#x) {
  flex-grow: var(--ratio);
  flex-shrink: 1;
  flex-basis: clamp(18%, calc(var(--row-h) * var(--ratio) * 0.4), 42%);
  height: var(--row-h);
}

/* Largeur exacte une fois les lignes constituées : flex-basis à 0 et flex-grow
   proportionnel au ratio garantissent que la ligne remplit pile 100% de sa
   largeur (calcul natif du navigateur, sans arrondi ni largeurs fixes en JS). */
body .wp-block-gallery.has-nested-images .ccn-gallery-row > figure.wp-block-image:not(#x) {
  flex: var(--ratio) 1 0;
  height: 100%;
}

body .wp-block-gallery.has-nested-images figure.wp-block-image:not(#x) a {
  display: block;
  height: 100%;
}

body .wp-block-gallery.has-nested-images figure.wp-block-image:not(#x) img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Mobile : pleine largeur du conteneur, sans marge, lignes plus basses */
@media (max-width: 1280px) {
  body .wp-block-gallery.has-nested-images {
    --row-h: 110px;
    --gap: 20px;
    width: 100%;
    margin-inline: 0;
  }
}