/*
Theme Name: MFMS
Theme URI: https://mfms.fr
Author: Thierry Mang
Version: 1.0
Description: Thème personnalisé MFMS
Text Domain: mfms
*/
:root{
	--violet:#5B1FA6;
	--violet-clair:#8A3DDB;
	--violet-fonce:#43117D;
	--orange:#FF6600;
	--orange-fonce:#E85600;
	--gris:#f5f5f5;
	--texte:#444;
	--noir:#222;
	--blanc:#fff;
	--rayon:12px;
	--ombre:0 8px 25px rgba(0,0,0,.08);
}
*{
	margin:0;
	padding:0;
	box-sizing:border-box;
}
html{
	scroll-behavior:smooth;
}
body{
	font-family:'Open Sans',sans-serif;
	color:var(--texte);
	line-height:1.7;
	background:#fff;
}
.container{
	width:90%;
	max-width:1200px;
	margin:auto;
}
header{
	background:linear-gradient(
		90deg,
		#5B1FA6 0%,
		#8A3DDB 45%,
		#FF6600 100%
	);
	color:white;
	text-align:center;
	padding:70px 20px;
}
.logo{
	max-width:220px;
	margin-bottom:25px;
}
h1{
	font-family:'Montserrat',sans-serif;
	font-size:3rem;
	font-weight:800;
	margin-bottom:20px;
}
h2{
	font-family:'Montserrat',sans-serif;
	font-size:2rem;
	font-weight:700;
	margin-bottom:25px;
	color:var(--violet);
}
h3{
	font-family:'Montserrat',sans-serif;
	font-size:1.3rem;
	font-weight:700;
	margin-bottom:10px;
	color:var(--orange);
}
.hero-text{
	font-size:1.2rem;
	max-width:900px;
	margin:auto;
}
.btn{
	display:inline-block;
	margin-top:30px;
	padding:16px 35px;
	background:var(--orange);
	color:white;
	text-decoration:none;
	font-weight:700;
	border-radius:50px;
	transition:.3s;
}
.btn:hover{
	background:var(--orange-fonce);
}
.section{
	padding:80px 0;
}
.section-grise{
	background:var(--gris);
}
.hero-image{
	width:100%;
	height:500px;
	object-fit:cover;
	border-radius:20px;
	margin-top:50px;
	box-shadow:var(--ombre);
}
.grille{
	display:grid;
	grid-template-columns:repeat(auto-fit,minmax(250px,1fr));
	gap:25px;
	margin-top:40px;
}
.carte{
	background:white;
	padding:25px;
	border-radius:var(--rayon);
	box-shadow:var(--ombre);
	transition:.3s;
}
.carte:hover{
transform:translateY(-5px);
}
.carte ul{
padding-left:20px;
}
.carte li{
margin-bottom:8px;
}
.images-3{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
gap:20px;
margin-top:40px;
}
.images-3 img{
width:100%;
height:250px;
object-fit:cover;
border-radius:12px;
box-shadow:var(--ombre);
}
.avantages{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
gap:25px;
margin-top:40px;
}
.avantage{
text-align:center;
padding:30px;
background:white;
border-radius:12px;
box-shadow:var(--ombre);
}
.contact{
background:linear-gradient(
90deg,
#5B1FA6 0%,
#8A3DDB 45%,
#FF6600 100%
);
color:white;
}
.contact h2{
color:white;
}
.formulaire{
display:grid;
gap:15px;
max-width:700px;
margin-top:30px;
}
input,
textarea{
padding:15px;
border:none;
border-radius:8px;
font-size:1rem;
}
textarea{
height:180px;
resize:vertical;
}
button{
padding:15px;
background:white;
color:var(--violet);
border:none;
font-weight:700;
cursor:pointer;
border-radius:8px;
}
footer{
	background:#222;
	color:white;
	text-align:center;
	padding:40px 20px;
}
footer p{
	margin-bottom:8px;
}

.footer-banner-main {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 30px;
	border-bottom: 1px solid rgba(255, 255, 255, 0.2);
	padding-bottom: 30px;
}
.footer-banner-contact h2 {
	color: white;
	font-size: 3rem;
	font-weight: 800;
	margin-bottom: 15px;
	letter-spacing: 3px;
}
.footer-banner-advantages {
	display: flex;
	gap: 25px;
	flex-wrap: wrap;
}

.footer-contact-link {
	display: flex;
	align-items: center;
	gap: 12px;
	font-size: 1.2rem;
	margin-bottom: 10px;
}
.footer-contact-link a {
	color: white;
	text-decoration: none;
	font-weight: 700;
}

.adv-item {
	text-align: center;
	max-width: 120px;
}
.adv-icon {
	background: white;
	color: var(--violet);
	width: 55px;
	height: 55px;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin: 0 auto 12px auto;
	font-size: 1.4rem;
	box-shadow: var(--ombre);
}
.adv-item p {
	font-family: 'Montserrat', sans-serif;
	font-size: 0.75rem;
	font-weight: 700;
	text-transform: uppercase;
	line-height: 1.3;
	margin: 0;
}

/* Mentions Légales */
.footer-banner-legal {
	display: flex;
	justify-content: space-between;
	font-size: 0.75rem;
	color: rgba(255, 255, 255, 0.8);
	padding-top: 15px;
}
	
	
/* --- RESPONSIVE --- */
@media (max-width: 992px) {
	.flyer-content-grid {
		grid-template-columns: 1fr;
	}
	.flyer-title-box {
		text-align: left;
	}
}

	

/* ---- ADAPTATION AUX VARIABLES DU SITE MFMS.FR ---- */
    .page-flyer {
        font-family: 'Open Sans', sans-serif;
        color: var(--texte);
        line-height: 1.7;
        background: #fff;
        max-width: 1200px;
        margin: 0 auto;
        padding: 40px 20px;
    }
	/* En-tête Flyer */
    .flyer-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-bottom: 50px;
        flex-wrap: wrap;
        gap: 30px;
    }
    .flyer-logo-box {
        flex: 1;
        min-width: 220px;
    }
    .flyer-logo-box h2 {
        font-size: 3.5rem;
        font-weight: 800;
        letter-spacing: 5px;
        margin: 0;
        background: linear-gradient(90deg, var(--violet) 0%, var(--violet-clair) 50%, var(--orange) 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
		display:none;
    }
	.flyer-logo-box img.logoimg {
       max-width:120px !important;
    }
	
    .flyer-title-box {
        flex: 1.5;
        min-width: 300px;
        text-align: right;
    }
    .flyer-title-box h1 {
        color: var(--violet-fonce);
        margin-bottom: 5px;
        font-size: 2.8rem;
        line-height: 1.2;
    }
    .flyer-title-box h2 {
        color: var(--orange);
        font-size: 1.8rem;
        margin-bottom: 15px;
        text-transform: uppercase;
    }
    .flyer-slogan {
        font-family: 'Georgia', serif;
        font-style: italic;
        font-size: 1.3rem;
        color: var(--violet);
        border-top: 2px solid var(--orange);
        padding-top: 10px;
        display: inline-block;
    }
	/* Intro */
    .flyer-intro {
        font-size: 1.2rem;
        margin-bottom: 40px;
        font-weight: 600;
    }
    .flyer-intro strong {
        color: var(--violet-clair);
    }
	/* Grille Principale (Services + Images) */
    .flyer-content-grid {
        display: grid;
        grid-template-columns: 1.3fr 1fr;
        gap: 40px;
        margin-bottom: 50px;
    }
	/* Section Services */
    .flyer-services {
        display: flex;
        flex-direction: column;
        gap: 20px;
    }
    .flyer-service-card {
        background: white;
        padding: 20px;
        border-radius: var(--rayon);
        box-shadow: var(--ombre);
        display: flex;
        align-items: center;
        gap: 20px;
        border-left: 6px solid var(--violet);
        transition: .3s;
    }
    .flyer-service-card:hover {
        transform: translateY(-5px);
    }
    .flyer-service-card.orange-border {
        border-left-color: var(--orange);
    }
    .flyer-service-icon {
        font-size: 2.2rem;
        min-width: 50px;
        text-align: center;
    }
    .flyer-service-details h3 {
        margin-bottom: 5px;
        font-size: 1.15rem;
        text-transform: uppercase;
    }
    .flyer-service-card.orange-border h3 { color: var(--orange); }
    .flyer-service-card:not(.orange-border) h3 { color: var(--violet); }
    .flyer-service-details p {
        margin: 0;
        font-size: 0.95rem;
        color: var(--texte);
    }
	/* Section Images style "Mosaïque" */
    .flyer-images-mosaic {
        display: grid;
        grid-template-columns: 1fr 1fr;
        grid-template-rows: repeat(3, 160px);
        gap: 15px;
    }
    .mosaic-img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: var(--rayon);
        box-shadow: var(--ombre);
        background-color: var(--gris);
    }
    .mosaic-img.tall {
        grid-row: span 2;
    }
	/* Bandeau de Réassurance */
    .flyer-reassurance {
        background: var(--gris);
        border-radius: var(--rayon);
        padding: 25px;
        text-align: center;
        box-shadow: var(--ombre);
        margin-bottom: 50px;
        border: 1px dashed var(--orange);
    }
    .reassurance-tags {
        font-family: 'Montserrat', sans-serif;
        font-weight: 700;
        font-size: 1.1rem;
        color: var(--violet-fonce);
        letter-spacing: 2px;
    }
    .reassurance-slogan {
        font-family: 'Georgia', serif;
        font-style: italic;
        color: var(--orange);
        font-size: 1.2rem;
        margin-top: 5px;
    }
	/* Footer Style Section Contact du Site */
    .flyer-footer-banner {
        background: linear-gradient(90deg, #5B1FA6 0%, #8A3DDB 45%, #FF6600 100%);
        color: white;
        border-radius: var(--rayon);
        padding: 40px;
        box-shadow: var(--ombre);
    }
	
	
	
@media(max-width:768px){
	h1{
	font-size:2rem;
	}
	h2{
	font-size:1.6rem;
	}
	.hero-image{
	height:300px;
	}
	.flyer-title-box h1 { font-size: 2rem; }
	.flyer-title-box h2 { font-size: 1.4rem; }
	.footer-banner-main { flex-direction: column; align-items: start; }
	.footer-banner-advantages { justify-content: center; width: 100%; }
	.footer-banner-legal { flex-direction: column; gap: 5px; }
	
	.flyer-images-mosaic{display:none}
	
	
}

@media(max-width:425px){
	h1{
	font-size:1.5rem;
	}
	h2{
	font-size:1.2rem;
	}
	.hero-image{
	height:300px;
	}
	.flyer-title-box h1 { font-size: 1.5rem; }
	.flyer-title-box h2 { font-size: 1rem; }
	
}