/* Hero */
#heroMarque {
    height: 94dvh;
    overflow: scroll;
    background-image: url(../assets/autres/maisonlua-marque-shooting-parc-hero.webp);
    background-size: cover;
    background-repeat: no-repeat;
    color: var(--color-beige);
    background-blend-mode: normal;
    background-position: center;
    z-index: 0;
}
.intro {
    margin-top: 56dvh;
}
.intro > p:last-child {
    width: 94%;
}
.quote {
    margin-top: var(--pm-4xl);
    margin-bottom: var(--pm-4xl);
    text-align: center;
    padding-left: var(--pm-2xl);
    padding-right: var(--pm-2xl);
}
.quote > p:first-child {
    margin-bottom: var(--pm-lg);
}
#videoBike {
    mix-blend-mode: lighten;
    margin-bottom: var(--pm-4xl);
}
#videoTeamMobile { display: none; }


/* Histoire */
.section--histoire {
    margin-top: -72px;
    z-index: 1;
}
#histoire {
    background-color: var(--color-beige);
}
.team--titre {
    margin-bottom: var(--pm-xl);
}
.team--text p {
    max-width: 80%;
}
.team--img {
    display: flex;
    justify-content: end;
}
.team--quote {
    text-align: center;
    margin-top: var(--pm-lg);
    margin-bottom: var(--pm-lg);
}
/* Cards des créatrices */
.cards {
    display: flex;
    gap: var(--pm-md);
}
.team--card {
    flex: 1;
    max-height: 469px;
    overflow: hidden;
}
.postit--top {
    text-align: center;
    background: linear-gradient(180deg, rgba(254, 251, 246, 1) 12%, rgba(247, 238, 168, 1) 12%);
    padding-bottom: var(--pm-xl);
    margin: var(--pm-none);
    z-index: 0;
}
.postit--bottom {
    background-color: var(--color-marroon);
    margin: var(--pm-none);
    padding: var(--pm-xl);
    min-height: 360px;
    z-index: 2;
}
.prenom {
    margin-top: var(--pm-lg);
    margin-bottom: var(--pm-none);
}
.citation--titre {
    margin-top: var(--pm-none);
    margin-bottom: var(--pm-rg);
    color: var(--color-beige);
}
.citation--content {
    color: var(--color-beige);
}
/* Animation des cards */
.postit--bottom {
    transition: transform 0.5s ease;
}
.team--card:hover .postit--bottom {
    transform: translateY(-400px);
}


/* Valeurs */
#valeurs {
    background-color: var(--color-creme);
}
.valeurs--text > h2 {
    max-width: 70%;
}
.valeurs--text {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.responsabilite, .design {
    margin-left: var(--pm-3xl);
}
.valeurs--quote > p {
    margin-bottom: -12px;
    margin-top: var(--pm-xl);
}
.valeurs--quote > p > span {
    margin-left: var(--pm-xl);
}
/* Liste */
ul.valeurs--list {
    list-style: none;
    padding-left: var(--pm-none);
}
ul.valeurs--list > li {
    position: relative;
    padding-left: var(--pm-xl);
    margin-bottom: var(--pm-sm);
}
ul.valeurs--list > li:before {
    content: '';
    position: absolute;
    left: 0;
    width: 20px;
    height: 20px;
    background: url("../assets/icons/maisonlua-icon-arrowright-brown.svg");
}



/* Détails */
.methode--titre {
    text-align: center;
    margin-bottom: var(--pm-xl);
}
.methode--titre > h2.text--h5 {
    margin-bottom: var(--pm-none) !important;
}
.cards {
    display: flex;
    align-items: center;
}
.methode--card {
    padding: var(--pm-sm);
}
.card--content {
    background-color: var(--color-yellow);
    padding-left: var(--pm-xl);
    padding-right: var(--pm-xl);
    padding-top: var(--pm-xl);
    padding-bottom: var(--pm-lg);
}
.methode--card:first-child > .card--content,
.methode--card:last-child > .card--content {
    background-color: var(--color-creme);
}
.methode--cta {
    text-align: center;
    margin-top: var(--pm-lg);
}






/*** RESPONSIVE ***/

/* Tablettes */
@media (max-width: 1199px) {
    #videoTeamDesktop { display: none; }
    #videoTeamMobile { display: block; margin-top: var(--pm-xl); }
    img { width: 100%; height: 100%; }
    .team--card { max-height: fit-content; }
    .team--card:hover .postit--bottom {
        transform: translateY(0);
    }
    .intro {
        margin-top: 55dvh;
        max-width: 60%;
    }
    video {
        width: 100%;
        height: auto;
        margin-bottom: var(--pm-xl);
    }
    .quote {
        text-align: left;
        padding: var(--pm-none);
        margin-top: var(--pm-2xl);
        margin-bottom: var(--pm-2xl);
    }
    .team--quote > h3 {
        margin-top: var(--pm-lg);
    }
    .valeurs--text {
        gap: var(--pm-xl);
    }
}

/* Mobiles */
@media (max-width: 767px) {
    .valeurs--text > h2 {
        max-width: 100%;
    }
    .responsabilite, .design {
        margin-left: var(--pm-none);
    }
    .cards {
        order: 1;
        flex-direction: column;
        gap: var(--pm-lg);
    }
    .postit--bottom { min-height: fit-content; }
    .team--quote { display: none; }
    .team--text {
        order: 1;
        margin-top: var(--pm-xl);
        margin-bottom: var(--pm-xl);
    }
    .team--text p {
        max-width: 100%;
    }
    .intro {
        margin-top: 44vh;
        max-width: 96%;
    }
    .methode--cta {
        order: 1;
    }
    .card--content > img { display: none; }
}