/* ═══════════════════════════════════════════
   COLVER BLOC LARGE — style2.css (frontend)
   ═══════════════════════════════════════════ */

.colver-bloc-large {
    display: flex;
    align-items: stretch;
    position: relative;
}

/* ── Bord écran : le bloc déclare le support d'alignement natif
   WordPress ("align":"full", classe .alignfull ajoutée par le rendu
   PHP). C'est WordPress qui gère le débordement bord-à-bord — y
   compris le padding global du thème (root padding) et le cas d'un
   groupe parent en layout "contraint" — plutôt qu'un calcul manuel
   basé sur 100vw, qui ne pouvait pas deviner ces cas-là. ── */

/* ── Zone image : absorbe tout l'espace restant (dont le débord
   bord-écran), quelle que soit la largeur d'écran. ── */
.colver-bloc-large__image {
    position: relative;
    overflow: hidden;
    flex: 1 1 auto;
    min-width: 0;
}

.clbl-img-main {
    display: block;
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.colver-bloc-large--img-left  .clbl-img-main { left: 0;  right: auto; }
.colver-bloc-large--img-right .clbl-img-main { right: 0; left: auto;  }

/* ── Colonne texte : centrée verticalement ──
   Même principe que colver-bloc/style.css : largeur calculée à partir
   de la piste "large" du thème (--wp--style--global--wide-size) et
   non d'un simple % du conteneur, pour rester sur la grille WordPress
   même quand ce bloc est dans un groupe pleine largeur (alignfull).
   --clbl-content-fraction est la version "nombre" (0.45) de
   --clbl-content-width (45%) : un % ne peut pas être multiplié par
   une longueur en CSS calc(), un nombre simple le peut.
   min()/max() : évite une marge négative (texte poussé hors écran)
   quand le conteneur devient plus étroit que wide-size, entre le
   palier ≤1350px et cette largeur. */
.colver-bloc-large__content {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    /* Pas de padding-left par défaut : quand l'image est à droite, le
       texte est collé au bord gauche de l'écran (alignfull) et un
       padding-left créerait un espace vide indésirable avant le
       texte. */
    padding: 64px 60px 64px 0;
    background: transparent;
    box-sizing: border-box;
    flex: 0 0 auto;
    width: min( 100%, calc( var( --clbl-content-fraction, 0.5 ) * var( --wp--style--global--wide-size, 1340px ) ) );
}

.colver-bloc-large--img-right .colver-bloc-large__content {
    margin-left: max( 0px, calc( ( 100% - var( --wp--style--global--wide-size, 1340px ) ) / 2 ) );
}

.colver-bloc-large--img-left .colver-bloc-large__content {
    margin-right: max( 0px, calc( ( 100% - var( --wp--style--global--wide-size, 1340px ) ) / 2 ) );
}

/* ── Responsive ──
   En dessous de la largeur "large" du thème, verrouiller la colonne
   texte sur la grille produirait une largeur fixe qui écraserait la
   colonne image en rétrécissant (le calc() ne redescend plus). On
   revient donc, comme pour colver-bloc, à un simple % du conteneur
   sur ce palier — pas de contrainte de grille, mais les proportions
   restent lisibles à toute largeur intermédiaire. ── */
@media ( max-width: 1350px ) {
    .colver-bloc-large__content {
        width: var( --clbl-content-width, 50% );
        flex: 0 0 auto;
        margin-left: 0;
        margin-right: 0;
        padding: 48px 40px 48px 0;
    }

    .colver-bloc-large__image {
        flex: 1 1 auto;
    }
}

@media ( max-width: 768px ) {
    .colver-bloc-large,
    .colver-bloc-large--img-left,
    .colver-bloc-large--img-right {
        display: flex;
        flex-direction: column;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    .colver-bloc-large__image {
        width: 100%;
        flex-basis: auto;
        min-height: 260px;
    }
    .clbl-img-main {
        width: 100% !important;
        height: 100% !important;
        left: 0 !important;
        right: auto !important;
    }
    .colver-bloc-large__content {
        width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding: 40px 24px;
    }
}