.vpa-titre-page{
    position: relative;         /* Permet de garder le flux normal */
    width: 100vw;               /* Prend toute la largeur de la fenêtre */
    left: 50%;                  /* Centre horizontalement */
    right: 0;
    transform: translateX(-50%);
    box-sizing: border-box;
    margin: 0 auto;
    top: 0;                     /* Pas de décalage vertical absolu */
    z-index: 1;
    background: white;          /* Optionnel : fond pour éviter la superposition visuelle */
    padding: 0 ;            /* Optionnel : espace autour du titre */
    display: block;
    max-height:70vh;
    overflow: hidden;  
    .vpa-image {
        background-color: var(--main-color);
        min-height:30vh;
    }
    
    img {
        border-radius: 0;
        object-fit: cover;
        filter:brightness(75%);
        width:100vw; 
    }
    .sub-container {
        padding: 0 !important;
        max-width: inherit;
    }        /* Pour éviter le débordement */
    .paragraph {
        position: absolute;
        top:15%;
        left: 50%;
        font-size:max(4vw);
        transform: translate(-50%, -50%);
        margin: 0;
        text-align: center;
        color: #fff; 
        background-color: var(--main-color);
        z-index: 2;
        pointer-events: none; /* optionnel, pour éviter de bloquer les clics sur l'image */
        font-family: var(--font-obviously);
        text-shadow: 0 2px 8px rgba(0,0,0,0.7);
        min-width:80%;
        line-height: 1.75em;
        @media screen and (min-width: 768px) {
            top: 25%;
            left: 50%;
            font-size: max(2vw); /* ajuste la taille selon besoin */
            padding: 0.5rem ; 
            min-width:auto;
        }
    }
}