/*
 * Slide « mois sans tabac » de la page d'accueil (themes/vapoteur/mst-home-slide.tpl), chargé par
 * vapoteurheaderbanniere en novembre. Mise en page de la maquette de Noémie (2000×411) ; tailles en vw :
 * le slider suit la largeur de l'écran (20.55vw de haut en desktop, 1000/1210 de la largeur en mobile).
 */
#vapoteurheaderbanniere .mst-home-slide {
    --mst-slide-gold: #f0bc4a;
    --mst-slide-red: #cc4e44;
    position: relative;
    overflow: hidden;
    background: #dce9df;
}

#vapoteurheaderbanniere .mst-home-slide__visual {
    display: block;
    height: 100%;
}

/* Desktop : bloc centré à 42 % de la largeur et 56 % de la hauteur, entre les mains en mousse de gauche et la pin-up. */
#vapoteurheaderbanniere .mst-home-slide__content {
    position: absolute;
    top: 12%;
    bottom: 0;
    left: 31%;
    right: 47%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    line-height: 1;
}

/* Spécificité de l'id seul : les marges des blocs ci-dessous l'emportent. */
#vapoteurheaderbanniere .mst-home-slide__content :where(p) {
    margin: 0;
}

/* Police du compteur des Black Fairdays (modules/fairday/css/compteur.css), sans ses cartes ni son animation ;
 * espacement des chiffres = largeur des cartes de la maquette. */
#vapoteurheaderbanniere .mst-home-slide__number {
    margin-right: -.21em;
    color: var(--mst-slide-gold);
    font: bold max(22px, 3.1vw) / 1 "Open Sans", sans-serif;
    letter-spacing: .21em;
    text-shadow: 0 .07em 0 var(--mst-slide-red);
    white-space: nowrap;
}

/* Encadré blanc à bord rouge, plus épais en bas à gauche (effet autocollant), texte jaune, « Mois sans tabac » en rouge. */
#vapoteurheaderbanniere .mst-home-slide__label {
    margin-top: max(6px, .85vw);
    padding: max(4px, .45vw) max(4px, .4vw) max(2px, .25vw) max(5px, .45vw);
    border: max(2px, .2vw) solid var(--mst-slide-red);
    border-radius: max(6px, .6vw);
    background: #fff;
    box-shadow: min(-2px, -.2vw) max(1px, .15vw) 0 var(--mst-slide-red);
    color: var(--mst-slide-gold);
    font: max(13px, 1.65vw) / .97 var(--lpv-font-01);
    text-transform: uppercase;
}

#vapoteurheaderbanniere .mst-home-slide__accent {
    color: var(--mst-slide-red);
}

#vapoteurheaderbanniere .mst-home-slide__cta {
    margin-top: max(8px, 1.2vw);
    padding: max(3px, .14vw) max(12px, 1.35vw);
    border: 0;
    border-radius: max(3px, .2vw);
    background: var(--mst-slide-red);
    color: #fff;
    font-size: max(13px, 1.28vw);
    line-height: 1;
}

#vapoteurheaderbanniere .mst-home-slide__cta:hover,
#vapoteurheaderbanniere .mst-home-slide__cta:focus {
    background: #b4433a;
    color: #fff;
}

/* Mobile : sous le menu des catégories (haut du slide), à gauche de la pin-up, au-dessus des mains en mousse du bas. */
@media only screen and (max-width: 767px) {
    #vapoteurheaderbanniere .mst-home-slide__content {
        top: 32%;
        bottom: 25%;
        left: 3%;
        right: 50%;
    }

    /* Proportions du desktop × 2,7. */
    #vapoteurheaderbanniere .mst-home-slide__number {
        font-size: 8.4vw;
    }

    #vapoteurheaderbanniere .mst-home-slide__label {
        margin-top: 2.3vw;
        padding: 1.2vw 1.1vw .7vw 1.2vw;
        border-width: .55vw;
        border-radius: 1.6vw;
        box-shadow: -.55vw .4vw 0 var(--mst-slide-red);
        font-size: 4.45vw;
    }

    #vapoteurheaderbanniere .mst-home-slide__cta {
        margin-top: 3.2vw;
        padding: .4vw 3.6vw;
        border-radius: .55vw;
        font-size: 3.45vw;
    }
}