/*
Theme Name:   FNAM (Bridge)
Theme URI:    https://www.fnam.fr/
Description:  Thème enfant de Bridge aux couleurs de la FNAM. Reprend automatiquement les menus et le CSS additionnel du thème Bridge à l'activation. Les fonctions inutiles de Bridge se désactivent avec le plugin « FNAM – Allègement Bridge ».
Author:       FNAM
Template:     bridge
Version:      1.0.1
Requires PHP: 7.4
Text Domain:  fnam-bridge
*/

/* ==========================================================================
   Palette officielle FNAM (identique au Design System colors_and_type.css).
   Redéclarée ici pour que le thème reste juste même sur une page qui ne
   charge pas le Design System.
   ========================================================================== */
:root {
	--fnam-bleu-roi: #326191;
	--fnam-bleu-roi-700: #2b5683;
	--fnam-bleu-roi-900: #1c3a59;
	--fnam-bleu-nuit: #21384D;
	--fnam-bleu-gris: #5092b6;
	--fnam-rouge-bordeaux: #be3c3f;
	--fnam-terracotta: #C77165;
	--fnam-cyan-pale: #70b4be;
	--fnam-ivory: #fbf8f1;
	--fnam-paper: #f6f1e7;
	--fnam-paper-edge: #e6dcc6;
	--fnam-ink-900: #1a1a1a;
}

/* Sélection de texte et focus clavier */
::selection {
	background: var(--fnam-bleu-roi);
	color: #fff;
}
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
	outline: 3px solid var(--fnam-bleu-roi);
	outline-offset: 2px;
}

/* ==========================================================================
   En-tête Bridge
   ========================================================================== */
.mobile_menu_button span,
.mobile_menu_button i {
	color: var(--fnam-bleu-nuit);
}
.side_menu_button a.side_menu_button_link,
.side_menu_button a.side_menu_button_link i {
	color: var(--fnam-bleu-nuit);
	transition: color .2s ease;
}
.side_menu_button a.side_menu_button_link:hover,
.side_menu_button a.side_menu_button_link:hover i {
	color: var(--fnam-rouge-bordeaux);
}

/* Menu mobile (☰) */
nav.mobile_menu {
	background-color: var(--fnam-ivory);
}
/* Liseré seulement sur la liste : sur le <nav> lui-même, il restait visible menu fermé (1.0.0). */
nav.mobile_menu > ul {
	border-top: 3px solid var(--fnam-rouge-bordeaux);
}
nav.mobile_menu ul li a,
nav.mobile_menu ul li h3 {
	color: var(--fnam-bleu-nuit);
	border-bottom-color: var(--fnam-paper-edge);
}
nav.mobile_menu ul li a:hover,
nav.mobile_menu ul li.active > a,
nav.mobile_menu ul li.current-menu-item > a {
	color: var(--fnam-rouge-bordeaux);
}

/* Panneau latéral « Espace adhérents » */
.side_menu {
	background-color: var(--fnam-bleu-nuit);
	border-left: 4px solid var(--fnam-rouge-bordeaux);
}
.side_menu h5,
.side_menu .widget h5 {
	color: var(--fnam-ivory);
	letter-spacing: .12em;
	text-transform: uppercase;
}
.side_menu a,
.side_menu li a {
	color: rgba(251, 248, 241, .85);
}
.side_menu a:hover,
.side_menu li a:hover,
.side_menu li.current-menu-item > a {
	color: var(--fnam-cyan-pale);
}
.side_menu a.close_side_menu,
.side_menu a.close_side_menu:before {
	color: var(--fnam-ivory);
}

/* Bouton « haut de page » */
#back_to_top span {
	background-color: var(--fnam-bleu-nuit);
	border-color: var(--fnam-bleu-nuit);
}
#back_to_top:hover span {
	background-color: var(--fnam-rouge-bordeaux);
	border-color: var(--fnam-rouge-bordeaux);
}

/* Barre de chargement / ajax Bridge */
.ajax_loader_html .pulse,
.ajax_loader .pulse {
	background-color: var(--fnam-bleu-roi);
}

/* ==========================================================================
   Page Contact (page-id-198531) — mise en page FNAM
   ========================================================================== */
body.page-id-198531 .wrapper,
body.page-id-198531 .full_width {
	background: transparent !important;
}
body.page-id-198531 .content,
body.page-id-198531 .content_inner {
	background:
		radial-gradient(1200px 500px at 85% -10%, rgba(112, 180, 190, .14), transparent 60%),
		linear-gradient(180deg, #fbf8f1 0%, #f6f1e7 100%);
}
body.page-id-198531 .content_inner > .full_width > .full_width_inner > .wpb-content-wrapper > .vc_row:first-child > .full_section_inner {
	max-width: 1180px;
	margin: 0 auto;
	padding: 56px 24px 72px;
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 0;
}

/* ---------- Colonne de gauche : introduction ---------- */
body.page-id-198531 .contactRouteIntro {
	padding: 8px 8px 0 0;
}
body.page-id-198531 .contactRouteIntro .eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	color: #326191;
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .18em;
	text-transform: uppercase;
}
body.page-id-198531 .contactRouteIntro .eyebrow::before {
	content: "";
	width: 36px;
	height: 3px;
	border-radius: 3px;
	background: #be3c3f;
}
body.page-id-198531 .contactRouteIntro h1 {
	margin: 18px 0 20px;
	color: #21384D !important;
	font-size: clamp(44px, 5.4vw, 76px);
	line-height: .98;
	letter-spacing: -.02em;
}
body.page-id-198531 .contactRouteIntro .lead {
	max-width: 470px;
	color: #3d3d3d !important;
	font-size: 18px;
	line-height: 1.6;
}
body.page-id-198531 .contactRouteNote {
	display: flex;
	gap: 16px;
	align-items: flex-start;
	margin-top: 28px;
	max-width: 480px;
	padding: 20px 22px;
	background: #fff;
	border: 1px solid #e6dcc6;
	border-left: 4px solid #be3c3f;
	border-radius: 14px;
	box-shadow: 0 10px 28px rgba(33, 56, 77, .07);
}
body.page-id-198531 .contactRouteNoteIcon {
	flex: 0 0 42px;
	display: grid;
	place-items: center;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	background: #21384D;
	color: #fbf8f1;
	font-weight: 800;
}
body.page-id-198531 .contactRouteNote p {
	margin: 0;
	color: #21384D !important;
	font-size: 15px;
	line-height: 1.55;
}

/* ---------- Colonne de droite : les deux cartes ---------- */
body.page-id-198531 .vc_row.card {
	position: relative;
	height: auto !important;
	overflow: visible !important;
	margin: 0 !important;
	padding: 34px 34px 30px !important;
	background: #fff !important;
	border: 1px solid #e6dcc6 !important;
	border-radius: 18px !important;
	box-shadow: 0 18px 40px rgba(33, 56, 77, .08) !important;
}
body.page-id-198531 .vc_row.card .full_section_inner,
body.page-id-198531 .vc_row.card .vc_column-inner,
body.page-id-198531 .vc_row.card .wpb_wrapper,
body.page-id-198531 .vc_row.card .wpb_raw_html {
	padding: 0 !important;
	margin: 0 !important;
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
}
body.page-id-198531 .vc_row.card h2 {
	margin: 0 0 8px;
	color: #21384D !important;
	font-size: 26px;
	letter-spacing: .01em;
}
body.page-id-198531 .vc_row.card h2 + p,
body.page-id-198531 .vc_row.card p.notice {
	margin: 0 0 20px;
	padding: 0;
	border: 0;
	color: #5a5a5a !important;
	font-size: 15px;
	line-height: 1.55;
}
body.page-id-198531 .vc_row.card p.notice {
	background: transparent !important;
	box-shadow: none !important;
}
body.page-id-198531 .vc_row.card p.notice::before {
	display: none;
}
body.page-id-198531 .vc_empty_space {
	height: 22px !important;
}

/* Liste des contacts */
body.page-id-198531 .contactRouteList {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}
body.page-id-198531 .contactRouteList li {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 6px 16px;
	margin: 0 !important;
	padding: 14px 0 !important;
	border-top: 1px solid #efe7d6;
	color: #5a5a5a !important;
	font-size: 14px;
	letter-spacing: .02em;
	list-style: none !important;
}
body.page-id-198531 .contactRouteList li::before,
body.page-id-198531 .contactRouteList li::marker {
	content: none !important;
	display: none !important;
}
body.page-id-198531 .contactRouteList li:last-child {
	padding-bottom: 0 !important;
}
body.page-id-198531 .contactRouteValue,
body.page-id-198531 .contactRouteList li > strong,
body.page-id-198531 .contactRouteList li > b {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	color: #21384D !important;
	font-size: 15px;
	font-weight: 700;
}
body.page-id-198531 .contactRouteValue a:not(.contactRouteMailIcon) {
	color: #326191 !important;
	text-decoration: none;
	border-bottom: 1px solid rgba(50, 97, 145, .25);
}
body.page-id-198531 .contactRouteValue a:not(.contactRouteMailIcon):hover {
	color: #be3c3f !important;
	border-bottom-color: currentColor;
}
body.page-id-198531 .contactRouteMailIcon {
	display: inline-grid !important;
	place-items: center;
	width: 30px;
	height: 30px;
	border-radius: 50%;
	background: #e3ecf4 !important;
	color: #326191 !important;
	border: 0 !important;
	transition: background .2s, color .2s;
}
body.page-id-198531 .contactRouteMailIcon:hover {
	background: #326191 !important;
	color: #fff !important;
}
body.page-id-198531 .contactRouteMailIcon svg {
	width: 16px;
	height: 16px;
	fill: currentColor;
}

/* ---------- Formulaire (Contact Form 7) ---------- */
body.page-id-198531 .wpcf7-form > p {
	margin: 0 0 18px;
}
body.page-id-198531 .wpcf7-form label {
	display: block;
	color: #21384D !important;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .04em;
}
body.page-id-198531 .wpcf7-form label br {
	display: none;
}
body.page-id-198531 .wpcf7-form-control-wrap {
	display: block;
	margin-top: 7px;
}
body.page-id-198531 .wpcf7-form input[type="text"],
body.page-id-198531 .wpcf7-form input[type="email"],
body.page-id-198531 .wpcf7-form input[type="tel"],
body.page-id-198531 .wpcf7-form textarea {
	width: 100% !important;
	box-sizing: border-box;
	margin: 0 !important;
	padding: 13px 15px !important;
	background: #fbf8f1 !important;
	border: 1px solid #d9cfb9 !important;
	border-radius: 10px !important;
	color: #1a1a1a !important;
	font-size: 15px !important;
	font-weight: 400;
	letter-spacing: 0;
	box-shadow: none !important;
	transition: border-color .2s, box-shadow .2s, background .2s;
}
body.page-id-198531 .wpcf7-form textarea {
	min-height: 170px;
	resize: vertical;
	line-height: 1.55;
}
body.page-id-198531 .wpcf7-form input[type="text"]:hover,
body.page-id-198531 .wpcf7-form input[type="email"]:hover,
body.page-id-198531 .wpcf7-form textarea:hover {
	border-color: #9ab6d2 !important;
}
body.page-id-198531 .wpcf7-form input[type="text"]:focus,
body.page-id-198531 .wpcf7-form input[type="email"]:focus,
body.page-id-198531 .wpcf7-form input[type="tel"]:focus,
body.page-id-198531 .wpcf7-form textarea:focus {
	outline: none;
	background: #fff !important;
	border-color: #326191 !important;
	box-shadow: 0 0 0 4px rgba(50, 97, 145, .15) !important;
}
body.page-id-198531 .wpcf7-not-valid {
	border-color: #be3c3f !important;
	background: #fdf4f3 !important;
}
body.page-id-198531 .wpcf7-not-valid-tip {
	margin-top: 6px;
	color: #be3c3f;
	font-size: 13px;
	font-weight: 600;
}

/* Case Cloudflare et bouton */
body.page-id-198531 .wpcf7-form .cf-turnstile {
	margin: 6px 0 22px;
}
body.page-id-198531 .wpcf7-form input[type="submit"],
body.page-id-198531 .wpcf7-form .wpcf7-submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 52px;
	padding: 0 34px !important;
	background: #326191 !important;
	border: 0 !important;
	border-radius: 999px !important;
	color: #fff !important;
	font-size: 14px !important;
	font-weight: 800 !important;
	letter-spacing: .14em !important;
	text-transform: uppercase;
	box-shadow: 0 10px 22px rgba(50, 97, 145, .28);
	cursor: pointer;
	transition: background .2s, transform .2s, box-shadow .2s;
}
body.page-id-198531 .wpcf7-form input[type="submit"]:hover,
body.page-id-198531 .wpcf7-form .wpcf7-submit:hover {
	background: #21384D !important;
	transform: translateY(-1px);
	box-shadow: 0 14px 28px rgba(33, 56, 77, .3);
}
body.page-id-198531 .wpcf7-form input[type="submit"]:disabled {
	opacity: .55;
	cursor: not-allowed;
	transform: none;
}
body.page-id-198531 .wpcf7 .wpcf7-spinner {
	margin-left: 14px;
}
body.page-id-198531 .wpcf7 form .wpcf7-response-output {
	margin: 18px 0 0 !important;
	padding: 12px 16px !important;
	border-radius: 10px;
	font-size: 14px;
}
body.page-id-198531 .wpcf7 form.sent .wpcf7-response-output {
	border-color: #2e7d32 !important;
	background: #eef7ee;
	color: #1d5c21;
}
body.page-id-198531 .wpcf7 form.invalid .wpcf7-response-output,
body.page-id-198531 .wpcf7 form.failed .wpcf7-response-output {
	border-color: #be3c3f !important;
	background: #fdf4f3;
	color: #8f2a2d;
}

/* Mentions sous le formulaire */
body.page-id-198531 .vc_row.card .wpb_text_column {
	margin-top: 22px !important;
	padding-top: 18px !important;
	border-top: 1px solid #efe7d6 !important;
}
body.page-id-198531 .vc_row.card .wpb_text_column p {
	color: #7a7a7a !important;
	font-size: 12.5px !important;
	line-height: 1.6 !important;
}

/* ---------- Tablette et mobile ---------- */
@media (max-width: 1000px) {
	body.page-id-198531 .content_inner > .full_width > .full_width_inner > .wpb-content-wrapper > .vc_row:first-child > .full_section_inner {
		padding: 36px 20px 56px;
	}
	body.page-id-198531 .contactRouteIntro {
		padding: 0 0 28px;
	}
	body.page-id-198531 .contactRouteNote,
	body.page-id-198531 .contactRouteIntro .lead {
		max-width: none;
	}
	/* Les colonnes gardaient 70 px de marge de chaque côté : texte trop serré sur mobile */
	body.page-id-198531 .content_inner .vc_row:first-child > .full_section_inner > .vc_col-sm-6 {
		width: 100% !important;
	}
	body.page-id-198531 .content_inner .vc_row:first-child > .full_section_inner > .vc_col-sm-6 > .vc_column-inner {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}
}
@media (max-width: 600px) {
	body.page-id-198531 .vc_row.card {
		padding: 26px 20px 22px !important;
		border-radius: 16px !important;
	}
		body.page-id-198531 .vc_row.card h2 {
		font-size: 22px;
	}
	body.page-id-198531 .contactRouteList li {
		display: block;
	}
	body.page-id-198531 .contactRouteValue {
		margin-top: 4px;
		display: flex;
	}
	body.page-id-198531 .wpcf7-form input[type="submit"] {
		width: 100%;
	}
}
