/* =========================================================
   NORMASEC – couche de modernisation
   Chargée après les feuilles du thème : elle garde les couleurs,
   la typographie et l'esprit du site, et range la mise en page.
   ========================================================= */

/* ---------- Base ---------- */
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
/* Fond d'eau : calque fixe (plus fluide au défilement qu'un background-attachment: fixed) */
body { background: #c9d9ef !important; }
body::before {
	content: "";
	position: fixed;
	top: 0; right: 0; bottom: 0; left: 0;
	z-index: -1;
	background: url(../images/bg.jpg) center / cover no-repeat;
	pointer-events: none;
}
p { font-size: 15px; line-height: 1.75; color: #4d4d4d; }
img { max-width: 100%; }
a, button { -webkit-tap-highlight-color: rgba(245, 130, 67, .25); }
.menu-wrapper ul.sf-menu > li > a { transition: background .2s, color .2s; }

/* ---------- Boutons ---------- */
.btn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 16px 26px;
	font-family: 'Open Sans', sans-serif;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: .5px;
	text-transform: uppercase;
	line-height: 1.2;
	color: #fff;
	transition: background .2s, color .2s, box-shadow .2s;
}
.btn i { font-size: 24px; line-height: 1; }
.btn-orange { background: #f58243; }
.btn-orange:hover, .btn-orange:focus { background: #e2692a; color: #fff; }
.btn-ghost { box-shadow: inset 0 0 0 2px #fff; }
.btn-ghost:hover, .btn-ghost:focus { background: #fff; color: #000; }
a.page-read-more-button, a.portfolio-read-more, #submit_contact { transition: background .2s; }
a.page-read-more-button:hover, a.portfolio-read-more:hover, #submit_contact:hover { background: #f58243 !important; color: #fff; }

/* ---------- Bannière d'accueil ---------- */
.hero {
	position: relative;
	display: flex;
	align-items: center;
	min-height: 520px;
	background-color: #333;
	background-position: center;
	background-size: cover;
}
.hero::before {
	content: "";
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	background: linear-gradient(90deg, rgba(0,0,0,.78) 0%, rgba(0,0,0,.5) 45%, rgba(0,0,0,.05) 85%);
}
.hero-inner { position: relative; max-width: 760px; padding: 60px 80px; }
.hero .hero-kicker { margin: 0 0 8px; font-size: 14px; font-weight: 700; letter-spacing: 4px; text-transform: uppercase; color: #f58243; }
.hero .hero-title { margin: 0 0 12px; font-size: 54px; font-weight: 800; line-height: 1.05; letter-spacing: -1.5px; text-transform: uppercase; color: #fff; }
.hero .hero-text { margin: 0 0 30px; font-size: 22px; font-style: italic; line-height: 1.4; color: #fff; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }

/* ---------- Rangées alignées (accueil) ---------- */
.row-flex { display: flex; align-items: stretch; }
.row-flex > .pego-columns { float: none; flex: 0 0 auto; }
.home-wrapper { margin-top: 0; }
.home-intro > .pego-columns { height: auto; min-height: 290px; }
.home-intro .home-element2 { display: flex; flex-direction: column; justify-content: center; padding: 50px 50px 46px; }
.home-wrapper h1.page-heading { margin-bottom: 16px; }
.home-intro .home-element3a { position: relative; height: auto; overflow: hidden; }
.home-intro .home-element3a img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }

.home-wrapper .home-element4, .home-wrapper .home-element5, .home-wrapper .home-element6 { height: 780px; }
.home-element4 .page-testimonails { display: flex; flex-direction: column; justify-content: center; height: 100%; padding: 40px 34px; }
.home-element4 .page-testimonails p { color: #fff; }
.home-element5 .services-wrapper { display: flex; flex-direction: column; justify-content: center; height: 100%; }
.home-element5 .services-wrapper p { padding: 16px 30px; }

/* ---------- Carrousel des prestations ---------- */
.prest-box .owl-wrapper-outer { height: 100%; }
.prest-box .owl-wrapper { display: flex !important; height: 100%; }
.prest-box .owl-item { display: flex; float: none; }
.prest-box div.item { display: flex; flex-direction: column; flex: 1 1 auto; padding-top: 14px; }
.prest-box img.portfolio-image { display: block; flex: 1 0 240px; width: 100%; min-height: 240px; height: auto; object-fit: cover; }
.prest-box h2.portfolio-title { font-size: 36px; margin-bottom: 12px; }
.prest-box h2.portfolio-title span { font-size: 28px; }
.prest-box p.portfolio-summary { font-size: 14px; }
.prest-box a.portfolio-read-more { align-self: center; }

/* Zone d'intervention : une ligne discrète sous la photo */
.prest-box .prest-zone {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	padding: 11px 20px 12px;
	background: #fff;
	border-top: 3px solid #f58243;
	color: #555;
	font-size: 12px;
	line-height: 1.55;
	text-align: left;
}
.prest-box .prest-zone strong { display: inline; flex: 0 0 auto; margin: 0; font-size: 11px; letter-spacing: .5px; white-space: nowrap; line-height: 1.7; }
.prest-box .prest-zone strong::before { content: "\e638"; font-family: 'Pe-icon-7-stroke'; margin-right: 4px; font-size: 15px; vertical-align: -3px; }

/* ---------- Rangées texte / photo (pages Murs, Toiture, Façade) ---------- */
.about-wrapper { display: flex; align-items: stretch; }
.about-wrapper > .clear { display: none; }
.about-wrapper > .pego-columns-auto-height { float: none; flex: 0 0 auto; }
.about-element1 { padding: 50px 50px 40px; }
.about-element1 h2 { margin-top: 6px; }
.about-element1 hr { border: 0; border-top: 1px solid #ddd; margin: 14px 0; }
.about-wrapper .about-element2 { position: relative; min-height: 380px; overflow: hidden; }
.about-wrapper .about-element2 > img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; }
/* schéma en 4 étapes : jamais recadré */
.about-wrapper .about-element2.img-entiere { min-height: 0; }
.about-wrapper .about-element2.img-entiere > img { position: static; height: auto; }
/* colonne 3D : contenu normal */
.about-wrapper .about-element2.toit3d-col { min-height: 0; }

/* ---------- Pourquoi choisir NORMASEC (cartes) ---------- */
.why-wrapper { padding: 56px 40px 60px; background: #fff; }
h2.why-title { margin: 0 0 30px; text-align: center; text-transform: uppercase; font-size: 32px; font-weight: 400; letter-spacing: -1px; color: #000; }
h2.why-title span { font-weight: 800; }
.why-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.why-card { padding: 28px 26px 22px; background: #f4f4f4; border-top: 3px solid #f58243; }
.why-card i { display: block; font-size: 44px; color: #0b559e; }
.why-card h3 { margin: 14px 0 8px; font-size: 16px; font-weight: 700; text-transform: uppercase; color: #000; }
.why-card p { margin: 0; font-size: 14.5px; }

/* ---------- Réalisations : grille régulière ---------- */
.portfolio-sh-items-wrapper { height: auto !important; }
.portfolio-sh-items-wrapper .portfolio-sh-item { position: relative !important; top: auto !important; left: auto !important; transform: none !important; }
a.portfoliosh-thumb { position: relative; overflow: hidden; aspect-ratio: 63 / 61; }
a.portfoliosh-thumb img.portfoliosh-image { width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
a.portfoliosh-thumb:hover img.portfoliosh-image { transform: scale(1.05); }

/* ---------- Bloc contact (bas de page) ---------- */
.contact-info--wrapper { display: flex; align-items: stretch; margin-bottom: 0; background: #f4f4f4; }
.contact-info--wrapper > .clear { display: none; }
.contact-info--wrapper > .pego-columns { float: none; height: auto; flex: 0 0 auto; }
.contact-info--wrapper .contact-element1 { padding: 40px 50px !important; }
.contact-info--wrapper .contact-element1 p { max-width: 760px; }
div.contact-info1 { font-size: 30px; letter-spacing: -1px; }
div.contact-info3 { font-size: 44px !important; line-height: 1.15 !important; letter-spacing: -1px; margin-top: 12px !important; }
div.contact-info3 a[href^="tel"] { white-space: nowrap; }
div.contact-info3 a[href^="mailto"] { display: inline-block; margin-top: 6px; font-size: 18px !important; letter-spacing: 0 !important; color: #333; word-break: break-word; }
.contact-info--wrapper .contact-element2 iframe { display: block; height: 100%; min-height: 290px; }

/* ---------- Page contact ---------- */
.contact-form-with-info-wrapper { display: flex; align-items: stretch; width: 100%; float: none !important; }
.contact-form-with-info-wrapper > .pego-columns-auto-height { float: none; flex: 0 0 auto; }
.contact-form-with-info1, .contact-form-with-info3 { display: flex; align-items: center; justify-content: center; padding: 40px 20px; }
.contact-form-with-info1 .page-vertical-alignment, .contact-form-with-info3 .page-vertical-alignment { position: static; height: auto; display: block; }
.contact-form-with-info1 p, .contact-form-with-info3 p { color: #fff; font-size: 14px; line-height: 1.7; }
.contact-form-with-info1 a { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.contact-form-with-info2 .wpcf7-form-control {
	width: 100%;
	padding: 14px 16px;
	border: 1px solid #d8d8d8;
	background: #fff;
	font-size: 15px;
	font-style: normal;
	transition: border-color .2s, box-shadow .2s;
}
.contact-form-with-info2 .wpcf7-form-control:focus { outline: 0; border-color: #f58243; box-shadow: 0 0 0 3px rgba(245, 130, 67, .2); }
#submit_contact { background: #000; color: #fff; border: 0; cursor: pointer; -webkit-appearance: none; border-radius: 0; }

/* ---------- Écrans moyens (960 à 1280 px) ---------- */
@media only screen and (max-width: 1280px) and (min-width: 960px) {
	.hero { min-height: 460px; }
	.hero-inner { padding: 50px 60px; }
	.hero .hero-title { font-size: 44px; }
	.home-wrapper .home-element4, .home-wrapper .home-element5, .home-wrapper .home-element6 { height: 860px; }
	.home-element5 .services-wrapper p { padding: 14px 20px; }
	.home-element4 .page-testimonails { padding: 30px 24px; }
	.why-wrapper { padding: 46px 30px 50px; }
}

/* ---------- Tablette et téléphone ---------- */
@media only screen and (max-width: 959px) {
	.row-flex, .about-wrapper, .contact-info--wrapper, .contact-form-with-info-wrapper { flex-direction: column; }
	.row-flex > .pego-columns, .about-wrapper > .pego-columns-auto-height, .contact-info--wrapper > .pego-columns, .contact-form-with-info-wrapper > .pego-columns-auto-height { width: 100%; }
	.home-wrapper .home-element4, .home-wrapper .home-element5, .home-wrapper .home-element6 { height: auto; }
	.home-element4 .page-testimonails, .home-element5 .services-wrapper { height: auto; }
	.about-wrapper .about-element2 { min-height: 0; }
	.about-wrapper .about-element2 > img { position: static; height: auto; }
	.contact-info--wrapper .contact-element2 iframe { height: 260px; min-height: 0; }
	.why-grid { grid-template-columns: 1fr; gap: 14px; }
}

@media only screen and (max-width: 767px) {
	p { font-size: 15px; }
	.hero { min-height: 0; }
	.hero::before { background: linear-gradient(180deg, rgba(0,0,0,.55) 0%, rgba(0,0,0,.72) 100%); }
	.hero-inner { padding: 46px 22px 40px; }
	.hero .hero-kicker { font-size: 12px; letter-spacing: 3px; }
	.hero .hero-title { font-size: 32px; letter-spacing: -1px; }
	.hero .hero-text { font-size: 18px; margin-bottom: 22px; }
	.hero-actions .btn { width: 100%; justify-content: center; }
	.home-intro .home-element2 { padding: 30px 22px; }
	.about-element1 { padding: 30px 22px 24px; }
	.prest-box h2.portfolio-title { font-size: 28px; }
	.prest-box h2.portfolio-title span { font-size: 22px; }
	.prest-box .prest-zone { padding: 10px 14px; }
	.why-wrapper { padding: 36px 18px 40px; }
	h2.why-title { font-size: 26px; margin-bottom: 20px; }
	.contact-info--wrapper .contact-element1 { padding: 30px 20px !important; }
	div.contact-info1 { font-size: 24px; }
	div.contact-info3 { font-size: 36px !important; }
	div.contact-info3 a[href^="mailto"] { font-size: 16px !important; }
}

@media only screen and (max-width: 360px) {
	div.contact-info3 { font-size: 31px !important; }
	.hero .hero-title { font-size: 28px; }
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	.prest-nudge { animation: none; }
	a.portfoliosh-thumb img.portfoliosh-image { transition: none; }
}

/* Champs du formulaire : texte lisible */
.contact-form-with-info2 .wpcf7-form-control { font-size: 15px !important; font-style: normal !important; }
.contact-form-with-info2 .wpcf7-form-control::placeholder { font-style: normal; font-size: 14px; color: #8a8a8a; }

/* Téléphone : galerie sur 2 colonnes, zone d'intervention sur deux lignes */
@media only screen and (max-width: 767px) {
	.portfolio-sh-items-wrapper .portfolio-sh-item { width: 50% !important; }
	.prest-box .prest-zone { flex-wrap: wrap; gap: 2px 8px; }
	.prest-box .prest-zone strong { flex-basis: 100%; }
	.home-element4 .page-testimonails { padding: 30px 24px; }
	.home-element4 .page-testimonails p[style*="margin-top"] { margin-top: 16px !important; }
	h1.portfolio-sh-items-header-title { font-size: 26px; }
}

h2.why-title span { color: #f58243; }
/* Téléphone : la maquette 3D passe avant le texte sur la page Toiture */
@media only screen and (max-width: 959px) {
	.about-wrapper .about-element2.toit3d-col { order: -1; }
}

/* Pied de page : plus de chevauchement */
.footer { margin-top: 0; padding: 20px 20px 18px; }
.footer p { margin: 0; line-height: 1.6; }

/* Page contact sur téléphone : le formulaire d'abord, cases d'infos compactes */
@media only screen and (max-width: 959px) {
	.contact-form-with-info-wrapper .contact-form-with-info2 { order: -1; }
	.contact-form-with-info1, .contact-form-with-info3 { height: auto !important; min-height: 0; padding: 26px 20px; text-align: center; }
	.contact-form-with-info1 .page-vertical-alignment, .contact-form-with-info3 .page-vertical-alignment { min-height: 0 !important; height: auto !important; }
	.contact-form-with-info1 .page-icon-wrapper, .contact-form-with-info3 .page-icon-wrapper { display: block; }
}

/* Zone d'intervention : libellé sur la même ligne que les villes */
.prest-box .prest-zone { display: block; line-height: 1.5; }
.prest-box .prest-zone strong { display: inline; margin-right: 6px; line-height: 1.5; }

/* ---------- Pourquoi choisir NORMASEC : version sobre ---------- */
.why-wrapper { padding: 40px 40px 44px; }
h2.why-title { font-size: 24px; margin-bottom: 22px; }
.why-grid { gap: 0; }
.why-card { padding: 4px 26px; background: none; border-top: 0; border-left: 1px solid #e2e2e2; }
.why-card:first-child { border-left: 0; padding-left: 0; }
.why-card:last-child { padding-right: 0; }
.why-card h3 { margin: 0 0 6px; font-size: 14px; letter-spacing: .3px; }
.why-card p { font-size: 14px; line-height: 1.65; }

/* ---------- Remontées capillaires en 3D (accueil) ---------- */
.rc3d-section { padding: 46px 40px 30px; background: #fff; border-top: 1px solid #ececec; }
h2.rc3d-titre { margin: 0 0 8px; text-align: center; text-transform: uppercase; font-size: 32px; font-weight: 400; letter-spacing: -1px; line-height: 1.1; color: #000; }
h2.rc3d-titre span { font-weight: 800; color: #f58243; }
p.rc3d-intro { margin: 0 auto 14px; max-width: 640px; text-align: center; }
#rc3d-frame { display: block; width: 100%; height: 1100px; border: 0; background: #fff; }

@media only screen and (max-width: 959px) {
	.why-card, .why-card:first-child, .why-card:last-child { padding: 14px 0; border-left: 0; border-top: 1px solid #e2e2e2; }
	.why-card:first-child { border-top: 0; padding-top: 0; }
	.why-grid { gap: 0; }
}

/* ---------- Accueil sur téléphone : arriver plus vite aux prestations ---------- */
@media only screen and (max-width: 767px) {
	.home-intro .home-element2 { padding: 24px 20px 22px; }
	.home-wrapper h1.page-heading, .home-wrapper h1.page-heading span { font-size: 22px; }
	.home-wrapper p.page-summary { font-size: 14px; line-height: 1.6; margin: 0; }
	.rc3d-section { padding: 28px 12px 10px; }
	h2.rc3d-titre { font-size: 24px; }
	p.rc3d-intro { font-size: 14px; margin-bottom: 8px; }
	.why-wrapper { padding: 28px 20px 30px; }
	h2.why-title { font-size: 21px; margin-bottom: 14px; }

	/* le carrousel des prestations passe avant les deux cases */
	.home-services .home-element6 { order: -1; }

	/* case services : liste compacte */
	.home-element5 .services-wrapper { padding: 6px 0 4px; }
	.home-element5 .services-wrapper p { padding: 12px 20px !important; font-size: 14px; text-align: left; }
	.home-element5 .services-wrapper p:first-child { font-size: 18px !important; padding: 16px 20px 12px !important; text-align: center; }
	.home-element5 .services-wrapper p span { font-size: 13.5px !important; line-height: 1.5; }
	.home-element5 .services-wrapper p:last-child { margin-bottom: 8px !important; }

	/* case devis : titre + bouton seulement (le texte est déjà dit dans la bannière) */
	.home-element4 .page-testimonails { flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 20px !important; }
	.home-element4 .page-testimonails p[style="color: #fff;"] { display: none; }
	.home-element4 h2.testimonial-title { margin: 0; text-align: left; font-size: 18px; }
	.home-element4 h2.testimonial-title span { font-size: 24px; }
	.home-element4 .page-testimonails p[style*="margin-top"] { margin: 0 !important; }
	.home-element4 a.page-read-more-button { padding: 14px 18px; }
}

/* Accueil sur téléphone : intro → prestations → 3D → devis → services */
@media only screen and (max-width: 767px) {
	.home-wrapper { display: flex; flex-direction: column; }
	.home-wrapper > * { order: 10; }
	.home-wrapper > .home-intro { order: 1; }
	.home-wrapper > .home-services { display: contents; }
	.home-services > .home-element6 { order: 3; }
	.home-wrapper > .rc3d-section { order: 2; }
	.home-services > .home-element4 { order: 4; }
	.home-services > .home-element5 { order: 5; }
	.home-element4 { background: #0b559e; }
	.home-element4 .page-testimonails { float: none; width: 100%; }
	.home-element4 > .clear { display: none; }
}
@media only screen and (max-width: 767px) {
	.home-wrapper .home-element4, .home-element4 .page-testimonails { height: auto !important; min-height: 0 !important; }
}

/* =========================================================
   Pleine largeur, sans fond bleu
   ========================================================= */
body { background: #fff !important; }
body::before { display: none !important; }
.header-socials-wrapper { display: none !important; }
.container-wrapper { width: auto !important; max-width: none; margin: 0 !important; box-shadow: none !important; }
@media only screen and (min-width: 960px) {
	.pego-columns3 { width: 25%; }
	.pego-columns6 { width: 50%; }
	.pego-columns9 { width: 75%; }
	.pego-columns12 { width: 100%; }
	.about-element1 > *, .home-intro .home-element2 > * { max-width: 760px; }
	.about-element1 { padding: 60px 60px 50px; }
}

/* ---------- En-tête fixe ---------- */
#header-wrapper {
	position: sticky; top: 0; z-index: 100;
	display: flex; align-items: center; gap: 20px;
	min-height: 0; padding: 0 40px;
	background: #fff;
	box-shadow: 0 1px 0 #ececec, 0 6px 20px rgba(0,0,0,.05);
}
#header-wrapper > .clear { display: none; }
#header-wrapper .logo { float: none; padding: 12px 0; margin: 0; width: auto; }
#header-wrapper .logo a { display: block; line-height: 0; }
#header-wrapper .logo img { max-width: 190px !important; height: auto; vertical-align: middle; }
#header-wrapper .menu-wrapper { float: none; margin-left: auto; }
.menu-wrapper ul.sf-menu { display: flex; }
.menu-wrapper ul.sf-menu > li { float: none; min-height: 0; background: none !important; }
.menu-wrapper ul.sf-menu > li > a {
	position: relative; display: block; width: auto !important;
	padding: 0 14px !important; line-height: 76px !important;
	font-size: 14px; letter-spacing: .5px; color: #111;
	background: none !important;
}
.menu-wrapper ul.sf-menu > li > a::after {
	content: ""; position: absolute; left: 14px; right: 14px; bottom: 22px; height: 2px;
	background: #f58243; transform: scaleX(0); transition: transform .2s;
}
.menu-wrapper ul.sf-menu > li > a:hover::after, .menu-wrapper ul.sf-menu > li.current-menu-item > a::after { transform: scaleX(1); }
.menu-wrapper ul.sf-menu > li > a:hover, .menu-wrapper ul.sf-menu > li.current-menu-item > a { color: #0b559e !important; background: none !important; }
.header-actions { display: flex; align-items: center; gap: 16px; }
.header-tel { display: flex; align-items: center; gap: 6px; font-weight: 700; font-size: 15px; color: #111; white-space: nowrap; }
.header-tel i { font-size: 24px; color: #f58243; }
.header-tel:hover { color: #0b559e; }
.btn.header-devis { padding: 12px 20px; font-size: 13px; }
#header-wrapper .mobile-menu-show { display: none; }
#header-wrapper .mobile-menu-wrapper { position: absolute; top: 100%; left: 0; right: 0; box-shadow: 0 12px 24px rgba(0,0,0,.12); }

@media only screen and (max-width: 1180px) {
	.header-tel span { display: none; }
	.menu-wrapper ul.sf-menu > li > a { padding: 0 10px !important; }
	.menu-wrapper ul.sf-menu > li > a::after { left: 10px; right: 10px; }
}
@media only screen and (max-width: 959px) {
	#header-wrapper { padding: 0 16px; gap: 12px; }
	#header-wrapper .logo { padding: 10px 0; text-align: left; }
	#header-wrapper .logo img { max-width: 150px !important; }
	#header-wrapper .menu-wrapper { display: none; }
	.header-actions { margin-left: auto; gap: 10px; }
	.header-tel { width: 42px; height: 42px; justify-content: center; border: 2px solid #ececec; }
	.btn.header-devis { padding: 11px 14px; font-size: 12px; }
	#header-wrapper .mobile-menu-show { display: block; float: none; margin: 0; font-size: 38px; line-height: 1; color: #111; }
}
@media only screen and (max-width: 400px) {
	.btn.header-devis { display: none; }
}

/* ---------- Titres de section communs ---------- */
h2.section-titre { margin: 0 0 10px; text-align: center; text-transform: uppercase; font-size: 32px; font-weight: 400; letter-spacing: -1px; line-height: 1.1; color: #000; }
h2.section-titre span { font-weight: 800; color: #f58243; }
p.section-intro { max-width: 640px; margin: 0 auto 28px; text-align: center; }
.ba-section, .galerie-section, .faq-section { padding: 60px 40px; background: #fff; }
.galerie-section { background: #f4f4f4; }

/* ---------- Avant / après ---------- */
.ba-grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 28px 24px; max-width: 1400px; margin: 0 auto; }
.ba-item { flex: 0 1 calc(33.333% - 16px); min-width: 280px; margin: 0; }
.ba {
	--pos: 50%;
	position: relative; overflow: hidden; aspect-ratio: 630 / 544;
	background: #ddd; cursor: ew-resize; touch-action: pan-y;
	-webkit-user-select: none; user-select: none;
}
.ba-img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; display: block; pointer-events: none; }
.ba-avant { position: absolute; top: 0; right: 0; bottom: 0; left: 0; clip-path: inset(0 calc(100% - var(--pos)) 0 0); }
.ba-ligne { position: absolute; top: 0; bottom: 0; left: var(--pos); width: 3px; margin-left: -1.5px; background: #fff; box-shadow: 0 0 6px rgba(0,0,0,.35); pointer-events: none; }
.ba-poignee {
	position: absolute; top: 50%; left: 50%; width: 48px; height: 48px; margin: -24px 0 0 -24px;
	border-radius: 50%; background: #f58243; box-shadow: 0 2px 10px rgba(0,0,0,.35);
	pointer-events: auto; cursor: ew-resize; transition: transform .15s;
}
.ba-poignee::before { content: "\2039\00a0\203A"; display: block; text-align: center; line-height: 46px; font-size: 22px; font-weight: 700; color: #fff; }
.ba-actif .ba-poignee, .ba-poignee:hover { transform: scale(1.08); }
.ba-poignee:focus-visible { outline: 3px solid #0b559e; outline-offset: 3px; }
.ba-tag { position: absolute; top: 12px; padding: 5px 10px; background: rgba(0,0,0,.72); color: #fff; font-size: 11px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; pointer-events: none; }
.ba-tag-avant { left: 12px; }
.ba-tag-apres { right: 12px; }
.ba-item figcaption { margin-top: 10px; text-align: center; font-size: 14px; font-weight: 700; text-transform: uppercase; letter-spacing: .3px; color: #111; }

/* ---------- Galerie à flèches ---------- */
.galerie { position: relative; max-width: 1400px; margin: 0 auto; }
.galerie-piste {
	display: flex; gap: 16px; overflow-x: auto; scroll-snap-type: x mandatory;
	scroll-behavior: smooth; scrollbar-width: none; -webkit-overflow-scrolling: touch;
}
.galerie-piste::-webkit-scrollbar { display: none; }
.galerie-item { flex: 0 0 calc((100% - 32px) / 3); scroll-snap-align: start; display: block; aspect-ratio: 63 / 61; overflow: hidden; background: #ddd; line-height: 0; }
.galerie-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s ease; }
.galerie-item:hover img { transform: scale(1.04); }
.galerie-fleche {
	position: absolute; top: 50%; z-index: 2; width: 52px; height: 52px; margin-top: -26px;
	border: 0; border-radius: 50%; background: #f58243; color: #fff;
	font-size: 36px; line-height: 48px; cursor: pointer;
	box-shadow: 0 4px 14px rgba(0,0,0,.25); transition: opacity .2s, background .2s;
}
.galerie-fleche:hover { background: #e2692a; }
.galerie-fleche:disabled { opacity: .3; pointer-events: none; box-shadow: none; }
.galerie-prev { left: -16px; }
.galerie-next { right: -16px; }

/* ---------- FAQ ---------- */
.faq-section { scroll-margin-top: 90px; }
.faq-liste { max-width: 860px; margin: 26px auto 0; border-top: 1px solid #e5e5e5; }
.faq-item { border-bottom: 1px solid #e5e5e5; }
.faq-item summary { position: relative; list-style: none; cursor: pointer; padding: 18px 44px 18px 0; font-size: 16px; font-weight: 700; color: #111; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: "+"; position: absolute; right: 6px; top: 50%; transform: translateY(-50%); font-size: 26px; font-weight: 400; color: #f58243; }
.faq-item[open] summary::after { content: "\2013"; }
.faq-item summary:hover { color: #0b559e; }
.faq-item p { margin: 0 0 18px; padding-right: 30px; }
p.faq-cta { margin: 26px 0 0; text-align: center; }
p.faq-cta a { color: #0b559e; font-weight: 700; }

/* ---------- Pied de page ---------- */
.site-footer { background: #111; }
.footer-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 40px; max-width: 1400px; margin: 0 auto; padding: 56px 60px 40px; }
.site-footer p, .site-footer li { color: #a9a9a9; font-size: 14px; line-height: 1.7; }
.site-footer p.footer-logo { margin: 0 0 10px; font-size: 26px; font-weight: 800; letter-spacing: -.5px; color: #fff; }
.site-footer p.footer-titre { margin: 0 0 12px; font-size: 13px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: #fff; }
.footer-col ul { list-style: none; margin: 0; padding: 0; }
.footer-col li { margin: 0 0 6px; }
.footer-col a { color: #e2e2e2; }
.footer-col a:hover { color: #f58243; }
.footer-col ul.footer-socials { display: flex; gap: 10px; margin-top: 16px; }
.footer-socials a { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; background: #222; color: #fff; font-size: 16px; transition: background .2s; }
.footer-socials a:hover { background: #f58243; color: #fff; }
.site-footer .footer { background: #0a0a0a; border-top: 1px solid #222; padding: 16px 20px; }

/* ---------- Tablette et téléphone ---------- */
@media only screen and (max-width: 1100px) {
	.ba-item { flex-basis: calc(50% - 12px); }
	.galerie-item { flex-basis: calc((100% - 16px) / 2); }
}
@media only screen and (max-width: 767px) {
	.ba-section, .galerie-section, .faq-section { padding: 40px 16px; }
	h2.section-titre { font-size: 24px; }
	.ba-item { flex-basis: 100%; min-width: 0; }
	.galerie-item { flex-basis: 84%; }
	.galerie-fleche { width: 42px; height: 42px; margin-top: -21px; font-size: 30px; line-height: 38px; }
	.galerie-prev { left: 6px; }
	.galerie-next { right: 6px; }
	.faq-item summary { font-size: 15px; }
	.footer-grid { grid-template-columns: 1fr; gap: 26px; padding: 40px 22px 28px; }
}

@media only screen and (max-width: 767px) {
	h1.about-title { font-size: 30px; letter-spacing: -.5px; }
	.about-element1 h2 { font-size: 22px; }
}

/* ---------- Un seul curseur avant/après : plus grand ---------- */
.ba-grid .ba-item:only-child { flex-basis: 760px; max-width: 100%; }

/* ---------- Page contact : carte « Demande de devis » ---------- */
.devis-section { padding: 60px 40px; background: #f4f4f4; }
.devis-carte { display: grid; grid-template-columns: 5fr 7fr; max-width: 1180px; margin: 0 auto; background: #fff; box-shadow: 0 18px 50px rgba(0,0,0,.08); }
.devis-infos { padding: 46px 40px; background: #0b559e; color: #fff; }
.devis-infos p { color: #dce8f5; font-size: 15px; }
h1.devis-titre { margin: 0 0 14px; font-size: 34px; font-weight: 400; line-height: 1.1; letter-spacing: -1px; text-transform: uppercase; color: #fff; }
h1.devis-titre span { display: block; font-weight: 800; color: #fff; }
.devis-coord, .devis-atouts { list-style: none; margin: 26px 0 0; padding: 0; }
.devis-coord li { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; font-size: 15px; }
.devis-coord i { flex: 0 0 auto; display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; background: rgba(255,255,255,.12); font-size: 22px; color: #fff; }
.devis-coord a, .devis-coord span { color: #fff; font-weight: 600; word-break: break-word; }
.devis-coord a:hover { color: #f9b48c; }
.devis-atouts { padding-top: 22px; border-top: 1px solid rgba(255,255,255,.2); }
.devis-atouts li { position: relative; padding-left: 26px; margin-bottom: 8px; font-size: 14px; color: #fff; }
.devis-atouts li::before { content: "\2713"; position: absolute; left: 0; top: 0; font-weight: 700; color: #f58243; }

.devis-form { padding: 42px 40px 34px; }
.champ-ligne { display: grid; grid-template-columns: 1fr 1fr; gap: 0 18px; }
.devis-form .champ { display: block; margin-bottom: 18px; }
.devis-form .champ > span { display: block; margin-bottom: 6px; font-size: 13px; font-weight: 700; letter-spacing: .2px; color: #222; }
.devis-form input, .devis-form select, .devis-form textarea {
	display: block; width: 100%; box-sizing: border-box;
	padding: 13px 14px; border: 1px solid #d6d6d6; border-radius: 0; background: #fafafa;
	font-family: 'Open Sans', sans-serif; font-size: 15px; font-style: normal; color: #111;
	transition: border-color .2s, box-shadow .2s, background .2s;
	-webkit-appearance: none; appearance: none;
}
.devis-form select {
	padding-right: 40px; cursor: pointer;
	background: #fafafa url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23f58243' stroke-width='2'/%3E%3C/svg%3E") no-repeat right 14px center;
}
.devis-form textarea { min-height: 130px; resize: vertical; }
.devis-form input:focus, .devis-form select:focus, .devis-form textarea:focus { outline: 0; background: #fff; border-color: #f58243; box-shadow: 0 0 0 3px rgba(245,130,67,.18); }
.devis-form ::placeholder { color: #999; font-style: normal; }
.champ-piege { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.devis-envoi { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin-top: 4px; }
.devis-form #submit_contact { padding: 16px 28px; border: 0; cursor: pointer; font-size: 14px; }
.devis-form #submit_contact:disabled { opacity: .6; cursor: wait; }
.devis-form .output_message { font-size: 14px; font-weight: 600; color: #555; }
.devis-form .output_message.ok { color: #2e7d32; }
.devis-form .output_message.erreur { color: #c62828; }
p.devis-rgpd { margin: 16px 0 0; font-size: 12.5px; color: #888; }

/* ---------- Bandeau cookies ---------- */
.cookies-bandeau {
	position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 1000;
	display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px;
	max-width: 760px; margin: 0 auto; padding: 16px 20px;
	background: #111; color: #fff; box-shadow: 0 10px 30px rgba(0,0,0,.3);
}
.cookies-bandeau p { flex: 1 1 320px; margin: 0; font-size: 14px; line-height: 1.5; color: #ddd; }
.cookies-boutons { display: flex; gap: 10px; }
.cookies-non { padding: 12px 18px; border: 1px solid #555; background: none; color: #fff; font-weight: 700; font-size: 13px; text-transform: uppercase; cursor: pointer; }
.cookies-non:hover { border-color: #fff; }
.cookies-bandeau .btn { padding: 12px 18px; border: 0; cursor: pointer; }
.site-footer .footer a.cookies-gerer { color: #aaa; text-decoration: underline; }

@media only screen and (max-width: 959px) {
	.devis-carte { grid-template-columns: 1fr; }
	.devis-form { order: -1; }
}
@media only screen and (max-width: 767px) {
	.devis-section { padding: 0; background: #fff; }
	.devis-carte { box-shadow: none; }
	.devis-form { padding: 28px 18px 26px; }
	.devis-infos { padding: 30px 20px; }
	h1.devis-titre { font-size: 26px; }
	.champ-ligne { grid-template-columns: 1fr; }
	.devis-form #submit_contact { width: 100%; justify-content: center; }
}

.devis-form #submit_contact { background: #f58243; color: #fff; }
.devis-form #submit_contact:hover { background: #e2692a !important; }

/* ---------- Accueil : colonne « Nos services » + devis (remplace les cases bleue et noire) ---------- */
.home-wrapper .home-element6 { height: 780px; }
.home-atouts { display: flex; flex-direction: column; justify-content: center; height: auto; padding: 50px 60px; background: #fff; }
.home-atouts > * { max-width: 600px; }
p.atouts-surtitre { margin: 0 0 6px; font-size: 12px; font-weight: 700; letter-spacing: 3px; text-transform: uppercase; color: #f58243; }
h2.atouts-titre { margin: 0 0 26px; font-size: 32px; font-weight: 400; line-height: 1.1; letter-spacing: -1px; text-transform: uppercase; color: #000; }
h2.atouts-titre span { display: block; font-weight: 800; color: #f58243; }
.atouts-liste { list-style: none; counter-reset: atout; margin: 0 0 28px; padding: 0; }
.atouts-liste li { position: relative; counter-increment: atout; padding: 14px 0 14px 54px; border-top: 1px solid #e8e8e8; }
.atouts-liste li:last-child { border-bottom: 1px solid #e8e8e8; }
.atouts-liste li::before { content: counter(atout, decimal-leading-zero); position: absolute; left: 0; top: 13px; font-size: 22px; font-weight: 800; color: #f58243; }
.atouts-liste strong { display: block; margin-bottom: 2px; font-size: 15px; text-transform: uppercase; letter-spacing: .3px; color: #111; }
.atouts-liste span { display: block; font-size: 14.5px; line-height: 1.6; color: #555; }
.atouts-devis { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 20px; padding: 20px 22px; background: #f4f4f4; border-left: 4px solid #0b559e; }
.atouts-devis p { flex: 1 1 240px; margin: 0; font-size: 14px; line-height: 1.55; color: #555; }
.atouts-devis p strong { display: block; font-size: 16px; color: #0b559e; }
.atouts-devis .btn { flex: 0 0 auto; }

@media only screen and (max-width: 1280px) and (min-width: 960px) {
	.home-wrapper .home-element6 { height: 760px; }
	.home-atouts { padding: 40px 36px; }
}
@media only screen and (max-width: 959px) {
	.home-wrapper .home-element6 { height: auto; }
	.home-atouts { width: 100%; padding: 40px 24px; }
}
@media only screen and (max-width: 767px) {
	.home-services > .home-atouts { order: 4; padding: 32px 18px; }
	h2.atouts-titre { font-size: 24px; margin-bottom: 18px; }
	.atouts-liste li { padding-left: 44px; }
	.atouts-liste li::before { font-size: 18px; }
	.atouts-devis { padding: 18px; }
	.atouts-devis .btn { width: 100%; justify-content: center; }
}

/* Pleine largeur : neutralise les marges négatives héritées du thème (débordement horizontal) */
#container .vc_row.wpb_row { margin-left: 0; margin-right: 0; }
html { overflow-x: clip; }
#container .vc_column_container, #container .vc_column_container > .vc_column-inner { padding-left: 0; padding-right: 0; }

/* ---------- Toiture : colonne d'introduction compacte ---------- */
.about-element1 p.toit-surtitre { margin: 0 0 6px; font-size: 12px; font-weight: 700; letter-spacing: 3px; text-transform: uppercase; color: #f58243; }
h1.about-title.toit-titre { margin-bottom: 16px; font-size: 40px; font-weight: 400; letter-spacing: -1px; }
h1.about-title.toit-titre span { display: block; font-weight: 800; color: #f58243; }
.about-element1 p.toit-intro { margin: 0 0 18px; font-size: 16px; line-height: 1.7; color: #444; }
.toit-badges { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0 0 26px; padding: 0; }
.toit-badges li { padding: 7px 14px 7px 30px; position: relative; background: #fff; border: 1px solid #ddd; font-size: 13px; font-weight: 700; color: #111; }
.toit-badges li::before { content: "\2713"; position: absolute; left: 12px; top: 7px; color: #f58243; font-weight: 700; }
.atouts-liste.toit-services { margin-bottom: 26px; }
.atouts-liste.toit-services li { border-color: #d9d9d9; }
.toit-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 20px; }
.toit-tel { font-size: 14px; color: #555; }
.toit-tel strong { color: #111; white-space: nowrap; }
.toit-tel:hover strong { color: #0b559e; }
.about-wrapper .about-element1:has(.toit-titre) { display: flex; flex-direction: column; justify-content: center; }
@media only screen and (max-width: 767px) {
	h1.about-title.toit-titre { font-size: 28px; }
	.about-element1 p.toit-intro { font-size: 15px; }
	.toit-actions .btn { width: 100%; justify-content: center; }
}

/* ---------- Colonnes de texte compactes (Murs, Façade, Toiture) ---------- */
.about-wrapper .about-element1.bloc-texte { display: flex; flex-direction: column; justify-content: center; }
.about-element1 h2.bloc-titre { margin: 0 0 16px; font-size: 30px; font-weight: 400; line-height: 1.1; letter-spacing: -1px; text-transform: uppercase; color: #000; }
.about-element1 h2.bloc-titre span { display: block; font-weight: 800; color: #f58243; }
.about-element1 h1.bloc-titre span { display: block; font-weight: 800; color: #f58243; }
.atouts-liste.bloc-liste { margin-bottom: 24px; }
.atouts-liste.bloc-liste li { border-color: #d9d9d9; }
.about-element1.bloc-texte .atouts-devis { background: #fff; }
.about-wrapper:not([style]) .about-element1.bloc-texte .atouts-devis { background: #f4f4f4; }
@media only screen and (max-width: 767px) {
	.about-element1 h2.bloc-titre { font-size: 24px; }
	.about-element1.bloc-texte .atouts-devis .btn { width: 100%; justify-content: center; }
}

/* Murs : schéma des 4 étapes plus compact et centré */
.about-wrapper .about-element2.img-entiere { display: flex; align-items: center; justify-content: center; padding: 30px; background: #fff; }
.about-wrapper .about-element2.img-entiere > img { float: none; width: 100%; max-width: 520px; height: auto; }
@media only screen and (max-width: 959px) { .about-wrapper .about-element2.img-entiere { padding: 20px 16px; } }

/* Téléphone : photos des rangées moins hautes, surtitres sur une ligne */
@media only screen and (max-width: 767px) {
	.about-wrapper .about-element2:not(.img-entiere):not(.toit3d-col):not(.img-complete) > img { height: 240px; object-fit: cover; }
	.about-element1 p.toit-surtitre, p.atouts-surtitre { letter-spacing: 1.5px; }
}

/* Façade : photos affichées en entier (pas de recadrage) */
.about-wrapper .about-element2.img-complete { min-height: 0; line-height: 0; }
.about-wrapper .about-element2.img-complete > img { position: static; display: block; float: none; width: 100%; height: auto; object-fit: contain; }
@media only screen and (max-width: 767px) { .about-wrapper .about-element2.img-complete > img { height: auto; } }
.about-wrapper .about-element2.photo-haut { min-height: 300px; }
.about-wrapper .about-element2.photo-haut > img { object-position: center top; }

/* ---------- Avis Google ---------- */
.avis-section { padding: 60px 40px; background: #fff; text-align: center; }
.etoiles { display: inline-flex; align-items: center; gap: 2px; line-height: 1; vertical-align: middle; }
.etoiles svg { display: block; max-width: 24px; max-height: 24px; }
.avis-note { display: inline-flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px; margin: 6px 0 28px; }
.avis-note-chiffre { font-size: 34px; font-weight: 800; color: #111; line-height: 1; }
.avis-note-total { font-size: 14px; color: #666; }
.avis-grille { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; max-width: 1200px; margin: 0 auto 26px; text-align: left; }
.avis-carte { margin: 0; padding: 22px 22px 20px; background: #f7f7f7; border-top: 3px solid #fbbc04; }
.avis-entete { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.avis-initiale { display: flex; align-items: center; justify-content: center; flex: 0 0 40px; width: 40px; height: 40px; border-radius: 50%; background: #0b559e; color: #fff; font-weight: 700; font-size: 17px; }
.avis-nom { font-weight: 700; font-size: 15px; color: #111; margin-bottom: 2px; }
.avis-date { display: block; margin-top: 3px; font-size: 12px; color: #888; }
blockquote.avis-texte { margin: 0; padding: 0; border: 0; font-size: 14.5px; line-height: 1.65; color: #444; font-style: normal; }
blockquote.avis-texte::before, blockquote.avis-texte::after { content: none; }
p.avis-lien { margin: 0; }
@media only screen and (max-width: 959px) {
	.avis-grille { grid-template-columns: 1fr; max-width: 640px; }
}
@media only screen and (max-width: 767px) {
	.avis-section { padding: 40px 16px; }
	p.avis-lien .btn { width: 100%; justify-content: center; }
}

/* ---------- Réseaux sociaux dans l'en-tête ---------- */
.header-reseau { display: flex; align-items: center; justify-content: center; width: 34px; height: 34px; color: #555; border: 1px solid #e3e3e3; transition: color .2s, border-color .2s; }
.header-reseau:hover { color: #fff; background: #f58243; border-color: #f58243; }
.header-reseau svg { width: 18px; height: 18px; display: block; }
.footer-socials a svg { width: 18px; height: 18px; display: block; }
@media only screen and (max-width: 1180px) and (min-width: 960px) { .header-reseau { display: none; } }
@media only screen and (max-width: 959px) { .header-reseau { width: 42px; height: 42px; border-width: 2px; border-color: #ececec; } }
@media only screen and (max-width: 480px) { .header-reseau { display: none; } }

/* ---------- Accueil : sections bien séparées ---------- */
.home-intro { display: block; padding: 64px 40px 60px; background: #f4f4f4; text-align: center; }
.home-intro > .pego-columns { float: none; width: 100% !important; height: auto; min-height: 0; }
.home-intro .home-element2 { display: block; max-width: 880px; margin: 0 auto; padding: 0 !important; background: none; }
.home-intro .home-element2 > * { max-width: none; }
.home-wrapper .home-intro h1.page-heading { position: relative; padding-bottom: 18px; margin-bottom: 20px; }
.home-wrapper .home-intro h1.page-heading::after { content: ""; position: absolute; left: 50%; bottom: 0; width: 60px; height: 3px; margin-left: -30px; background: #f58243; }
.home-wrapper .home-intro p.page-summary { font-size: 16px; line-height: 1.8; color: #555; }

.rc3d-section { padding: 64px 40px 40px; border-top: 0; }
.home-services { border-top: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; }
.galerie-section, .avis-section, .faq-section { padding-top: 64px; padding-bottom: 64px; }
.avis-section { border-bottom: 1px solid #e6e6e6; }
h2.section-titre, h2.rc3d-titre { position: relative; padding-bottom: 16px; margin-bottom: 18px; }
h2.section-titre::after, h2.rc3d-titre::after { content: ""; position: absolute; left: 50%; bottom: 0; width: 50px; height: 3px; margin-left: -25px; background: #f58243; }
p.rc3d-intro { margin-bottom: 26px; }

/* ---------- Carrousel : cadrage des photos sur le sujet ---------- */
.prest-box img.portfolio-image.img-toiture { object-position: center 18%; }
.prest-box img.portfolio-image.img-facade { object-position: center 12%; }
.prest-box img.portfolio-image.img-murs { object-position: center 40%; }

@media only screen and (max-width: 767px) {
	.home-intro { padding: 36px 20px 34px; }
	.rc3d-section { padding: 36px 12px 16px; }
	.galerie-section, .avis-section, .faq-section { padding-top: 40px; padding-bottom: 40px; }
}

/* ---------- Murs : photo de tête cadrée sur la tache d'humidité ---------- */
.about-wrapper .about-element2.photo-mur > img { object-position: 35% 55%; }

/* ---------- Types d'humidité ---------- */
.types-section { padding: 64px 40px; background: #f4f4f4; border-top: 1px solid #e6e6e6; }
.types-grille { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; max-width: 1200px; margin: 0 auto; }
.type-carte { position: relative; padding: 28px 26px 24px; background: #fff; border-top: 3px solid #0b559e; }
.type-num { display: block; margin-bottom: 8px; font-size: 22px; font-weight: 800; color: #f58243; }
.type-carte h3 { margin: 0 0 10px; font-size: 17px; font-weight: 700; text-transform: uppercase; color: #111; }
.type-carte p { margin: 0 0 12px; font-size: 14.5px; line-height: 1.65; color: #555; }
.type-carte p.type-solution { margin: 0; padding-top: 12px; border-top: 1px solid #eee; color: #333; }
.type-carte p.type-solution strong { color: #0b559e; }

/* ---------- Avant / après au format portrait ---------- */
.ba-item.ba-portrait { flex: 0 1 380px; min-width: 260px; }
.ba-portrait .ba { aspect-ratio: 3 / 4; }

@media only screen and (max-width: 959px) {
	.types-grille { grid-template-columns: 1fr; max-width: 640px; }
}
@media only screen and (max-width: 767px) {
	.types-section { padding: 40px 16px; }
	.ba-item.ba-portrait { flex-basis: 100%; }
}

/* ---------- Toiture sur téléphone : la présentation avant la maquette 3D ---------- */
@media only screen and (max-width: 959px) {
	.about-wrapper .about-element2.toit3d-col { order: 0; }
}

/* Bannière de page (même style que l accueil) */
.hero.hero-page { min-height: 480px; background-position: 30% 60%; }
.hero-badges { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: -12px 0 26px; padding: 0; }
.hero-badges li { position: relative; padding: 7px 14px 7px 30px; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.35); color: #fff; font-size: 13px; font-weight: 700; }
.hero-badges li::before { content: "\2713"; position: absolute; left: 12px; top: 7px; color: #f58243; }
@media only screen and (max-width: 767px) { .hero.hero-page { min-height: 0; } .hero-badges { margin-top: -6px; } }
.photo-fixe .ba { cursor: default; }

/* Bannière avec photo de petite taille : photo nette à droite, fond flou de la même photo */
.hero.hero-photo-droite { overflow: hidden; background: #2b2b2b; }
.hero-photo-droite .hero-flou { position: absolute; top: -40px; right: -40px; bottom: -40px; left: -40px; background-size: cover; background-position: center; filter: blur(22px) brightness(.55); transform: scale(1.05); }
.hero-photo-droite::before { z-index: 1; }
.hero-photo-droite .hero-photo { position: absolute; top: 0; right: 0; z-index: 1; height: 100%; width: auto; max-width: 55%; object-fit: cover; object-position: 30% 60%;
	-webkit-mask-image: linear-gradient(90deg, transparent 0, #000 22%); mask-image: linear-gradient(90deg, transparent 0, #000 22%); }
.hero-photo-droite .hero-inner { z-index: 2; }
@media only screen and (max-width: 767px) {
	.hero.hero-photo-droite { display: flex; flex-direction: column; }
	.hero-photo-droite .hero-photo { position: relative; order: -1; width: 100%; max-width: none; height: 240px; -webkit-mask-image: none; mask-image: none; }
	.hero-photo-droite .hero-inner { padding-top: 30px; }
}

/* ---------- Bandeaux de marques ---------- */
.marques { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px 34px; padding: 18px 30px; background: #fff; border-top: 1px solid #e6e6e6; border-bottom: 1px solid #e6e6e6; }
p.marques-titre { margin: 0; font-size: 12px; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; color: #888; }
.marques-liste { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px 40px; list-style: none; margin: 0; padding: 0; }
.marques-liste li { font-size: 22px; font-weight: 800; letter-spacing: 2px; color: #4a4a4a; line-height: 1; }
@media only screen and (max-width: 767px) {
	.marques { padding: 14px 16px; gap: 8px 20px; }
	p.marques-titre { width: 100%; text-align: center; font-size: 11px; letter-spacing: 1px; }
	.marques-liste li { font-size: 18px; }
}
.marques { padding: 22px 30px; }
.marques-liste { gap: 16px 56px; }
.marques-liste li { line-height: 0; }
.marques-liste img { display: block; height: 48px; width: auto; max-width: 200px; object-fit: contain; }
@media only screen and (max-width: 767px) { .marques-liste { gap: 14px 34px; } .marques-liste img { height: 38px; max-width: 150px; } }
.ba-portrait .ba { aspect-ratio: 884 / 1120; }

/* Bannière Murs sur téléphone : la photo en fond, le texte par-dessus, compact */
@media only screen and (max-width: 767px) {
	.hero.hero-photo-droite { display: flex; flex-direction: column; min-height: 0; }
	.hero-photo-droite .hero-photo { display: none; }
	.hero-photo-droite .hero-flou { top: 0; right: 0; bottom: 0; left: 0; filter: brightness(.5); transform: none; background-position: 30% 60%; }
	.hero-photo-droite .hero-inner { padding: 34px 20px 30px; }
	.hero-photo-droite .hero-title { font-size: 28px; }
	.hero-photo-droite .hero-text { font-size: 16px; margin-bottom: 18px; }
	.hero-photo-droite .hero-badges, .hero-photo-droite .hero-actions .btn-ghost { display: none; }
}
@media only screen and (max-width: 767px) {
	.hero-photo-droite .hero-flou { filter: none; }
	.hero-photo-droite::before { background: linear-gradient(180deg, rgba(0,0,0,.35) 0%, rgba(0,0,0,.6) 100%); }
	.marques-liste img { height: 32px; max-width: 120px; }
	.marques-liste { gap: 14px 26px; }
}

/* ---------- Toiture : maquette 3D au centre, services dessous ---------- */
.toit3d-section { padding: 60px 40px 50px; background: #f4f4f4; }
.toit3d-cadre { max-width: 980px; margin: 0 auto; background: #fff; }
.toit3d-services { max-width: 980px; margin: 30px auto 0; }
.toit3d-services .atouts-liste { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 26px; margin: 0; }
.toit3d-services .atouts-liste li, .toit3d-services .atouts-liste li:last-child { border-top: 3px solid #f58243; border-bottom: 0; padding: 16px 0 0 44px; }
@media only screen and (max-width: 959px) { .toit3d-services .atouts-liste { grid-template-columns: 1fr; } .toit3d-services .atouts-liste li { border-top-width: 1px; } }
@media only screen and (max-width: 767px) { .toit3d-section { padding: 36px 12px 30px; } }

/* ---------- Façade : curseur portrait 3:4 ---------- */
.ba-portrait .ba.ba-34 { aspect-ratio: 3 / 4; }

/* ---------- Bannières de pages sur téléphone : compactes ---------- */
@media only screen and (max-width: 767px) {
	.hero.hero-page .hero-badges, .hero.hero-page .hero-actions .btn-ghost { display: none; }
	.hero.hero-page .hero-title { font-size: 28px; }
	.hero.hero-page .hero-text { font-size: 16px; margin-bottom: 18px; }
	.hero.hero-page .hero-inner { padding: 34px 20px 30px; }
}

/* ---------- Bandeaux de marques : couleur + défilement au doigt sur téléphone ---------- */
.marques { background: #0b559e; border: 0; }
.marques-liste li { display: flex; align-items: center; justify-content: center; padding: 10px 16px; background: #fff; border-radius: 4px; }
.marques-liste { gap: 14px 18px; }
@media only screen and (max-width: 767px) {
	.marques { padding: 14px 0; }
	.marques-liste { flex-wrap: nowrap; justify-content: flex-start; overflow-x: auto; scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch; scrollbar-width: none; padding: 0 16px; width: 100%; gap: 12px; }
	.marques-liste::-webkit-scrollbar { display: none; }
	.marques-liste li { flex: 0 0 auto; scroll-snap-align: start; padding: 8px 12px; }
	.marques-liste img { height: 30px; max-width: 120px; }
}
.ba-grid { align-items: flex-start; }

/* ---------- Barre d'action fixe sur téléphone ---------- */
.barre-mobile { display: none; }
@media only screen and (max-width: 767px) {
	.barre-mobile { position: fixed; left: 0; right: 0; bottom: 0; z-index: 900; display: grid; grid-template-columns: 1fr 1fr; box-shadow: 0 -4px 16px rgba(0,0,0,.15); padding-bottom: env(safe-area-inset-bottom); background: #fff; }
	.barre-mobile a { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 15px 10px; font-size: 14px; font-weight: 700; text-transform: uppercase; letter-spacing: .3px; }
	.barre-mobile i { font-size: 22px; }
	.barre-appel { background: #fff; color: #0b559e; }
	.barre-devis { background: #f58243; color: #fff; }
	body { padding-bottom: 56px; }
	.cookies-bandeau { bottom: 70px; }
}
.galerie-item img[src*="upload/humidite/"] { object-fit: cover; }
.galerie-section .galerie-item:has(img[src*="upload/humidite/"]) { aspect-ratio: 3 / 4; }
@media only screen and (min-width: 960px) { .galerie-piste:has(img[src*="upload/humidite/"]) .galerie-item { flex-basis: calc((100% - 48px) / 4); } .galerie:has(img[src*="upload/humidite/"]) .galerie-fleche { display: none; } }

/* Espace entre la bannière d'une page et la première photo */
.hero.hero-page + .about-wrapper { margin-top: 50px; }
@media only screen and (max-width: 959px) {
	.hero.hero-page + .about-wrapper { margin-top: 0; }
	.hero.hero-page + .about-wrapper > .about-element1 { order: -1; }
}

/* Réseaux sociaux visibles sur téléphone (en-tête compact + menu) */
@media only screen and (max-width: 480px) {
	.header-reseau { display: flex; width: 34px; height: 34px; border-width: 1px; }
	.header-tel { width: 34px; height: 34px; }
	.header-actions { gap: 6px; }
	#header-wrapper .logo img { max-width: 128px !important; }
	#header-wrapper .mobile-menu-show { font-size: 32px; }
}
.menu-reseaux { display: flex; gap: 10px; padding: 14px 20px 18px; border-top: 1px solid #e6e6e6; }
.menu-reseaux a { display: flex; align-items: center; gap: 8px; padding: 10px 14px; border: 1px solid #e3e3e3; font-weight: 700; font-size: 14px; color: #111; }
.menu-reseaux svg { width: 18px; height: 18px; }

/* Carrousel des prestations : « En savoir + » posé sur la photo, semi-transparent */
.prest-box div.item { position: relative; }
.prest-box a.portfolio-read-more {
	position: absolute !important; left: 50%; bottom: 24px; top: auto; z-index: 5;
	margin: 0 !important; transform: translateX(-50%);
	background: rgba(0,0,0,.45) !important; border: 1px solid rgba(255,255,255,.7);
	color: #fff; opacity: .75; backdrop-filter: blur(2px);
	transition: opacity .2s, background .2s;
}
.prest-box a.portfolio-read-more:hover, .prest-box a.portfolio-read-more:focus, .prest-box a.portfolio-read-more:active { opacity: 1; background: #f58243 !important; border-color: #f58243; }
.prest-box p.portfolio-summary { margin-bottom: 14px; }
.nettoyage-toiture { background: #f4f4f4; border-top: 1px solid #e6e6e6; }
.ba-item.ba-paysage { flex: 0 1 520px; min-width: 260px; }
@media only screen and (max-width: 767px) { .ba-item.ba-paysage { flex-basis: 100%; } }

/* Bandeaux de marques : logos plus compacts sur ordinateur */
@media only screen and (min-width: 768px) {
	.marques { padding: 16px 30px; }
	.marques-liste { gap: 10px 12px; max-width: 1300px; }
	.marques-liste li { padding: 8px 12px; }
	.marques-liste img { height: 34px; max-width: 130px; }
}

/* Bandeau de marques défilant (accueil) : une seule ligne, sur ordinateur et téléphone */
.marques-defile { padding: 16px 0; }
.marques-defile .marques-liste {
	flex-wrap: nowrap; justify-content: flex-start; width: 100%; max-width: none;
	overflow-x: auto; scroll-snap-type: none; scrollbar-width: none; -webkit-overflow-scrolling: touch;
	padding: 0; gap: 12px; cursor: grab; -webkit-user-select: none; user-select: none;
}
.marques-defile .marques-liste::-webkit-scrollbar { display: none; }
.marques-defile .marques-liste.saisi { cursor: grabbing; }
.marques-defile .marques-liste li { flex: 0 0 auto; }
.marques-defile .marques-liste img { pointer-events: none; -webkit-user-drag: none; }

/* Bandeaux : centrés quand tous les logos tiennent, glissables sinon (sans couper le premier logo) */
.marques-defile .marques-liste li:first-child { margin-left: auto; }
.marques-defile .marques-liste li:last-child { margin-right: auto; }
.marques-defile .marques-liste { padding: 0 16px; cursor: auto; }
.marques-defile .marques-liste.saisi { cursor: grabbing; }
@media (hover: hover) { .marques-defile .marques-liste { cursor: grab; } }
.avis-note { gap: 12px; }

/* Anciens iPhone (iOS < 16) : « overflow-x: clip » n'existe pas, on garde « hidden » en secours */
html { overflow-x: hidden; }
@supports (overflow-x: clip) { html { overflow-x: clip; } }

/* ===== Retouches graphiques ===== */
/* 1. Titres sur plusieurs lignes : interligne confortable (plus de chevauchement) */
.home-wrapper h1.page-heading, .home-wrapper h1.page-heading span { line-height: 1.15; }
.home-wrapper .home-intro h1.page-heading span { display: block; margin-top: 4px; }
h2.section-titre, h2.rc3d-titre, h2.atouts-titre, h1.about-title, .about-element1 h2.bloc-titre, h2.portfolio-title { line-height: 1.15; }
.home-wrapper .home-intro p.page-summary { max-width: 680px; margin-left: auto; margin-right: auto; }

/* 5. Consigne du carrousel : seulement sur écran tactile */
.prest-hint { display: none; }
@media (hover: none) { .prest-hint { display: block; } }

/* 6. Flèches du carrousel : ronds orange comme les galeries */
.prest-arrow { width: 48px; height: 48px; margin-top: -24px; border-radius: 50%; background: rgba(245,130,67,.92); font-size: 32px; line-height: 44px; box-shadow: 0 4px 14px rgba(0,0,0,.25); }
.prest-arrow:hover, .prest-arrow:focus { background: #e2692a; }
.prest-prev { left: 14px; }
.prest-next { right: 14px; }

/* 7. Bannière d'accueil plus lumineuse (texte toujours lisible) */
.hero:not(.hero-page)::before { background: linear-gradient(90deg, rgba(0,0,0,.62) 0%, rgba(0,0,0,.32) 45%, rgba(0,0,0,0) 80%); }
.hero:not(.hero-page) .hero-title, .hero:not(.hero-page) .hero-text { text-shadow: 0 2px 12px rgba(0,0,0,.45); }
@media only screen and (max-width: 767px) {
	.hero:not(.hero-page)::before { background: linear-gradient(180deg, rgba(0,0,0,.42) 0%, rgba(0,0,0,.62) 100%); }
}

/* 8. Maquette 3D de l'accueil plus large sur ordinateur */
.rc3d-section { padding-left: 24px; padding-right: 24px; }

/* 9. Villes desservies : plus discret */
.prest-box .prest-zone { font-size: 11.5px; line-height: 1.5; padding: 9px 18px; color: #666; }
.prest-box .prest-zone strong { font-size: 10.5px; }

/* Carrousel : même hauteur de photo pour les 3 prestations (le texte réserve toujours 2 lignes) */
.prest-box img.portfolio-image.img-murs { object-position: center 70%; }
/* Les 3 photos ont exactement la même hauteur et sont alignées en bas, quelle que soit la longueur du texte */
.prest-box img.portfolio-image { flex: 0 0 auto !important; margin-top: auto; height: 470px !important; min-height: 0; }
@media only screen and (max-width: 1280px) { .prest-box img.portfolio-image { height: 410px !important; } }
@media only screen and (max-width: 959px) { .prest-box img.portfolio-image { height: 340px !important; } }
@media only screen and (max-width: 767px) { .prest-box img.portfolio-image { height: 240px !important; } }

/* ---------- Mentions légales ---------- */
.legal-section { padding: 60px 40px 70px; background: #fff; }
.legal-texte { max-width: 820px; margin: 30px auto 0; }
.legal-texte h2 { margin: 30px 0 8px; font-size: 18px; font-weight: 700; text-transform: uppercase; letter-spacing: .3px; color: #111; }
.legal-texte h2:first-child { margin-top: 0; }
.legal-texte p { margin: 0 0 10px; font-size: 15px; line-height: 1.75; color: #444; }
.legal-texte a { color: #0b559e; font-weight: 600; }
@media only screen and (max-width: 767px) { .legal-section { padding: 40px 18px 50px; } }

/* ---------- Bloc de contact (bas de page) ---------- */
.contact-bloc { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); background: #f4f4f4; border-top: 1px solid #e6e6e6; }
.contact-bloc-texte { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 18px; padding: 56px 60px; }
p.contact-bloc-titre { margin: 0; font-size: 32px; font-weight: 400; line-height: 1.15; letter-spacing: -1px; text-transform: uppercase; color: #000; }
p.contact-bloc-titre span { display: block; font-weight: 800; color: #f58243; }
p.contact-bloc-intro { margin: 0; font-size: 16px; color: #555; }
.contact-bloc-liens { display: flex; flex-wrap: wrap; gap: 12px; }
.contact-lien { display: flex; align-items: center; gap: 12px; padding: 12px 18px 12px 12px; background: #fff; border: 1px solid #e3e3e3; color: #111; transition: border-color .2s, box-shadow .2s; }
.contact-lien:hover { border-color: #f58243; box-shadow: 0 4px 14px rgba(0,0,0,.08); color: #111; }
.contact-lien i { display: flex; align-items: center; justify-content: center; width: 42px; height: 42px; background: #0b559e; color: #fff; font-size: 22px; }
.contact-lien-tel i { background: #f58243; }
.contact-lien span { display: flex; flex-direction: column; font-size: 16px; font-weight: 700; line-height: 1.25; word-break: break-word; }
.contact-lien small { font-size: 11px; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; color: #888; }
.contact-lien-tel span { font-size: 20px; white-space: nowrap; }
.contact-bloc-carte { min-height: 380px; }
.contact-bloc-carte iframe { display: block; width: 100%; height: 100%; min-height: 380px; border: 0; }
@media only screen and (max-width: 959px) {
	.contact-bloc { grid-template-columns: 1fr; }
	.contact-bloc-texte { padding: 40px 24px; }
	.contact-bloc-carte, .contact-bloc-carte iframe { min-height: 260px; }
}
@media only screen and (max-width: 767px) {
	.contact-bloc-texte { align-items: stretch; padding: 34px 18px; }
	p.contact-bloc-titre { font-size: 24px; }
	.contact-bloc-liens { flex-direction: column; }
	.contact-bloc-texte .btn { justify-content: center; }
}
.legal-section h1.section-titre { display: block; position: relative; margin: 0 auto 10px; padding-bottom: 16px; text-align: center; font-size: 32px; font-weight: 400; letter-spacing: -1px; line-height: 1.15; text-transform: uppercase; color: #000; }
.legal-section h1.section-titre span { font-weight: 800; color: #f58243; }
.legal-section h1.section-titre::after { content: ""; position: absolute; left: 50%; bottom: 0; width: 50px; height: 3px; margin-left: -25px; background: #f58243; }
@media only screen and (max-width: 767px) { .legal-section h1.section-titre { font-size: 24px; } }

/* ===== Ordinateur : moins de vide blanc ===== */
@media only screen and (min-width: 960px) {
	/* sections : marges verticales resserrées */
	.ba-section, .galerie-section, .faq-section, .avis-section, .types-section, .chantier-section, .legal-section, .toit3d-section { padding-top: 46px; padding-bottom: 46px; }
	.rc3d-section { padding-top: 46px; padding-bottom: 24px; }
	.home-intro { padding-top: 46px; padding-bottom: 42px; }
	h2.section-titre, h2.rc3d-titre { margin-bottom: 14px; }
	p.section-intro, p.rc3d-intro { margin-bottom: 22px; }

	/* rangées texte + photo : la photo prend moins de largeur, la rangée est moins haute (photo toujours entière) */
	.about-wrapper > .about-element2 { width: 42% !important; }
	.about-wrapper > .about-element1 { width: 58% !important; padding: 44px 56px; }
	.about-wrapper .about-element2.img-entiere { padding: 24px; }

	/* curseurs avant/après de tailles différentes : centrés verticalement entre eux */
	.ba-grid { align-items: center; }

	/* maquettes 3D : plus larges */
	.toit3d-cadre { max-width: 1180px; }
	.toit3d-services { max-width: 1180px; }
}

/* ---------- Bande « Belles fêtes » (1er déc. – 6 janv.) ---------- */
.bande-fetes { position: relative; display: flex; align-items: center; justify-content: center; padding: 9px 46px; background: #0b559e; color: #fff; text-align: center; }
.bande-fetes p { margin: 0; font-size: 14px; line-height: 1.45; color: #fff; }
.bande-fetes p::before { content: "\2744"; margin-right: 8px; color: #f58243; }
.bande-fetes-titre { font-weight: 700; }
.bande-fetes-info { color: #dce8f5; }
.bande-fetes a { color: #fff; font-weight: 700; white-space: nowrap; text-decoration: underline; text-underline-offset: 2px; }
.bande-fetes-fermer { position: absolute; right: 10px; top: 50%; width: 30px; height: 30px; margin-top: -15px; padding: 0; border: 0; background: none; color: #fff; font-size: 22px; line-height: 30px; cursor: pointer; opacity: .8; }
.bande-fetes-fermer:hover { opacity: 1; }
@media only screen and (max-width: 767px) {
	.bande-fetes { padding: 8px 40px 8px 14px; }
	.bande-fetes p { font-size: 12.5px; }
	.bande-fetes-sep { display: none; }
	.bande-fetes-info { display: block; }
}
.bande-fetes .bande-fetes-titre { color: #fff !important; }
.bande-fetes .bande-fetes-info { color: #dce8f5 !important; }

/* Bande des fêtes : version raffinée (bleu nuit, liseré orange, flocons très discrets) */
.bande-fetes {
	gap: 18px; padding: 10px 52px;
	background:
		radial-gradient(circle at 6% 30%, rgba(255,255,255,.10) 0 1.5px, transparent 2px),
		radial-gradient(circle at 11% 70%, rgba(255,255,255,.08) 0 1px, transparent 1.5px),
		radial-gradient(circle at 17% 40%, rgba(255,255,255,.07) 0 2px, transparent 2.5px),
		radial-gradient(circle at 84% 35%, rgba(255,255,255,.08) 0 1.5px, transparent 2px),
		radial-gradient(circle at 90% 70%, rgba(255,255,255,.10) 0 1px, transparent 1.5px),
		radial-gradient(circle at 95% 30%, rgba(255,255,255,.07) 0 2px, transparent 2.5px),
		linear-gradient(90deg, #072f5c 0%, #0b4a8a 50%, #072f5c 100%);
	box-shadow: inset 0 -2px 0 #f58243;
}
.bande-fetes p::before { color: #f9b48c; }
.bande-fetes .bande-fetes-titre { letter-spacing: .2px; }
.bande-fetes-btn {
	flex: 0 0 auto; padding: 6px 14px; border: 1px solid rgba(255,255,255,.55);
	color: #fff !important; font-size: 12px; font-weight: 700; letter-spacing: .5px; text-transform: uppercase;
	text-decoration: none !important; white-space: nowrap; transition: background .2s, border-color .2s;
}
.bande-fetes-btn:hover { background: #f58243; border-color: #f58243; }
@media only screen and (max-width: 1100px) { .bande-fetes-btn { display: none; } }
@media only screen and (max-width: 767px) { .bande-fetes { padding: 9px 40px 10px 14px; } }
.bande-fetes .bf-court { display: none; }
@media only screen and (max-width: 767px) { .bande-fetes .bf-long { display: none; } .bande-fetes .bf-court { display: inline; } .bande-fetes p { font-size: 13px; } }

/* Bande des fêtes sur téléphone : 2 lignes nettes, texte blanc, lien en pastille */
@media only screen and (max-width: 767px) {
	.bande-fetes { padding: 9px 42px 10px; }
	.bande-fetes p { font-size: 13.5px; line-height: 1.4; letter-spacing: 0; }
	.bande-fetes .bande-fetes-titre, .bande-fetes .bande-fetes-titre .bf-court { display: block; color: #fff !important; font-weight: 700; letter-spacing: 0; }
	.bande-fetes .bande-fetes-info, .bande-fetes .bande-fetes-info .bf-court { display: block; color: #fff !important; }
	.bande-fetes .bande-fetes-info { margin-top: 5px; }
	.bande-fetes a.bf-lien { display: inline-block; padding: 3px 10px; border: 1px solid rgba(255,255,255,.6); border-radius: 20px; color: #fff !important; font-size: 12px; font-weight: 700; text-decoration: none; white-space: nowrap; }
	.bande-fetes p::before { display: none; }
	.bande-fetes .bande-fetes-titre .bf-court::before { content: "\2744\00a0"; color: #f9b48c; }
}
@media only screen and (max-width: 359px) {
	.bande-fetes a.bf-lien { font-size: 11px; padding: 3px 8px; }
	.bande-fetes p { font-size: 12.5px; }
}
.bande-fetes .bf-xs { display: none; }
@media only screen and (max-width: 374px) { .bande-fetes .bf-xl { display: none; } .bande-fetes .bf-xs { display: inline; } .bande-fetes .bande-fetes-fermer { right: 4px; } }
.bande-fetes a.bf-lien span { color: #fff !important; }

/* ===== Téléphone : la page ne doit jamais glisser sur le côté ni sortir du cadre ===== */
html, body { max-width: 100%; overflow-x: hidden; overscroll-behavior-x: none; }
@supports (overflow-x: clip) { html, body { overflow-x: clip; } }
body { position: relative; }
iframe, video, embed, object { max-width: 100%; }
/* iPhone : un iframe prend la largeur de son contenu si on ne le force pas */
#rc3d-frame, #toit3d-frame, #ite3d-frame { width: 1px !important; min-width: 100% !important; }