/*
Theme Name: Divi 5 Child Theme
Description: Thème enfant Divi 5 — SAS Thierry Skieffer (plomberie, chauffage, PAC, climatisation, électricité)
Version: 1.1.0
Author: Morgan Barba
Author URI: www.arkt.com
Template: Divi
License: GNU General Public License v2 or later
*/

/* =========================================================
   1. Jetons de la charte (couleurs du logo, typos)
   Les couleurs sont aussi déclarées comme couleurs globales Divi.
   ========================================================= */
:root {
	--skf-green: #178F38;
	--skf-green-d: #11722C;
	--skf-blue: #2E71B3;
	--skf-ink: #13263B;
	--skf-body: #24384C;
	--skf-muted: #4C5D6E;
	--skf-ground: #FFFFFF;
	--skf-tint-g: #E7F3EA;
	--skf-tint-b: #E8EFF7;
	--skf-night: #0E1D2E;
	--skf-sans: 'Outfit', 'Segoe UI', system-ui, sans-serif;
	--skf-script: 'Reenie Beanie', 'Bradley Hand', cursive;
	--skf-ring: clamp(10px, 1.1vw, 18px);
	--skf-margin: 32px;
	--skf-ease: cubic-bezier(.22, .8, .24, 1);
}
@media (max-width: 767px) {
	:root { --skf-margin: 20px; }
}

body {
	font-family: var(--skf-sans);
	color: var(--skf-body);
	background: var(--skf-ground);
	font-size: 18px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}
body #page-container { background: var(--skf-ground); }
::selection { background: var(--skf-green); color: #fff; }
a { color: var(--skf-blue); }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
	outline: 3px solid var(--skf-blue);
	outline-offset: 3px;
}

h1, h2, h3, h4,
.et_pb_module_header,
.et_pb_heading .et_pb_module_header {
	font-family: var(--skf-sans);
	color: var(--skf-ink);
	letter-spacing: -0.02em;
	padding-bottom: 0;
}
.skf-h1 .et_pb_module_header, .skf-page h1 {
	font-size: clamp(32px, 4.4vw, 68px);
	line-height: 1.0;
	font-weight: 700;
	letter-spacing: -0.035em;
}
.skf-h2 .et_pb_module_header, .skf-page h2 {
	font-size: clamp(32px, 3.6vw, 56px);
	line-height: 1.04;
	font-weight: 650;
	letter-spacing: -0.028em;
}
.skf-page h3 { font-size: 22px; line-height: 1.25; font-weight: 600; letter-spacing: -0.01em; }
.skf-page p { font-size: 18px; line-height: 1.6; color: var(--skf-body); padding-bottom: 0; }
.skf-page p + p { margin-top: 1em; }
.skf-lead p { font-size: clamp(19px, 1.5vw, 22px); line-height: 1.5; }

/* Manuscrite : signature, notes de Thierry */
.skf-script, .skf-script p {
	font-family: var(--skf-script);
	color: var(--skf-blue);
	font-size: clamp(34px, 3vw, 46px);
	line-height: 1;
	letter-spacing: 0;
}
.skf-script small { display: block; font-family: var(--skf-sans); font-size: 16px; color: var(--skf-muted); margin-top: 6px; }

/* =========================================================
   2. Cadre : marges égales, rangées
   ========================================================= */
.skf-page .et_pb_row,
.skf-head .et_pb_row,
.skf-foot .et_pb_row {
	width: calc(100% - (var(--skf-margin) * 2)) !important;
	max-width: 1240px;
	margin-left: auto !important;
	margin-right: auto !important;
}
.skf-sec { padding-top: clamp(96px, 11vw, 168px) !important; padding-bottom: clamp(96px, 11vw, 168px) !important; }
.skf-sec--tight { padding-top: clamp(64px, 7vw, 112px) !important; padding-bottom: clamp(64px, 7vw, 112px) !important; }
.skf-field-g { background: var(--skf-tint-g) !important; }
.skf-field-b { background: var(--skf-tint-b) !important; }
.skf-field-ink { background: var(--skf-ink) !important; }
.skf-field-ink, .skf-field-ink p, .skf-field-ink h2, .skf-field-ink h3, .skf-field-ink .et_pb_module_header { color: #fff !important; }

/* =========================================================
   3. Le motif : le cercle du logo
   ========================================================= */
.skf-circle img, .skf-circle video, .skf-circle .et_pb_image_wrap {
	border-radius: 50% !important;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	width: 100%;
	display: block;
}
.skf-circle .et_pb_image_wrap { overflow: hidden; display: block; }
.skf-ring .et_pb_image_wrap {
	box-sizing: border-box;
	border: var(--skf-ring) solid var(--skf-green);
	border-radius: 50%;
	overflow: hidden;
}
.skf-dot { display: inline-block; width: .62em; height: .62em; border-radius: 50%; background: var(--skf-green); vertical-align: .06em; margin-right: .5em; }

/* Boutons : pastilles pleines, forme du cercle étirée */
.skf-page .et_pb_button, .skf-head .et_pb_button, .skf-foot .et_pb_button, .skf-btn.et_pb_button {
	font-family: var(--skf-sans) !important;
	font-size: 17px !important;
	font-weight: 600 !important;
	line-height: 1.2 !important;
	letter-spacing: 0 !important;
	padding: 17px 30px !important;
	border: 0 !important;
	border-radius: 999px !important;
	background: var(--skf-green) !important;
	color: #fff !important;
	transition: background-color .2s var(--skf-ease), transform .2s var(--skf-ease);
	display: inline-block;
}
.skf-page .et_pb_button:hover, .skf-head .et_pb_button:hover, .skf-foot .et_pb_button:hover { background: var(--skf-green-d) !important; padding: 17px 30px !important; }
.skf-page .et_pb_button:active { transform: scale(.97); }
.et_pb_button::after, .et_pb_button::before { display: none !important; }
.skf-btn--soft.et_pb_button, .skf-btn--soft .et_pb_button { background: var(--skf-tint-b) !important; color: var(--skf-ink) !important; }
.skf-btn--soft.et_pb_button:hover { background: #D6E3F1 !important; }
.skf-btn--white.et_pb_button { background: #fff !important; color: var(--skf-ink) !important; }
.skf-btns { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.skf-btns .et_pb_button_module_wrapper, .skf-btns > div { margin: 0 !important; }

/* Liens-pastille dans les textes */
.skf-pill {
	display: inline-flex; align-items: center; gap: .5em;
	padding: 15px 26px; border-radius: 999px;
	background: var(--skf-green); color: #fff !important;
	font-weight: 600; font-size: 17px; text-decoration: none;
	transition: background-color .2s var(--skf-ease), transform .2s var(--skf-ease);
}
.skf-pill:hover { background: var(--skf-green-d); }
.skf-pill:active { transform: scale(.97); }
.skf-pill--soft { background: var(--skf-tint-b); color: var(--skf-ink) !important; }
.skf-pill--soft:hover { background: #D6E3F1; }
.skf-pill--white { background: #fff; color: var(--skf-ink) !important; }

/* =========================================================
   4. En-tête (Theme Builder)
   ========================================================= */
.skf-head { background: #fff; position: sticky; top: 0; z-index: 99; }
.admin-bar .skf-head { top: 32px; }
.skf-head .et_pb_row { padding: 12px 0 !important; }
.skf-brand a { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; }
.skf-brand img { width: 58px; height: 58px; }
.skf-brand .skf-wm { display: flex; align-items: baseline; gap: 8px; white-space: nowrap; }
.skf-brand .skf-wm-t { font-family: var(--skf-script); color: var(--skf-blue); font-size: 36px; line-height: 1; }
.skf-brand .skf-wm-s { font-family: var(--skf-sans); color: var(--skf-green); font-weight: 800; font-size: 25px; letter-spacing: .01em; line-height: 1; }
.skf-head .et_pb_menu .et-menu > li > a { font-family: var(--skf-sans); font-size: 16px; font-weight: 500; color: var(--skf-ink); padding-bottom: 0 !important; }
.skf-head .et_pb_menu .et-menu > li > a:hover { color: var(--skf-green); opacity: 1; }
.skf-head .et_pb_menu .et-menu > li.current-menu-item > a { color: var(--skf-green); }
.skf-head .et_pb_menu .et-menu-nav > ul ul { border-top: 0; padding: 10px 0; }
.skf-head .et_pb_menu__wrap { justify-content: flex-end; }
.skf-head .skf-tel { white-space: nowrap; }
@media (max-width: 980px) {
	.skf-brand img { width: 46px; height: 46px; }
	.skf-brand .skf-wm-t { font-size: 30px; }
	.skf-brand .skf-wm-s { font-size: 20px; }
	.skf-head .skf-tel-col { display: none !important; }
}

/* Barre d'appel mobile, toujours visible */
.skf-callbar { display: none; }
@media (max-width: 767px) {
	.skf-callbar {
		display: grid; grid-template-columns: 1fr 1fr; gap: 8px;
		position: fixed; left: 0; right: 0; bottom: 0; z-index: 9999;
		padding: 10px 12px calc(10px + env(safe-area-inset-bottom));
		background: var(--skf-ink);
	}
	.skf-callbar a { justify-content: center; padding: 14px 10px; font-size: 16px; }
	body { padding-bottom: 76px; }
}

/* =========================================================
   5. Hero : vidéo dans le grand cercle
   ========================================================= */
.skf-hero { position: relative; overflow: hidden; }
.skf-hero .et_pb_row { min-height: calc(100svh - 84px); align-items: center !important; }
.skf-hero-text { position: relative; z-index: 2; padding: 48px 0 !important; }
.skf-hero-text .skf-lead { margin-top: 32px !important; max-width: 40ch; }
.skf-hero-text .skf-btns { margin-top: 40px; }
.skf-hero-text .skf-script { margin-top: 44px !important; }
.skf-trust { margin-top: 28px !important; }
.skf-trust p { font-size: 16px !important; color: var(--skf-muted); display: flex; flex-wrap: wrap; gap: 8px 22px; }
.skf-trust span { white-space: nowrap; }
.skf-trust strong { color: var(--skf-ink); }
.skf-hero-disc { position: relative; }
.skf-hero-disc .et_pb_video_box, .skf-hero-disc .fluid-width-video-wrapper { padding: 0 !important; }
.skf-hero-disc .et_pb_video_box {
	width: min(100vh, 56vw, 980px);
	aspect-ratio: 1 / 1;
	border-radius: 50%;
	overflow: hidden;
	border: var(--skf-ring) solid var(--skf-green);
	box-sizing: border-box;
	background: var(--skf-tint-b);
	margin-left: auto;
	margin-right: calc(-1 * min(12vw, 200px));
	position: relative;
}
.skf-hero-disc video {
	position: absolute; inset: 0;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover;
	transform: scale(1.9);
	transform-origin: 52% 50%;
	display: block;
}
.skf-hero-disc .et_pb_video_overlay, .skf-hero-disc .et_pb_video_play { display: none !important; }
@media (max-width: 980px) {
	.skf-hero .et_pb_row { min-height: 0; }
	.skf-hero-disc .et_pb_video_box { width: 86vw; margin: 0 auto; }
	.skf-hero-text { padding-bottom: 8px !important; }
}

/* Petits héros des pages métier */
.skf-subhero .et_pb_row { align-items: center !important; }
.skf-subhero .skf-circle { max-width: 520px; margin-left: auto !important; }
@media (max-width: 980px) { .skf-subhero .skf-circle { max-width: 78vw; margin: 0 auto !important; } }

/* =========================================================
   6. Énoncé avec vignettes rondes dans la ligne
   ========================================================= */
.skf-statement p {
	font-size: clamp(24px, 2.6vw, 36px) !important;
	line-height: 1.3 !important;
	font-weight: 500;
	color: var(--skf-ink) !important;
	letter-spacing: -0.015em;
	max-width: 30ch;
}
.skf-statement img {
	display: inline-block; height: .95em; width: .95em; object-fit: cover;
	border-radius: 50%; vertical-align: -0.14em; margin: 0 .14em;
}
.skf-statement-side p { font-size: 18px; }

/* =========================================================
   7. Index des métiers avec aperçu (mouvement signature)
   ========================================================= */
.skf-index ul { list-style: none; padding: 0 !important; margin: 0; }
.skf-index li { padding: 0; margin: 0; }
.skf-index li + li { margin-top: 6px; }
.skf-index a {
	display: grid; grid-template-columns: auto 1fr; column-gap: 20px; align-items: baseline;
	padding: 20px 24px; text-decoration: none; color: var(--skf-ink);
	background: var(--skf-tint-b);
	transition: background-color .24s var(--skf-ease), color .24s var(--skf-ease);
}
.skf-index a .skf-dot { margin: 0; transition: transform .24s var(--skf-ease); }
.skf-index a strong { font-size: clamp(24px, 2.4vw, 36px); font-weight: 650; letter-spacing: -0.02em; line-height: 1.1; }
.skf-index a span.skf-fact { grid-column: 2; font-size: 16px; color: var(--skf-muted); margin-top: 4px; }
.skf-index a:hover, .skf-index a:focus-visible, .skf-index a.is-on { background: var(--skf-green); color: #fff; }
.skf-index a:hover span.skf-fact, .skf-index a.is-on span.skf-fact, .skf-index a:focus-visible span.skf-fact { color: #E7F3EA; }
.skf-index a:hover .skf-dot, .skf-index a.is-on .skf-dot { background: #fff; transform: scale(1.25); }
.skf-index a img.skf-inline-prev { display: none; }
.skf-preview { position: relative; }
.skf-preview .et_pb_image {
	position: absolute !important; inset: 0; opacity: 0; transition: opacity .24s var(--skf-ease);
}
.skf-preview .et_pb_image:first-child { position: relative !important; }
.skf-preview .et_pb_image.is-on { opacity: 1; }
.skf-preview .et_pb_image .et_pb_image_wrap { border: var(--skf-ring) solid var(--skf-green); border-radius: 50%; overflow: hidden; }
@media (hover: none), (max-width: 980px) {
	.skf-preview { display: none !important; }
	.skf-index a { grid-template-columns: 64px 1fr; }
	.skf-index a .skf-dot { display: none; }
	.skf-index a img.skf-inline-prev { display: block; width: 64px; height: 64px; border-radius: 50%; object-fit: cover; grid-row: span 2; }
	.skf-index a strong { font-size: 24px; }
}

/* =========================================================
   8. Plaque carrée (pompe à chaleur)
   ========================================================= */
.skf-plate .et_pb_row { align-items: stretch !important; }
.skf-plate-img .et_pb_image_wrap { position: relative; display: block; }
.skf-plate-img img { aspect-ratio: 1 / 1; object-fit: cover; width: 100%; display: block; }
.skf-plate-img .et_pb_image_wrap::after {
	content: ""; position: absolute; left: 7%; top: 7%; width: 86%; height: 86%;
	border-radius: 50%; border: 6px solid #fff; box-sizing: border-box; pointer-events: none;
}
.skf-plate-txt { display: flex !important; flex-direction: column; justify-content: space-between; gap: 40px; }
.skf-tabs p { display: flex; flex-wrap: wrap; gap: 10px 26px; font-size: 18px !important; }
.skf-tabs span { color: var(--skf-muted); }
.skf-tabs span.is-on { color: var(--skf-ink); font-weight: 600; }
.skf-cells { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.skf-cells a {
	display: flex; align-items: center; justify-content: center; text-align: center;
	min-height: 72px; padding: 12px 18px; border-radius: 999px; text-decoration: none;
	font-weight: 600; font-size: 17px; transition: background-color .2s var(--skf-ease), transform .2s var(--skf-ease);
}
.skf-cells a:first-child { background: var(--skf-ink); color: #fff; }
.skf-cells a:first-child:hover { background: var(--skf-green); }
.skf-cells a + a { background: #fff; color: var(--skf-ink); }
.skf-cells a + a:hover { background: var(--skf-tint-b); }
.skf-cells a:active { transform: scale(.97); }
@media (max-width: 767px) { .skf-cells { grid-template-columns: 1fr; } .skf-cells a { min-height: 60px; } }

/* =========================================================
   9. Avis
   ========================================================= */
.skf-score {
	width: min(340px, 70vw); aspect-ratio: 1 / 1; border-radius: 50%;
	background: var(--skf-green); color: #fff; display: grid; place-content: center; text-align: center;
}
.skf-score p { color: #fff !important; }
.skf-score .n { font-size: clamp(72px, 8vw, 120px); font-weight: 700; line-height: .9; letter-spacing: -0.04em; }
.skf-score .l { font-size: 18px; margin-top: 10px; }
.skf-quote blockquote { border: 0; padding: 0; margin: 0; }
.skf-quote blockquote p { font-size: clamp(22px, 2.2vw, 32px) !important; line-height: 1.3 !important; color: var(--skf-ink) !important; font-weight: 400; letter-spacing: -0.01em; }
.skf-quote cite { display: block; margin-top: 22px; font-style: normal; font-size: 16px; color: var(--skf-muted); }
.skf-quote cite strong { color: var(--skf-ink); }

/* Carrousels natifs Divi */
.skf-page .et_pb_group_carousel .et-pb-arrow-prev,
.skf-page .et_pb_group_carousel .et-pb-arrow-next,
.skf-page [class*="carousel"] .et-pb-arrow-prev,
.skf-page [class*="carousel"] .et-pb-arrow-next { color: var(--skf-ink); }
.skf-page .et-pb-controllers a, .skf-page [class*="carousel"] [class*="dot"] button { background: #C4CFDA; }
.skf-page .et-pb-controllers .et-pb-active-control { background: var(--skf-green); }
.skf-shot .et_pb_image_wrap { display: block; overflow: hidden; border-radius: 50%; }
.skf-shot img { aspect-ratio: 1 / 1; object-fit: cover; width: 100%; transition: transform .6s var(--skf-ease); }
.skf-shot:hover img { transform: scale(1.04); }
.skf-shot-cap p { font-size: 16px !important; color: var(--skf-ink) !important; font-weight: 600; margin-top: 16px !important; text-align: center; }

/* =========================================================
   10. Étapes : des cercles qui grandissent
   ========================================================= */
.skf-steps .et_pb_row { align-items: flex-end !important; }
.skf-step .skf-stepdisc { border-radius: 50%; aspect-ratio: 1/1; display: grid; place-items: center; overflow: hidden; border: var(--skf-ring) solid var(--skf-green); box-sizing: border-box; }
.skf-step .skf-stepdisc img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.skf-step:nth-child(1) .skf-stepdisc { width: 58%; background: #fff; }
.skf-step:nth-child(2) .skf-stepdisc { width: 78%; background: var(--skf-tint-g); }
.skf-step:nth-child(3) .skf-stepdisc { width: 100%; background: var(--skf-green); }
.skf-step h3 { margin-top: 28px; font-size: 22px !important; }
.skf-step p { font-size: 17px !important; color: var(--skf-muted) !important; margin-top: 8px !important; }
@media (max-width: 767px) {
	.skf-step:nth-child(1) .skf-stepdisc { width: 44%; }
	.skf-step:nth-child(2) .skf-stepdisc { width: 60%; }
	.skf-step:nth-child(3) .skf-stepdisc { width: 76%; }
}

/* =========================================================
   11. Zone d'intervention
   ========================================================= */
.skf-communes ul { list-style: none; padding: 0 !important; columns: 2; column-gap: 32px; }
.skf-communes li { font-size: 18px; padding: 6px 0; break-inside: avoid; color: var(--skf-ink); }
.skf-communes li::before { content: ""; display: inline-block; width: .5em; height: .5em; border-radius: 50%; background: var(--skf-green); margin-right: .7em; vertical-align: .1em; }
.skf-communes li.is-home { font-weight: 700; }
@media (max-width: 480px) { .skf-communes ul { columns: 1; } }

/* =========================================================
   12. FAQ : tuiles pleines (module Accordéon Divi)
   ========================================================= */
.skf-faq-head { position: sticky; top: 120px; }
.skf-page .et_pb_accordion .et_pb_toggle {
	border: 0 !important; border-radius: 0; margin-bottom: 8px !important;
	background: var(--skf-tint-b) !important; padding: 0 !important;
	transition: background-color .24s var(--skf-ease);
}
.skf-page .et_pb_accordion .et_pb_toggle_title {
	font-size: 20px !important; font-weight: 600 !important; color: var(--skf-ink) !important;
	padding: 24px 64px 24px 24px !important; line-height: 1.3;
}
.skf-page .et_pb_accordion .et_pb_toggle_title::before {
	content: "+" !important; font-family: var(--skf-sans) !important; font-size: 30px !important; font-weight: 400;
	right: 24px !important; color: var(--skf-green) !important; top: 50%; transform: translateY(-50%); margin-top: 0 !important;
}
.skf-page .et_pb_accordion .et_pb_toggle_open { background: var(--skf-green) !important; }
.skf-page .et_pb_accordion .et_pb_toggle_open .et_pb_toggle_title,
.skf-page .et_pb_accordion .et_pb_toggle_open .et_pb_toggle_title::before,
.skf-page .et_pb_accordion .et_pb_toggle_open p { color: #fff !important; }
.skf-page .et_pb_accordion .et_pb_toggle_open .et_pb_toggle_title::before { content: "\2013" !important; }
.skf-page .et_pb_accordion .et_pb_toggle_content { padding: 0 24px 26px !important; max-width: 60ch; }
.skf-page .et_pb_accordion .et_pb_toggle_content p { font-size: 17px !important; }
@media (max-width: 980px) { .skf-faq-head { position: static; } }

/* =========================================================
   13. Formulaire de devis : le coupon
   ========================================================= */
.skf-coupon { background: var(--skf-ink) !important; position: relative; }
.skf-coupon-side h2, .skf-coupon-side p, .skf-coupon-side .et_pb_module_header { color: #fff !important; }
.skf-coupon-side .skf-script p { color: #9CC4EC !important; }
.skf-coupon-side ul { list-style: none; padding: 0 !important; margin-top: 28px; }
.skf-coupon-side li { color: #fff; font-size: 17px; padding: 6px 0; }
.skf-coupon-side li::before { content: ""; display: inline-block; width: .5em; height: .5em; border-radius: 50%; background: var(--skf-green); margin-right: .7em; vertical-align: .1em; }
.skf-coupon-side a { color: #fff; }
@media (min-width: 981px) {
	.skf-coupon-form { border-left: 6px dotted rgba(255,255,255,.28); padding-left: 48px !important; }
}

.skf-form .et_pb_contact_form_label, .skf-form .et_pb_contact_field label, .skf-form .et_pb_contact_field > p:first-child {
	font-size: 15px; font-weight: 600; color: inherit; margin-bottom: 6px; display: block;
}
.skf-form .et_pb_contact_field { margin-bottom: 14px !important; }
.skf-form input.input, .skf-form textarea.input, .skf-form select.input, .skf-form .et_pb_contact_select {
	background: #fff !important; color: var(--skf-ink) !important; border: 2px solid transparent !important;
	border-radius: 0 !important; font-family: var(--skf-sans) !important; font-size: 17px !important;
	padding: 15px 16px !important; min-height: 54px; width: 100%;
	transition: border-color .2s var(--skf-ease);
}
.skf-form input.input:focus, .skf-form textarea.input:focus, .skf-form select.input:focus { border-color: var(--skf-green) !important; }
.skf-form input::placeholder, .skf-form textarea::placeholder { color: #66778A; }
.skf-form .et_contact_error { border-color: #C9372C !important; }
.skf-form .et_pb_contact_field_options_title { font-size: 15px; font-weight: 600; margin-bottom: 8px; }
.skf-form .et_pb_contact_field_checkbox label, .skf-form .et_pb_contact_field_radio label { font-weight: 400; font-size: 16px; display: flex; align-items: center; gap: 10px; }
.skf-form .et_pb_contact_field_checkbox, .skf-form .et_pb_contact_field_radio { margin-bottom: 6px; }
.skf-form .et_pb_contact_submit, .skf-form button.et_pb_button {
	width: 100%; background: var(--skf-green) !important; color: #fff !important;
	border: 0 !important; border-radius: 999px !important; padding: 18px 30px !important;
	font-size: 18px !important; font-weight: 600 !important; margin-top: 10px; cursor: pointer;
}
.skf-form .et_pb_contact_submit:hover { background: var(--skf-green-d) !important; }
.skf-form .et_contact_bottom_container { float: none; display: block; width: 100%; margin-top: 8px; }
.skf-form .et-pb-contact-message { font-size: 18px; color: inherit; }
.skf-form .et-pb-contact-message p { color: inherit !important; }
.skf-form .skf-optional-start { margin-top: 18px; }
.skf-optional-title { display: block; width: 100%; font-size: 20px; font-weight: 650; margin: 18px 0 4px; }
.skf-optional-note { display: block; width: 100%; font-size: 15px; opacity: .85; margin-bottom: 12px; }
.skf-coupon .skf-form { color: #fff; }
.skf-coupon .skf-form label, .skf-coupon .skf-form .et_pb_contact_field_options_title { color: #fff !important; }
.skf-form-light .skf-form { color: var(--skf-ink); }
.skf-form-light .skf-form input.input, .skf-form-light .skf-form textarea.input, .skf-form-light .skf-form select.input { background: var(--skf-tint-b) !important; }

/* =========================================================
   14. Pages métier
   ========================================================= */
.skf-services ul { list-style: none; padding: 0 !important; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.skf-services li { background: var(--skf-tint-b); padding: 22px 24px; }
.skf-services li strong { display: block; font-size: 20px; color: var(--skf-ink); margin-bottom: 4px; }
.skf-services li span { font-size: 16px; color: var(--skf-muted); }
@media (max-width: 767px) { .skf-services ul { grid-template-columns: 1fr; } }
.skf-crumbs p { font-size: 15px !important; color: var(--skf-muted); }
.skf-crumbs a { color: var(--skf-muted); }

/* Galerie Divi en cercles légers */
.skf-gallery .et_pb_gallery_image img { aspect-ratio: 4/3; object-fit: cover; width: 100%; }
.skf-gallery .et_pb_gallery_title { font-size: 17px; color: var(--skf-ink); font-weight: 600; margin-top: 10px; }
.skf-gallery .et_pb_gallery_caption { font-size: 15px; color: var(--skf-muted); }
.skf-gallery .et_overlay { background: rgba(23,143,56,.78) !important; border: 0 !important; }

/* Articles */
.skf-article p, .skf-article li { font-size: 19px; line-height: 1.7; }
.skf-article h2 { font-size: clamp(26px, 2.4vw, 34px) !important; margin-top: 1.6em; }
.skf-article .et_pb_text_inner { max-width: 68ch; }
.skf-postcards a { display: block; text-decoration: none; background: var(--skf-tint-b); padding: 28px; height: 100%; transition: background-color .2s var(--skf-ease); }
.skf-postcards a:hover { background: var(--skf-tint-g); }
.skf-postcards strong { display: block; font-size: 22px; color: var(--skf-ink); line-height: 1.25; }
.skf-postcards span { display: block; margin-top: 8px; font-size: 16px; color: var(--skf-muted); }

/* =========================================================
   15. Pied de page : l'emblème en grand
   ========================================================= */
.skf-foot { background: var(--skf-night); color: #fff; }
.skf-foot p, .skf-foot li, .skf-foot a, .skf-foot h2, .skf-foot h3 { color: #fff !important; }
.skf-foot .skf-mark { display: flex; align-items: center; gap: clamp(16px, 3vw, 48px); flex-wrap: wrap; }
.skf-foot .skf-mark img { width: clamp(120px, 16vw, 240px); height: auto; border-radius: 50%; background: #fff; }
.skf-foot .skf-mark .t { font-family: var(--skf-script); color: #9CC4EC; font-size: clamp(64px, 9vw, 150px); line-height: .9; }
.skf-foot .skf-mark .s { font-family: var(--skf-sans); font-weight: 800; color: #5FCB7C; font-size: clamp(48px, 7.4vw, 124px); line-height: .9; letter-spacing: -0.01em; }
.skf-foot h3 { font-size: 16px !important; font-weight: 600; opacity: .7; margin-bottom: 12px !important; letter-spacing: 0; }
.skf-foot ul { list-style: none; padding: 0 !important; }
.skf-foot li { padding: 4px 0; font-size: 16px; }
.skf-foot a { text-decoration: none; }
.skf-foot a:hover { color: #5FCB7C !important; }
.skf-foot .skf-legal p { font-size: 14px !important; opacity: .72; }
.skf-foot .skf-legal a { text-decoration: underline; text-underline-offset: 3px; }

/* =========================================================
   16. Entrées (révélation des sections)
   ========================================================= */
.skf-js .skf-reveal { opacity: 0; transform: translateY(24px); transition: opacity .7s var(--skf-ease), transform .7s var(--skf-ease); }
.skf-js .skf-reveal.is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
	.skf-js .skf-reveal { opacity: 1; transform: none; transition: none; }
	* { scroll-behavior: auto !important; }
	.skf-shot img, .skf-preview .et_pb_image { transition: none !important; }
}

/* Masque le pied de page Divi par défaut (remplacé par le Theme Builder) */
#main-footer { display: none; }

@media (max-width: 767px) { .skf-h1 .et_pb_module_header, .skf-page h1 { font-size: 8.4vw; } }

/* Ajustements après relecture */
.skf-statement-side p { font-size: 18px !important; line-height: 1.55 !important; }
@media (max-width: 980px) { .skf-score { margin: 0 auto; } }
@media (hover: none), (max-width: 980px) {
	.skf-index a { align-items: center; row-gap: 2px; }
	.skf-index a img.skf-inline-prev { grid-column: 1; grid-row: 1 / span 2; }
	.skf-index a strong, .skf-index a span.skf-fact { grid-column: 2; margin-top: 0; }
}
@media (max-width: 767px) {
	.skf-step:nth-child(1) .skf-stepdisc { width: 30%; }
	.skf-step:nth-child(2) .skf-stepdisc { width: 40%; }
	.skf-step:nth-child(3) .skf-stepdisc { width: 52%; }
}

/* Menu mobile plein écran */
@media (max-width: 980px) {
	.skf-head { z-index: 10000; }
	.skf-head .mobile_nav .et_mobile_menu {
		position: fixed !important; top: var(--skf-head-h, 66px) !important; left: 0 !important; right: 0 !important; bottom: 0 !important;
		width: auto !important; height: auto !important; max-height: none !important; margin: 0 !important;
		overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain;
		padding: 24px var(--skf-margin) 140px !important; background: #fff !important;
		border: 0 !important; box-shadow: none !important; z-index: 10001;
	}
	.skf-head .et_mobile_menu li a {
		font-family: var(--skf-sans); font-size: clamp(26px, 7vw, 34px) !important; font-weight: 650; letter-spacing: -0.02em;
		color: var(--skf-ink) !important; padding: 12px 0 !important; border: 0 !important; background: none !important; width: 100% !important;
	}
	.skf-head .et_mobile_menu li a:hover, .skf-head .et_mobile_menu li.current-menu-item > a { color: var(--skf-green) !important; opacity: 1; }
	.skf-head .et_mobile_menu li { border: 0 !important; }
	.skf-head .et_mobile_menu .sub-menu, .skf-head .et_mobile_menu ul { padding: 0 0 8px 20px !important; }
	.skf-head .et_mobile_menu .sub-menu li a, .skf-head .et_mobile_menu ul li a { font-size: 20px !important; font-weight: 500; padding: 8px 0 !important; }
	.skf-head .et_mobile_menu .sub-menu li a::before { content: ""; display: inline-block; width: .45em; height: .45em; border-radius: 50%; background: var(--skf-green); margin-right: .6em; vertical-align: .12em; }
	.skf-head .et_mobile_menu li.skf-menu-cta { margin-top: 32px; display: grid; gap: 10px; }
	.skf-head .et_mobile_menu li.skf-menu-cta a { font-size: 18px !important; font-weight: 600; letter-spacing: 0; padding: 16px 24px !important; border-radius: 999px; text-align: center; justify-content: center; }
	.skf-head .et_mobile_menu li.skf-menu-cta a.skf-pill { background: var(--skf-green) !important; color: #fff !important; }
	.skf-head .et_mobile_menu li.skf-menu-cta a.skf-pill--soft { background: var(--skf-tint-b) !important; color: var(--skf-ink) !important; }
	.skf-head .mobile_nav.opened .mobile_menu_bar::before { content: "\4d"; }
	html.skf-menu-open, html.skf-menu-open body { overflow: hidden; }
	html.skf-menu-open .skf-callbar { display: none; }
}

/* Page Nos métiers */
html { scroll-behavior: smooth; }
.skf-metier { scroll-margin-top: var(--skf-head-h, 80px); }
.skf-field-b .et_pb_accordion .et_pb_toggle:not(.et_pb_toggle_open) { background: #fff !important; }
.skf-jump .skf-btns { gap: 10px; }
.skf-metier h3 { font-size: 26px !important; margin-bottom: 12px; }
@media (max-width: 980px) { .skf-metier-img { max-width: 72vw; margin: 0 auto; } }

/* En-tête toujours visible : le conteneur du Theme Builder porte le sticky */
header.et-l--header { position: sticky; top: 0; z-index: 10000; background: #fff; }
.admin-bar header.et-l--header { top: 32px; }
@media (max-width: 782px) { .admin-bar header.et-l--header { top: 46px; } }
header.et-l--header .skf-head { position: relative !important; top: auto !important; }
.et_pb_section[id], [id="devis"] { scroll-margin-top: 96px; }

/* En-tête ordinateur : téléphone + bouton devis */
.skf-head .skf-head-cta { display: flex; justify-content: flex-end; align-items: center; gap: 10px; flex-wrap: nowrap; padding: 0 !important; }
.skf-head .skf-head-cta .skf-pill { padding: 14px 22px; font-size: 16px; white-space: nowrap; }
@media (max-width: 1180px) { .skf-head .skf-head-cta .skf-tel { display: none; } }
/* Carte de la zone */
.skf-map iframe { max-width: 100%; }

/* Hero mobile : visage centré dans l'écran (l'ordinateur garde le cadrage d'origine) */
@media (max-width: 767px) {
	.skf-hero .et-pb-parallax-background { background-size: cover !important; background-position: 72% center !important; }
}

/* Formulaires : flèche des listes déroulantes centrée verticalement dans le champ */
.skf-form .et_pb_contact_field[data-type="select"]::after { display: none !important; }
.skf-form select.et_pb_contact_select, .skf-form select.input {
	-webkit-appearance: none !important; appearance: none !important;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%2313263B' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important; background-position: right 18px center !important; background-size: 14px 9px !important;
	padding-right: 46px !important; cursor: pointer;
}