/* ============================================================
   HERO BANNER EBOX
   ============================================================ */

.ebox-home-hero {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

.ebox-home-hero__content {
    position: relative;

    display: grid;
    grid-template-columns: minmax(0, 1fr) 600px;
    align-items: center;

    width: 100%;
    min-height: 330px;

    overflow: hidden;
    box-sizing: border-box;

    border: 1px solid rgba(74, 42, 22, .10);
    border-radius: 14px;

    background:
        linear-gradient(
            90deg,
            rgba(250, 245, 237, .99) 0%,
            rgba(250, 245, 237, .96) 34%,
            rgba(250, 245, 237, .58) 52%,
            rgba(250, 245, 237, .08) 74%
        ),

var(--ebox-hero-bg) center right / cover no-repeat;

    box-shadow: 0 12px 30px rgba(74, 42, 22, .10);
}


/* ============================================================
   TEXTE
   ============================================================ */

.ebox-home-hero__text {
    position: relative;
    z-index: 3;

    min-width: 0;
    padding: 38px 55px;
}

.ebox-home-hero__text p {
    max-width: 620px;
    margin: 0;

    color: #2d2118;

    font-family: Georgia, "Times New Roman", serif;
    font-size: 29px;
    font-weight: 500;
    font-style: normal;
    line-height: 1.42;
    letter-spacing: -0.01em;
}


/* ============================================================
   PARTIE VISUELLE
   ============================================================ */

.ebox-home-hero__visual {
    position: relative;

    min-width: 0;
    min-height: 330px;
    height: 100%;
}

.ebox-home-hero__book {
    position: absolute;
    z-index: 4;

    left: 70px;
    bottom: 0;

    display: block;

    width: auto;
    max-width: 220px;
    max-height: 270px;

    object-fit: contain;

    filter: drop-shadow(0 16px 16px rgba(0, 0, 0, .30));
}


/* ============================================================
   ALIGNEMENT WORDPRESS
   ============================================================ */





.home .ebox-home-hero__content {
    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;

    box-sizing: border-box !important;
}


/* ============================================================
   RESPONSIVE — TABLETTE
   ============================================================ */

@media (max-width: 1050px) {

    .ebox-home-hero__content {
        grid-template-columns: minmax(0, 1fr) 430px;
        min-height: 300px;
    }

    .ebox-home-hero__text {
        padding: 36px;
    }

    .ebox-home-hero__text p {
        font-size: 24px;
    }

    .ebox-home-hero__visual {
        min-height: 300px;
    }

    .ebox-home-hero__book {
        left: 50px;

        max-width: 190px;
        max-height: 235px;
    }
}


/* ============================================================
   RESPONSIVE — MOBILE
   ============================================================ */

@media (max-width: 760px) {

    .home .entry-content > .wp-block-shortcode:has(.ebox-home-hero) {
        margin-top: 0 !important;
    }

    .ebox-home-hero__content {
        grid-template-columns: 1fr;
        min-height: 0;
    }

    .ebox-home-hero__text {
        padding: 30px 24px;
        text-align: center;
    }

    .ebox-home-hero__text p {
    max-width: none;

    font-family: Georgia, "Times New Roman", serif;
    font-size: 21px;
    font-weight: 500;
    font-style: italic;
    line-height: 1.45;
    letter-spacing: -0.01em;
}


    .ebox-home-hero__visual {
        min-height: 235px;
    }

    .ebox-home-hero__book {
        left: 50%;
        bottom: 0;

        max-width: 175px;
        max-height: 215px;

        transform: translateX(-50%);
    }
}


@media (max-width: 480px) {

    .ebox-home-hero__content {
        border-radius: 10px;
    }

    .ebox-home-hero__text {
        padding: 25px 18px;
    }

    .ebox-home-hero__text p {
        font-size: 20px;
    }

    .ebox-home-hero__visual {
        min-height: 210px;
    }

    .ebox-home-hero__book {
        max-width: 155px;
        max-height: 190px;
    }
}

/* ============================================================
   ALIGNEMENT DU HERO DANS WORDPRESS
   ============================================================ */

body.home .entry-content > .wp-block-shortcode:has(.ebox-home-hero) {
    width: 100% !important;
    max-width: none !important;

    margin: 0 0 20px !important;
    margin-block-start: 0 !important;

    padding: 0 !important;
}

body.home .ebox-home-hero {
    width: 100% !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;
}