/* =====================================================
   FAFECA — ELEMENTOR OVERRIDES & GLOBAL STYLE ENFORCEMENT
   ===================================================== */

/* ── 1. GLOBAL FONT & COLOR VARIABLES (sync with Elementor Kit) ─────── */
:root {
	--e-global-color-primary:   #002E6D;
	--e-global-color-secondary: #D71920;
	--e-global-color-accent:    #009739;
	--e-global-color-text:      #0F1B2D;
	--e-global-typography-primary-font-family:   'Inter';
	--e-global-typography-secondary-font-family: 'Inter';
	--e-global-typography-text-font-family:      'Inter';
	--e-global-typography-accent-font-family:    'Inter';
}

/* ── 2. ELEMENTOR TYPOGRAPHY — force Inter on all widgets ─────────────── */
.elementor-widget,
.elementor-widget *,
.elementor-element,
.elementor-element * {
	font-family: 'Inter', sans-serif !important;
}

/* Remixicon exception — specificity 0,0,2,0 > 0,0,1,0 above → remixicon gagne */
.elementor-widget [class^="ri-"],
.elementor-widget [class*=" ri-"],
.elementor-element [class^="ri-"],
.elementor-element [class*=" ri-"] {
	font-family: 'remixicon' !important;
}

.elementor-widget-heading .elementor-heading-title {
	font-family: 'Inter', sans-serif !important;
	font-weight: 700;
	color: var(--color-primary);
}

.elementor-widget-text-editor,
.elementor-widget-text-editor p,
.elementor-widget-text-editor li {
	font-family: 'Inter', sans-serif !important;
	color: var(--color-dark);
	line-height: 1.7;
}

/* ── 3. ELEMENTOR BUTTONS — sweep animation identique au btn-primary ─── */
.elementor-button,
.elementor-button-wrapper .elementor-button {
	font-family: 'Inter', sans-serif !important;
	font-weight: 600 !important;
	border-radius: 9999px !important;
	letter-spacing: .01em;
	border: none !important;
	position: relative !important;
	overflow: hidden !important;
	isolation: isolate;
	transition: color .25s ease, box-shadow .3s ease !important;
}

/* Sweep overlay — même mécanique que .btn::before */
.elementor-button::before,
.elementor-button-wrapper .elementor-button::before {
	content: '';
	position: absolute;
	inset: 0;
	border-radius: inherit;
	background: var(--color-primary); /* bleu par défaut */
	transform: translateX(-101%);
	transition: transform .48s cubic-bezier(.4, 0, .2, 1);
	z-index: -1;
}
.elementor-button:hover::before,
.elementor-button-wrapper .elementor-button:hover::before {
	transform: translateX(0);
}

/* Texte et icône toujours au-dessus du sweep */
.elementor-button .elementor-button-content-wrapper {
	position: relative;
	z-index: 1;
}

.elementor-button.elementor-button-link,
a.elementor-button {
	display: inline-flex;
	align-items: center;
	gap: .5rem;
}

/* Variante rouge (bg rouge → sweep bleu, défaut) */
.elementor-button[style*="background-color: #D71920"],
.elementor-button[style*="background-color: rgb(215, 25, 32)"],
.e-btn-custom-primary {
	background: var(--color-red) !important;
	color: #fff !important;
}
.elementor-button[style*="background-color: #D71920"]:hover,
.e-btn-custom-primary:hover {
	box-shadow: 0 6px 22px rgba(0,46,109,.28) !important;
}

/* Variante bleue (bg bleu → sweep rouge) */
.elementor-button[style*="background-color: #002E6D"],
.elementor-button[style*="background-color: rgb(0, 46, 109)"],
.e-btn-custom-secondary {
	background: var(--color-primary) !important;
	color: #fff !important;
}
.elementor-button[style*="background-color: #002E6D"]::before,
.e-btn-custom-secondary::before {
	background: var(--color-red);
}
.elementor-button[style*="background-color: #002E6D"]:hover,
.e-btn-custom-secondary:hover {
	box-shadow: 0 6px 22px rgba(215,25,32,.28) !important;
}

/* ── 4. ELEMENTOR IMAGES — rounded corners ───────────────────────────── */
.elementor-widget-image .elementor-image img,
.elementor-widget-image img {
	border-radius: var(--radius-lg);
}

.elementor-widget-image-box .elementor-image-box-img img {
	border-radius: var(--radius-md);
}

/* ── 5. SECTION / CONTAINER LAYOUT ──────────────────────────────────── */
.elementor-section.elementor-section-boxed > .elementor-container,
.e-con-inner {
	max-width: var(--container-max);
}

/* Hero section pulls up behind transparent header */
.has-transparent-header .elementor-section:first-of-type,
.has-transparent-header .e-con:first-of-type {
	margin-top: calc(-1 * var(--header-height, 80px));
}

/* Page main padding when not Elementor full-page template */
.elementor-page:not(.elementor-template-full-width) .site-main {
	padding-top: 0;
}

/* ── 6. ICON BOX WIDGET ──────────────────────────────────────────────── */
.elementor-icon-box-icon .elementor-icon i,
.elementor-icon-box-icon .elementor-icon svg {
	color: var(--color-red);
	transition: color var(--transition);
}
.elementor-widget-icon-box:hover .elementor-icon-box-icon .elementor-icon i {
	color: var(--color-primary);
}

/* ── 7. ICON LIST ────────────────────────────────────────────────────── */
.elementor-icon-list-item {
	padding: .35rem 0;
}
.elementor-icon-list-icon i {
	color: var(--color-red) !important;
}

/* ── 8. DIVIDER ──────────────────────────────────────────────────────── */
.elementor-divider-separator {
	border-color: var(--color-border);
}

/* ── 9. TESTIMONIAL / REVIEW ─────────────────────────────────────────── */
.elementor-testimonial__name {
	font-family: 'Inter', sans-serif !important;
	font-weight: 700;
	color: var(--color-primary);
}

/* ── 10. COUNTER WIDGET ──────────────────────────────────────────────── */
.elementor-counter-number-wrapper {
	font-family: 'Inter', sans-serif !important;
	font-weight: 800;
	color: var(--color-primary);
}

/* ── 11. CONTACT FORM 7 & GRAVITY FORMS ─────────────────────────────── */
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form textarea,
.wpcf7-form select,
.gfield input,
.gfield textarea,
.gfield select {
	width: 100%;
	padding: .75rem 1rem;
	border: 1.5px solid var(--color-border);
	border-radius: var(--radius-md);
	font-family: 'Inter', sans-serif;
	font-size: .95rem;
	color: var(--color-dark);
	transition: border-color .25s, box-shadow .25s;
	outline: none;
}

.wpcf7-form input:focus,
.wpcf7-form textarea:focus,
.gfield input:focus,
.gfield textarea:focus {
	border-color: var(--color-primary);
	box-shadow: 0 0 0 3px rgba(0,46,109,.10);
}

.wpcf7-submit,
.gform_button {
	background: var(--color-red);
	color: #fff;
	border: none;
	border-radius: 9999px;
	padding: .78rem 1.85rem;
	font-family: 'Inter', sans-serif;
	font-weight: 600;
	font-size: .95rem;
	cursor: pointer;
	position: relative;
	overflow: hidden;
	isolation: isolate;
	transition: color .25s ease, box-shadow .3s ease;
}
.wpcf7-submit::before,
.gform_button::before {
	content: '';
	position: absolute;
	inset: 0;
	border-radius: inherit;
	background: var(--color-primary);
	transform: translateX(-101%);
	transition: transform .48s cubic-bezier(.4, 0, .2, 1);
	z-index: -1;
}
.wpcf7-submit:hover::before,
.gform_button:hover::before {
	transform: translateX(0);
}
.wpcf7-submit:hover,
.gform_button:hover {
	box-shadow: 0 6px 22px rgba(0,46,109,.28);
}

/* ── 12. CARDS IN ELEMENTOR ──────────────────────────────────────────── */
.elementor-widget-image-box .elementor-image-box-wrapper {
	transition: transform .25s ease, box-shadow .25s ease;
}
.elementor-widget-image-box:hover .elementor-image-box-wrapper {
	transform: translateY(-4px);
	box-shadow: var(--shadow-md);
}

/* ── 13. POLYLANG LANGUAGE SWITCHER ─────────────────────────────────── */
.pll-parent-menu-item > a {
	display: flex;
	align-items: center;
	gap: .4rem;
}

/* ── 14. ENTRY CONTENT (single post) ────────────────────────────────── */
.entry-content {
	max-width: 800px;
	margin: 0 auto;
	font-family: 'Inter', sans-serif;
	font-size: 1.05rem;
	line-height: 1.8;
	color: var(--color-dark);
}
.entry-content h2,
.entry-content h3 {
	margin-top: 2.25rem;
	margin-bottom: 1rem;
	color: var(--color-primary);
}
.entry-content img {
	border-radius: var(--radius-md);
	margin: 1.75rem auto;
}
.entry-content blockquote {
	border-left: 4px solid var(--color-red);
	margin: 1.75rem 0;
	padding: 1.1rem 1.5rem;
	background: var(--color-light);
	border-radius: 0 var(--radius-md) var(--radius-md) 0;
	font-style: italic;
	color: var(--color-gray);
}
.entry-content a {
	color: var(--color-red);
	text-decoration: underline;
}
.entry-content a:hover {
	color: var(--color-primary);
}

/* ── 15. POST META ───────────────────────────────────────────────────── */
.post-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 1.25rem;
	font-size: .85rem;
	color: var(--color-gray);
	margin-bottom: 2rem;
	padding-bottom: 1.5rem;
	border-bottom: 1px solid var(--color-border);
}
.post-meta i { color: var(--color-red); }

/* ── 16. PERFORMANCE: reduce repaints ────────────────────────────────── */
.elementor-widget,
.elementor-element {
	will-change: auto;
}

/* ── 17. PARTNER LOGOS — toujours pleine opacité, pas de filtre au survol */
.part-logo-box img {
    opacity: 1 !important;
    filter: none !important;
    transition: opacity .25s ease, transform .25s ease !important;
}
.part-logo-box:hover img {
    opacity: 1 !important;
    filter: none !important;
}

/* ══════════════════════════════════════════════════════════════════════
   18. RESPONSIVE OVERRIDES — passe complète mobile/tablette
   ══════════════════════════════════════════════════════════════════════ */

/* ── Tablette ≤1024px ─────────────────────────────────────────────── */
@media (max-width: 1024px) {

	/* Padding sections (snapshots Elementor ont style="padding:Xrem 0" inline)  */
	section[style*="padding:5rem"],  section[style*="padding: 5rem"],
	section[style*="padding:4rem"],  section[style*="padding: 4rem"],
	.section {
		padding-top:    3rem !important;
		padding-bottom: 3rem !important;
	}

	/* Champs de formulaire Elementor : pleine largeur */
	.elementor-field-group { width: 100% !important; }

	/* Colonnes Elementor empilées */
	.elementor-column { width: 100% !important; }
	.e-con           { flex-direction: column !important; }
	.e-con-inner     { flex-direction: column !important; }

	/* ── Grilles de cartes (inline style → besoin de !important) ── */
	/* Toutes les cards-grid : 2 colonnes sur tablette */
	.cards-grid,
	[style*="grid-template-columns:repeat(3,1fr)"],
	[style*="grid-template-columns:repeat(4,1fr)"],
	[style*="grid-template-columns: repeat(3, 1fr)"],
	[style*="grid-template-columns: repeat(4, 1fr)"] {
		grid-template-columns: repeat(2, 1fr) !important;
	}

	/* Sections about / values : empiler les colonnes */
	.fafeca-about, .fafeca-values-grid { flex-direction: column !important; }
	.fafeca-about .about-img-col,   .fafeca-values-grid .vals-img-col,
	.fafeca-about .about-text-col,  .fafeca-values-grid .vals-text-col {
		width: 100% !important;
	}

	/* Team grid (equipe.html) — pas de cards-mobile-carousel */
	.fafeca-team-grid .cards-grid {
		grid-template-columns: repeat(2, 1fr) !important;
	}

	/* Sidebar archves cachée sur tablette */
	.archive-layout--sidebar { grid-template-columns: 1fr !important; }
	.archive-sidebar { display: none !important; }
}

/* ── Mobile ≤768px ────────────────────────────────────────────────── */
@media (max-width: 768px) {

	/* Padding sections réduit */
	section[style*="padding:5rem"],  section[style*="padding: 5rem"],
	section[style*="padding:4rem"],  section[style*="padding: 4rem"],
	.section {
		padding-top:    2rem !important;
		padding-bottom: 2rem !important;
	}

	/* Toutes les grilles inline et .cards-grid → 1 colonne */
	.cards-grid,
	[style*="grid-template-columns:repeat(2,1fr)"],
	[style*="grid-template-columns:repeat(3,1fr)"],
	[style*="grid-template-columns:repeat(4,1fr)"],
	[style*="grid-template-columns: repeat(2, 1fr)"],
	[style*="grid-template-columns: repeat(3, 1fr)"],
	[style*="grid-template-columns: repeat(4, 1fr)"] {
		grid-template-columns: 1fr !important;
	}

	/* Sauf les grilles de formulaire internes (champs côte à côte) :
	   déjà gérées individuellement ci-dessous */

	/* Grilles formulaires inline : 1 col */
	[style*="grid-template-columns:1fr 1fr"],
	[style*="grid-template-columns: 1fr 1fr"],
	[style*="grid-template-columns:1fr 1fr 1fr"],
	[style*="grid-template-columns: 1fr 1fr 1fr"],
	.fafeca-contact-form [style*="grid-template-columns"],
	.fafeca-form-wrap    [style*="grid-template-columns"] {
		grid-template-columns: 1fr !important;
	}

	/* Stats (div inline sans classe, e.g. nos-actions) */
	.fafeca-stats .container > div[style*="grid-template"] {
		grid-template-columns: repeat(2, 1fr) !important;
		max-width: 100% !important;
	}

	/* Stats about (flex wrap) */
	.about-stats {
		flex-wrap: wrap;
		gap: 1rem !important;
	}
	.about-stats > div {
		flex: 1 1 calc(50% - .5rem) !important;
		min-width: 0;
	}

	/* Typographie hero */
	.fafeca-hero h1  { font-size: clamp(1.6rem, 7vw, 2.4rem) !important; }
	.fafeca-hero p   { font-size: 1rem !important; }

	/* Boutons hero : restent en ligne, wrap naturel */
	.fafeca-hero .btn-group,
	.fafeca-hero [style*="display:flex"][style*="gap:1rem"] {
		flex-wrap: wrap !important;
		gap: .75rem !important;
	}

	/* Images full-width */
	.fafeca-about .about-img-col img,
	.fafeca-values-grid .vals-img-col img {
		width: 100% !important;
		max-width: 100% !important;
	}

	/* Logos partenaires : 2 par ligne */
	.partners-grid { grid-template-columns: repeat(2, 1fr) !important; }

	/* Conteneurs Elementor */
	.elementor-section .elementor-row { flex-direction: column !important; }

	/* ── Conteneurs boxed Elementor (contacts, devenir-membre/partenaire) ──
	   Les CSS Elementor de ces pages fixent --content-width à 310-320px sur
	   mobile → max-width rigide qui crée un espace mort à droite et à gauche.
	   On annule cette contrainte et on donne de l'air au container. */
	.e-con-boxed {
		padding-left:  clamp(.75rem, 4vw, 1.5rem) !important;
		padding-right: clamp(.75rem, 4vw, 1.5rem) !important;
		box-sizing: border-box !important;
	}
	.e-con-boxed > .e-con-inner {
		max-width: 100% !important;
		width:     100% !important;
		box-sizing: border-box !important;
	}

	/* ── Formulaires : réduire le padding interne ──
	   .fafeca-form-wrap a padding:2.5rem en style inline → !important requis */
	.fafeca-form-wrap {
		padding:       1.25rem !important;
		border-radius: 16px   !important;
	}

	/* Team grid : 2 colonnes sur mobile aussi (images + noms lisibles) */
	.fafeca-team-grid .cards-grid {
		grid-template-columns: repeat(2, 1fr) !important;
	}

	/* Section titre responsive */
	.section-title  { font-size: 1.6rem !important; line-height: 1.25 !important; }
	.section-eyebrow { font-size: .72rem !important; }
}

/* ── Petit mobile ≤480px ──────────────────────────────────────────── */
@media (max-width: 480px) {

	/* Stats nos-actions → 1 colonne */
	.fafeca-stats .container > div[style*="grid-template"] {
		grid-template-columns: 1fr !important;
	}

	/* Team grid → 1 colonne sur très petit écran */
	.fafeca-team-grid .cards-grid {
		grid-template-columns: 1fr !important;
	}

	/* Boutons hero : auto-width, centrés */
	.fafeca-hero .btn,
	.fafeca-hero .btn-primary,
	.fafeca-hero .btn-green {
		width: auto;
		justify-content: center;
	}

	/* Carousel nav : réduire padding latéral */
	[style*="padding:0 54px"], [style*="padding: 0 54px"],
	[style*="padding:0 50px"], [style*="padding: 0 50px"] {
		padding-left: 28px !important;
		padding-right: 28px !important;
	}

	/* Formulaires encore plus compacts */
	.fafeca-form-wrap {
		padding:       1rem !important;
		border-radius: 12px !important;
	}

	/* Titres encore plus compacts */
	.section-title { font-size: 1.35rem !important; }
}

/* ── 19. PRINT ───────────────────────────────────────────────────────── */
@media print {
	.site-header,
	.site-footer,
	#back-to-top,
	.mobile-menu-toggle,
	.mobile-overlay { display: none !important; }
	.site-main { padding-top: 0 !important; }
}
