/**
 * Wobi — Accueil v2 : en-tete et pied de page.
 *
 * Complement de wobi-v2.css. Meme regle : tout est limite a la page 140
 * (« Accueil v2 »), le site actuel n'est pas affecte.
 *
 * Sommaire :
 *   5. En-tete flottant
 *   6. Pied de page
 */

/* ---------- 5. En-tete flottant ---------- */

body .v2-header {
	border-radius: 0 0 18px 18px;
	box-shadow: 0 10px 30px rgba(20, 20, 20, .08);
	transition: box-shadow .3s ease, padding .3s var(--v2-ease);
}
body .v2-header .v2-nav { flex: 1; }
body .v2-header .elementskit-navbar-nav-default { justify-content: center; }
body .v2-header .elementskit-navbar-nav > li > a {
	font-family: var(--v2-font) !important;
	font-size: 15px !important;
	font-weight: 500 !important;
	color: var(--v2-text) !important;
	padding: 10px 14px !important;
	transition: color .2s ease;
}
body .v2-header .elementskit-navbar-nav > li > a:hover,
body .v2-header .elementskit-navbar-nav > li.current-menu-item > a { color: var(--v2-orange) !important; }

body .v2-search .ekit-wid-con a,
body .v2-search svg,
body .v2-search i {
	color: var(--v2-ink) !important;
	fill: var(--v2-ink) !important;
	font-size: 17px;
}

body .v2-header .elementskit-menu-hamburger {
	border: 1.5px solid var(--v2-line) !important;
	border-radius: 10px;
	padding: 10px 9px !important;
}
body .v2-header .elementskit-menu-hamburger-icon { background: var(--v2-ink) !important; }

@media (max-width: 1024px) {
	body .v2-header { border-radius: 0 0 14px 14px; }
	body .v2-header .elementskit-navbar-nav > li > a { padding: 14px 18px !important; }
}
@media (max-width: 600px) {
	body .v2-cta-header { display: none; }
}

/* ---------- 6. Pied de page ---------- */

body .v2-footer { border-top: 1px solid var(--v2-line); }

body .v2-footer__slogan .elementor-heading-title {
	font-size: 17px;
	font-weight: 600;
	color: var(--v2-ink);
}
body .v2-footer__slogan .elementor-heading-title::after { content: "."; color: var(--v2-orange); }

body .v2-footer__titre .elementor-heading-title {
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--v2-ink);
}

body .v2-footer__liens .elementor-icon-list-item { margin: 0 !important; }
body .v2-footer__liens .elementor-icon-list-text {
	font-size: 15px;
	color: var(--v2-muted) !important;
	display: inline-block;
	transition: color .2s ease, transform .25s var(--v2-ease);
}
body .v2-footer__liens a:hover .elementor-icon-list-text {
	color: var(--v2-orange) !important;
	transform: translateX(3px);
}

body .v2-social .elementor-social-icon {
	background: var(--v2-grey-bg) !important;
	width: 38px;
	height: 38px;
	transition: background-color .25s ease, transform .25s var(--v2-ease);
}
body .v2-social .elementor-social-icon svg { fill: var(--v2-ink); transition: fill .2s ease; }
body .v2-social .elementor-social-icon:hover { background: var(--v2-orange) !important; transform: translateY(-3px); }
body .v2-social .elementor-social-icon:hover svg { fill: #fff; }

body .v2-footer__bas { border-top: 1px solid var(--v2-line); }
body .v2-footer__copy p,
body .v2-footer__legal p { font-size: 14px; color: var(--v2-muted); }
body .v2-footer__legal a { color: var(--v2-muted); text-decoration: none; }
body .v2-footer__legal a:hover { color: var(--v2-orange); }

@media (prefers-reduced-motion: reduce) {
	body .v2-footer__liens .elementor-icon-list-text,
	body .v2-social .elementor-social-icon { transition: none !important; transform: none !important; }
}


/* ---------- Menu mobile (panneau) ----------
   La hauteur de 80 px de la barre de menu (reglage Elementor) s'appliquait aussi au
   panneau mobile et coupait les liens : on redonne toute la hauteur d'ecran. */
@media (max-width: 1024px) {
	body .v2-header .elementskit-menu-container.elementskit-menu-offcanvas-elements {
		height: 100vh !important;
		height: 100dvh !important;
		max-width: 340px;
		width: 86vw;
		background: #fff !important;
		overflow-y: auto;
		padding: 0 0 32px;
		box-shadow: 0 0 60px rgba(17, 17, 17, .25);
		z-index: 100001;
	}
	body .v2-header .elementskit-nav-identity-panel {
		display: flex; align-items: center; justify-content: space-between;
		padding: 18px 22px; border-bottom: 1px solid var(--v2-line, #ECECEC);
	}
	body .v2-header .elementskit-menu-close {
		color: var(--v2-ink, #111) !important; border-color: var(--v2-line, #ECECEC) !important;
		border-radius: 10px; width: 42px; height: 42px; display: grid; place-items: center; font-size: 18px;
	}
	body .v2-header .elementskit-navbar-nav { display: block !important; padding: 8px 0 !important; height: auto !important; }
	body .v2-header .elementskit-navbar-nav > li { display: block; height: auto !important; border-bottom: 1px solid var(--v2-line, #ECECEC); }
	body .v2-header .elementskit-navbar-nav > li > a {
		display: flex !important; align-items: center;
		color: var(--v2-ink, #111) !important;
		font-size: 17px !important; line-height: 1.3 !important;
		padding: 16px 24px !important; height: auto !important;
	}
	body .v2-header .elementskit-navbar-nav > li.current-menu-item > a,
	body .v2-header .elementskit-navbar-nav > li > a:hover { color: var(--v2-orange, #F26A1B) !important; background: #FFF6EF; }
	body .elementskit-menu-overlay { background: rgba(17, 17, 17, .45) !important; z-index: 100000; }
}


/* ---------- En-tete sur tablette et mobile ----------
   Les marges laterales de 100 px (reglage ordinateur) + 85 % de largeur depassaient
   l'ecran et decalaient l'en-tete a droite. */
@media (max-width: 1024px) {
	body .e-con.v2-header {
		--width: calc(100% - 32px) !important; width: calc(100% - 32px) !important; max-width: calc(100% - 32px) !important;
		--margin-left: 16px !important; --margin-right: 16px !important;
		margin-left: 16px !important; margin-right: 16px !important;
		justify-content: space-between !important;
	}
	body .v2-header .v2-logo { order: 1; }
	body .v2-header .e-con.v2-header__droite { order: 2; --width: auto !important; width: auto !important; margin-left: auto; flex: 0 0 auto; }
	body .v2-header .v2-nav { order: 3; flex: 0 0 auto !important; width: auto !important; margin-left: 10px; }
}
@media (max-width: 767px) {
	body .e-con.v2-header {
		--width: calc(100% - 24px) !important; width: calc(100% - 24px) !important; max-width: calc(100% - 24px) !important;
		--margin-left: 12px !important; --margin-right: 12px !important;
		margin-left: 12px !important; margin-right: 12px !important;
	}
}
/* Securite : aucun debordement horizontal de la page */
html, body { overflow-x: clip; }

/* ---------- En-tete centre sur ordinateur ----------
   85 % de largeur + 100 px de marge de chaque cote debordait sur les ecrans de
   1025 a ~1340 px : largeur plafonnee et centrage automatique. */
@media (min-width: 1025px) {
	body .e-con.v2-header {
		--width: min(85%, calc(100% - 64px)) !important; width: min(85%, calc(100% - 64px)) !important;
		--margin-left: auto !important; --margin-right: auto !important;
		margin-left: auto !important; margin-right: auto !important;
	}
}
/* Quand l'en-tete devient fixe au defilement, il reste centre */
body .e-con.v2-header { left: 0 !important; right: 0 !important; }