/* =============================================================
   QSN.CSS — AMSS13
   Styles spécifiques à la page "Qui Sommes-Nous ?"
   ============================================================= */


/* -------------------------------------------------------------
   1. BASE DE LA PAGE
   ------------------------------------------------------------- */

html, body {
    width:    100%;
    position: relative;
}


/* -------------------------------------------------------------
   2. ARRIÈRE-PLAN FLOUTÉ
   ------------------------------------------------------------- */

.qsn-bg-blur {
    position:       fixed;
    top:            0;
    left:           0;
    width:          100vw;
    height:         100vh;
    z-index:        -1;
    background:     url('../img/background/amss-orangevelodrome-2022-02.png') center center / cover no-repeat;
    filter:         blur(8px) brightness(0.85);
    opacity:        0.7;
    pointer-events: none;
}


/* -------------------------------------------------------------
   3. CONTENU PRINCIPAL
   ------------------------------------------------------------- */

main.container {
    position: relative;
    z-index:  1;
}


/* -------------------------------------------------------------
   4. SECTIONS (cards)
   ------------------------------------------------------------- */

.qsn-section {
    background:    rgba(255, 255, 255, 0.85);
    border-radius: 18px;
    box-shadow:    0 4px 24px rgba(0, 0, 0, 0.08);
    padding:       2rem 2.5rem;
    margin-bottom: 2.5rem;
    position:      relative;
    z-index:       2;
}


/* -------------------------------------------------------------
   5. IMAGES DES SECTIONS
   ------------------------------------------------------------- */

.qsn-logo img,
.qsn-img img {
    border-radius: 16px;
    box-shadow:    0 2px 12px rgba(0, 0, 0, 0.10);
    background:    #fff;
}


/* -------------------------------------------------------------
   6. TYPOGRAPHIE
   ------------------------------------------------------------- */

.qsn-title {
    font-size:     2.2rem;
    font-weight:   700;
    margin-bottom: 0.7rem;
}

.qsn-subtitle {
    font-size:     1.5rem;
    font-weight:   600;
    margin-bottom: 0.5rem;
}

.qsn-desc {
    font-size: 1.1rem;
    color:     #222;
}