/*!
Theme Name: Haptic
Theme URI: http://themexriver.com/wp/haptic
Author: themexriver
Author URI: http://themexriver.com/
Description: Haptic - Web Agency WordPress Theme
Version: 1.8.7
Tested up to: 5.4
Requires PHP: 5.6
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: haptic
Tags: custom-background, custom-logo, custom-menu, featured-images, threaded-comments, translation-ready

This theme, like WordPress, is licensed under the GPL.
Use it to make something cool, have fun, and share what you've learned.

haptic is based on Underscores https://underscores.me/, (C) 2012-2020 Automattic, Inc.
Underscores is distributed under the terms of the GNU GPL v2 or later.

Normalizing styles have been helped along thanks to the fine work of
Nicolas Gallagher and Jonathan Neal https://necolas.github.io/normalize.css/
*/
/* Neutralise scroll-behavior:smooth de Bootstrap qui interfère avec GSAP ScrollTrigger */
html {
	scroll-behavior: auto !important;
}

/* Formations template */
.formation-hero {
	margin-bottom: 40px;
}

.formation-hero__title {
	margin-bottom: 10px;
}

.formation-hero__subtitle {
	font-size: 1.1rem;
	opacity: 0.75;
}

.formation-hero__intro {
	margin-top: 15px;
	max-width: 720px;
}

.formation-grid {
	row-gap: 30px;
}

.formation-card__inner {
	background: #ffffff;
	border-radius: 12px;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	height: 100%;
}

.formation-card__image {
	width: 100%;
	height: auto;
	display: block;
}

.formation-card__content {
	padding: 24px 26px 28px;
}

.formation-card__title {
	margin-bottom: 12px;
}

.formation-card__description {
	margin-bottom: 18px;
}

.formation-card__meta {
	list-style: none;
	padding: 0;
	margin: 0 0 20px;
	display: grid;
	gap: 6px;
	font-size: 0.95rem;
	opacity: 0.8;
}

.formation-card__cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 10px 18px;
	border-radius: 999px;
	background: #0f172a;
	color: #ffffff;
	text-decoration: none;
	font-weight: 600;
	transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.formation-card__cta:hover {
	transform: translateY(-2px);
	box-shadow: 0 12px 20px rgba(15, 23, 42, 0.2);
}

@media (max-width: 767px) {
	.formation-card__content {
		padding: 20px;
	}
}

/* Formation CFA archive + single */
.formation-detail__image {
	margin-bottom: 20px;
}

.formation-detail__content {
	max-width: 900px;
}

.formation-card__title a {
	color: inherit;
	text-decoration: none;
}

.formation-card__title a:hover {
	text-decoration: underline;
}

.formation-card__image-link {
	display: block;
}

.formation-breadcrumb {
	background: #2f2d39;
	padding: 40px 0;
}

.formation-breadcrumb__inner {
	display: flex;
	flex-direction: column;
	gap: 10px;
	color: #ffffff;
}

.formation-breadcrumb__title {
	font-size: 28px;
	font-weight: 700;
}

.formation-breadcrumb__list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: inline-flex;
	gap: 10px;
	align-items: center;
	flex-wrap: wrap;
	font-size: 0.95rem;
}

.formation-breadcrumb__list li::after {
	content: "›";
	margin-left: 10px;
	opacity: 0.7;
}

.formation-breadcrumb__list li:last-child::after {
	content: "";
	margin: 0;
}

.formation-breadcrumb__list a {
	color: inherit;
	text-decoration: none;
	opacity: 0.85;
}

.formation-breadcrumb__list a:hover {
	opacity: 1;
	text-decoration: underline;
}

/* ============================================================
   FORMATION ALTERNANCE — LAYOUT MODERNE
   ============================================================ */

/* --- Hero -------------------------------------------------- */
.fa-hero {
	position: relative;
	min-height: 420px;
	display: flex;
	align-items: flex-end;
	background-color: #0f172a;
	background-size: cover;
	background-position: center;
	overflow: hidden;
}

.fa-hero__overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(
		160deg,
		rgba(4, 30, 66, 0.45) 0%,
		rgba(0, 67, 128, 0.35) 60%,
		rgba(0, 0, 0, 0.1) 100%
	);
	backdrop-filter: blur(1px);
}

.fa-hero .container {
	position: relative;
	z-index: 2;
	padding-bottom: 56px;
	padding-top: 100px;
}

.fa-hero__content {
	max-width: 820px;
}

.fa-hero__title {
	font-size: clamp(1.8rem, 4vw, 3rem);
	font-weight: 800;
	color: #ffffff;
	line-height: 1.18;
	margin-bottom: 18px;
	letter-spacing: -0.02em;
}

/* breadcrumb dans hero */
.fa-hero .formation-breadcrumb__inner {
	margin-bottom: 24px;
}

.fa-hero .formation-breadcrumb__list {
	font-size: 0.82rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: rgba(255,255,255,0.6);
}

.fa-hero .formation-breadcrumb__list a {
	color: rgba(255,255,255,0.75);
}

.fa-hero__badges {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 28px;
}

.fa-hero__btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 8px 18px;
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	border-radius: 4px;
	text-decoration: none;
	transition: opacity .2s, transform .2s;
}

.fa-hero__btn:hover { opacity: .85; transform: translateY(-1px); }

.fa-hero__btn--orange {
	background: #f97316;
	color: #ffffff;
}

.fa-hero__btn--blue {
	background: rgba(255,255,255,0.12);
	color: #ffffff;
	border: 1px solid rgba(255,255,255,0.25);
}

@media (max-width: 767px) {
	.fa-hero { min-height: 320px; }
	.fa-hero .container { padding-bottom: 36px; }
}

/* --- Wrapper principal ------------------------------------- */
#bi-formation-single {
	background: #f8fafc;
}

#bi-formation-single > .container {
	padding-top: 48px;
	padding-bottom: 64px;
}

/* --- Layout colonne --------------------------------------- */
.formation-detail__layout {
	gap: 32px;
	align-items: flex-start;
	flex-wrap: wrap;
}

.formation-detail__layout > .col-lg-8 {
	order: 1;
}

.formation-detail__layout > .col-lg-4 {
	order: 2;
	display: flex;
}

/* --- Corps gauche : champs ACF en cartes ------------------ */
.formation-detail__content {
	display: flex;
	flex-direction: column;
	gap: 0;
}

.fa-field-block {
	background: #ffffff;
	border-left: 4px solid #004380;
	padding: 20px 24px;
	margin-bottom: 12px;
	border-radius: 0 8px 8px 0;
	box-shadow: 0 2px 8px rgba(0,0,0,0.05);
	transition: box-shadow .2s, transform .2s;
}

.fa-field-block:hover {
	box-shadow: 0 6px 20px rgba(0,67,128,0.10);
	transform: translateX(3px);
}

.fa-field-block__label {
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #004380;
	margin: 0 0 6px;
}

.fa-field-block__value {
	font-size: 0.97rem;
	color: #1e293b;
	margin: 0;
	line-height: 1.6;
}

/* séparateur avant contenu Elementor */
.fa-elementor-content {
	margin-top: 24px;
	padding-top: 24px;
	border-top: 2px solid #e2e8f0;
}

.fa-cta {
	margin: 24px 0;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 32px 24px;
	background: #ffffff;
	border-radius: 8px;
	box-shadow: 0 1px 6px rgba(0,0,0,0.07);
}

.fa-cta--hero {
	margin-top: 20px;
	background: rgba(0, 67, 128, 0.92);
	border-radius: 0;
	box-shadow: none;
}

.fa-cta--content,
.fa-cta--bottom {
	width: 100vw;
	max-width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	border-radius: 0;
	box-shadow: none;
	border-top: 1px solid #edf0f4;
}

.fa-cta__link {
	font-size: 0.82rem;
	letter-spacing: 0.08em;
	background: #f97316;
	color: #ffffff;
	border: none;
	border-radius: 999px;
	padding: 14px 36px;
}

.fa-cta__link:hover {
	background: #ea6c0a;
	color: #ffffff;
	opacity: 1;
}

.fa-cta--hero .fa-cta__link {
	background: #ffffff;
	color: #004380;
	border: 1px solid #ffffff;
}

.fa-cta--hero .fa-cta__link:hover {
	background: transparent;
	color: #ffffff;
	border-color: rgba(255,255,255,0.7);
}

.formation-sidebar .fa-cta {
	padding: 18px 24px 24px;
	margin: 0;
	border-top: 1px solid rgba(255,255,255,0.1);
	background: #004380;
	width: auto;
	max-width: none;
}

.formation-sidebar .fa-cta__link {
	width: 100%;
	justify-content: center;
}

.fa-sidebar-link {
	color: #ffffff;
	text-decoration: underline;
	text-underline-offset: 2px;
}

.fa-sidebar-link:hover {
	color: rgba(255,255,255,0.85);
}

@media (max-width: 767px) {
	.fa-cta {
		padding: 14px 16px;
	}

	.fa-cta__link {
		width: 100%;
		justify-content: center;
	}
}

/* --- Image région ----------------------------------------- */
.fa-region-image {
	padding: 24px 0 0;
}

.fa-last-modified {
	font-size: 0.8rem;
	color: #888;
	text-align: right;
	margin: 16px 0 8px;
}

.fa-region-image img {
	max-width: 100%;
	height: auto;
	display: block;
}

/* --- Indicateurs ------------------------------------------ */
.fa-indicators {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 28px;
	padding: 8px 0 36px;
}

.fa-indicator-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 18px;
	text-align: center;
}

.fa-indicator-ring {
	--progress: 0;
	--size: 220px;
	--thickness: 12px;
	position: relative;
	width: min(100%, var(--size));
	aspect-ratio: 1;
	border-radius: 50%;
	background: conic-gradient(from -90deg, #4a87bd calc(var(--progress) * 1%), #edf0f4 0);
	display: grid;
	place-items: center;
	margin: 0 auto;
}

.fa-indicator-ring::before {
	content: "";
	position: absolute;
	inset: var(--thickness);
	border-radius: 50%;
	background: #ffffff;
	box-shadow: inset 0 0 0 1px rgba(15, 23, 42, 0.04);
}

.fa-indicator-ring__value {
	position: relative;
	z-index: 1;
	font-size: 2rem;
	font-weight: 700;
	line-height: 1;
	color: #102542;
}

.fa-indicator-card__label {
	max-width: 18ch;
	margin: 0;
	font-size: 0.95rem;
	font-weight: 700;
	line-height: 1.55;
	letter-spacing: 0.01em;
	text-transform: uppercase;
	color: #102542;
}

.formation-sidebar__indicators {
	padding: 22px 24px 26px;
	border-top: 1px solid rgba(255,255,255,0.1);
}

.formation-sidebar__subtitle {
	margin: 0 0 18px;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: rgba(255,255,255,0.55);
}

.formation-sidebar .fa-indicators {
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px 14px;
	padding: 0;
}

.formation-sidebar .fa-indicator-card {
	gap: 12px;
}

.formation-sidebar .fa-indicator-ring {
	--size: 132px;
	--thickness: 9px;
	background: conic-gradient(from -90deg, #ffffff calc(var(--progress) * 1%), rgba(255,255,255,0.16) 0);
}

.formation-sidebar .fa-indicator-ring::before {
	background: #004380;
	box-shadow: inset 0 0 0 1px rgba(255,255,255,0.1);
}

.formation-sidebar .fa-indicator-ring__value,
.formation-sidebar .fa-indicator-card__label {
	color: #ffffff;
}

.formation-sidebar .fa-indicator-ring__value {
	font-size: 1.4rem;
}

.formation-sidebar .fa-indicator-card__label {
	max-width: none;
	font-size: 0.72rem;
	line-height: 1.45;
	letter-spacing: 0.04em;
}

.formation-sidebar__action {
	padding: 14px 24px 26px;
	display: flex;
	justify-content: center;
}

.formation-sidebar__action .fa-hero__btn {
	width: auto;
	max-width: 100%;
	margin: 0 auto;
	justify-content: center;
	padding: 10px 16px;
	font-size: 0.74rem;
}

@media (max-width: 1199px) {
	.fa-indicators {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.fa-indicator-ring {
		--size: 200px;
	}
}

@media (max-width: 767px) {
	.fa-indicators {
		grid-template-columns: 1fr;
		gap: 24px;
	}

	.fa-indicator-ring {
		--size: 180px;
	}

	.formation-sidebar .fa-indicators {
		grid-template-columns: 1fr;
	}

	.formation-sidebar .fa-indicator-ring {
		--size: 160px;
	}
}

/* --- Sidebar droite --------------------------------------- */
.formation-detail__layout > .col-lg-4 {
	padding-top: 0;
}

.formation-sidebar {
	position: -webkit-sticky;
	position: sticky;
	top: 20px;
	width: 100%;
	border-radius: 0;
}

.formation-sidebar--blue {
	background: #004380;
	color: #ffffff;
	padding: 0;
	border-radius: 0;
	overflow: hidden;
}

.formation-sidebar__header {
	background: #003368;
	padding: 20px 24px;
	border-bottom: 1px solid rgba(255,255,255,0.1);
}

.formation-sidebar__title {
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: rgba(255,255,255,0.55);
	margin: 0;
}

.formation-sidebar__meta {
	list-style: none;
	margin: 0;
	padding: 0;
}

.formation-sidebar__meta li {
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 16px 24px;
	border-bottom: 1px solid rgba(255,255,255,0.08);
	transition: background .15s;
}

.formation-sidebar__meta li:hover {
	background: rgba(255,255,255,0.05);
}

.formation-sidebar__meta li:last-child {
	border-bottom: none;
}

.formation-sidebar__meta span {
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: rgba(255,255,255,0.5);
}

.formation-sidebar__meta strong {
	font-size: 0.95rem;
	font-weight: 600;
	color: #ffffff;
	line-height: 1.45;
}

.fa-programme-accordion__trigger {
	-webkit-appearance: none;
	appearance: none;
	background: transparent;
	border: 0;
	padding: 0 28px 0 0;
	margin: 0 0 6px;
	width: 100%;
	display: block;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	line-height: 1.3;
	color: #004380;
	text-align: left;
	cursor: pointer;
	position: relative;
}

.fa-programme-accordion__trigger::after {
	content: "+";
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
	font-size: 1.1rem;
	font-weight: 700;
	line-height: 1;
}

.fa-programme-accordion__trigger[aria-expanded="true"]::after {
	content: "-";
}

.fa-programme-accordion__trigger:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 2px;
}

@media (max-width: 991px) {
	.formation-detail__layout > .col-lg-4 {
		display: block;
	}
	.formation-sidebar {
		position: static;
	}
}
/* 
.hap-header-menu-navigation .main-navigation li:hover > a {
  color: #6D55E9 !important;
} */
