/* ============================
   SECTIONS GLOBALES (100vh)
   ============================ */

section {
    height: 100vh;
    display: flex;
    justify-content: center;   /* centrage vertical global */
    align-items: center;
    position: relative;
    overflow: hidden;
}

section .inner {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;   /* centrage vertical global */
    align-items: center;
}




@media (max-width: 900px) {
    .s3-title {
        font-size: 32px;
        margin-bottom: 10px;
    }
}


/* ============================
   SECTION 4 — ALIGNEMENT EN HAUT
   ============================ */

/* On aligne S4 en haut */
#s4 .inner {
    justify-content: flex-start;
}

/* On crée l’espace visuel SANS casser le fullscreen */
.s4-title {
    margin-top: 150px; /* espace sous le bord haut */
}

/* ============================
   SECTION 4 — TITRES (TAILLES)
   ============================ */

.s4-title {
    font-size: 56px;
    font-weight: 200;
    letter-spacing: 0.08em;
    margin-bottom: 40px;
    color: #fff;
    text-align: center;
}

.s4-subtitle,
.s4-text p {
    font-size: 20px;
    color: #fff;
    text-align: center;
}


/* ============================
   SECTION 4 — IMAGE
   ============================ */







/* --- S4 IMAGE DESKTOP --- */
.s4-image-wrapper {
    width: 100%;
    padding: 0 60px;            /* padding desktop (ajuste si tu veux 40px) */
    box-sizing: border-box;
    display: flex;
    justify-content: center;    /* centrage horizontal */
}

.s4-image {
    max-width: 260px;           /* limite la largeur pour éviter pleine page */
    width: 100%;
    height: auto;               /* proportions respectées sur desktop */
    display: block;
    border-radius: 6px;
}
/* ============================
   SECTION 4 — MOBILE
   ============================ */

@media (max-width: 900px) {

    /* --- TITRE S4 : espace pour éviter qu'il colle en haut --- */
    #s4 .inner > *:first-child {
        margin-top: 80px;
    }

    .s4-title {
        font-size: 32px;
        margin-bottom: 30px; 
        letter-spacing: 0.02em;
        text-align: center;
    }

    /* --- IMAGE S4 : centrée + padding + hauteur fixe + recadrage --- */
    .s4-image-wrapper {
        width: 100%;
        padding: 0 40px;          /* padding demandé */
        box-sizing: border-box;
        display: flex;
        justify-content: center;  /* centrage horizontal */
    }

    .s4-image {
        width: 100%;              /* occupe la largeur du wrapper */
        height: 300px;            /* hauteur demandée */
        object-fit: cover;        /* coupe proprement */
        object-position: center;  /* centrée dans le cadre */
        display: block;
        border-radius: 6px;
		margin-bottom: 30px;
    }

    /* --- TEXTE S4 --- */
    .s4-text p {
        font-size: 18px;
        margin-bottom: 10px;
        text-align: center;
    }
}
.s4-text a {
color:bisque !important;font-size:17px;	
	
}
.s4-text a:hover {
color: #ffcc66 !important;

	
}