/* ==========================================================
   PAGE
   QUI SOMMES-NOUS
   ========================================================== */


/* ==========================================================
   CONTENU
   ========================================================== */

.page .container{

    max-width:980px;

}


/* ==========================================================
   TITRE PRINCIPAL
   ========================================================== */

h1{

    font-size:2.10rem;

    font-weight:700;

    margin-bottom:38px;

    color:var(--color-title);

}


/* ==========================================================
   TITRES DE PARAGRAPHES
   ========================================================== */

h2{

    font-size:1.55rem;

    font-weight:600;

    color:var(--color-title);

    margin-top:42px;

    margin-bottom:16px;

}


/* ==========================================================
   PARAGRAPHES
   ========================================================== */

p{

    margin-bottom:18px;

    text-align:justify;

}


/* ==========================================================
   CITATIONS
   ========================================================== */

blockquote{

    margin:34px 0;

    padding:20px 28px;

    border-left:5px solid var(--color-gold);

    background:#F7FAFC;

    color:var(--color-secondary);

    font-size:1.15rem;

    line-height:1.7;

    font-style:italic;

}


/* ==========================================================
   PHRASE FINALE
   ========================================================== */

.page p:last-child{

    margin-top:28px;

    margin-bottom:0;

    color:var(--color-secondary);

    font-size:1.22rem;

    font-weight:600;

}


/* ==========================================================
   ESPACEMENT AVANT LE FOOTER
   ========================================================== */

.page{

    padding-bottom:40px;

}


/* ==========================================================
   RESPONSIVE
   ========================================================== */

@media (max-width:900px){

    .page .container{

        max-width:100%;

    }

    h1{

        font-size:1.80rem;

    }

    h2{

        font-size:1.35rem;

    }

    p{

        text-align:left;

    }

}

/* ==========================================================
   PAGE D'ATTENTE
========================================================== */

.page-placeholder .container{

    min-height:650px;

    display:flex;

    align-items:center;

}

.placeholder-message{

    max-width:700px;

}

/* ==========================================================
   FENÊTRE MODALE - FORMULAIRE DE CONTACT
========================================================== */

.contact-overlay{

    position:fixed;

    inset:0;

    display:flex;

    justify-content:center;

    align-items:center;

    background:rgba(2,35,76,.35);

    z-index:9999;

}

.contact-modal{

    width:min(560px,90%);

    background:#FFFFFF;

    border-top:6px solid #D7A33D;

    padding:40px 45px;

    box-shadow:0 20px 60px rgba(0,0,0,.20);

    text-align:center;

}

.contact-modal h2{

    margin:0 0 25px;

    color:var(--color-title);

}

.contact-modal p{

    margin-bottom:35px;

    line-height:1.8;

}

.contact-modal .btn-primary{

    min-width:180px;

}