/*
 * optoneering — ajustements du thème enfant (v2, 2026-11-08).
 * Mesures relevées sur la référence (/srv/rapports/782-optoneering-releve.md).
 * La structure vient de The7 (options de thème) ; ce fichier n'ajuste que les dimensions et détails
 * que les options ne couvrent pas. Couleurs : bleu #2f4d86, vert #699e4b, sombre #000916, pied #f5f6f7.
 */

:root {
	--opt-blue: #2f4d86;
	--opt-green: #699e4b;
	--opt-dark: #000916;
	--opt-ink: #021228;
	--opt-footer-bg: #f5f6f7;
	--opt-text: rgba(196, 196, 196, 0.85); /* couleur de texte courant de la référence (contraste faible : reproduit) */
	--opt-shadow: 0 0 33px 0 rgba(64, 92, 146, 0.25);
}

/* ---------- Contenu Elementor en pleine largeur (comme le gabarit Pro « 7 Single Page ») ---------- */
.elementor-page #main {
	padding: 0 !important;
}
.elementor-page #main > .wf-wrap {
	max-width: none;
	padding: 0;
	width: 100%;
}
.elementor-page #main .wf-container-main {
	margin: 0;
}
.elementor-page #content {
	padding: 0;
	margin: 0;
	width: 100%;
}

/* ---------- En-tête bureau ---------- */
.masthead:not(.side-header):not(.mixed-header) .header-bar,
#phantom .header-bar {
	max-width: 1300px;
	margin: 0 auto;
	padding: 0 !important;
}
.masthead .branding img,
#phantom .branding img {
	width: 110px;
	height: auto;
	max-height: none;
}
#phantom .logo-box img {
	width: 85px;
	height: auto;
	max-height: none;
}
.home #phantom .logo-box img {
	width: 95px;
}
.main-nav > li > a .menu-text,
#phantom .main-nav > li > a .menu-text {
	font-family: "Outfit", sans-serif;
	font-size: 19px;
	font-weight: 400;
	line-height: 1.3;
}
/* Écart de 30 px : marges natives The7 (15 px de chaque côté du lien, extrêmes retirés par The7). */
/* Soulignement 2 px vert sous le texte, plein pour l'élément actif. */
.underline-decoration > li > a .menu-item-text:before,
.underline-decoration > li > a .decoration-line {
	height: 2px !important;
	bottom: -3px !important;
	background: var(--opt-green) !important;
}
.masthead:not(.side-header) {
	box-shadow: var(--opt-shadow);
}
/* Accueil : en-tête superposé au visuel, liens blancs. */
.transparent .masthead:not(.side-header) {
	box-shadow: none;
}
.transparent .masthead:not(#phantom) .main-nav > li > a .menu-text {
	color: #fff !important;
}

/* En-tête flottant : 60 px, blanc, ombre ; masqué en descendant, réaffiché en remontant (assets/js). */
#phantom {
	box-shadow: var(--opt-shadow) !important;
	transition: transform 0.3s ease, visibility 0.3s, opacity 0.3s;
}
#phantom .main-nav > li > a .menu-text {
	color: var(--opt-blue) !important;
}
body.opt-scroll-down #phantom {
	transform: translateY(-100%) !important;
	box-shadow: none !important;
}

/* ---------- En-tête mobile (≤ 1200 px) ---------- */
.mobile-header-bar {
	height: 60px;
	min-height: 60px;
}
.mobile-branding img {
	width: 85px !important;
	height: auto !important;
	max-height: none !important;
}
.home .mobile-branding img {
	width: 95px !important;
}
.masthead.sticky-mobile-on,
.sticky-mobile-header .masthead.fixed-mobile-header {
	transition: transform 0.3s ease;
}
body.opt-scroll-down .masthead.sticky-mobile-on,
body.opt-scroll-down .masthead.fixed-mobile-header {
	transform: translateY(-100%);
}

/* Hamburger : icône « list » de la référence (3 traits 24 × 2 px, pas de 8 px) dans une boîte de 32 px. */
.dt-mobile-menu-icon {
	padding: 0 !important;
	margin: 0 !important;
}
.dt-mobile-menu-icon .lines-button {
	position: relative !important;
	display: block !important;
	width: 32px !important;
	height: 32px !important;
	margin: 0 !important;
	padding: 0 !important;
}
.dt-mobile-menu-icon .menu-line {
	position: absolute !important;
	left: 4px !important;
	width: 24px !important;
	height: 2px !important;
	margin: 0 !important;
	border-radius: 2px;
	background: var(--opt-blue) !important;
	transform: none !important;
}
.dt-mobile-menu-icon .menu-line:nth-child(1) { top: 7px !important; }
.dt-mobile-menu-icon .menu-line:nth-child(2) { top: 15px !important; }
.dt-mobile-menu-icon .menu-line:nth-child(3) { top: 23px !important; }
.dt-mobile-menu-icon .menu-line:before,
.dt-mobile-menu-icon .menu-line:after {
	display: none !important;
}
.transparent .masthead:not(.sticky-mobile-on) .dt-mobile-menu-icon .menu-line {
	background: #fff !important;
}

/* Panneau du menu mobile : 400 px, logo 150 px puis liens 21 px (pas de 45 px). */
.dt-mobile-header {
	width: 400px;
	max-width: 100%;
	padding: 0 !important; /* marges intérieures : option The7 « header-mobile-content-padding » (60/40 px) */
}
.dt-mobile-header .opt-mobile-menu-logo {
	display: block;
	margin: 0 0 60px;
	line-height: 0;
}
.dt-mobile-header .opt-mobile-menu-logo img {
	width: 150px;
	height: auto;
}
.dt-mobile-header .mobile-main-nav {
	padding: 0 !important;
	margin: 0 !important;
}
.mobile-main-nav > li {
	margin: 0 0 18px !important;
	padding: 0 !important;
}
.mobile-main-nav > li > a {
	padding: 0 !important;
	min-height: 0 !important;
}
.mobile-main-nav > li > a .menu-text {
	font-family: "Outfit", sans-serif;
	font-size: 21px;
	font-weight: 400;
	line-height: 1.3;
	color: var(--opt-blue);
}
/* Croix 20 px à 15 px du coin haut droit, couleur rgba(2,18,40,.32). */
.dt-mobile-header .dt-close-mobile-menu-icon {
	position: absolute !important;
	top: 15px !important;
	right: 2px !important; /* 15 px du bord : The7 réserve 13 px à sa barre de défilement */
	left: auto !important;
	width: 20px !important;
	height: 20px !important;
	margin: 0 !important;
	padding: 0 !important;
}
.dt-close-mobile-menu-icon .close-line-wrap {
	position: relative;
	width: 20px !important;
	height: 20px !important;
}
.dt-close-mobile-menu-icon .close-line {
	position: absolute !important;
	top: 9px !important;
	left: 0 !important;
	width: 20px !important;
	height: 2px !important;
	margin: 0 !important;
	background: rgba(2, 18, 40, 0.32) !important;
}
.dt-close-mobile-menu-icon .close-line:nth-child(1) { transform: rotate(45deg) !important; }
.dt-close-mobile-menu-icon .close-line:nth-child(2) { transform: rotate(-45deg) !important; }
.dt-close-mobile-menu-icon .close-line:nth-child(3) { display: none !important; }

/* ---------- Zone de titre (The7) ---------- */
.page-title .wf-wrap {
	max-width: 100%;
	padding: 0;
}
.page-title h1,
.page-title .entry-title {
	font-family: "Outfit", sans-serif;
	font-weight: 500;
	letter-spacing: normal;
}
/* Image de fond : taille naturelle (bureau), 150 % de large (650-880 px), invisible ≤ 650 px — comme la référence. */
.page-title {
	background-size: auto !important;
}
@media (max-width: 880px) {
	.page-title {
		background-size: 150% auto !important;
	}
}
@media (max-width: 650px) {
	.page-title {
		background-size: 1px auto !important;
	}
}

/* ---------- Pied (zone de widgets The7) ---------- */
#footer.solid-bg {
	background-color: var(--opt-footer-bg);
	border-top: 1px solid #ffffff33;
}
#footer > .wf-wrap {
	max-width: 100%;
	padding: 0;
}
#footer .wf-container-footer {
	padding: 100px 0 0 !important;
}
#footer .wf-container {
	display: grid;
	/* colonnes de 496 / 298 / 298 px séparées de 60 et 148 px (mesures de la référence, conteneur de 1300 px) */
	grid-template-columns: 38.154% 4.615% 22.923% 11.385% 22.923%;
	grid-template-rows: auto 1fr;
	margin: 0 !important;
}
#footer .wf-container > .widget {
	width: auto !important;
	padding: 0 !important;
	margin: 0 !important;
}
#footer .wf-container > .widget:nth-child(1) { grid-column: 1; grid-row: 1; }
#footer .wf-container > .widget:nth-child(2) { grid-column: 1; grid-row: 2; }
#footer .wf-container > .widget:nth-child(3) { grid-column: 3; grid-row: 1 / span 2; }
#footer .wf-container > .widget:nth-child(4) { grid-column: 5; grid-row: 1 / span 2; }
#footer .widget_media_image img {
	width: 180px;
	height: auto;
	display: block;
}
#footer .opt-footer-phone {
	margin: 60px 0 0;
	font: 500 26px/1.25 "Outfit", sans-serif;
	color: var(--opt-blue);
}
#footer .opt-footer-mail {
	margin: 10px 0 0;
	font: 300 17px/1.5 "Outfit", sans-serif;
	color: var(--opt-text);
}
#footer .opt-footer-cta {
	margin: 29px 0 0;
	line-height: 0;
}
#footer .opt-footer-btn,
#footer .opt-footer-btn:hover {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 104px;
	height: 44px;
	border-radius: 100px;
	background: var(--opt-blue);
	color: #fff !important;
	font: 400 16px/1 "Outfit", sans-serif;
	text-decoration: none;
	box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0);
}
#footer .widget-title {
	margin: 0 0 30px !important;
	font: 500 17px/1.3 "Outfit", sans-serif !important;
	letter-spacing: 1.36px;
	text-transform: uppercase;
	color: var(--opt-blue) !important;
}
#footer .widget_nav_menu ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
#footer .widget_nav_menu li {
	line-height: 22px;
	margin: 0 0 16px !important;
	padding: 0 !important;
	border: 0 !important;
}
#footer .widget_nav_menu li:last-child {
	margin-bottom: 0 !important;
}
#footer .widget_nav_menu li:before {
	display: none !important;
}
#footer .widget_nav_menu li a {
	font: 400 17px/1.3 "Outfit", sans-serif;
	color: var(--opt-text);
	text-decoration: none;
}
#footer .widget_nav_menu li.current-menu-item > a,
#footer .widget_nav_menu li a:hover {
	color: var(--opt-blue);
}

/* Barre basse. */
#bottom-bar {
	background: var(--opt-footer-bg) !important;
	margin-top: 80px;
	padding-bottom: 20px;
}
#bottom-bar > .wf-wrap {
	max-width: 100%;
	padding: 0;
}
#bottom-bar .wf-container-bottom {
	min-height: 40px;
	padding: 0 !important;
	border: 0 !important;
}
#bottom-bar .wf-float-left {
	margin: 0 !important;
	padding: 0 !important;
	font: 300 15px/21px "Outfit", sans-serif;
	color: rgba(2, 18, 40, 0.57);
}
#bottom-bar .wf-float-left a {
	color: var(--opt-blue);
	text-decoration: underline;
}

@media (max-width: 1340px) {
	#footer > .wf-wrap,
	#bottom-bar > .wf-wrap,
	.page-title .wf-wrap,
	.masthead:not(.side-header):not(.mixed-header) .header-bar,
	#phantom .header-bar {
		padding-left: 20px !important;
		padding-right: 20px !important;
	}
}

/* Pied empilé et centré (≤ 1024 px). */
@media (max-width: 1024px) {
	#footer .opt-footer-phone {
		font-size: 25px;
	}
	#footer > .wf-wrap,
	#bottom-bar > .wf-wrap {
		padding-left: 40px !important;
		padding-right: 40px !important;
	}
	#footer .wf-container {
		display: block;
		text-align: center;
	}
	#footer .wf-container > .widget {
		display: block !important;
		width: 100% !important;
	}
	#footer .wf-container > .widget + .widget:not(:nth-child(2)) {
		margin-top: 80px !important;
	}
	#footer .widget_media_image img {
		margin: 0 auto;
	}
	#bottom-bar .wf-container-bottom,
	#bottom-bar .wf-float-left {
		float: none;
		width: 100%;
		text-align: center;
		justify-content: center;
	}
}
@media (max-width: 650px) {
	#footer > .wf-wrap,
	#bottom-bar > .wf-wrap {
		padding-left: 20px !important;
		padding-right: 20px !important;
	}
}

/* ---------- Formulaires Contact Form 7 (remplacent les formulaires Elementor Pro) ---------- */
.opt-cf7 .opt-cf7-grid {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;

}
.opt-cf7 .opt-f {
	flex: 0 0 100%;
	min-width: 0;
	margin: 0;
}
.opt-cf7 .opt-w25 { flex-basis: calc(25% - 15px); }
.opt-cf7 .opt-w33 { flex-basis: calc(33.333% - 13.34px); }
.opt-cf7 .opt-w40 { flex-basis: calc(40% - 12px); }
.opt-cf7 .opt-w50 { flex-basis: calc(50% - 10px); }
.opt-cf7 .opt-w60 { flex-basis: calc(60% - 8px); }
.opt-cf7 .opt-w66 { flex-basis: calc(66.666% - 6.67px); }
.opt-cf7 .opt-w75 { flex-basis: calc(75% - 5px); }
@media (max-width: 1024px) {
	.opt-cf7 .opt-wt100 { flex-basis: 100%; }
	.opt-cf7 .opt-wt50 { flex-basis: calc(50% - 10px); }
}
@media (max-width: 650px) {
	.opt-cf7 .opt-wm100 { flex-basis: 100%; }
}
.opt-cf7 label,
.opt-cf7 .opt-l {
	display: block;
	margin: 0;
	font: 400 17px/1.3 "Outfit", sans-serif;
	color: var(--opt-blue);
}
.opt-cf7 .opt-l {
	padding-bottom: 10px;
}
.opt-cf7 .opt-req {
	padding-left: 3.4px;
	color: var(--opt-green);
}
.opt-cf7 .wpcf7-form-control-wrap {
	display: block;
}
.opt-cf7 input[type="text"],
.opt-cf7 input[type="email"],
.opt-cf7 input[type="tel"],
.opt-cf7 input[type="url"],
.opt-cf7 input[type="number"],
.opt-cf7 input[type="date"],
.opt-cf7 select,
.opt-cf7 textarea {
	display: block;
	width: 100%;
	height: 44px;
	min-height: 44px;
	margin: 0 !important;
	padding: 7px 14px !important;
	box-sizing: border-box;
	border: 1px solid rgba(2, 18, 40, 0.17);
	border-radius: 0;
	background: #fff;
	box-shadow: none;
	font: 300 17px/1.5 "Outfit", sans-serif;
	color: var(--opt-text);
}
.opt-cf7 textarea {
	height: auto;
	resize: vertical;
}
.opt-cf7 ::placeholder {
	color: var(--opt-text);
	opacity: 1;
}
.opt-cf7 .opt-submit {
	position: relative;
}
.opt-cf7 input[type="submit"],
.opt-cf7 .wpcf7-submit {
	display: block !important;
	width: 100% !important;
	height: 50px !important;
	min-height: 50px !important;
	margin: 0 !important;
	padding: 6px 28px !important;
	border: 0 !important;
	border-radius: 100px !important;
	background: var(--opt-blue) !important;
	color: #fff !important;
	font: 400 17px/1 "Outfit", sans-serif !important;
	cursor: pointer;
}
.opt-cf7 input[type="submit"]:hover {
	background: var(--opt-blue);
	opacity: 0.9;
}
.opt-cf7 .wpcf7-spinner {
	position: absolute;
	right: 20px;
	top: 13px;
	margin: 0;
}
.opt-cf7 .wpcf7-list-item {
	margin: 0 16px 0 0;
}
.opt-cf7 .wpcf7-not-valid-tip,
.opt-cf7 .wpcf7-response-output {
	font: 400 15px/1.4 "Outfit", sans-serif;
}

/* ---------- Carrousels (remplacent the7-multipurpose-scroller) ---------- */
.opt-scroller.e-con-full,
.opt-scroller > .e-con-inner {
	overflow-x: auto;
	overflow-y: hidden;
	scroll-snap-type: x proximity;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
	cursor: grab;
}
.opt-scroller.e-con-full::-webkit-scrollbar,
.opt-scroller > .e-con-inner::-webkit-scrollbar {
	display: none;
}
.opt-scroller.is-dragging {
	cursor: grabbing;
	scroll-snap-type: none;
	user-select: none;
}
.opt-scroller > .opt-card,
.opt-scroller > .e-con-inner > .opt-card {
	flex: 0 0 var(--opt-slide, 410px) !important;
	width: var(--opt-slide, 410px) !important;
	max-width: none !important;
	scroll-snap-align: center;
}
/* Largeur minimale des cartes (réglage « slides min width » d'origine) ; une carte par écran sur mobile. */
.opt-slide-300 { --opt-slide: 300px; }
.opt-slide-350 { --opt-slide: 350px; }
.opt-slide-380 { --opt-slide: 380px; }
.opt-slide-410 { --opt-slide: 410px; }
.opt-slide-600 { --opt-slide: 600px; }
@media (max-width: 1024px) {
	.opt-slide-t-250 { --opt-slide: 250px; }
	.opt-slide-t-300 { --opt-slide: 300px; }
}
@media (max-width: 650px) {
	.opt-scroller { --opt-slide: 100%; }
	.opt-slide-m-200 { --opt-slide: 200px; }
	.opt-slide-m-250 { --opt-slide: 250px; }
}
.opt-progress {
	position: relative;
	width: 400px;
	max-width: 90%;
	height: 3px;
	margin: 22px auto 0;
	border-radius: 100px;
	background: #d4e4ff;
	overflow: hidden;
}
.opt-progress > span {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	border-radius: 100px;
	background: var(--opt-blue);
}
.opt-progress[hidden] {
	display: none;
}

/* ---------- Grilles d'articles et filtres (remplacent the7-post-loop) ---------- */
.opt-grid > .opt-card[hidden] {
	display: none !important;
}
.opt-filter {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 10px 30px;
	margin: 0; /* marges d'origine portées par le widget HTML (réglage « Marge » d'Elementor) */
}
.opt-filter a {
	font: 500 15px/1.2 "Outfit", sans-serif;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--opt-filter-color, var(--opt-blue));
	transition: color 0.2s;
}
.opt-filter a:hover {
	color: var(--opt-filter-hover, var(--opt-filter-active, var(--opt-green)));
}
.opt-filter a.act {
	color: var(--opt-filter-active, var(--opt-green));
}
@media (max-width: 1024px) {
	.opt-filter {
		gap: 10px 20px;
	}
}
/* Étiquettes de catégories (remplacent le widget the7-taxonomies dans les cartes). */
.opt-terms {
	display: flex;
	flex-wrap: wrap;
	gap: 5px;
}
.opt-term {
	display: inline-block;
	padding: 4px 8px 4px 10px;
	border: 1px solid #ffffff54;
	border-radius: 100px;
	background: #e5eeff;
	font: 500 0.75rem/1.2 "Outfit", sans-serif;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--opt-blue);
}

/* Barre de progression des carrousels : 400 × 5 px, 17 px sous le carrousel, sans occuper de place (comme The7). */
.opt-progress {
	position: absolute !important;
	left: 50%;
	height: 5px !important;
	margin: 0 !important;
	transform: translateX(-50%);
	background: #d4e4ff;
}
.opt-progress > span {
	background: rgba(44, 116, 255, 0.21);
}
.opt-progress-light + .opt-progress,
.opt-progress-light > .opt-progress {
	background: rgba(255, 255, 255, 0.15);
}
.opt-progress-light + .opt-progress > span,
.opt-progress-light > .opt-progress > span {
	background: rgba(255, 255, 255, 0.15);
}
@media (max-width: 650px) {
	.opt-progress {
		width: 90%;
	}
}
/* Contenu d'article figé (ex-widget theme-post-content) : marge du dernier paragraphe conservée. */
.opt-post-content p:last-child {
	margin-bottom: 10px !important;
}

/* Superposition des cartes (ex-gabarits « the7-overlay-template ») : posée en bas de l'image. */
.opt-has-overlay {
	position: relative;
}
.opt-has-overlay > .opt-overlay,
.opt-has-overlay > .e-con-inner > .opt-overlay {
	position: absolute !important;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 10 !important;
	width: 100% !important;
	pointer-events: none;
	transition: opacity 0.3s ease;
}
.opt-overlay a {
	pointer-events: auto;
}
.opt-overlay-hover,
.opt-overlay-hover-desktop {
	opacity: 0;
}
.opt-has-overlay:hover > .opt-overlay,
.opt-has-overlay:hover > .e-con-inner > .opt-overlay {
	opacity: 1;
}
@media (max-width: 1200px) {
	.opt-overlay-hover-desktop {
		opacity: 1;
	}
}
/* Étiquettes blanches dans les superpositions (réglages du gabarit d'origine). */
.opt-overlay .opt-term {
	border-color: #ffffff7d;
	background: #ffffff36;
	color: #fff;
	font-size: 0.78rem;
}