/* =============================================================================
   FIVE.CLUB — Feuille de style principale
   Design : bento arrondi « disruptif mais noble », base claire + cartes sombres,
   violet #8752FA + lime #C6FF3E, display Archivo Expanded, texte Hanken Grotesk.
   ========================================================================== */

/* -----------------------------------------------------------------------------
   1. Polices variables (auto-hébergées)
   -------------------------------------------------------------------------- */

@font-face {
	font-family: 'Archivo';
	src: url('../fonts/Archivo-Variable.woff2') format('woff2-variations');
	font-weight: 100 900;
	font-stretch: 62% 125%;
	font-display: swap;
}

@font-face {
	font-family: 'Hanken Grotesk';
	src: url('../fonts/HankenGrotesk-Variable.woff2') format('woff2-variations');
	font-weight: 100 900;
	font-display: swap;
}

/* -----------------------------------------------------------------------------
   2. Design tokens
   -------------------------------------------------------------------------- */

:root {
	/* Couleurs de marque */
	--fc-violet: #8752FA;
	--fc-violet-deep: #4500F9;
	--fc-lilac: #CD83FF;
	--fc-lime: #C6FF3E;
	--fc-coral: #FE5442;
	--fc-dark: #09001B;
	--fc-dark-2: #12121B;
	--fc-bg: #F2F1ED;
	--fc-beige: #CFC9BB;
	--fc-taupe: #787765;

	/* Dérivés */
	--fc-ink: var(--fc-dark);
	--fc-ink-60: rgba(9, 0, 27, 0.6);
	--fc-ink-30: rgba(9, 0, 27, 0.3);
	--fc-paper-60: rgba(242, 241, 237, 0.6);
	--fc-white: #FFFFFF;
	--fc-gradient: linear-gradient(120deg, var(--fc-violet) 0%, var(--fc-violet-deep) 100%);
	--fc-gradient-soft: linear-gradient(120deg, var(--fc-violet) 0%, var(--fc-lilac) 100%);

	/* Typo */
	--font-display: 'Archivo', 'Arial Black', sans-serif;
	--font-body: 'Hanken Grotesk', 'Segoe UI', sans-serif;

	/* Rayons — l'arrondi est l'ADN du design */
	--r-xl: 44px;
	--r-lg: 32px;
	--r-md: 22px;
	--r-pill: 999px;

	/* Layout */
	--container: 1320px;
	--gutter: clamp(20px, 4vw, 48px);
	--header-h: 84px;

	/* Motion */
	--ease-out: cubic-bezier(0.22, 1, 0.36, 1);
	--ease-luxe: cubic-bezier(0.65, 0, 0.35, 1);
	--dur: 0.65s;
}

/* -----------------------------------------------------------------------------
   3. Reset & base
   -------------------------------------------------------------------------- */

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: auto; -webkit-text-size-adjust: 100%; }

a, button { -webkit-tap-highlight-color: transparent; }

body {
	margin: 0;
	background: var(--fc-bg);
	color: var(--fc-ink);
	font-family: var(--font-body);
	font-size: 17px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	overflow-x: clip;
}

body.menu-open { overflow: hidden; }

/* Gel du scroll de fond quand un overlay est ouvert et que le smooth scroll JS
   n'est pas actif (tactile) : `overflow: hidden` seul ne verrouille pas iOS
   Safari. La position est mémorisée puis restituée par main.js. */
body.fc-scroll-lock {
	position: fixed;
	left: 0;
	right: 0;
	width: 100%;
	overflow: hidden;
}

img, video { max-width: 100%; display: block; }

a { color: inherit; text-decoration: none; }

h1, h2, h3, h4 { margin: 0; font-family: var(--font-display); line-height: 1.02; }

p { margin: 0; }

button { font: inherit; background: none; border: 0; cursor: pointer; color: inherit; }

::selection { background: var(--fc-violet); color: var(--fc-white); }

/* Curseur custom : on masque le natif seulement sur pointeur précis + JS actif */
@media (hover: hover) and (pointer: fine) {
	.fc-js body.fc-cursor-on,
	.fc-js body.fc-cursor-on a,
	.fc-js body.fc-cursor-on button { cursor: none; }
}

/* -----------------------------------------------------------------------------
   4. Utilitaires
   -------------------------------------------------------------------------- */

.fc-section__inner {
	max-width: var(--container);
	margin-inline: auto;
	padding-inline: var(--gutter);
}

.fc-section__head { margin-bottom: clamp(36px, 6vw, 72px); }
.fc-section__head--center { text-align: center; }
.fc-section__head--center .fc-label { justify-content: center; }

/* Titres display */
.fc-h2 {
	font-size: clamp(2.6rem, 6vw, 5rem);
	font-weight: 800;
	font-stretch: 118%;
	text-transform: uppercase;
	letter-spacing: -0.01em;
	margin-top: 18px;
}

.fc-h2 em {
	font-style: normal;
	color: transparent;
	background: var(--fc-gradient-soft);
	-webkit-background-clip: text;
	background-clip: text;
}

.fc-h2--light { color: var(--fc-bg); }
.fc-h2--light em {
	background: linear-gradient(120deg, var(--fc-lime) 0%, var(--fc-lilac) 100%);
	-webkit-background-clip: text;
	background-clip: text;
}

/* Label de section (pill) */
.fc-label {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 9px 18px;
	border: 1px solid var(--fc-ink-30);
	border-radius: var(--r-pill);
	font-size: 0.78rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.fc-label__dot {
	width: 7px; height: 7px;
	border-radius: 50%;
	background: var(--fc-violet);
	animation: fc-pulse 2.4s infinite var(--ease-luxe);
}

.fc-label--light { color: var(--fc-bg); border-color: rgba(242, 241, 237, 0.3); }
.fc-label--light .fc-label__dot { background: var(--fc-lime); }

@keyframes fc-pulse {
	0%, 100% { transform: scale(1); opacity: 1; }
	50% { transform: scale(1.55); opacity: 0.55; }
}

/* Grain photographique (noble) */
.fc-grain {
	position: absolute; inset: 0;
	pointer-events: none;
	opacity: 0.5;
	mix-blend-mode: overlay;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='0.32'/%3E%3C/svg%3E");
}

/* Verre (glass) */
.fc-glass {
	background: rgba(242, 241, 237, 0.12);
	border: 1px solid rgba(242, 241, 237, 0.22);
	backdrop-filter: blur(18px) saturate(1.4);
	-webkit-backdrop-filter: blur(18px) saturate(1.4);
	box-shadow: 0 18px 50px rgba(9, 0, 27, 0.35);
}

.fc-glass-dark {
	background: rgba(18, 18, 27, 0.55);
	border: 1px solid rgba(242, 241, 237, 0.12);
	backdrop-filter: blur(18px) saturate(1.2);
	-webkit-backdrop-filter: blur(18px) saturate(1.2);
}

/* -----------------------------------------------------------------------------
   5. Boutons
   -------------------------------------------------------------------------- */

.fc-btn {
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 15px 28px;
	border-radius: var(--r-pill);
	font-family: var(--font-body);
	font-weight: 700;
	font-size: 0.95rem;
	letter-spacing: 0.01em;
	white-space: nowrap;
	overflow: hidden;
	transition: transform 0.45s var(--ease-out), box-shadow 0.45s var(--ease-out), background-color 0.45s var(--ease-out), color 0.45s var(--ease-out);
	will-change: transform;
}

.fc-btn--big { padding: 19px 36px; font-size: 1.02rem; }

.fc-btn--lime { background: var(--fc-lime); color: var(--fc-dark); }
.fc-btn--lime:hover { box-shadow: 0 14px 38px rgba(198, 255, 62, 0.4); }

.fc-btn--dark { background: var(--fc-dark); color: var(--fc-bg); }
.fc-btn--dark:hover { box-shadow: 0 14px 38px rgba(9, 0, 27, 0.35); background: var(--fc-violet); }

.fc-btn--glass {
	background: rgba(242, 241, 237, 0.12);
	border: 1px solid rgba(242, 241, 237, 0.35);
	color: var(--fc-bg);
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
}
.fc-btn--glass:hover { background: rgba(242, 241, 237, 0.22); }

/* Bouton « Application » : mis en évidence, dégradé signature */
.fc-btn--app {
	gap: 9px;
	background: var(--fc-gradient);
	color: var(--fc-white);
	box-shadow: 0 6px 22px rgba(135, 82, 250, 0.35);
}
.fc-btn--app:hover { box-shadow: 0 14px 38px rgba(135, 82, 250, 0.5); }
.fc-btn--app .fc-icon { color: var(--fc-white); }
.fc-btn--app.is-current { outline: 2px solid rgba(198, 255, 62, 0.6); outline-offset: 2px; }

.fc-btn__arrow { transition: transform 0.45s var(--ease-out); }
.fc-btn:hover .fc-btn__arrow { transform: translateX(5px); }

/* -----------------------------------------------------------------------------
   6. Preloader (fade / glass)
   -------------------------------------------------------------------------- */

.fc-loader { display: none; }

/* Affiché dès le premier rendu via fc-js-early (script inline dans le <head>) :
   plus aucun flash de page avant le loader. */
.fc-js-early .fc-loader {
	display: grid;
	place-items: center;
	position: fixed; inset: 0;
	z-index: 1000;
	background: var(--fc-dark);
}

/* Garde-fou : si le JS ne retire jamais le loader (échec de chargement,
   connexion très lente), il s'efface tout seul après 7 s. */
@keyframes fc-loader-failsafe {
	to { opacity: 0; visibility: hidden; }
}

.fc-js-early .fc-loader,
.fc-js-early .fc-app-loader {
	animation: fc-loader-failsafe 0.6s ease 7s forwards;
}

.fc-loader__inner {
	position: relative;
	z-index: 3;
	display: grid;
	justify-items: center;
	gap: 26px;
}

.fc-loader__mark { width: 74px; height: auto; }

.fc-loader__bar {
	width: 168px; height: 2px;
	border-radius: var(--r-pill);
	background: rgba(242, 241, 237, 0.14);
	overflow: hidden;
}

.fc-loader__bar-fill {
	display: block;
	width: 100%; height: 100%;
	background: var(--fc-lime);
	transform: scaleX(0);
	transform-origin: left;
}

/* Voiles « glass » qui balayent l'écran à la sortie du loader */
.fc-loader__veil {
	position: absolute; inset: 0;
	transform: translateY(101%);
}
.fc-loader__veil--1 { z-index: 1; background: var(--fc-violet); }
.fc-loader__veil--2 {
	z-index: 2;
	background: rgba(242, 241, 237, 0.16);
	backdrop-filter: blur(30px);
	-webkit-backdrop-filter: blur(30px);
}

/* -----------------------------------------------------------------------------
   7. Curseur custom
   -------------------------------------------------------------------------- */

.fc-cursor { display: none; }

@media (hover: hover) and (pointer: fine) {
	.fc-js .fc-cursor {
		display: block;
		position: fixed;
		top: 0; left: 0;
		z-index: 1400; /* au-dessus de tous les overlays (modal membre 1200 compris) */
		pointer-events: none;
	}
}

.fc-cursor__dot {
	position: absolute;
	width: 8px; height: 8px;
	margin: -4px 0 0 -4px;
	border-radius: 50%;
	background: var(--fc-violet);
}

.fc-cursor__ring {
	position: absolute;
	display: grid;
	place-items: center;
	width: 42px; height: 42px;
	margin: -21px 0 0 -21px;
	border: 1.5px solid rgba(135, 82, 250, 0.55);
	border-radius: 50%;
	transition: width 0.35s var(--ease-out), height 0.35s var(--ease-out), margin 0.35s var(--ease-out), background-color 0.35s var(--ease-out), border-color 0.35s var(--ease-out);
}

.fc-cursor__label {
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--fc-dark);
	opacity: 0;
	transition: opacity 0.25s;
}

/* état hover (liens) */
.fc-cursor.is-hover .fc-cursor__ring {
	width: 64px; height: 64px;
	margin: -32px 0 0 -32px;
	background: rgba(198, 255, 62, 0.16);
	border-color: var(--fc-lime);
}

/* état label (cartes) */
.fc-cursor.is-label .fc-cursor__ring {
	width: 88px; height: 88px;
	margin: -44px 0 0 -44px;
	background: var(--fc-lime);
	border-color: var(--fc-lime);
}
.fc-cursor.is-label .fc-cursor__label { opacity: 1; }
.fc-cursor.is-label .fc-cursor__dot { opacity: 0; }

/* -----------------------------------------------------------------------------
   8. Header & navigation pills
   -------------------------------------------------------------------------- */

.fc-header {
	position: fixed;
	top: 0; left: 0; right: 0;
	z-index: 900;
	transition: transform 0.6s var(--ease-luxe);
}

.fc-header.is-hidden { transform: translateY(-110%); }

.fc-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 20px;
	max-width: 1560px;
	margin-inline: auto;
	padding: 18px var(--gutter);
	transition: padding 0.5s var(--ease-luxe);
}

.fc-header.is-scrolled .fc-header__inner { padding-block: 10px; }

.fc-header__logo { position: relative; display: block; flex: 0 0 auto; }
.fc-header__logo-img { height: 24px; width: auto; transition: opacity 0.4s; }
.fc-header__logo-img--light { position: absolute; inset: 0; opacity: 0; }

/* Sur une section sombre (hero, phero, planning…), on passe le logo en blanc */
body.fc-head-dark .fc-header__logo-img--dark { opacity: 0; }
body.fc-head-dark .fc-header__logo-img--light { opacity: 1; }

/* Piste de pills */
.fc-nav { flex: 0 1 auto; }

.fc-nav__pill-track {
	position: relative;
	display: flex;
	align-items: center;
	gap: 2px;
	padding: 6px;
	border-radius: var(--r-pill);
	background: rgba(242, 241, 237, 0.55);
	border: 1px solid rgba(9, 0, 27, 0.08);
	backdrop-filter: blur(20px) saturate(1.5);
	-webkit-backdrop-filter: blur(20px) saturate(1.5);
	box-shadow: 0 6px 30px rgba(9, 0, 27, 0.07);
	transition: background-color 0.4s, border-color 0.4s;
}

body.fc-head-dark .fc-nav__pill-track {
	background: rgba(9, 0, 27, 0.35);
	border-color: rgba(242, 241, 237, 0.14);
}

.fc-header.is-scrolled .fc-nav__pill-track {
	box-shadow: 0 10px 34px rgba(9, 0, 27, 0.12);
}

/* Le blob « lava » qui glisse sous le lien survolé */
.fc-nav__blob {
	position: absolute;
	top: 6px; left: 0;
	height: calc(100% - 12px);
	width: 60px;
	border-radius: var(--r-pill);
	background: var(--fc-dark);
	opacity: 0;
	pointer-events: none;
}

body.fc-head-dark .fc-nav__blob { background: var(--fc-lime); }

.fc-nav__link {
	position: relative;
	z-index: 1;
	padding: 10px 18px;
	border-radius: var(--r-pill);
	font-size: 0.88rem;
	font-weight: 600;
	color: var(--fc-ink);
	transition: color 0.3s, background-color 0.3s;
}

body.fc-head-dark .fc-nav__link { color: var(--fc-bg); }

.fc-nav__link.is-blob-on { color: var(--fc-bg); }
body.fc-head-dark .fc-nav__link.is-blob-on { color: var(--fc-dark); }

/* Page courante : pastille teintée, lisible sur fond clair comme sombre */
.fc-nav__link.is-active:not(.is-blob-on) {
	background: rgba(135, 82, 250, 0.12);
	color: var(--fc-violet);
}
body.fc-head-dark .fc-nav__link.is-active:not(.is-blob-on) {
	background: rgba(198, 255, 62, 0.14);
	color: var(--fc-lime);
}

.fc-nav__link-txt { display: inline-block; }

.fc-header__actions { display: flex; align-items: center; gap: 12px; }

/* Burger (mobile) */
.fc-burger {
	display: none;
	position: relative;
	width: 48px; height: 48px;
	border-radius: 50%;
	background: var(--fc-dark);
}
.fc-burger span {
	position: absolute;
	left: 14px; right: 14px;
	height: 2px;
	background: var(--fc-bg);
	transition: transform 0.45s var(--ease-luxe), top 0.45s var(--ease-luxe);
}
.fc-burger span:nth-child(1) { top: 20px; }
.fc-burger span:nth-child(2) { top: 27px; }

body.menu-open .fc-burger span:nth-child(1) { top: 23px; transform: rotate(45deg); }
body.menu-open .fc-burger span:nth-child(2) { top: 23px; transform: rotate(-45deg); }

/* -----------------------------------------------------------------------------
   9. Menu overlay mobile
   -------------------------------------------------------------------------- */

.fc-menu-overlay {
	position: fixed; inset: 0;
	z-index: 850;
	display: flex;
	flex-direction: column;
	justify-content: center;
	/* Bas : réserve la place du pied fixé (tél + réseaux) */
	padding: 88px var(--gutter) 96px;
	visibility: hidden;
	pointer-events: none;
	overflow-y: auto;
	overscroll-behavior: contain;
}

body.menu-open .fc-menu-overlay { visibility: visible; pointer-events: auto; }

.fc-menu-overlay__bg {
	position: absolute; inset: 0;
	background: rgba(9, 0, 27, 0.92);
	backdrop-filter: blur(24px);
	-webkit-backdrop-filter: blur(24px);
	opacity: 0;
	transition: opacity 0.5s var(--ease-luxe);
}
body.menu-open .fc-menu-overlay__bg { opacity: 1; }

.fc-menu-overlay__nav { position: relative; display: grid; gap: 2px; }

.fc-menu-overlay__link {
	display: flex;
	align-items: baseline;
	gap: 12px;
	padding: 5px 0;
	font-family: var(--font-display);
	font-stretch: 115%;
	font-weight: 800;
	font-size: clamp(1.4rem, 5.5vw, 2.1rem);
	line-height: 1.15;
	text-transform: uppercase;
	color: var(--fc-bg);
	opacity: 0;
	transform: translateY(28px);
	transition: opacity 0.5s var(--ease-out), transform 0.6s var(--ease-out);
	transition-delay: calc(var(--i) * 0.05s);
}

body.menu-open .fc-menu-overlay__link { opacity: 1; transform: none; }

.fc-menu-overlay__link.is-active { color: var(--fc-lime); }

/* Entrée « Application » : pill discret — mis en évidence sans crier
   (simple liseré violet + léger voile, pas de dégradé plein ni d'ombre) */
.fc-menu-overlay__link--app {
	margin-top: 22px;
	justify-self: start;
	align-items: center;
	gap: 12px;
	padding: 10px 22px 10px 10px;
	border-radius: var(--r-pill);
	background: rgba(135, 82, 250, 0.14);
	border: 1px solid rgba(135, 82, 250, 0.5);
	color: var(--fc-white);
	font-size: 0.95rem;
	font-stretch: 110%;
	letter-spacing: 0.02em;
}

.fc-menu-overlay__link--app .fc-menu-overlay__num {
	display: grid;
	place-items: center;
	width: 34px; height: 34px;
	border-radius: 50%;
	background: rgba(135, 82, 250, 0.28);
	color: var(--fc-white);
}

.fc-menu-overlay__link--app .fc-menu-overlay__go {
	margin-left: 4px;
	color: var(--fc-lime);
	transition: transform 0.3s var(--ease-out);
}

.fc-menu-overlay__link--app:active .fc-menu-overlay__go { transform: translateX(4px); }

.fc-menu-overlay__link--app.is-active {
	color: var(--fc-white);
	outline: 2px solid rgba(198, 255, 62, 0.7);
	outline-offset: 2px;
}

.fc-menu-overlay__num {
	font-family: var(--font-body);
	font-size: 0.66rem;
	font-weight: 600;
	color: var(--fc-lilac);
}

/* Pied du menu : fixé en bas de l'écran (tél + réseaux toujours visibles) */
.fc-menu-overlay__foot {
	position: fixed;
	left: var(--gutter);
	right: var(--gutter);
	bottom: max(18px, env(safe-area-inset-bottom));
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 12px;
	color: var(--fc-beige);
	font-size: 0.85rem;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.5s 0.3s;
}
body.menu-open .fc-menu-overlay__foot { opacity: 1; pointer-events: auto; }

.fc-menu-overlay__socials { display: flex; gap: 18px; }

/* -----------------------------------------------------------------------------
   10. Rail fixe gauche
   -------------------------------------------------------------------------- */

.fc-rail {
	position: fixed;
	left: 26px; top: 0; bottom: 0;
	z-index: 800;
	display: none;
	flex-direction: column;
	align-items: center;
	justify-content: space-between;
	padding: 110px 0 34px;
	width: 24px;
}

@media (min-width: 1200px) {
	.fc-js .fc-rail { display: flex; }
}

.fc-rail__top { display: flex; flex-direction: column; align-items: center; gap: 14px; }

.fc-rail__scroll-word {
	writing-mode: vertical-rl;
	font-size: 0.68rem;
	font-weight: 600;
	letter-spacing: 0.3em;
	text-transform: uppercase;
	color: var(--fc-taupe);
}

.fc-rail__line {
	position: relative;
	width: 2px; height: 130px;
	background: rgba(9, 0, 27, 0.12);
	border-radius: var(--r-pill);
	overflow: hidden;
}
body.fc-rail-dark .fc-rail__line { background: rgba(242, 241, 237, 0.18); }
body.fc-rail-dark .fc-rail__scroll-word { color: var(--fc-beige); }

.fc-rail__line-fill {
	position: absolute;
	top: 0; left: 0; right: 0;
	height: 100%;
	background: var(--fc-violet);
	transform: scaleY(0);
	transform-origin: top;
}

.fc-rail__dots { display: grid; gap: 12px; }

.fc-rail__dot {
	position: relative;
	width: 8px; height: 8px;
	padding: 0;
	border-radius: 50%;
	background: rgba(9, 0, 27, 0.18);
	transition: background-color 0.3s, transform 0.3s var(--ease-out);
}
body.fc-rail-dark .fc-rail__dot { background: rgba(242, 241, 237, 0.3); }

.fc-rail__dot.is-active { background: var(--fc-violet); transform: scale(1.5); }
body.fc-rail-dark .fc-rail__dot.is-active { background: var(--fc-lime); }

/* Nom de la section : au survol, et automatiquement sur la section active */
.fc-rail__dot::after {
	content: attr(data-label);
	position: absolute;
	left: 18px; top: 50%;
	transform: translateY(-50%) translateX(-6px);
	padding: 4px 12px;
	border-radius: var(--r-pill);
	background: var(--fc-dark);
	color: var(--fc-bg);
	font-size: 0.68rem;
	font-weight: 600;
	letter-spacing: 0.06em;
	white-space: nowrap;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.25s, transform 0.35s var(--ease-out);
}
.fc-rail__dot:hover::after,
.fc-rail__dot.is-active::after {
	opacity: 1;
	transform: translateY(-50%) translateX(0);
}
/* Le dot actif est grossi (scale 1.5) : on compense pour garder le label net */
.fc-rail__dot.is-active::after { font-size: 0.46rem; padding: 3px 8px; }
body.fc-rail-dark .fc-rail__dot::after { background: var(--fc-lime); color: var(--fc-dark); }

.fc-rail__socials { display: grid; gap: 14px; }
.fc-rail__socials a {
	color: var(--fc-taupe);
	transition: color 0.3s, transform 0.3s var(--ease-out);
}
body.fc-rail-dark .fc-rail__socials a { color: var(--fc-beige); }
.fc-rail__socials a:hover { color: var(--fc-violet); transform: translateY(-2px); }

/* -----------------------------------------------------------------------------
   11. Hero
   -------------------------------------------------------------------------- */

.fc-hero {
	position: relative;
	min-height: 100svh;
	display: grid;
	/* 100% : sans quoi la piste auto s'élargit au min-content du titre
	   insécable (police fallback plus large, zoom…) et TOUT le contenu
	   du hero sort du cadre à droite */
	grid-template-columns: 100%;
	align-items: center;
	overflow: clip;
	background: var(--fc-dark);
}

.fc-hero__media { position: absolute; inset: 0; }

.fc-hero__media-clip {
	position: absolute; inset: 0;
	overflow: hidden;
	border-radius: 0;
	/* le morph (inset + radius) est piloté en JS via ScrollTrigger */
}

.fc-hero__img {
	position: absolute;
	inset: -6%;
	width: 112%; height: 112%;
	object-fit: cover;
	transform-origin: center;
}

.fc-hero__overlay {
	position: absolute; inset: 0;
	background:
		linear-gradient(180deg, rgba(9, 0, 27, 0.55) 0%, rgba(9, 0, 27, 0.25) 45%, rgba(9, 0, 27, 0.78) 100%),
		radial-gradient(90% 70% at 25% 55%, rgba(9, 0, 27, 0.55) 0%, transparent 70%);
}

.fc-hero__content {
	position: relative;
	z-index: 2;
	max-width: var(--container);
	width: 100%;
	margin-inline: auto;
	padding: calc(var(--header-h) + 40px) var(--gutter) 120px;
	color: var(--fc-bg);
}

.fc-hero__kicker {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 9px 18px;
	border-radius: var(--r-pill);
	border: 1px solid rgba(242, 241, 237, 0.28);
	background: rgba(242, 241, 237, 0.08);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.fc-hero__kicker-dot {
	width: 7px; height: 7px;
	border-radius: 50%;
	background: var(--fc-lime);
	animation: fc-pulse 2.4s infinite var(--ease-luxe);
}

.fc-hero__title {
	margin: 26px 0 22px;
	font-size: clamp(3.4rem, 10.5vw, 9.2rem);
	font-weight: 850;
	font-stretch: 122%;
	line-height: 0.94;
	text-transform: uppercase;
	letter-spacing: -0.015em;
}

/* padding-top compensé : sans lui, l'overflow hidden rogne les accents (É, Ê, À).
   nowrap : chaque ligne du titre est UNE ligne — le split par lettres
   autoriserait sinon des césures en plein mot (« LE FITNES-S ») */
.fc-hero__line { display: block; overflow: hidden; padding: 0.14em 0 0.06em; margin-top: -0.14em; white-space: nowrap; }
.fc-hero__line-inner { display: inline-block; }

.fc-hero__line--accent .fc-hero__line-inner {
	color: transparent;
	background: linear-gradient(110deg, var(--fc-lilac) 0%, var(--fc-violet) 55%, var(--fc-violet-deep) 100%);
	-webkit-background-clip: text;
	background-clip: text;
}

.fc-hero__dot { color: var(--fc-lime); }

/* Lettres (split) */
.fc-char { display: inline-block; will-change: transform; }

.fc-hero__sub {
	max-width: 480px;
	font-size: clamp(1rem, 1.4vw, 1.15rem);
	color: rgba(242, 241, 237, 0.82);
}

.fc-hero__ctas {
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	margin-top: 38px;
}

/* Cartes flottantes */
.fc-hero__float {
	position: absolute;
	z-index: 3;
	will-change: transform;
}

.fc-hero__float--video {
	right: clamp(20px, 7vw, 120px);
	top: 22%;
	width: clamp(150px, 15vw, 220px);
	aspect-ratio: 4 / 5;
	border-radius: var(--r-md);
	overflow: hidden;
	box-shadow: 0 30px 70px rgba(9, 0, 27, 0.5);
	transform: rotate(4deg);
	border: 1px solid rgba(242, 241, 237, 0.25);
}

.fc-hero__float--video video {
	width: 100%; height: 100%;
	object-fit: cover;
}

/* CTA sur la carte vidéo */
.fc-hero__float-cta {
	position: absolute;
	left: 10px; right: 10px; bottom: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 11px 14px;
	border-radius: var(--r-pill);
	background: var(--fc-lime);
	color: var(--fc-dark);
	font-size: 0.76rem;
	font-weight: 800;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	transition: transform 0.35s var(--ease-out), box-shadow 0.35s;
}

.fc-hero__float-cta:hover {
	transform: translateY(-2px);
	box-shadow: 0 10px 26px rgba(198, 255, 62, 0.35);
}

.fc-hero__float-cta span { transition: transform 0.3s var(--ease-out); }
.fc-hero__float-cta:hover span { transform: translateX(4px); }

/* Groupe de badges (24/7 + séance d'essai), côte à côte en bas à droite */
.fc-hero__badges {
	position: absolute;
	right: clamp(20px, 6vw, 90px);
	bottom: 11%;
	z-index: 3;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 12px;
	will-change: transform;
}

.fc-hero__float--stat {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 12px 22px 12px 12px;
	border-radius: var(--r-pill);
	color: var(--fc-bg);
}

.fc-hero__ring-wrap {
	position: relative;
	flex: 0 0 auto;
	width: 52px;
	height: 52px;
}

.fc-hero__ring { display: block; width: 100%; height: 100%; transform: rotate(-90deg); }
.fc-hero__ring-bg, .fc-ring-bg { fill: none; stroke: rgba(242, 241, 237, 0.18); stroke-width: 5; }
.fc-hero__ring-fill, .fc-ring-fill {
	fill: none;
	stroke: var(--fc-lime);
	stroke-width: 5;
	stroke-linecap: round;
	stroke-dasharray: 170;
	stroke-dashoffset: 170;
}

/* Logomark « F » centré dans l'anneau */
.fc-hero__ring-logo {
	position: absolute;
	top: 50%; left: 50%;
	width: 22px;
	height: auto;
	transform: translate(-50%, -50%);
}

.fc-hero__stat-txt { display: grid; line-height: 1.15; }
.fc-hero__stat-txt strong { font-family: var(--font-display); font-size: 1.5rem; font-stretch: 115%; }
.fc-hero__stat-txt span { font-size: 0.78rem; color: rgba(242, 241, 237, 0.7); }

.fc-hero__float--chip {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 15px 22px;
	border-radius: var(--r-pill);
	color: var(--fc-bg);
	font-size: 0.88rem;
	font-weight: 600;
}

.fc-hero__chip-flash { display: inline-flex; color: var(--fc-lime); }

/* Cue de scroll */
.fc-hero__scroll-cue {
	position: absolute;
	left: 50%;
	bottom: 26px;
	z-index: 3;
	transform: translateX(-50%);
	display: grid;
	justify-items: center;
	gap: 10px;
	color: rgba(242, 241, 237, 0.65);
}

.fc-hero__scroll-line {
	width: 1.5px; height: 44px;
	background: rgba(242, 241, 237, 0.35);
	position: relative;
	overflow: hidden;
}

.fc-hero__scroll-line::after {
	content: '';
	position: absolute;
	inset: 0;
	background: var(--fc-lime);
	animation: fc-scroll-drip 1.9s infinite var(--ease-luxe);
}

@keyframes fc-scroll-drip {
	0% { transform: translateY(-100%); }
	55%, 100% { transform: translateY(100%); }
}

.fc-hero__scroll-txt {
	font-size: 0.68rem;
	font-weight: 600;
	letter-spacing: 0.28em;
	text-transform: uppercase;
}

/* -----------------------------------------------------------------------------
   12. Marquee
   -------------------------------------------------------------------------- */

.fc-marquee {
	position: relative;
	padding: 26px 0;
	background: var(--fc-bg);
	border-block: 1px solid rgba(9, 0, 27, 0.09);
	overflow: hidden;
}

.fc-marquee__track {
	display: flex;
	width: max-content;
	white-space: nowrap;
	will-change: transform;
}

.fc-marquee__item {
	font-family: var(--font-display);
	font-stretch: 118%;
	font-weight: 750;
	font-size: clamp(1.1rem, 2.4vw, 1.7rem);
	text-transform: uppercase;
	letter-spacing: 0.02em;
	padding-right: 18px;
}

.fc-marquee__sep { color: var(--fc-violet); font-style: normal; padding-inline: 14px; }

/* -----------------------------------------------------------------------------
   13. Mission
   -------------------------------------------------------------------------- */

.fc-mission { padding: clamp(90px, 12vw, 170px) 0; }

.fc-mission__grid {
	display: grid;
	grid-template-columns: 220px 1fr;
	gap: clamp(24px, 5vw, 80px);
	align-items: start;
}

.fc-mission__side { position: sticky; top: 130px; }

.fc-mission__statement {
	font-family: var(--font-display);
	font-stretch: 112%;
	font-weight: 700;
	font-size: clamp(1.7rem, 3.6vw, 3.1rem);
	line-height: 1.18;
	letter-spacing: -0.01em;
}

.fc-mission__statement .fc-word { opacity: 0.14; display: inline-block; }

.fc-mission__cta { margin-top: 44px; }

/* -----------------------------------------------------------------------------
   14. Bento
   -------------------------------------------------------------------------- */

.fc-bento { padding-bottom: clamp(80px, 10vw, 150px); }

.fc-bento__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	grid-auto-rows: 235px;
	gap: 18px;
}

.fc-bento__cell--hero { grid-column: span 2; grid-row: span 2; }
.fc-bento__cell--tall { grid-row: span 2; }

/* Cartes */
.fc-card {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	padding: 28px;
	border-radius: var(--r-lg);
	overflow: hidden;
	transform-style: preserve-3d;
	transition: box-shadow 0.5s var(--ease-out);
}

.fc-card:hover { box-shadow: 0 26px 60px rgba(9, 0, 27, 0.16); }

.fc-card h3 {
	font-size: 1.25rem;
	font-weight: 800;
	font-stretch: 112%;
	text-transform: uppercase;
	letter-spacing: 0.005em;
	margin-bottom: 8px;
}

.fc-card p { font-size: 0.92rem; opacity: 0.82; }

.fc-card--photo { color: var(--fc-bg); }
.fc-card--photo img,
.fc-card--video video {
	position: absolute;
	inset: 0;
	width: 100%; height: 100%;
	object-fit: cover;
	transition: transform 1s var(--ease-out);
}
.fc-card--photo:hover img, .fc-card--video:hover video { transform: scale(1.06); }

.fc-card__scrim {
	position: absolute; inset: 0;
	background: linear-gradient(185deg, transparent 40%, rgba(9, 0, 27, 0.82) 100%);
}

.fc-card__body { position: relative; }

.fc-card--video { color: var(--fc-bg); }

.fc-card--dark { background: var(--fc-dark); color: var(--fc-bg); }
.fc-card--lime { background: var(--fc-lime); color: var(--fc-dark); }
.fc-card--violet { background: var(--fc-gradient); color: var(--fc-white); }
.fc-card--light { background: var(--fc-white); border: 1px solid rgba(9, 0, 27, 0.08); }

.fc-card__pill {
	position: absolute;
	top: 20px; right: 20px;
	padding: 7px 15px;
	border-radius: var(--r-pill);
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}
.fc-card__pill--lime { background: var(--fc-lime); color: var(--fc-dark); }
.fc-card__pill--dark { background: var(--fc-dark); color: var(--fc-bg); }
.fc-card__pill--light { background: rgba(255, 255, 255, 0.22); color: var(--fc-white); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }

.fc-card__ring-wrap {
	position: relative;
	width: 96px; height: 96px;
	margin-bottom: auto;
}
.fc-card__ring-wrap svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.fc-card__ring-wrap .fc-ring-fill { stroke-dasharray: 327; stroke-dashoffset: 327; }
.fc-card__ring-txt {
	position: absolute; inset: 0;
	display: grid;
	place-items: center;
	font-family: var(--font-display);
	font-weight: 800;
	font-stretch: 115%;
	font-size: 1.35rem;
}

/* Icônes SVG inline (Lucide) */
.fc-icon { display: block; }

.fc-card__big-icon {
	display: inline-grid;
	place-items: center;
	width: 64px; height: 64px;
	margin-bottom: auto;
	border-radius: var(--r-md);
	background: rgba(9, 0, 27, 0.08);
}

.fc-card__big-txt {
	font-family: var(--font-display);
	font-weight: 850;
	font-stretch: 125%;
	font-size: 2.6rem;
	line-height: 1;
	margin-bottom: auto;
	color: transparent;
	-webkit-text-stroke: 1.5px rgba(242, 241, 237, 0.4);
}

/* Badge flèche des cartes-liens (bento) : visible aussi au doigt, sans hover */
.fc-card__go {
	position: absolute;
	right: 18px; bottom: 18px;
	display: grid;
	place-items: center;
	width: 38px; height: 38px;
	border-radius: 50%;
	font-size: 1.05rem;
	background: rgba(242, 241, 237, 0.16);
	color: var(--fc-bg);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	transition: background-color 0.3s, color 0.3s, transform 0.4s var(--ease-out);
}

.fc-card--lime .fc-card__go { background: rgba(9, 0, 27, 0.12); color: var(--fc-dark); }
.fc-card--light .fc-card__go { background: rgba(135, 82, 250, 0.12); color: var(--fc-violet); }

.fc-card:hover .fc-card__go {
	background: var(--fc-lime);
	color: var(--fc-dark);
	transform: rotate(-45deg);
}

/* Les textes des cartes-liens laissent la place au badge */
.fc-bento__cell .fc-card__body h3,
.fc-bento__cell .fc-card__body p,
.fc-bento__cell > p { padding-right: 42px; }

/* -----------------------------------------------------------------------------
   15. Stats
   -------------------------------------------------------------------------- */

.fc-stats {
	padding: clamp(70px, 9vw, 130px) 0;
	background: var(--fc-bg);
}

.fc-stats__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
	border-top: 1px solid rgba(9, 0, 27, 0.14);
	padding-top: clamp(40px, 6vw, 70px);
}

.fc-stats__item { display: grid; gap: 8px; }

.fc-stats__value {
	font-family: var(--font-display);
	font-weight: 850;
	font-stretch: 122%;
	font-size: clamp(3rem, 6.5vw, 5.6rem);
	line-height: 1;
	color: transparent;
	background: var(--fc-gradient-soft);
	-webkit-background-clip: text;
	background-clip: text;
}

.fc-stats__label {
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--fc-taupe);
	text-transform: uppercase;
	letter-spacing: 0.08em;
}

/* -----------------------------------------------------------------------------
   16. Cours (section épinglée, scroll horizontal)
   -------------------------------------------------------------------------- */

.fc-cours {
	background: var(--fc-dark);
	border-radius: var(--r-xl) var(--r-xl) 0 0;
}

.fc-cours__pin {
	min-height: 100svh;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: clamp(70px, 8vw, 110px) 0 60px;
	overflow: hidden;
}

.fc-cours__head {
	max-width: var(--container);
	width: 100%;
	margin-inline: auto;
	padding-inline: var(--gutter);
	margin-bottom: clamp(30px, 4vw, 56px);
}

.fc-cours__intro {
	max-width: 420px;
	margin-top: 18px;
	color: rgba(242, 241, 237, 0.66);
}

.fc-cours__track-wrap { width: 100%; }

.fc-cours__track {
	display: flex;
	gap: 20px;
	padding-inline: max(var(--gutter), calc((100vw - var(--container)) / 2 + var(--gutter)));
	width: max-content;
	will-change: transform;
}

.fc-cours__card {
	position: relative;
	display: flex;
	flex-direction: column;
	width: clamp(280px, 26vw, 360px);
	min-height: 400px;
	padding: 30px;
	border-radius: var(--r-lg);
	background: var(--fc-dark-2);
	border: 1px solid rgba(242, 241, 237, 0.09);
	color: var(--fc-bg);
	transition: transform 0.6s var(--ease-out), border-color 0.4s, background-color 0.4s;
}

.fc-cours__card:hover {
	transform: translateY(-10px);
	border-color: rgba(198, 255, 62, 0.45);
}

.fc-cours__num {
	font-family: var(--font-display);
	font-weight: 800;
	font-stretch: 120%;
	font-size: 0.95rem;
	color: rgba(242, 241, 237, 0.35);
}

.fc-cours__picto {
	width: 84px; height: 84px;
	margin: 26px 0 auto;
	display: grid;
	place-items: center;
	border-radius: var(--r-md);
	background: rgba(198, 255, 62, 0.08);
	border: 1px solid rgba(198, 255, 62, 0.2);
	transition: transform 0.5s var(--ease-out), background-color 0.4s;
}

.fc-cours__card:hover .fc-cours__picto {
	transform: rotate(-6deg) scale(1.08);
	background: rgba(198, 255, 62, 0.16);
}

.fc-cours__picto img { width: 46px; height: 46px; object-fit: contain; }

.fc-cours__tag {
	align-self: flex-start;
	margin-top: 26px;
	padding: 6px 14px;
	border-radius: var(--r-pill);
	background: rgba(135, 82, 250, 0.22);
	color: var(--fc-lilac);
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.fc-cours__card h3 {
	margin-top: 12px;
	font-size: 1.6rem;
	font-weight: 800;
	font-stretch: 116%;
	text-transform: uppercase;
}

.fc-cours__card p {
	margin-top: 10px;
	font-size: 0.92rem;
	color: rgba(242, 241, 237, 0.66);
}

/* Les cartes sont des liens vers le planning filtré */
.fc-cours__go {
	margin-top: 14px;
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	color: var(--fc-lime);
	opacity: 0;
	transform: translateX(-6px);
	transition: opacity 0.35s, transform 0.35s var(--ease-out);
}

.fc-cours__card:hover .fc-cours__go { opacity: 1; transform: none; }

.fc-cours__card--cta {
	justify-content: center;
	gap: 18px;
	background: var(--fc-gradient);
	border: 0;
}
.fc-cours__card--cta p { color: rgba(255, 255, 255, 0.8); }
.fc-cours__card--cta .fc-btn { align-self: flex-start; }

.fc-cours__progress {
	max-width: var(--container);
	width: calc(100% - var(--gutter) * 2);
	margin: 46px auto 0;
	height: 2px;
	background: rgba(242, 241, 237, 0.14);
	border-radius: var(--r-pill);
	overflow: hidden;
}

.fc-cours__progress-fill {
	display: block;
	height: 100%;
	width: 100%;
	background: var(--fc-lime);
	transform: scaleX(0);
	transform-origin: left;
}

/* -----------------------------------------------------------------------------
   17. Abonnements
   -------------------------------------------------------------------------- */

.fc-abos {
	padding: clamp(90px, 12vw, 170px) 0;
	background: var(--fc-bg);
	border-radius: 0 0 var(--r-xl) var(--r-xl);
}

.fc-abos__note { margin-top: 16px; color: var(--fc-taupe); }

.fc-abos__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
	align-items: stretch;
}

.fc-abos__card {
	position: relative;
	display: flex;
	flex-direction: column;
	padding: 36px 32px;
	border-radius: var(--r-lg);
	background: var(--fc-white);
	border: 1px solid rgba(9, 0, 27, 0.09);
	transition: box-shadow 0.5s var(--ease-out), border-color 0.4s;
}

.fc-abos__card:hover { box-shadow: 0 30px 70px rgba(9, 0, 27, 0.12); }

.fc-abos__card.is-featured {
	background: var(--fc-dark);
	color: var(--fc-bg);
	border: 0;
	transform: scale(1.03);
}

.fc-abos__badge {
	position: absolute;
	top: -14px; left: 50%;
	transform: translateX(-50%);
	padding: 8px 18px;
	border-radius: var(--r-pill);
	background: var(--fc-lime);
	color: var(--fc-dark);
	font-size: 0.72rem;
	font-weight: 800;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	white-space: nowrap;
}

.fc-abos__card h3 {
	font-size: 1.1rem;
	font-weight: 800;
	font-stretch: 114%;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}

.fc-abos__price {
	display: flex;
	align-items: baseline;
	gap: 7px;
	margin: 18px 0 10px;
}

.fc-abos__chf { font-weight: 700; font-size: 0.95rem; opacity: 0.6; }

.fc-abos__amount {
	font-family: var(--font-display);
	font-weight: 850;
	font-stretch: 120%;
	font-size: clamp(2.8rem, 4.5vw, 3.8rem);
	line-height: 1;
}

.fc-abos__card.is-featured .fc-abos__amount { color: var(--fc-lime); }

.fc-abos__period { font-size: 0.95rem; opacity: 0.6; }

/* Respiration entre la description et le bouton S'abonner (accueil compris) */
.fc-abos__desc { font-size: 0.94rem; opacity: 0.75; margin-bottom: 26px; }

.fc-abos__features {
	list-style: none;
	margin: 24px 0 30px;
	padding: 0;
	display: grid;
	gap: 11px;
	font-size: 0.92rem;
}

.fc-abos__features li {
	display: flex;
	align-items: center;
	gap: 10px;
}

.fc-abos__features li::before {
	content: '✓';
	flex: 0 0 auto;
	display: grid;
	place-items: center;
	width: 20px; height: 20px;
	border-radius: 50%;
	background: rgba(135, 82, 250, 0.14);
	color: var(--fc-violet);
	font-size: 0.7rem;
	font-weight: 800;
}

.fc-abos__card.is-featured .fc-abos__features li::before {
	background: rgba(198, 255, 62, 0.16);
	color: var(--fc-lime);
}

.fc-abos__card .fc-btn { margin-top: auto; justify-content: center; }

.fc-abos__more { text-align: center; margin-top: 42px; font-weight: 600; }
.fc-abos__more a { border-bottom: 1.5px solid var(--fc-violet); padding-bottom: 3px; transition: color 0.3s; }
.fc-abos__more a:hover { color: var(--fc-violet); }

/* -----------------------------------------------------------------------------
   18. Équipe
   -------------------------------------------------------------------------- */

.fc-equipe { padding: clamp(90px, 12vw, 160px) 0 clamp(70px, 9vw, 120px); }

.fc-equipe__scroller {
	overflow-x: auto;
	scrollbar-width: none;
	cursor: grab;
	-webkit-overflow-scrolling: touch;
	/* Le glisser-souris pilote scrollLeft : on neutralise la sélection de texte
	   et le drag natif des images qui interrompaient le mouvement. */
	user-select: none;
	-webkit-user-select: none;
}
.fc-equipe__scroller::-webkit-scrollbar { display: none; }
.fc-equipe__scroller.is-dragging { cursor: grabbing; }
.fc-equipe__scroller img { -webkit-user-drag: none; user-drag: none; }

.fc-equipe__row {
	display: flex;
	gap: 20px;
	padding-inline: max(var(--gutter), calc((100vw - var(--container)) / 2 + var(--gutter)));
	width: max-content;
}

.fc-equipe__card {
	width: clamp(240px, 22vw, 300px);
	flex: 0 0 auto;
}

.fc-equipe__photo {
	position: relative;
	aspect-ratio: 4 / 5;
	border-radius: var(--r-lg);
	overflow: hidden;
	background: var(--fc-dark-2);
}

.fc-equipe__photo img {
	width: 100%; height: 100%;
	object-fit: cover;
	filter: grayscale(0.9);
	transition: filter 0.7s var(--ease-out), transform 0.9s var(--ease-out);
}

.fc-equipe__card:hover .fc-equipe__photo img {
	filter: grayscale(0);
	transform: scale(1.05);
}

.fc-equipe__meta { padding: 18px 6px 0; }

.fc-equipe__meta h3 {
	font-size: 1.25rem;
	font-weight: 800;
	font-stretch: 114%;
	text-transform: uppercase;
	display: inline;
}

.fc-equipe__role {
	display: inline-block;
	margin-left: 10px;
	padding: 5px 13px;
	border-radius: var(--r-pill);
	background: rgba(135, 82, 250, 0.12);
	color: var(--fc-violet);
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	vertical-align: middle;
}

.fc-equipe__meta p {
	margin-top: 10px;
	font-size: 0.9rem;
	color: var(--fc-taupe);
}

/* -----------------------------------------------------------------------------
   19. Avis
   -------------------------------------------------------------------------- */

.fc-avis {
	padding: clamp(90px, 12vw, 160px) 0;
	background: var(--fc-dark);
	border-radius: var(--r-xl);
	margin-inline: clamp(8px, 1.2vw, 20px);
}

/* Slider horizontal à glisser (souris + tactile) — pas de scroll-snap :
   il se battrait avec le drag JS et rendrait le glisser saccadé. */
.fc-avis__scroller {
	overflow-x: auto;
	scrollbar-width: none;
	cursor: grab;
	-webkit-overflow-scrolling: touch;
	user-select: none;
	-webkit-user-select: none;
}
.fc-avis__scroller::-webkit-scrollbar { display: none; }
.fc-avis__scroller.is-dragging { cursor: grabbing; }

.fc-avis__row {
	display: flex;
	gap: 20px;
	width: max-content;
	padding-inline: max(var(--gutter), calc((100vw - var(--container)) / 2 + var(--gutter)));
}

.fc-avis__card {
	position: relative;
	flex: 0 0 auto;
	width: clamp(290px, 32vw, 400px);
	margin: 0;
	padding: 38px 32px 30px;
	border-radius: var(--r-lg);
	color: var(--fc-bg);
}

.fc-avis__who { display: grid; line-height: 1.3; }
.fc-avis__who small { font-weight: 600; font-size: 0.74rem; color: rgba(242, 241, 237, 0.5); }

.fc-avis__more { text-align: center; margin-top: 38px; font-weight: 600; }
.fc-avis__more a {
	color: rgba(242, 241, 237, 0.75);
	border-bottom: 1.5px solid rgba(198, 255, 62, 0.45);
	padding-bottom: 3px;
	transition: color 0.3s, border-color 0.3s;
}
.fc-avis__more a:hover { color: var(--fc-lime); border-color: var(--fc-lime); }

.fc-avis__quote {
	position: absolute;
	top: 6px; right: 26px;
	font-family: var(--font-display);
	font-size: 7rem;
	font-weight: 850;
	line-height: 1;
	color: rgba(135, 82, 250, 0.35);
	pointer-events: none;
}

.fc-avis__stars { color: var(--fc-lime); letter-spacing: 4px; margin-bottom: 18px; }

.fc-avis__card blockquote {
	margin: 0;
	font-size: 1.02rem;
	line-height: 1.7;
	color: rgba(242, 241, 237, 0.86);
}

.fc-avis__card figcaption {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-top: 24px;
	font-weight: 700;
	font-size: 0.92rem;
}

.fc-avis__avatar {
	display: grid;
	place-items: center;
	width: 40px; height: 40px;
	border-radius: 50%;
	background: var(--fc-gradient);
	font-family: var(--font-display);
	font-weight: 800;
}

/* -----------------------------------------------------------------------------
   20. CTA final
   -------------------------------------------------------------------------- */

.fc-cta { padding: clamp(90px, 12vw, 170px) 0; }

.fc-cta__card {
	position: relative;
	overflow: hidden;
	padding: clamp(60px, 9vw, 130px) clamp(28px, 6vw, 90px);
	border-radius: var(--r-xl);
	background: var(--fc-dark);
	color: var(--fc-bg);
	text-align: center;
}

/* Décor pur : ne doit jamais avaler les survols/clics des boutons au-dessus */
.fc-cta__orbs { position: absolute; inset: 0; pointer-events: none; }

.fc-cta__orb {
	position: absolute;
	border-radius: 50%;
	filter: blur(70px);
	opacity: 0.75;
	will-change: transform;
}

.fc-cta__orb--1 { width: 460px; height: 460px; left: -120px; top: -140px; background: var(--fc-violet); }
.fc-cta__orb--2 { width: 340px; height: 340px; right: -90px; bottom: -120px; background: var(--fc-violet-deep); }
.fc-cta__orb--3 { width: 200px; height: 200px; right: 18%; top: -70px; background: var(--fc-lilac); opacity: 0.5; }

.fc-cta__mark { position: relative; margin: 0 auto 26px; width: 62px; height: auto; }

.fc-cta__title {
	position: relative;
	font-size: clamp(2.8rem, 7.5vw, 6.4rem);
	font-weight: 850;
	font-stretch: 120%;
	text-transform: uppercase;
	line-height: 0.98;
}

.fc-cta__title em {
	font-style: normal;
	color: var(--fc-lime);
}

.fc-cta__sub {
	position: relative;
	max-width: 430px;
	margin: 22px auto 0;
	color: rgba(242, 241, 237, 0.75);
}

.fc-cta__actions {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 18px;
	margin-top: 42px;
}

.fc-cta__phone {
	font-size: 0.92rem;
	color: rgba(242, 241, 237, 0.65);
	border-bottom: 1px solid rgba(242, 241, 237, 0.25);
	padding-bottom: 2px;
	transition: color 0.3s, border-color 0.3s;
}
.fc-cta__phone:hover { color: var(--fc-lime); border-color: var(--fc-lime); }

/* -----------------------------------------------------------------------------
   21. Footer
   -------------------------------------------------------------------------- */

.fc-footer {
	background: var(--fc-dark);
	color: var(--fc-bg);
	border-radius: var(--r-xl) var(--r-xl) 0 0;
	overflow: hidden;
}

.fc-footer__inner {
	max-width: var(--container);
	margin-inline: auto;
	padding: clamp(60px, 8vw, 100px) var(--gutter) 30px;
}

.fc-footer__top {
	display: grid;
	grid-template-columns: 1.4fr 0.8fr 1fr 1fr;
	gap: clamp(30px, 5vw, 70px);
	padding-bottom: clamp(46px, 6vw, 80px);
}

.fc-footer__brand img { height: 30px; width: auto; }
.fc-footer__brand p { margin-top: 18px; color: rgba(242, 241, 237, 0.65); font-size: 0.95rem; }

.fc-footer__socials { display: flex; gap: 18px; margin-top: 22px; }
.fc-footer__socials a {
	font-weight: 700;
	font-size: 0.9rem;
	border-bottom: 1.5px solid rgba(242, 241, 237, 0.3);
	padding-bottom: 2px;
	transition: color 0.3s, border-color 0.3s;
}
.fc-footer__socials a:hover { color: var(--fc-lime); border-color: var(--fc-lime); }

.fc-footer__col { display: grid; gap: 12px; align-content: start; }

.fc-footer__col h3 {
	font-size: 0.78rem;
	font-family: var(--font-body);
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--fc-lilac);
	margin-bottom: 8px;
}

.fc-footer__col a {
	font-size: 0.95rem;
	color: rgba(242, 241, 237, 0.8);
	transition: color 0.3s, transform 0.3s var(--ease-out);
}
.fc-footer__col a:hover { color: var(--fc-lime); }

.fc-footer__hours-row {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	font-size: 0.92rem;
	color: rgba(242, 241, 237, 0.8);
}
.fc-footer__hours-row span:last-child { color: var(--fc-bg); font-weight: 600; }

.fc-footer__marquee {
	border-block: 1px solid rgba(242, 241, 237, 0.1);
	padding: 18px 0;
	overflow: hidden;
}

.fc-footer__marquee-track {
	display: flex;
	width: max-content;
	white-space: nowrap;
	font-family: var(--font-display);
	font-weight: 800;
	font-stretch: 122%;
	font-size: clamp(1.6rem, 4vw, 2.8rem);
	text-transform: uppercase;
	color: transparent;
	-webkit-text-stroke: 1px rgba(242, 241, 237, 0.25);
}

.fc-footer__bottom {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 10px;
	padding-top: 26px;
	font-size: 0.82rem;
	color: rgba(242, 241, 237, 0.45);
}

.fc-footer__credit i { font-style: normal; padding-inline: 6px; opacity: 0.6; }

.fc-footer__credit a {
	color: rgba(242, 241, 237, 0.65);
	border-bottom: 1px solid rgba(242, 241, 237, 0.25);
	transition: color 0.3s, border-color 0.3s;
}

.fc-footer__credit a:hover { color: var(--fc-lime); border-color: var(--fc-lime); }

/* -----------------------------------------------------------------------------
   22. Placeholder & 404
   -------------------------------------------------------------------------- */

.fc-placeholder {
	min-height: 100svh;
	display: grid;
	align-items: center;
	padding-top: var(--header-h);
}

.fc-placeholder__inner { display: grid; justify-items: start; gap: 22px; max-width: 720px; }

.fc-placeholder__actions { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 10px; }

/* Page 404 : « cette page a séché la séance » */
.fc-404 {
	position: relative;
	min-height: 100svh;
	display: grid;
	align-items: center;
	overflow: clip;
	color: var(--fc-bg);
	background:
		radial-gradient(70% 90% at 80% 10%, rgba(69, 0, 249, 0.4) 0%, transparent 60%),
		radial-gradient(55% 75% at 12% 88%, rgba(135, 82, 250, 0.3) 0%, transparent 65%),
		var(--fc-dark);
}

.fc-404__bg { position: absolute; inset: 0; pointer-events: none; }

.fc-404__inner {
	position: relative;
	z-index: 2;
	width: 100%;
	max-width: 860px;
	margin-inline: auto;
	padding: calc(var(--header-h) + 40px) var(--gutter) 130px;
	display: grid;
	justify-items: center;
	text-align: center;
	gap: 18px;
}

/* 4 [disque] 4 */
.fc-404__figure {
	display: flex;
	align-items: center;
	gap: clamp(8px, 2vw, 20px);
	line-height: 1;
	margin: 6px 0 4px;
}

.fc-404__digit {
	font-family: var(--font-display);
	font-weight: 850;
	font-stretch: 125%;
	font-size: clamp(7rem, 24vw, 15rem);
	color: transparent;
	-webkit-text-stroke: 2px rgba(242, 241, 237, 0.22);
}

/* Le « 0 » : un disque de fonte lime qui fait ses squats */
.fc-404__plate {
	position: relative;
	display: grid;
	place-items: center;
	width: clamp(5.4rem, 18vw, 11.5rem);
	height: clamp(5.4rem, 18vw, 11.5rem);
	border-radius: 50%;
	background: radial-gradient(circle at 32% 28%, #e2ff8f 0%, var(--fc-lime) 45%, #9fe32a 100%);
	box-shadow:
		inset 0 0 0 clamp(8px, 1.6vw, 16px) rgba(9, 0, 27, 0.12),
		0 26px 60px rgba(198, 255, 62, 0.28);
	animation: fc-404-squat 2.3s var(--ease-luxe) infinite;
	transform-origin: bottom center;
}

.fc-404__plate-hole {
	width: 26%;
	height: 26%;
	border-radius: 50%;
	background: var(--fc-dark);
	box-shadow: inset 0 4px 10px rgba(0, 0, 0, 0.5);
}

@keyframes fc-404-squat {
	0%, 100% { transform: translateY(0) scale(1, 1); }
	42% { transform: translateY(9%) scale(1.07, 0.9); }
	58% { transform: translateY(-5%) scale(0.97, 1.05); }
	70% { transform: translateY(0) scale(1.01, 0.99); }
}

.fc-404__title {
	font-size: clamp(1.7rem, 4.6vw, 3rem);
	font-weight: 850;
	font-stretch: 118%;
	text-transform: uppercase;
	letter-spacing: -0.01em;
}

.fc-404__txt {
	max-width: 480px;
	color: rgba(242, 241, 237, 0.75);
	font-size: 0.98rem;
}

.fc-404__actions {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 12px;
	margin-top: 14px;
}

.fc-404__links {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin-top: 10px;
}

.fc-404__links-label {
	font-size: 0.8rem;
	color: rgba(242, 241, 237, 0.5);
	margin-right: 4px;
}

.fc-404__links a {
	padding: 8px 16px;
	border-radius: var(--r-pill);
	border: 1px solid rgba(242, 241, 237, 0.18);
	color: rgba(242, 241, 237, 0.8);
	font-size: 0.82rem;
	font-weight: 600;
	transition: border-color 0.3s, color 0.3s, background-color 0.3s, transform 0.3s var(--ease-out);
}

.fc-404__links a:hover {
	border-color: var(--fc-lime);
	color: var(--fc-lime);
	transform: translateY(-2px);
}

/* Bandeau défilant en bas */
.fc-404__marquee {
	position: absolute;
	left: 0; right: 0; bottom: 0;
	z-index: 2;
	padding: 16px 0;
	border-top: 1px solid rgba(242, 241, 237, 0.1);
	overflow: hidden;
}

.fc-404__marquee-track {
	display: flex;
	width: max-content;
	white-space: nowrap;
	font-family: var(--font-display);
	font-weight: 800;
	font-stretch: 120%;
	font-size: clamp(1.1rem, 2.6vw, 1.7rem);
	text-transform: uppercase;
	color: transparent;
	-webkit-text-stroke: 1px rgba(242, 241, 237, 0.25);
}

.fc-404__marquee-track i {
	font-style: normal;
	-webkit-text-stroke: 0;
	color: var(--fc-lime);
	padding-inline: 16px;
}

@media (max-width: 640px) {
	.fc-404__inner { padding-bottom: 110px; }
	.fc-404__actions .fc-btn--big { width: 100%; justify-content: center; }
}

/* -----------------------------------------------------------------------------
   23. États d'animation initiaux (uniquement si JS présent)
   -------------------------------------------------------------------------- */

.fc-js [data-reveal] { opacity: 0; transform: translateY(42px); }
.fc-js [data-hero-fade] { opacity: 0; transform: translateY(26px); }
.fc-js [data-app-fade] { opacity: 0; transform: translateY(26px); }
.fc-js [data-app-line] { display: inline-block; transform: translateY(110%); }
.fc-js [data-icon-pop] { opacity: 0; }
.fc-js .fc-char { transform: translateY(110%); }
.fc-js [data-line-reveal] { display: inline-block; transform: translateY(110%); }
.fc-js .fc-hero__dot { display: inline-block; opacity: 0; transform: scale(0.4); }
.fc-js [data-split-lines] .fc-line-inner { transform: translateY(110%); display: inline-block; }
[data-split-lines] .fc-line { display: block; overflow: hidden; padding: 0.14em 0 0.08em; margin: -0.14em 0 -0.08em; }

/* -----------------------------------------------------------------------------
   24. Responsive
   -------------------------------------------------------------------------- */

/* Laptop : la nav (8 items) se compacte progressivement avant le burger */
@media (max-width: 1440px) {
	.fc-nav__link { padding: 9px 13px; font-size: 0.84rem; }
}

@media (max-width: 1280px) {
	.fc-nav__link { padding: 8px 10px; font-size: 0.78rem; }
	.fc-header__cta, .fc-header__app { padding: 12px 18px; font-size: 0.88rem; }
}

/* Sur tablette étroite, le bouton Application cède la place (présent dans l'overlay) */
@media (max-width: 900px) {
	.fc-header__app { display: none; }
}

@media (max-width: 1100px) {
	.fc-bento__grid { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 225px; }
	.fc-abos__grid { grid-template-columns: 1fr; max-width: 480px; margin-inline: auto; }
	.fc-abos__card.is-featured { transform: none; }
	.fc-stats__grid { grid-template-columns: repeat(2, 1fr); gap: 36px 20px; }
	.fc-footer__top { grid-template-columns: 1fr 1fr; }
}

/* Tablette : burger (aligné sur le breakpoint JS de 1024), heros recalés */
@media (max-width: 1023px) {
	.fc-nav { display: none; }
	.fc-burger { display: block; }
	.fc-hero__badges { right: var(--gutter); bottom: 8%; }
	.fc-hero__float--video { top: 18%; width: clamp(130px, 17vw, 180px); }
}

@media (max-width: 900px) {
	.fc-mission__grid { grid-template-columns: 1fr; }
	.fc-mission__side { position: static; }
	.fc-hero__float--video { top: auto; bottom: 30%; width: 128px; }
}

@media (max-width: 640px) {
	/* Hero : tout reste visible — les badges rejoignent le flux sous les CTA.
	   11vw : « RÉINVENTÉ. » (point compris, insécable) tient dans l'écran
	   même avec des glyphes plus larges (police fallback, zoom) */
	.fc-hero__content { padding-top: calc(var(--header-h) + 28px); padding-bottom: 34px; }
	.fc-hero__title { font-size: clamp(2.4rem, 11vw, 3.6rem); }
	.fc-hero__ctas { margin-top: 24px; }
	.fc-hero__ctas .fc-btn--big { width: 100%; justify-content: center; }
	.fc-hero__badges {
		position: static;
		justify-content: flex-start;
		margin: 18px var(--gutter) 34px;
		transform: none !important;
	}
	/* Image de fond pleine largeur : le parallaxe souris n'a pas de sens au
	   tactile et décalait la photo (bande sombre à droite) */
	.fc-hero__img {
		inset: 0 !important;
		width: 100% !important;
		height: 100% !important;
		transform: none !important;
	}
	.fc-hero__float--video { display: none; }
	.fc-hero__scroll-cue { display: none; }
	.fc-header__cta { display: none; }

	/* Typo display recalibrée petit écran — 8.4vw : « ACCOMPAGNEMENT »
	   (mot le plus large des h2) tient dans 100vw − 2 gutters */
	.fc-h2 { font-size: clamp(1.75rem, 8.4vw, 2.5rem); }
	.fc-stats__value { font-size: clamp(2.3rem, 11vw, 3.2rem); }

	.fc-bento__grid { grid-template-columns: 1fr; grid-auto-rows: minmax(215px, auto); }
	.fc-bento__cell--hero { grid-column: auto; grid-row: span 2; }
	.fc-card { padding: 22px; }
	.fc-equipe__card { width: min(78vw, 300px); }

	/* Avis : cartes plus généreuses, avec un aperçu de la suivante */
	.fc-avis__card { width: 86vw; }

	/* CTA final : tout centré (logo, titre, texte, bouton, ligne tél) */
	.fc-cta__title { font-size: clamp(1.8rem, 8vw, 2.6rem); }
	.fc-cta__actions .fc-btn--big { width: 100%; justify-content: center; }
	.fc-footer__top { grid-template-columns: 1fr; }

	/* Five.Bot plein écran utile */
	.fc-bot { right: 16px; bottom: 16px; }
	.fc-bot__panel { width: calc(100vw - 32px); }
}

/* Sur mobile / tablette : la section cours devient un scroll horizontal natif */
@media (max-width: 1023px), (prefers-reduced-motion: reduce) {
	.fc-cours__pin { min-height: 0; }
	.fc-cours__track-wrap {
		overflow-x: auto;
		scrollbar-width: none;
		-webkit-overflow-scrolling: touch;
		scroll-snap-type: x mandatory;
	}
	.fc-cours__track-wrap::-webkit-scrollbar { display: none; }
	.fc-cours__card { scroll-snap-align: center; }
	.fc-cours__progress { display: none; }
}

/* -----------------------------------------------------------------------------
   25. Reduced motion — l'accessibilité fait partie du « noble »
   -------------------------------------------------------------------------- */

@media (prefers-reduced-motion: reduce) {
	.fc-js [data-reveal],
	.fc-js [data-hero-fade],
	.fc-js [data-app-fade],
	.fc-js [data-app-line],
	.fc-js [data-icon-pop],
	.fc-js .fc-char,
	.fc-js [data-line-reveal],
	.fc-js .fc-hero__dot,
	.fc-js [data-split-lines] .fc-line-inner {
		opacity: 1 !important;
		transform: none !important;
	}

	/* Reduced-motion : aucun loader, jamais */
	.fc-js-early .fc-loader,
	.fc-js-early .fc-app-loader { display: none !important; }

	.fc-label__dot,
	.fc-hero__kicker-dot,
	.fc-hero__scroll-line::after { animation: none; }

	.fc-marquee__track, .fc-footer__marquee-track { transform: none !important; }

	*, *::before, *::after {
		transition-duration: 0.01ms !important;
		animation-duration: 0.01ms !important;
	}
}

/* =============================================================================
   PAGES INTÉRIEURES
   ========================================================================== */

/* -----------------------------------------------------------------------------
   26. Hero de page (fc-phero)
   -------------------------------------------------------------------------- */

.fc-phero {
	position: relative;
	min-height: 74svh;
	display: grid;
	/* 100% : sans quoi la piste auto s'élargit au min-content des titres
	   longs (ex. « L'EXCELLENCE ») et le hero clippe le texte à droite */
	grid-template-columns: 100%;
	align-items: end;
	overflow: clip;
	background: var(--fc-dark);
}

.fc-phero__media { position: absolute; inset: 0; overflow: hidden; }

.fc-phero__img {
	position: absolute;
	inset: -5%;
	width: 110%; height: 110%;
	object-fit: cover;
}

.fc-phero__overlay {
	position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(9, 0, 27, 0.6) 0%, rgba(9, 0, 27, 0.3) 45%, rgba(9, 0, 27, 0.85) 100%);
}

/* Variante sans photo : gradient de marque */
.fc-phero--plain .fc-phero__media {
	background:
		radial-gradient(60% 90% at 80% 10%, rgba(69, 0, 249, 0.5) 0%, transparent 60%),
		radial-gradient(50% 80% at 15% 90%, rgba(135, 82, 250, 0.45) 0%, transparent 65%),
		var(--fc-dark);
}

.fc-phero__content {
	position: relative;
	z-index: 2;
	max-width: var(--container);
	width: 100%;
	margin-inline: auto;
	padding: calc(var(--header-h) + 80px) var(--gutter) clamp(50px, 8vw, 90px);
	color: var(--fc-bg);
}

.fc-phero__title {
	margin: 22px 0 0;
	font-size: clamp(2.8rem, 7.5vw, 6.6rem);
	font-weight: 850;
	font-stretch: 120%;
	line-height: 0.96;
	text-transform: uppercase;
	letter-spacing: -0.012em;
}

.fc-phero__title em {
	font-style: normal;
	color: transparent;
	background: linear-gradient(110deg, var(--fc-lilac) 0%, var(--fc-violet) 60%, var(--fc-violet-deep) 100%);
	-webkit-background-clip: text;
	background-clip: text;
}

.fc-phero__sub {
	max-width: 520px;
	margin-top: 20px;
	color: rgba(242, 241, 237, 0.8);
	font-size: clamp(0.98rem, 1.3vw, 1.1rem);
}

/* Responsive des heros de pages — DOIT rester après les règles de base
   ci-dessus (à spécificité égale, c'est l'ordre dans le fichier qui tranche) */
@media (max-width: 1023px) {
	.fc-phero { min-height: 66svh; }
}

@media (max-width: 900px) {
	.fc-phero__content { padding-top: calc(var(--header-h) + 50px); }
}

@media (max-width: 640px) {
	.fc-phero { min-height: 58svh; }
	/* 9.2vw max : « L'EXCELLENCE » (mot le plus large des titres) doit tenir
	   dans 100vw − 2 gutters sans coupure */
	.fc-phero__title { font-size: clamp(1.95rem, 9.2vw, 3.1rem); }
	.fc-phero__content { padding-top: calc(var(--header-h) + 40px); }
}

/* -----------------------------------------------------------------------------
   27. Grille des cours (page Cours collectifs)
   -------------------------------------------------------------------------- */

.fc-courses-grid { padding: clamp(80px, 10vw, 150px) 0; }

.fc-courses-grid__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 18px;
}

.fc-course-tile {
	position: relative;
	padding: 28px;
	border-radius: var(--r-lg);
	background: var(--fc-white);
	border: 1px solid rgba(9, 0, 27, 0.08);
	transition: box-shadow 0.5s var(--ease-out), border-color 0.4s;
}

.fc-course-tile:hover {
	box-shadow: 0 24px 54px rgba(9, 0, 27, 0.12);
	border-color: rgba(135, 82, 250, 0.35);
}

.fc-course-tile__picto {
	display: grid;
	place-items: center;
	width: 72px; height: 72px;
	border-radius: var(--r-md);
	background: rgba(135, 82, 250, 0.1);
	transition: transform 0.5s var(--ease-out), background-color 0.4s;
}

.fc-course-tile:hover .fc-course-tile__picto {
	transform: rotate(-6deg) scale(1.08);
	background: rgba(135, 82, 250, 0.18);
}

.fc-course-tile__picto img { width: 40px; height: 40px; object-fit: contain; }

.fc-course-tile__tag {
	display: inline-block;
	margin-top: 20px;
	padding: 5px 13px;
	border-radius: var(--r-pill);
	background: rgba(135, 82, 250, 0.1);
	color: var(--fc-violet);
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.fc-course-tile h3 {
	margin-top: 10px;
	font-size: 1.2rem;
	font-weight: 800;
	font-stretch: 114%;
	text-transform: uppercase;
}

.fc-course-tile p { margin-top: 8px; font-size: 0.9rem; color: var(--fc-taupe); }

/* Affordance « En savoir plus » (les tuiles ouvrent un modal) */
.fc-course-tile { cursor: pointer; }

.fc-course-tile__more {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	margin-top: 14px;
	font-size: 0.76rem;
	font-weight: 700;
	letter-spacing: 0.07em;
	text-transform: uppercase;
	color: var(--fc-violet);
}

.fc-course-tile__more i {
	display: grid;
	place-items: center;
	width: 20px; height: 20px;
	border-radius: 50%;
	background: rgba(135, 82, 250, 0.12);
	font-style: normal;
	font-size: 0.85rem;
	transition: background-color 0.3s, color 0.3s, transform 0.4s var(--ease-out);
}

.fc-course-tile:hover .fc-course-tile__more i {
	background: var(--fc-lime);
	color: var(--fc-dark);
	transform: rotate(90deg);
}

/* Modal « En savoir plus » sur un cours */
.fc-course-modal {
	position: fixed;
	inset: 0;
	z-index: 1150;
	display: grid;
	place-items: center;
	padding: var(--gutter);
}

.fc-course-modal[hidden] { display: none; }

.fc-course-modal__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(9, 0, 27, 0.7);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	opacity: 0;
	transition: opacity 0.35s;
}

.fc-course-modal.is-open .fc-course-modal__backdrop { opacity: 1; }

.fc-course-modal__card {
	position: relative;
	width: min(560px, 100%);
	max-height: min(86svh, 720px);
	overflow-y: auto;
	overscroll-behavior: contain;
	display: grid;
	gap: 18px;
	padding: clamp(26px, 4vw, 40px);
	border-radius: var(--r-lg);
	background: var(--fc-dark);
	border: 1px solid rgba(198, 255, 62, 0.22);
	color: var(--fc-bg);
	box-shadow: 0 40px 100px rgba(0, 0, 0, 0.5);
	opacity: 0;
	transform: translateY(20px) scale(0.97);
	transition: transform 0.4s var(--ease-out), opacity 0.35s;
	scrollbar-width: thin;
}

.fc-course-modal.is-open .fc-course-modal__card { opacity: 1; transform: none; }

.fc-course-modal__card > .fc-grain { opacity: 0.25; }
.fc-course-modal__card > *:not(.fc-grain) { position: relative; }

/* Sélecteur enfant direct : la règle « > *:not(.fc-grain) { position: relative } »
   plus bas est plus spécifique et écraserait un simple .fc-course-modal__x.
   Sticky : la croix reste en haut à droite même quand la carte scrolle. */
.fc-course-modal__card > .fc-course-modal__x {
	position: sticky;
	top: 0;
	justify-self: end;
	margin: -6px -6px -48px 0;
	display: grid;
	place-items: center;
	width: 36px; height: 36px;
	border-radius: 50%;
	background: rgba(242, 241, 237, 0.14);
	color: var(--fc-bg);
	transition: background-color 0.3s;
	z-index: 3;
}

.fc-course-modal__x:hover { background: rgba(242, 241, 237, 0.22); }

.fc-course-modal__head {
	display: flex;
	align-items: center;
	gap: 16px;
	padding-right: 40px;
}

.fc-course-modal__picto {
	display: grid;
	place-items: center;
	flex: 0 0 auto;
	width: 72px; height: 72px;
	border-radius: var(--r-md);
	background: rgba(198, 255, 62, 0.08);
	border: 1px solid rgba(198, 255, 62, 0.2);
}

.fc-course-modal__picto img { width: 40px; height: 40px; object-fit: contain; }

.fc-course-modal__tag {
	display: inline-block;
	padding: 5px 13px;
	border-radius: var(--r-pill);
	background: rgba(135, 82, 250, 0.22);
	color: var(--fc-lilac);
	font-size: 0.68rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.fc-course-modal__name {
	margin-top: 8px;
	font-size: clamp(1.5rem, 3.4vw, 2.1rem);
	font-weight: 850;
	font-stretch: 116%;
	text-transform: uppercase;
}

.fc-course-modal__long { color: rgba(242, 241, 237, 0.8); line-height: 1.7; }

.fc-course-modal__meta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 12px;
	padding: 14px 18px;
	border-radius: var(--r-md);
	background: rgba(242, 241, 237, 0.05);
	border: 1px solid rgba(242, 241, 237, 0.1);
}

.fc-course-modal__intensity {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: rgba(242, 241, 237, 0.6);
}

.fc-course-modal__intensity i { display: inline-flex; gap: 5px; }

.fc-course-modal__intensity b {
	width: 9px; height: 9px;
	border-radius: 50%;
	background: rgba(242, 241, 237, 0.16);
}

.fc-course-modal__intensity b.is-on { background: var(--fc-lime); }

.fc-course-modal__sessions {
	font-size: 0.85rem;
	font-weight: 700;
	color: var(--fc-lime);
}

.fc-course-modal__planning { justify-content: center; }
.fc-course-modal__close { justify-content: center; }

/* -----------------------------------------------------------------------------
   28. Planning hebdomadaire (tabs jours)
   -------------------------------------------------------------------------- */

.fc-plan {
	padding: clamp(80px, 10vw, 150px) 0;
	background: var(--fc-dark);
	border-radius: var(--r-xl);
	margin-inline: clamp(8px, 1.2vw, 20px);
}

.fc-plan__note { max-width: 460px; margin-top: 18px; color: rgba(242, 241, 237, 0.66); }

/* Sélecteur de cours : une seule ligne — défilement horizontal fluide,
   scrollbar masquée, fondu sur les bords pour suggérer la suite */
.fc-plan__courses { margin-bottom: 24px; }

/* Pas de scroll-snap : il se battrait avec le glisser à la souris (drag JS)
   et son inertie, rendant le défilement saccadé. */
.fc-plan__courses-row {
	display: flex;
	flex-wrap: nowrap;
	gap: 8px;
	overflow-x: auto;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
	padding: 4px 2px 8px;
	-webkit-mask-image: linear-gradient(90deg, #000 92%, transparent);
	mask-image: linear-gradient(90deg, #000 92%, transparent);
	cursor: grab;
}

.fc-plan__courses-row.is-dragging { cursor: grabbing; }

.fc-plan__courses-row::-webkit-scrollbar { display: none; }

/* Indice de glissement du filtre de cours : à TOUTES les tailles — la rangée
   déborde aussi sur desktop (13 cours). main.js le masque via [hidden] quand
   elle tient entièrement à l'écran. */
.fc-plan__swipe {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	margin: 6px 0 0;
	font-size: 0.78rem;
	font-weight: 600;
	color: rgba(242, 241, 237, 0.55);
}

.fc-plan__swipe[hidden] { display: none; }

.fc-plan__swipe-arrow,
.fc-swipe-arrow {
	display: inline-block;
	color: var(--fc-lime);
	animation: fc-swipe-r 1.8s ease-in-out infinite;
}

.fc-plan__swipe-arrow:first-child,
.fc-swipe-arrow:first-child { animation-name: fc-swipe-l; }

/* Indice du slider d'avis : mobile uniquement (au doigt) */
.fc-avis__swipe { display: none; }

@media (max-width: 640px) {
	.fc-avis__swipe {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 10px;
		margin: 18px var(--gutter) 0;
		font-size: 0.78rem;
		font-weight: 600;
		color: rgba(242, 241, 237, 0.55);
	}
}

@keyframes fc-swipe-l {
	0%, 100% { transform: translateX(0); }
	50% { transform: translateX(-4px); }
}
@keyframes fc-swipe-r {
	0%, 100% { transform: translateX(0); }
	50% { transform: translateX(4px); }
}

@media (prefers-reduced-motion: reduce) {
	.fc-plan__swipe-arrow,
	.fc-swipe-arrow { animation: none; }
}

.fc-plan__courses-row .fc-plan__course {
	flex: 0 0 auto;
	min-width: 96px;
}

.fc-plan__course {
	display: grid;
	justify-items: center;
	align-content: start;
	gap: 8px;
	padding: 13px 8px 11px;
	border-radius: 16px;
	background: rgba(242, 241, 237, 0.05);
	border: 1px solid rgba(242, 241, 237, 0.12);
	color: rgba(242, 241, 237, 0.75);
	font-size: 0.7rem;
	font-weight: 600;
	line-height: 1.25;
	text-align: center;
	transition: border-color 0.3s, background-color 0.3s, color 0.3s, transform 0.3s var(--ease-out);
}

.fc-plan__course:hover {
	border-color: rgba(198, 255, 62, 0.4);
	color: var(--fc-bg);
	transform: translateY(-2px);
}

.fc-plan__course-ico {
	display: grid;
	place-items: center;
	width: 44px; height: 44px;
	border-radius: 13px;
	background: rgba(198, 255, 62, 0.08);
	border: 1px solid rgba(198, 255, 62, 0.18);
	transition: background-color 0.3s, transform 0.4s var(--ease-out);
}

.fc-plan__course-ico img { width: 26px; height: 26px; object-fit: contain; }
.fc-plan__course-ico--all { color: var(--fc-lime); }

.fc-plan__course:hover .fc-plan__course-ico { transform: rotate(-6deg) scale(1.06); }

.fc-plan__course.is-active {
	background: rgba(198, 255, 62, 0.1);
	border-color: var(--fc-lime);
	color: var(--fc-bg);
}

.fc-plan__course.is-active .fc-plan__course-ico { background: var(--fc-lime); border-color: var(--fc-lime); }
.fc-plan__course.is-active .fc-plan__course-ico--all { color: var(--fc-dark); }
.fc-plan__course.is-active .fc-plan__course-ico img { filter: brightness(0); }

/* Panneau planning unifié : les jours vivent dans son en-tête */
.fc-plan__panel-card {
	padding: clamp(18px, 2.5vw, 30px);
	border-radius: var(--r-lg);
	background: rgba(242, 241, 237, 0.04);
	border: 1px solid rgba(242, 241, 237, 0.1);
}

.fc-plan__panel-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 14px;
	margin-bottom: 20px;
}

.fc-plan__panel-head[hidden] { display: none; }

.fc-plan__count {
	color: var(--fc-lime);
	font-weight: 700;
	font-size: 0.9rem;
}
.fc-plan__count[hidden] { display: none; }

.fc-plan__byday[hidden],
.fc-plan__week[hidden] { display: none; }

/* Vue cours : séances groupées par jour */
.fc-plan__week { display: grid; gap: 24px; }

.fc-plan__daygroup { display: grid; gap: 10px; }
.fc-plan__daygroup[hidden] { display: none; }
.fc-plan__row[hidden] { display: none; }

.fc-plan__dayname {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0;
	font-size: 0.9rem;
	font-weight: 800;
	font-stretch: 116%;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--fc-lilac);
}

.fc-plan__dayname::before {
	content: '';
	width: 7px; height: 7px;
	border-radius: 50%;
	background: var(--fc-lime);
}

.fc-plan__empty { color: rgba(242, 241, 237, 0.6); padding: 14px 4px; }

.fc-plan__tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	padding: 6px;
	border-radius: var(--r-pill);
	background: rgba(242, 241, 237, 0.07);
	border: 1px solid rgba(242, 241, 237, 0.12);
	width: fit-content;
	max-width: 100%;
}

.fc-plan__tab {
	padding: 11px 20px;
	border-radius: var(--r-pill);
	color: rgba(242, 241, 237, 0.65);
	font-weight: 600;
	font-size: 0.9rem;
	transition: color 0.3s, background-color 0.3s, transform 0.3s var(--ease-out);
}

.fc-plan__tab:hover { color: var(--fc-bg); transform: translateY(-1px); }

.fc-plan__tab.is-active {
	background: var(--fc-lime);
	color: var(--fc-dark);
}

.fc-plan__tab-short { display: none; }

.fc-plan__tabs[hidden] { display: none; }

.fc-plan__panels { margin-top: 0; }

.fc-plan__panel { display: grid; gap: 10px; }
.fc-plan__panel[hidden] { display: none; }

.fc-plan__row {
	display: grid;
	grid-template-columns: 70px 44px 1fr auto;
	align-items: center;
	gap: 16px;
	padding: 16px 22px;
	border-radius: var(--r-md);
	background: var(--fc-dark-2);
	border: 1px solid rgba(242, 241, 237, 0.08);
	color: var(--fc-bg);
	transition: border-color 0.3s, transform 0.4s var(--ease-out);
}

.fc-plan__row:hover {
	border-color: rgba(198, 255, 62, 0.4);
	transform: translateX(6px);
}

.fc-plan__time {
	font-family: var(--font-display);
	font-weight: 800;
	font-stretch: 116%;
	font-size: 1.05rem;
	color: var(--fc-lime);
}

.fc-plan__picto {
	display: grid;
	place-items: center;
	width: 44px; height: 44px;
	border-radius: 12px;
	background: rgba(198, 255, 62, 0.08);
	border: 1px solid rgba(198, 255, 62, 0.16);
}

.fc-plan__picto img { width: 24px; height: 24px; object-fit: contain; }

.fc-plan__name { font-weight: 700; display: grid; gap: 2px; min-width: 0; }

/* Salle (Multifonction / Serena) + variante de la séance */
.fc-plan__meta {
	font-size: 0.72rem;
	font-weight: 600;
	letter-spacing: 0.02em;
	color: rgba(242, 241, 237, 0.5);
}

.fc-plan__meta--multi { color: rgba(198, 255, 62, 0.75); }
.fc-plan__meta--serena { color: rgba(205, 131, 255, 0.85); }

.fc-plan__dur {
	padding: 5px 13px;
	border-radius: var(--r-pill);
	background: rgba(135, 82, 250, 0.22);
	color: var(--fc-lilac);
	font-size: 0.78rem;
	font-weight: 700;
}

.fc-plan__cta { margin-top: 38px; }

/* -----------------------------------------------------------------------------
   29. Coaching (2 colonnes)
   -------------------------------------------------------------------------- */

.fc-coaching { padding: clamp(80px, 11vw, 160px) 0; }

.fc-coaching__grid {
	display: grid;
	grid-template-columns: 0.9fr 1.1fr;
	gap: clamp(28px, 5vw, 80px);
	align-items: center;
}

.fc-coaching__media {
	position: relative;
	border-radius: var(--r-lg);
	overflow: hidden;
	aspect-ratio: 4 / 5;
}

.fc-coaching__media img {
	width: 100%; height: 100%;
	object-fit: cover;
	transition: transform 0.9s var(--ease-out);
}

.fc-coaching__media:hover img { transform: scale(1.05); }

.fc-coaching__body { display: grid; gap: 18px; justify-items: start; }
.fc-coaching__body p { color: var(--fc-taupe); max-width: 480px; }

/* -----------------------------------------------------------------------------
   30. Équipements (page Le Club)
   -------------------------------------------------------------------------- */

.fc-equip {
	padding: clamp(80px, 10vw, 150px) 0;
	background: var(--fc-dark);
	border-radius: var(--r-xl);
	margin-inline: clamp(8px, 1.2vw, 20px);
}

.fc-equip__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
}

.fc-equip__item {
	position: relative;
	padding: 26px;
	border-radius: var(--r-md);
	background: var(--fc-dark-2);
	border: 1px solid rgba(242, 241, 237, 0.08);
	color: var(--fc-bg);
	transition: border-color 0.3s, transform 0.4s var(--ease-out);
}

.fc-equip__item:hover {
	border-color: rgba(135, 82, 250, 0.5);
	transform: translateY(-6px);
}

/* Liseré dégradé violet→lime qui s'allume au survol */
.fc-equip__item::after {
	content: '';
	position: absolute;
	inset: -1px;
	border-radius: var(--r-md);
	padding: 1px;
	background: linear-gradient(120deg, var(--fc-violet), var(--fc-lime));
	-webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: xor;
	mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
	mask-composite: exclude;
	opacity: 0;
	transition: opacity 0.4s;
	pointer-events: none;
}

.fc-equip__item:hover::after { opacity: 1; }

.fc-equip__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}

.fc-equip__icon {
	display: grid;
	place-items: center;
	width: 46px; height: 46px;
	border-radius: 14px;
	background: rgba(135, 82, 250, 0.16);
	color: var(--fc-lilac);
	transition: background-color 0.35s, color 0.35s, transform 0.5s var(--ease-out);
}

.fc-equip__item:hover .fc-equip__icon {
	background: rgba(198, 255, 62, 0.14);
	color: var(--fc-lime);
	transform: rotate(-8deg) scale(1.1);
}

.fc-equip__num {
	font-family: var(--font-display);
	font-weight: 800;
	font-stretch: 120%;
	font-size: 0.85rem;
	color: var(--fc-lilac);
}

.fc-equip__item h3 {
	margin-top: 14px;
	font-size: 1.05rem;
	font-weight: 800;
	font-stretch: 112%;
	text-transform: uppercase;
}

.fc-equip__item p { margin-top: 8px; font-size: 0.88rem; color: rgba(242, 241, 237, 0.62); }

/* -----------------------------------------------------------------------------
   31. Abonnements : promo + formules + inclus
   -------------------------------------------------------------------------- */

.fc-promo { padding: clamp(70px, 9vw, 130px) 0 0; }

.fc-promo__card {
	position: relative;
	overflow: hidden;
	display: grid;
	grid-template-columns: 1.3fr auto auto;
	align-items: center;
	gap: clamp(20px, 4vw, 50px);
	padding: clamp(30px, 5vw, 56px);
	border-radius: var(--r-xl);
	background: var(--fc-lime);
	color: var(--fc-dark);
}

.fc-promo__badge {
	position: absolute;
	top: 22px; right: 22px;
	padding: 8px 16px;
	border-radius: var(--r-pill);
	background: var(--fc-dark);
	color: var(--fc-lime);
	font-size: 0.72rem;
	font-weight: 800;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.fc-promo__body h2 {
	font-size: clamp(1.6rem, 3.4vw, 2.6rem);
	font-weight: 850;
	font-stretch: 118%;
	text-transform: uppercase;
}

.fc-promo__body p { margin-top: 10px; font-weight: 500; opacity: 0.85; max-width: 420px; }

.fc-promo__price { display: grid; justify-items: start; gap: 4px; }

.fc-promo__old {
	font-weight: 700;
	text-decoration: line-through;
	opacity: 0.5;
}

.fc-promo__new {
	font-family: var(--font-display);
	font-weight: 850;
	font-stretch: 120%;
	font-size: clamp(2.2rem, 4.5vw, 3.4rem);
	line-height: 1;
}

.fc-promo__new small { font-size: 0.4em; font-weight: 700; }

.fc-passes { padding: clamp(80px, 10vw, 140px) 0; }

/* Toggle « Avec engagement / Sans engagement » */
.fc-abos-toggle {
	display: inline-flex;
	gap: 4px;
	padding: 5px;
	margin-bottom: 30px;
	border-radius: var(--r-pill);
	background: var(--fc-white);
	border: 1px solid rgba(9, 0, 27, 0.1);
	box-shadow: 0 6px 24px rgba(9, 0, 27, 0.06);
}

.fc-abos-toggle__btn {
	display: inline-flex;
	align-items: baseline;
	gap: 7px;
	padding: 11px 22px;
	border-radius: var(--r-pill);
	font-weight: 700;
	font-size: 0.9rem;
	color: var(--fc-ink-60);
	transition: background-color 0.3s, color 0.3s;
}

.fc-abos-toggle__btn small {
	font-size: 0.66rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	opacity: 0.6;
}

.fc-abos-toggle__btn:hover { color: var(--fc-ink); }

.fc-abos-toggle__btn.is-active {
	background: var(--fc-dark);
	color: var(--fc-bg);
}

[data-abos-panel][hidden] { display: none; }

.fc-passes__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
}

.fc-passes__window {
	align-self: flex-start;
	display: inline-block;
	margin-bottom: 14px;
	padding: 6px 14px;
	border-radius: var(--r-pill);
	background: rgba(135, 82, 250, 0.12);
	color: var(--fc-violet);
	font-size: 0.74rem;
	font-weight: 800;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.fc-abos__card.is-featured .fc-passes__window {
	background: rgba(198, 255, 62, 0.14);
	color: var(--fc-lime);
}


.fc-included { padding-bottom: clamp(80px, 10vw, 140px); }

.fc-included__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 16px;
}

.fc-included__item {
	padding: 28px;
	border-radius: var(--r-lg);
	background: var(--fc-white);
	border: 1px solid rgba(9, 0, 27, 0.08);
}

.fc-included__item h3 {
	font-size: 1rem;
	font-weight: 800;
	font-stretch: 112%;
	text-transform: uppercase;
}

.fc-included__item p { margin-top: 8px; font-size: 0.88rem; color: var(--fc-taupe); }

/* Cartes riches « Toujours inclus » : visuels 3D + cartes couleur,
   entrée en éventail au scroll (GSAP) et parallaxe interne des images */
.fc-included__grid--rich { align-items: stretch; }

.fc-incl-card {
	display: flex;
	flex-direction: column;
	border-radius: var(--r-lg);
	background: var(--fc-white);
	border: 1px solid rgba(9, 0, 27, 0.08);
	overflow: hidden;
	will-change: transform;
	transition: box-shadow 0.5s var(--ease-out), transform 0.5s var(--ease-out);
}

.fc-incl-card:hover {
	box-shadow: 0 26px 60px rgba(9, 0, 27, 0.14);
	transform: translateY(-6px);
}

.fc-incl-card__media {
	position: relative;
	height: 200px;
	overflow: hidden;
	display: grid;
	place-items: center;
	background: var(--fc-dark-2);
}

.fc-incl-card__media img {
	position: absolute;
	inset: -12% 0;
	width: 100%;
	height: 124%;
	object-fit: cover;
	will-change: transform;
	transition: scale 0.8s var(--ease-out);
}

.fc-incl-card:hover .fc-incl-card__media img { scale: 1.06; }

/* Variantes couleur (pas de visuel 3D correspondant) : icône en majesté */
.fc-incl-card--lime .fc-incl-card__media { background: var(--fc-lime); color: var(--fc-dark); }
.fc-incl-card--violet .fc-incl-card__media { background: var(--fc-gradient); color: var(--fc-white); }

.fc-incl-card__icon {
	display: grid;
	place-items: center;
	width: 84px; height: 84px;
	border-radius: 24px;
	background: rgba(9, 0, 27, 0.1);
	transition: transform 0.5s var(--ease-out);
}

.fc-incl-card--violet .fc-incl-card__icon { background: rgba(255, 255, 255, 0.16); }

.fc-incl-card:hover .fc-incl-card__icon { transform: rotate(-8deg) scale(1.1); }

.fc-incl-card__body {
	position: relative;
	flex: 1;
	padding: 22px 24px 26px;
}

.fc-incl-card__num {
	position: absolute;
	top: -16px;
	right: 18px;
	font-family: var(--font-display);
	font-weight: 850;
	font-stretch: 125%;
	font-size: 2.4rem;
	line-height: 1;
	color: transparent;
	-webkit-text-stroke: 1.5px rgba(9, 0, 27, 0.16);
	pointer-events: none;
}

.fc-incl-card__body h3 {
	font-size: 1.02rem;
	font-weight: 800;
	font-stretch: 112%;
	text-transform: uppercase;
	padding-right: 44px;
}

.fc-incl-card__body p { margin-top: 8px; font-size: 0.88rem; color: var(--fc-taupe); }

@media (max-width: 640px) {
	.fc-incl-card__media { height: 170px; }
}

/* -----------------------------------------------------------------------------
   32. FAQ (accordéon)
   -------------------------------------------------------------------------- */

.fc-faq { padding: clamp(80px, 10vw, 150px) 0 clamp(40px, 6vw, 80px); }

.fc-faq__inner { max-width: 880px; }

/* Page Aide : liste éditoriale pleine largeur — rangées séparées par de
   fines lignes, questions en grande typo, réponses aérées */
.fc-faq__wide { max-width: 980px; }

.fc-faq--lines .fc-faq__list { gap: 0; }

.fc-faq--lines .fc-faq__item {
	background: transparent;
	border: 0;
	border-bottom: 1px solid rgba(9, 0, 27, 0.12);
	border-radius: 0;
	overflow: visible;
}

.fc-faq--lines .fc-faq__item:first-child { border-top: 1px solid rgba(9, 0, 27, 0.12); }

.fc-faq--lines .fc-faq__item.is-open {
	border-color: rgba(135, 82, 250, 0.45);
	box-shadow: none;
}

.fc-faq--lines .fc-faq__q {
	gap: clamp(16px, 3vw, 30px);
	padding: clamp(24px, 3.5vw, 34px) 4px;
}

.fc-faq--lines .fc-faq__num {
	font-size: clamp(1.1rem, 2vw, 1.5rem);
	font-stretch: 122%;
	color: transparent;
	-webkit-text-stroke: 1.2px rgba(9, 0, 27, 0.3);
	transition: -webkit-text-stroke-color 0.3s;
}

.fc-faq--lines .fc-faq__q-txt {
	font-family: var(--font-display);
	font-weight: 750;
	font-stretch: 108%;
	font-size: clamp(1.1rem, 2.2vw, 1.5rem);
	line-height: 1.25;
	transition: color 0.3s, transform 0.4s var(--ease-out);
}

.fc-faq--lines .fc-faq__q:hover .fc-faq__q-txt { transform: translateX(6px); }

.fc-faq--lines .fc-faq__item.is-open .fc-faq__q-txt { color: var(--fc-violet); }
.fc-faq--lines .fc-faq__item.is-open .fc-faq__num { -webkit-text-stroke-color: var(--fc-violet); }

.fc-faq--lines .fc-faq__icon { width: 40px; height: 40px; }

.fc-faq--lines .fc-faq__a-inner {
	padding: 0 4px 30px calc(clamp(1.1rem, 2vw, 1.5rem) * 1.6 + clamp(16px, 3vw, 30px));
	max-width: 720px;
	font-size: 1rem;
	line-height: 1.75;
}

/* « Pas trouvé ? » — liens directs sous la liste */
.fc-faq__notfound {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px 14px;
	margin-top: 34px;
	color: var(--fc-taupe);
	font-weight: 600;
}

.fc-faq__notfound a {
	padding: 9px 16px;
	border-radius: var(--r-pill);
	border: 1px solid rgba(9, 0, 27, 0.14);
	background: var(--fc-white);
	font-size: 0.85rem;
	transition: border-color 0.3s, color 0.3s, transform 0.3s var(--ease-out);
}

.fc-faq__notfound a:hover {
	border-color: var(--fc-violet);
	color: var(--fc-violet);
	transform: translateY(-2px);
}

@media (max-width: 640px) {
	.fc-faq--lines .fc-faq__a-inner { padding-left: 4px; }
	.fc-faq__notfound a { width: 100%; text-align: center; }
}

.fc-faq__list { display: grid; gap: 12px; }

.fc-faq__item {
	border-radius: var(--r-md);
	background: var(--fc-white);
	border: 1px solid rgba(9, 0, 27, 0.09);
	overflow: hidden;
	transition: border-color 0.3s, box-shadow 0.4s;
}

.fc-faq__item.is-open {
	border-color: rgba(135, 82, 250, 0.4);
	box-shadow: 0 18px 44px rgba(9, 0, 27, 0.08);
}

.fc-faq__q {
	display: flex;
	align-items: center;
	gap: 18px;
	width: 100%;
	padding: 22px 26px;
	text-align: left;
	font-weight: 700;
	font-size: 1.02rem;
}

.fc-faq__num {
	font-family: var(--font-display);
	font-weight: 800;
	font-stretch: 118%;
	font-size: 0.85rem;
	color: var(--fc-violet);
}

.fc-faq__q-txt { flex: 1; }

.fc-faq__icon {
	position: relative;
	flex: 0 0 auto;
	width: 34px; height: 34px;
	border-radius: 50%;
	background: rgba(135, 82, 250, 0.1);
	transition: background-color 0.3s, transform 0.45s var(--ease-luxe);
}

.fc-faq__icon::before,
.fc-faq__icon::after {
	content: '';
	position: absolute;
	top: 50%; left: 50%;
	width: 12px; height: 2px;
	margin: -1px 0 0 -6px;
	border-radius: 2px;
	background: var(--fc-violet);
	transition: transform 0.45s var(--ease-luxe);
}

.fc-faq__icon::after { transform: rotate(90deg); }

.fc-faq__item.is-open .fc-faq__icon {
	background: var(--fc-lime);
	transform: rotate(180deg);
}
.fc-faq__item.is-open .fc-faq__icon::before,
.fc-faq__item.is-open .fc-faq__icon::after { background: var(--fc-dark); }
.fc-faq__item.is-open .fc-faq__icon::after { transform: rotate(0deg); }

/* Fermé uniquement quand JS est là pour l'ouvrir ; sans JS tout reste lisible. */
.fc-js .fc-faq__a { height: 0; overflow: hidden; }

.fc-faq__a-inner { padding: 0 26px 24px 70px; color: var(--fc-taupe); }

/* -----------------------------------------------------------------------------
   33. Contact rapide, carte, réseaux
   -------------------------------------------------------------------------- */

.fc-quick { padding: clamp(40px, 6vw, 80px) 0 clamp(80px, 10vw, 140px); }

.fc-quick__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 18px;
}

.fc-quick__card {
	display: grid;
	align-content: start;
	gap: 8px;
	padding: 30px;
	border-radius: var(--r-lg);
	background: var(--fc-white);
	border: 1px solid rgba(9, 0, 27, 0.09);
	transition: box-shadow 0.5s var(--ease-out), border-color 0.3s;
}

.fc-quick__card:hover {
	box-shadow: 0 24px 54px rgba(9, 0, 27, 0.12);
	border-color: rgba(135, 82, 250, 0.35);
}

.fc-quick__label {
	font-size: 0.72rem;
	font-weight: 800;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--fc-violet);
}

.fc-quick__card strong {
	font-family: var(--font-display);
	font-weight: 800;
	font-stretch: 112%;
	font-size: 1.15rem;
	text-transform: uppercase;
	line-height: 1.2;
}

.fc-quick__card p { font-size: 0.88rem; color: var(--fc-taupe); }

.fc-contact { padding: clamp(60px, 8vw, 110px) 0; }

.fc-contact__grid {
	display: grid;
	grid-template-columns: 1fr 1.1fr;
	gap: 20px;
	align-items: stretch;
}

.fc-contact__cards { display: grid; gap: 16px; align-content: start; }

.fc-contact__map {
	border-radius: var(--r-xl);
	overflow: hidden;
	min-height: 460px;
	border: 1px solid rgba(9, 0, 27, 0.1);
	filter: grayscale(0.85) contrast(1.02);
	transition: filter 0.7s var(--ease-out);
}

.fc-contact__map:hover { filter: grayscale(0); }

.fc-contact__map iframe {
	width: 100%; height: 100%;
	min-height: 460px;
	border: 0;
	display: block;
}

.fc-socials-band { padding-bottom: clamp(40px, 6vw, 80px); }

.fc-socials-band__card {
	display: grid;
	gap: 18px;
	justify-items: start;
	padding: clamp(36px, 6vw, 70px);
	border-radius: var(--r-xl);
	background: var(--fc-white);
	border: 1px solid rgba(9, 0, 27, 0.08);
}

.fc-socials-band__card p { max-width: 440px; color: var(--fc-taupe); }

.fc-socials-band__links { display: flex; flex-wrap: wrap; gap: 12px; }

.fc-btn--glass-dark {
	border: 1.5px solid rgba(9, 0, 27, 0.25);
	color: var(--fc-ink);
	background: transparent;
}
.fc-btn--glass-dark:hover { border-color: var(--fc-violet); color: var(--fc-violet); }

.fc-quick__card--hours { cursor: default; }
.fc-quick__card--hours .fc-footer__hours-row { color: var(--fc-ink-60); }
.fc-quick__card--hours .fc-footer__hours-row span:last-child { color: var(--fc-ink); }

/* -----------------------------------------------------------------------------
   33a-bis. Formulaire de contact
   -------------------------------------------------------------------------- */

.fc-form { padding-bottom: clamp(60px, 8vw, 110px); }

.fc-form__card {
	display: grid;
	grid-template-columns: 0.85fr 1.15fr;
	gap: clamp(30px, 5vw, 80px);
	padding: clamp(30px, 5vw, 64px);
	border-radius: var(--r-xl);
	background: var(--fc-white);
	border: 1px solid rgba(9, 0, 27, 0.08);
}

.fc-form__head .fc-h2 { font-size: clamp(2rem, 3.6vw, 3.2rem); }
.fc-form__head p { margin-top: 16px; color: var(--fc-taupe); max-width: 380px; }

.fc-form__form { display: grid; gap: 18px; align-content: start; }

/* Honeypot : hors écran, jamais visible */
.fc-form__hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px; height: 1px;
	overflow: hidden;
}

.fc-form__row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 18px;
}

.fc-form__field { display: grid; gap: 8px; }

.fc-form__field label {
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--fc-ink-60);
}

.fc-form__field label small { text-transform: none; letter-spacing: 0; font-weight: 600; }
.fc-form__field label span { color: var(--fc-violet); }

.fc-form__field input,
.fc-form__field textarea {
	width: 100%;
	padding: 14px 18px;
	border-radius: 16px;
	border: 1px solid rgba(9, 0, 27, 0.14);
	background: var(--fc-bg);
	font: inherit;
	font-size: 0.95rem;
	color: var(--fc-ink);
	transition: border-color 0.25s, box-shadow 0.25s;
}

.fc-form__field textarea { resize: vertical; min-height: 130px; }

.fc-form__field input:focus,
.fc-form__field textarea:focus {
	outline: none;
	border-color: var(--fc-violet);
	box-shadow: 0 0 0 3px rgba(135, 82, 250, 0.18);
}

.fc-form__consent {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: 0.85rem;
	color: var(--fc-taupe);
	cursor: pointer;
}

.fc-form__consent input {
	margin-top: 3px;
	width: 17px; height: 17px;
	accent-color: var(--fc-violet);
	flex: 0 0 auto;
}

.fc-form__consent a {
	color: var(--fc-violet);
	font-weight: 600;
	border-bottom: 1px solid rgba(135, 82, 250, 0.35);
}

.fc-form__foot { display: grid; gap: 12px; justify-items: start; margin-top: 6px; }

.fc-form.is-sending button[type="submit"],
.fc-form__form.is-sending button[type="submit"] { opacity: 0.6; pointer-events: none; }

.fc-form__status { font-weight: 600; font-size: 0.92rem; min-height: 1.4em; }
.fc-form__status.is-success { color: #1c7c39; }
.fc-form__status.is-error { color: #b3261e; }

/* -----------------------------------------------------------------------------
   33b. Five.Bot — bulle, pop-up de chat, carte CTA (page Aide)
   -------------------------------------------------------------------------- */

.fc-bot {
	position: fixed;
	right: 22px;
	bottom: 22px;
	z-index: 950;
}

body.menu-open .fc-bot { visibility: hidden; }

/* Invite discrète « Une question ? » */
.fc-bot__nudge {
	position: absolute;
	right: 72px;
	bottom: 12px;
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 12px 10px 18px;
	border-radius: var(--r-pill);
	background: var(--fc-dark);
	color: var(--fc-bg);
	font-size: 0.85rem;
	font-weight: 600;
	white-space: nowrap;
	box-shadow: 0 14px 36px rgba(9, 0, 27, 0.3);
	opacity: 0;
	transform: translateX(8px);
	transition: opacity 0.4s var(--ease-out), transform 0.5s var(--ease-out);
	pointer-events: none;
}

.fc-bot.has-nudge .fc-bot__nudge {
	opacity: 1;
	transform: none;
	pointer-events: auto;
}

.fc-bot__nudge[hidden] { display: flex; }
.fc-bot:not(.has-nudge) .fc-bot__nudge { opacity: 0; pointer-events: none; }

/* Le pop-up d'offre a la priorité : le nudge s'efface tant qu'il est ouvert
   (sur mobile les deux se chevauchent en bas d'écran) */
body.fc-offer-pop-open .fc-bot .fc-bot__nudge { opacity: 0; pointer-events: none; }

.fc-bot__nudge button {
	display: grid;
	place-items: center;
	width: 22px; height: 22px;
	border-radius: 50%;
	background: rgba(242, 241, 237, 0.12);
	color: var(--fc-bg);
	transition: background-color 0.3s;
}
.fc-bot__nudge button:hover { background: rgba(242, 241, 237, 0.25); }

/* Bulle */
.fc-bot__bubble {
	position: relative;
	display: grid;
	place-items: center;
	width: 62px; height: 62px;
	border-radius: 50%;
	background: var(--fc-violet);
	color: var(--fc-white);
	box-shadow: 0 16px 40px rgba(69, 0, 249, 0.35);
	transition: transform 0.4s var(--ease-out), background-color 0.3s, box-shadow 0.4s;
}

.fc-bot__bubble:hover {
	transform: translateY(-3px) scale(1.05);
	box-shadow: 0 22px 52px rgba(69, 0, 249, 0.45);
}

.fc-bot.is-open .fc-bot__bubble { background: var(--fc-dark); }

/* Pastille lime « nouveau » */
.fc-bot__ping {
	position: absolute;
	top: 2px; right: 2px;
	width: 13px; height: 13px;
	border-radius: 50%;
	background: var(--fc-lime);
	border: 2.5px solid var(--fc-bg);
	opacity: 0;
	transform: scale(0);
	transition: opacity 0.3s, transform 0.4s var(--ease-out);
}

.fc-bot.has-ping .fc-bot__ping {
	opacity: 1;
	transform: none;
	animation: fc-bot-ping 2.2s infinite var(--ease-luxe);
}

@keyframes fc-bot-ping {
	0%, 100% { box-shadow: 0 0 0 0 rgba(198, 255, 62, 0.5); }
	50% { box-shadow: 0 0 0 7px rgba(198, 255, 62, 0); }
}

.fc-bot__bubble-icon {
	grid-area: 1 / 1;
	display: grid;
	place-items: center;
	transition: opacity 0.3s, transform 0.45s var(--ease-out);
}
.fc-bot__bubble-icon--close { opacity: 0; transform: rotate(-90deg) scale(0.6); }
.fc-bot.is-open .fc-bot__bubble-icon--open { opacity: 0; transform: rotate(90deg) scale(0.6); }
.fc-bot.is-open .fc-bot__bubble-icon--close { opacity: 1; transform: none; }

/* Panneau — verre sombre signature du site */
.fc-bot__panel {
	position: absolute;
	right: 0;
	bottom: 78px;
	width: min(392px, calc(100vw - 44px));
	max-height: min(600px, calc(100svh - 130px));
	display: flex;
	flex-direction: column;
	border-radius: 26px;
	background: rgba(9, 0, 27, 0.92);
	border: 1px solid rgba(242, 241, 237, 0.14);
	backdrop-filter: blur(22px) saturate(1.3);
	-webkit-backdrop-filter: blur(22px) saturate(1.3);
	box-shadow: 0 34px 90px rgba(9, 0, 27, 0.5);
	overflow: hidden;
	visibility: hidden;
	opacity: 0;
	transform: translateY(16px) scale(0.96);
	transform-origin: bottom right;
	transition: opacity 0.35s var(--ease-out), transform 0.5s var(--ease-out), visibility 0s 0.5s;
	pointer-events: none;
	color: var(--fc-bg);
}

.fc-bot__panel > .fc-grain { opacity: 0.25; z-index: 0; }
.fc-bot__panel > *:not(.fc-grain) { position: relative; z-index: 1; }

/* La visibilité est animée via .is-open ; [hidden] ne doit pas casser le layout flex */
.fc-bot__panel[hidden] { display: flex; }

.fc-bot.is-open .fc-bot__panel {
	visibility: visible;
	opacity: 1;
	transform: none;
	pointer-events: auto;
	transition: opacity 0.35s var(--ease-out), transform 0.5s var(--ease-out), visibility 0s;
}

.fc-bot__head {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 14px 14px 14px 18px;
	border-bottom: 1px solid rgba(242, 241, 237, 0.1);
	background: rgba(18, 18, 27, 0.6);
}

.fc-bot__avatar {
	display: grid;
	place-items: center;
	width: 40px; height: 40px;
	border-radius: 14px;
	background: var(--fc-gradient);
	box-shadow: 0 8px 22px rgba(69, 0, 249, 0.35);
}

.fc-bot__head-txt { display: grid; line-height: 1.3; }
.fc-bot__head-txt strong {
	font-family: var(--font-display);
	font-stretch: 114%;
	font-size: 1rem;
	text-transform: uppercase;
}

.fc-bot__status {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 0.73rem;
	color: rgba(242, 241, 237, 0.6);
}

.fc-bot__status i {
	width: 7px; height: 7px;
	border-radius: 50%;
	background: var(--fc-lime);
	animation: fc-pulse 2.4s infinite var(--ease-luxe);
}

.fc-bot__hbtn {
	display: grid;
	place-items: center;
	width: 34px; height: 34px;
	border-radius: 50%;
	color: var(--fc-bg);
	background: rgba(242, 241, 237, 0.08);
	transition: background-color 0.3s, transform 0.3s var(--ease-out);
}
.fc-bot__hbtn:first-of-type { margin-left: auto; }
.fc-bot__hbtn:hover { background: rgba(242, 241, 237, 0.2); transform: rotate(-18deg); }
.fc-bot__hbtn#fc-bot-close:hover { transform: none; }

/* Fil de messages */
.fc-bot__messages {
	flex: 1;
	min-height: 240px;
	overflow-y: auto;
	overscroll-behavior: contain; /* la molette scrolle la discussion, jamais la page */
	display: grid;
	align-content: start;
	gap: 10px;
	padding: 18px 16px;
	scrollbar-width: thin;
	scrollbar-color: rgba(242, 241, 237, 0.2) transparent;
}

.fc-bot__messages::-webkit-scrollbar { width: 5px; }
.fc-bot__messages::-webkit-scrollbar-thumb {
	background: rgba(242, 241, 237, 0.18);
	border-radius: 99px;
}

.fc-bot__msg {
	max-width: 88%;
	font-size: 0.92rem;
	line-height: 1.55;
	animation: fc-bot-msg-in 0.5s var(--ease-out) backwards;
}

.fc-bot__msg.is-restored { animation: none; }

@keyframes fc-bot-msg-in {
	from { opacity: 0; transform: translateY(12px) scale(0.98); }
	to { opacity: 1; transform: none; }
}

.fc-bot__msg-txt {
	padding: 12px 15px;
	border-radius: 18px;
	overflow-wrap: break-word;
}

.fc-bot__msg--assistant { justify-self: start; }
.fc-bot__msg--assistant .fc-bot__msg-txt {
	background: rgba(242, 241, 237, 0.07);
	border: 1px solid rgba(242, 241, 237, 0.1);
	border-bottom-left-radius: 6px;
}
.fc-bot__msg--assistant strong { color: var(--fc-lime); font-weight: 700; }

.fc-bot__msg--user { justify-self: end; }
.fc-bot__msg--user .fc-bot__msg-txt {
	background: var(--fc-lime);
	color: var(--fc-dark);
	font-weight: 500;
	border-bottom-right-radius: 6px;
}

.fc-bot__msg--error .fc-bot__msg-txt {
	background: rgba(254, 84, 66, 0.14);
	border: 1px solid rgba(254, 84, 66, 0.4);
	color: #ffb4ab;
}

/* Boutons d'action dans les réponses */
.fc-bot__actions {
	display: grid;
	gap: 7px;
	margin-top: 8px;
}

.fc-bot__action {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	padding: 11px 16px;
	border-radius: var(--r-pill);
	background: rgba(135, 82, 250, 0.16);
	border: 1px solid rgba(135, 82, 250, 0.45);
	color: var(--fc-bg);
	font-size: 0.88rem;
	font-weight: 600;
	transition: background-color 0.3s, border-color 0.3s, transform 0.35s var(--ease-out);
}

.fc-bot__action:hover {
	background: var(--fc-violet);
	border-color: var(--fc-violet);
	transform: translateX(3px);
}

.fc-bot__action i {
	font-style: normal;
	transition: transform 0.35s var(--ease-out);
}
.fc-bot__action:hover i { transform: translateX(3px); }

/* Chips de suggestions */
.fc-bot__suggests {
	display: flex;
	flex-wrap: wrap;
	gap: 7px;
	padding: 0 16px 10px;
}

.fc-bot__suggests:empty { display: none; }

.fc-bot__chip {
	padding: 8px 14px;
	border-radius: var(--r-pill);
	border: 1px solid rgba(198, 255, 62, 0.4);
	background: rgba(198, 255, 62, 0.07);
	color: var(--fc-lime);
	font-size: 0.8rem;
	font-weight: 600;
	transition: background-color 0.3s, color 0.3s, transform 0.3s var(--ease-out);
	animation: fc-bot-msg-in 0.45s var(--ease-out) backwards;
}

.fc-bot__chip:nth-child(2) { animation-delay: 0.06s; }
.fc-bot__chip:nth-child(3) { animation-delay: 0.12s; }

.fc-bot__chip:hover {
	background: var(--fc-lime);
	color: var(--fc-dark);
	transform: translateY(-2px);
}

/* Indicateur de frappe */
.fc-bot__msg--typing {
	display: inline-flex;
	align-items: center;
	gap: 5px;
	padding: 14px 16px;
	background: rgba(242, 241, 237, 0.07);
	border: 1px solid rgba(242, 241, 237, 0.1);
	border-radius: 18px;
	border-bottom-left-radius: 6px;
	justify-self: start;
}
.fc-bot__msg--typing span {
	width: 6px; height: 6px;
	border-radius: 50%;
	background: var(--fc-lilac);
	animation: fc-bot-typing 1.1s infinite;
}
.fc-bot__msg--typing span:nth-child(2) { animation-delay: 0.15s; }
.fc-bot__msg--typing span:nth-child(3) { animation-delay: 0.3s; }

@keyframes fc-bot-typing {
	0%, 100% { opacity: 0.3; transform: translateY(0); }
	50% { opacity: 1; transform: translateY(-3px); }
}

/* Zone de saisie */
.fc-bot__form {
	display: flex;
	gap: 8px;
	padding: 12px 14px;
	border-top: 1px solid rgba(242, 241, 237, 0.1);
	background: rgba(18, 18, 27, 0.6);
}

.fc-bot__input {
	flex: 1;
	padding: 12px 18px;
	border-radius: var(--r-pill);
	border: 1px solid rgba(242, 241, 237, 0.16);
	background: rgba(242, 241, 237, 0.06);
	font: inherit;
	font-size: 0.92rem;
	color: var(--fc-bg);
	transition: border-color 0.3s, background-color 0.3s;
}

.fc-bot__input::placeholder { color: rgba(242, 241, 237, 0.4); }

.fc-bot__input:focus {
	outline: none;
	border-color: var(--fc-lime);
	background: rgba(242, 241, 237, 0.09);
}

.fc-bot__send {
	flex: 0 0 auto;
	display: grid;
	place-items: center;
	width: 46px; height: 46px;
	border-radius: 50%;
	background: var(--fc-lime);
	color: var(--fc-dark);
	transition: background-color 0.3s, transform 0.3s var(--ease-out), box-shadow 0.3s;
}
.fc-bot__send:hover {
	transform: scale(1.08) rotate(-8deg);
	box-shadow: 0 10px 26px rgba(198, 255, 62, 0.35);
}
.fc-bot.is-pending .fc-bot__send { opacity: 0.5; pointer-events: none; }

.fc-bot__hint {
	padding: 0 18px 12px;
	font-size: 0.68rem;
	color: rgba(242, 241, 237, 0.4);
}

/* Caret de la machine à écrire */
.fc-bot__msg-txt.is-typing { cursor: pointer; }
.fc-bot__msg-txt.is-typing::after {
	content: '';
	display: inline-block;
	width: 2px; height: 1em;
	margin-left: 2px;
	vertical-align: text-bottom;
	background: var(--fc-lime);
	animation: fc-bot-caret 0.85s steps(1) infinite;
}

@keyframes fc-bot-caret {
	0%, 60% { opacity: 1; }
	61%, 100% { opacity: 0; }
}

/* -----------------------------------------------------------------------------
   Cartes riches dans le fil de discussion
   -------------------------------------------------------------------------- */

.fc-bot__cards {
	display: grid;
	gap: 10px;
	margin-top: 10px;
}

/* Carrousel horizontal quand plusieurs cartes */
.fc-bot__cards.is-carousel {
	display: flex;
	gap: 10px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	padding-bottom: 4px;
	margin-right: -16px;
	padding-right: 16px;
	-webkit-mask-image: linear-gradient(90deg, #000 88%, transparent);
	mask-image: linear-gradient(90deg, #000 88%, transparent);
}
.fc-bot__cards.is-carousel::-webkit-scrollbar { display: none; }
.fc-bot__cards.is-carousel .fc-bot__card {
	flex: 0 0 236px;
	scroll-snap-align: start;
}

.fc-bot__cards.is-fresh .fc-bot__card { animation: fc-bot-msg-in 0.55s var(--ease-out) backwards; }
.fc-bot__cards.is-fresh .fc-bot__card:nth-child(2) { animation-delay: 0.08s; }
.fc-bot__cards.is-fresh .fc-bot__card:nth-child(3) { animation-delay: 0.16s; }
.fc-bot__actions.is-fresh .fc-bot__action { animation: fc-bot-msg-in 0.5s var(--ease-out) backwards; }
.fc-bot__actions.is-fresh .fc-bot__action:nth-child(2) { animation-delay: 0.07s; }
.fc-bot__actions.is-fresh .fc-bot__action:nth-child(3) { animation-delay: 0.14s; }

.fc-bot__card {
	position: relative;
	display: grid;
	gap: 8px;
	padding: 16px;
	border-radius: 18px;
	background: rgba(242, 241, 237, 0.06);
	border: 1px solid rgba(242, 241, 237, 0.12);
	transition: border-color 0.3s, transform 0.35s var(--ease-out);
}

.fc-bot__card:hover {
	border-color: rgba(135, 82, 250, 0.55);
	transform: translateY(-2px);
}

.fc-bot__card-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
}

.fc-bot__card-name {
	font-family: var(--font-display);
	font-weight: 800;
	font-stretch: 114%;
	font-size: 0.95rem;
	text-transform: uppercase;
	line-height: 1.15;
}

.fc-bot__card-pill {
	flex: 0 0 auto;
	padding: 4px 10px;
	border-radius: var(--r-pill);
	background: rgba(135, 82, 250, 0.2);
	color: var(--fc-lilac);
	font-size: 0.66rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	white-space: nowrap;
}

.fc-bot__card-price {
	display: flex;
	align-items: baseline;
	gap: 6px;
}

.fc-bot__card-chf { font-size: 0.78rem; font-weight: 700; opacity: 0.55; }

.fc-bot__card-amount {
	font-family: var(--font-display);
	font-weight: 850;
	font-stretch: 118%;
	font-size: 1.7rem;
	line-height: 1;
	color: var(--fc-lime);
}

.fc-bot__card-period { font-size: 0.78rem; opacity: 0.55; }
.fc-bot__card-old { font-size: 0.8rem; opacity: 0.5; }

.fc-bot__card-desc {
	font-size: 0.82rem;
	line-height: 1.45;
	color: rgba(242, 241, 237, 0.66);
	margin: 0;
}

.fc-bot__card-cta {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin-top: 2px;
	padding: 10px 14px;
	border-radius: var(--r-pill);
	background: var(--fc-lime);
	color: var(--fc-dark);
	font-size: 0.84rem;
	font-weight: 700;
	transition: transform 0.3s var(--ease-out), box-shadow 0.3s;
}

.fc-bot__card-cta:hover {
	transform: translateY(-1px);
	box-shadow: 0 8px 22px rgba(198, 255, 62, 0.3);
}

.fc-bot__card-cta i { font-style: normal; }

/* Carte featured (All-Day) : liseré violet */
.fc-bot__card--pass.is-featured {
	background: rgba(135, 82, 250, 0.14);
	border-color: rgba(135, 82, 250, 0.5);
}

/* Carte promo : lime signature */
.fc-bot__card--promo {
	background: var(--fc-lime);
	border-color: var(--fc-lime);
	color: var(--fc-dark);
}
.fc-bot__card--promo .fc-bot__card-amount { color: var(--fc-dark); }
.fc-bot__card--promo .fc-bot__card-desc { color: rgba(9, 0, 27, 0.7); }
.fc-bot__card--promo .fc-bot__card-cta { background: var(--fc-dark); color: var(--fc-lime); }
.fc-bot__card--promo .fc-bot__card-cta:hover { box-shadow: 0 8px 22px rgba(9, 0, 27, 0.35); }

.fc-bot__card-badge {
	justify-self: start;
	padding: 4px 10px;
	border-radius: var(--r-pill);
	background: var(--fc-dark);
	color: var(--fc-lime);
	font-size: 0.64rem;
	font-weight: 800;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

/* Carte mini-planning */
.fc-bot__card-picto {
	display: grid;
	place-items: center;
	width: 34px; height: 34px;
	border-radius: 10px;
	background: rgba(198, 255, 62, 0.1);
	border: 1px solid rgba(198, 255, 62, 0.2);
	flex: 0 0 auto;
}

.fc-bot__card--planning .fc-bot__card-head { justify-content: flex-start; }

.fc-bot__card-rows {
	display: grid;
	gap: 4px;
	max-height: 168px;
	overflow-y: auto;
	scrollbar-width: thin;
	scrollbar-color: rgba(242, 241, 237, 0.2) transparent;
}

.fc-bot__card-row {
	display: grid;
	grid-template-columns: 1fr auto auto;
	gap: 8px;
	align-items: center;
	padding: 7px 10px;
	border-radius: 10px;
	background: rgba(242, 241, 237, 0.05);
	font-size: 0.8rem;
}

.fc-bot__card-day { font-weight: 700; }

.fc-bot__card-time {
	font-family: var(--font-display);
	font-weight: 800;
	font-stretch: 114%;
	color: var(--fc-lime);
}

.fc-bot__card-dur {
	padding: 2px 8px;
	border-radius: var(--r-pill);
	background: rgba(135, 82, 250, 0.22);
	color: var(--fc-lilac);
	font-size: 0.68rem;
	font-weight: 700;
}

/* Carte coach : photo + méta */
.fc-bot__card--coach {
	grid-template-columns: 64px 1fr;
	align-items: center;
	gap: 12px;
}

.fc-bot__card-photo {
	width: 64px; height: 64px;
	border-radius: 16px;
	overflow: hidden;
	background: var(--fc-dark-2);
}

.fc-bot__card-photo img {
	width: 100%; height: 100%;
	object-fit: cover;
}

.fc-bot__card--coach .fc-bot__card-head {
	flex-wrap: wrap;
	justify-content: flex-start;
	gap: 6px;
}

.fc-bot__card-meta { display: grid; gap: 4px; min-width: 0; }

.fc-bot__cards.is-carousel .fc-bot__card--coach { flex-basis: 260px; }

@media (prefers-reduced-motion: reduce) {
	.fc-bot__msg, .fc-bot__chip { animation: none; }
	.fc-bot__ping { animation: none; }
	.fc-bot__cards.is-fresh .fc-bot__card,
	.fc-bot__actions.is-fresh .fc-bot__action { animation: none; }
	.fc-bot__msg-txt.is-typing::after { animation: none; }
}

/* -----------------------------------------------------------------------------
   Voile de transition « Five.Bot aux commandes… »
   Départ : élément .fc-bot-veil (fondu d'entrée). Arrivée : classe fc-veil-on
   posée sur <html> avant le premier rendu (script inline), dissoute ensuite.
   Sous le chat (z-index 950) : le panneau reste net au-dessus du voile.
   -------------------------------------------------------------------------- */

/* Fond du voile — partagé entre l'élément JS et le pseudo d'arrivée
   (le pseudo ne sert qu'à couvrir la page avant que le JS ne prenne le relais). */
.fc-bot-veil,
html.fc-veil-on::after {
	position: fixed;
	inset: 0;
	z-index: 940;
	background:
		radial-gradient(80% 80% at 85% 115%, rgba(69, 0, 249, 0.28) 0%, transparent 60%),
		linear-gradient(160deg, rgba(9, 0, 27, 0.6) 0%, rgba(9, 0, 27, 0.44) 55%, rgba(9, 0, 27, 0.58) 100%);
	backdrop-filter: blur(9px) saturate(1.15);
	-webkit-backdrop-filter: blur(9px) saturate(1.15);
	pointer-events: none;
}

html.fc-veil-on::after { content: ''; }

/* L'élément : caption + balayage lumineux, fondu global (les animations des
   enfants n'empêchent jamais le fade du parent — fini la caption qui traîne). */
.fc-bot-veil {
	opacity: 0;
	transition: opacity 0.45s var(--ease-out);
	overflow: hidden;
}

.fc-bot-veil.is-in { opacity: 1; }

/* Balayage diagonal discret : la « prise de contrôle » se sent, sans agresser */
.fc-bot-veil__sweep {
	position: absolute;
	inset: -20%;
	background: linear-gradient(115deg, transparent 42%, rgba(198, 255, 62, 0.07) 50%, rgba(135, 82, 250, 0.1) 54%, transparent 62%);
	animation: fc-veil-sweep 1.6s var(--ease-luxe) infinite;
}

@keyframes fc-veil-sweep {
	0% { transform: translateX(-45%); }
	100% { transform: translateX(45%); }
}

/* Caption bas-gauche : pastille verre, très lisible sur tout fond */
.fc-bot-veil__caption {
	position: absolute;
	left: clamp(20px, 4vw, 40px);
	bottom: clamp(20px, 4vw, 36px);
	display: flex;
	align-items: center;
	gap: 11px;
	padding: 12px 18px;
	border-radius: var(--r-pill);
	background: rgba(9, 0, 27, 0.72);
	border: 1px solid rgba(242, 241, 237, 0.16);
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
	box-shadow: 0 14px 40px rgba(9, 0, 27, 0.45);
}

.fc-bot-veil__dot {
	width: 9px; height: 9px;
	border-radius: 50%;
	background: var(--fc-lime);
	box-shadow: 0 0 14px rgba(198, 255, 62, 0.8);
	animation: fc-pulse 1.4s infinite var(--ease-luxe);
}

.fc-bot-veil__txt {
	font-family: var(--font-display);
	font-weight: 800;
	font-stretch: 116%;
	font-size: 0.85rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--fc-bg);
}

/* Points de progression façon « frappe » */
.fc-bot-veil__dots {
	display: inline-flex;
	gap: 4px;
}

.fc-bot-veil__dots span {
	width: 5px; height: 5px;
	border-radius: 50%;
	background: var(--fc-lilac);
	animation: fc-bot-typing 1.1s infinite;
}
.fc-bot-veil__dots span:nth-child(2) { animation-delay: 0.15s; }
.fc-bot-veil__dots span:nth-child(3) { animation-delay: 0.3s; }

@media (prefers-reduced-motion: reduce) {
	.fc-bot-veil, html.fc-veil-on::after { display: none; }
}

/* -----------------------------------------------------------------------------
   Navigation guidée — flash de la section cible (utilisé hors du widget)
   -------------------------------------------------------------------------- */

.fc-guide-flash {
	animation: fc-guide-flash 2.4s var(--ease-out);
	scroll-margin-top: 100px;
}

@keyframes fc-guide-flash {
	0% { box-shadow: 0 0 0 0 rgba(135, 82, 250, 0); }
	18% { box-shadow: 0 0 0 5px rgba(135, 82, 250, 0.55), 0 0 70px rgba(135, 82, 250, 0.3); }
	100% { box-shadow: 0 0 0 0 rgba(135, 82, 250, 0); }
}

/* =============================================================================
   CONFIGURATEUR D'ABONNEMENT
   ========================================================================== */

/* -----------------------------------------------------------------------------
   Bouton déclencheur — gradient signature + balayage lumineux
   -------------------------------------------------------------------------- */

.fc-btn--config {
	position: relative;
	background: var(--fc-gradient);
	color: var(--fc-white);
	overflow: hidden;
	box-shadow: 0 12px 34px rgba(69, 0, 249, 0.35);
}

.fc-btn--config:hover { box-shadow: 0 18px 48px rgba(69, 0, 249, 0.5); }

.fc-btn__spark {
	display: grid;
	place-items: center;
	color: var(--fc-lime);
}

.fc-btn__shine {
	position: absolute;
	inset: 0;
	background: linear-gradient(115deg, transparent 30%, rgba(255, 255, 255, 0.35) 50%, transparent 70%);
	transform: translateX(-120%);
	animation: fc-shine 3.6s var(--ease-luxe) infinite;
	pointer-events: none;
}

@keyframes fc-shine {
	0%, 55% { transform: translateX(-120%); }
	85%, 100% { transform: translateX(120%); }
}

/* -----------------------------------------------------------------------------
   Duo Offre exclusive + Configurateur (page Abonnements)
   Grille asymétrique 7/5, configurateur légèrement décalé vers le bas —
   contraste lime/navy façon bento.
   -------------------------------------------------------------------------- */

.fc-duo {
	display: grid;
	grid-template-columns: 7fr 5fr;
	gap: 20px;
	align-items: stretch;
}

/* ---- Offre : carte lime verticale, prix + CTA sur la ligne de pied ---- */
.fc-promo__card--stack {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 14px;
	min-height: 400px;
	padding: clamp(30px, 4vw, 50px);
}

/* Filigrane logomark dans l'angle */
.fc-promo__mark {
	position: absolute;
	right: -30px;
	bottom: -34px;
	width: clamp(180px, 22vw, 260px);
	height: auto;
	opacity: 0.07;
	transform: rotate(-10deg);
	pointer-events: none;
}

/* Badge intégré au flux (fini le chevauchement avec le titre) */
.fc-promo__badge-inline {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 8px 16px;
	border-radius: var(--r-pill);
	background: var(--fc-dark);
	color: var(--fc-lime);
	font-size: 0.7rem;
	font-weight: 800;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.fc-promo__stack-title {
	font-size: clamp(1.9rem, 3.8vw, 3rem);
	font-weight: 850;
	font-stretch: 118%;
	text-transform: uppercase;
	line-height: 1.02;
	max-width: 16ch;
	position: relative;
}

.fc-promo__stack-txt {
	font-weight: 500;
	color: rgba(9, 0, 27, 0.72);
	max-width: 44ch;
	position: relative;
}

/* Pied : ancien prix au-dessus, prix géant + CTA alignés en bas */
.fc-promo__foot {
	position: relative;
	margin-top: auto;
	width: 100%;
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 18px;
	padding-top: 18px;
	border-top: 1.5px dashed rgba(9, 0, 27, 0.2);
}

.fc-promo__price-col { display: grid; gap: 2px; }

.fc-promo__card--stack .fc-promo__old { font-size: 0.95rem; }
.fc-promo__card--stack .fc-promo__new {
	font-size: clamp(2.6rem, 5vw, 3.8rem);
	line-height: 0.95;
}

/* ---- Configurateur : carte navy structurée, décalée ---- */
.fc-configband__card--stack {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 14px;
	padding: clamp(28px, 3.5vw, 44px);
	border-radius: var(--r-xl);
	background: var(--fc-dark);
	color: var(--fc-bg);
	position: relative;
	overflow: hidden;
}

/* Le bouton reste ancré en bas de la carte étirée (hauteurs égales du duo) */
.fc-configband__card--stack .fc-btn--config { margin-top: auto; }

/* Halo violet discret dans l'angle */
.fc-configband__card--stack::before {
	content: '';
	position: absolute;
	right: -90px; top: -90px;
	width: 300px; height: 300px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(135, 82, 250, 0.4) 0%, transparent 70%);
	pointer-events: none;
}

.fc-configband__card--stack .fc-configband__icon {
	position: relative;
	width: 54px; height: 54px;
	border-radius: 18px;
	margin: 0;
}

.fc-configband__stack-title {
	position: relative;
	font-size: clamp(1.5rem, 2.8vw, 2.1rem);
	font-weight: 850;
	font-stretch: 116%;
	text-transform: uppercase;
}

.fc-configband__stack-txt {
	position: relative;
	color: rgba(242, 241, 237, 0.66);
	max-width: 38ch;
}

/* Micro-pills : ce que promet le configurateur */
.fc-configband__chips {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	gap: 7px;
	margin-bottom: 6px;
}

.fc-configband__chips span {
	padding: 7px 13px;
	border-radius: var(--r-pill);
	background: rgba(242, 241, 237, 0.06);
	border: 1px solid rgba(242, 241, 237, 0.14);
	font-size: 0.74rem;
	font-weight: 600;
	color: rgba(242, 241, 237, 0.72);
}

.fc-configband__card--stack .fc-btn--config {
	position: relative;
	margin-top: auto;
	width: 100%;
	justify-content: center;
}

@media (max-width: 900px) {
	.fc-duo { grid-template-columns: 1fr; }
	.fc-configband__card--stack { margin-top: 0; }
	.fc-promo__card--stack { min-height: 0; }
	.fc-promo__foot .fc-btn { width: 100%; justify-content: center; }
}

/* -----------------------------------------------------------------------------
   Bande configurateur (page Abonnements)
   -------------------------------------------------------------------------- */

.fc-configband { padding: clamp(50px, 7vw, 90px) 0 0; }

.fc-configband__card {
	position: relative;
	overflow: hidden;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: clamp(18px, 3vw, 34px);
	padding: clamp(26px, 4vw, 44px);
	border-radius: var(--r-xl);
	background: var(--fc-dark);
	color: var(--fc-bg);
}

.fc-configband__icon {
	display: grid;
	place-items: center;
	flex: 0 0 auto;
	width: 60px; height: 60px;
	border-radius: 20px;
	background: var(--fc-gradient);
	color: var(--fc-lime);
	box-shadow: 0 12px 30px rgba(69, 0, 249, 0.4);
}

.fc-configband__body { position: relative; flex: 1 1 300px; }

.fc-configband__card h2 {
	font-size: clamp(1.3rem, 2.6vw, 1.9rem);
	font-weight: 800;
	font-stretch: 114%;
	text-transform: uppercase;
}

.fc-configband__card p { margin-top: 6px; color: rgba(242, 241, 237, 0.66); }

/* -----------------------------------------------------------------------------
   Pop-up
   -------------------------------------------------------------------------- */

body.config-open { overflow: hidden; }

.fc-config {
	position: fixed;
	inset: 0;
	z-index: 990;
	display: grid;
	place-items: center;
	padding: 20px;
}

.fc-config[hidden] { display: none; }

.fc-config__overlay {
	position: absolute;
	inset: 0;
	background: rgba(9, 0, 27, 0.66);
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
	opacity: 0;
	transition: opacity 0.35s var(--ease-out);
}

.fc-config.is-open .fc-config__overlay { opacity: 1; }

.fc-config__dialog {
	position: relative;
	width: min(600px, 100%);
	max-height: min(760px, calc(100svh - 40px));
	display: flex;
	flex-direction: column;
	border-radius: 30px;
	background: rgba(9, 0, 27, 0.94);
	border: 1px solid rgba(242, 241, 237, 0.14);
	backdrop-filter: blur(24px) saturate(1.3);
	-webkit-backdrop-filter: blur(24px) saturate(1.3);
	box-shadow: 0 40px 110px rgba(9, 0, 27, 0.6);
	color: var(--fc-bg);
	overflow: hidden;
	opacity: 0;
	transform: translateY(26px) scale(0.95);
	transition: opacity 0.35s var(--ease-out), transform 0.5s var(--ease-out);
}

.fc-config.is-open .fc-config__dialog { opacity: 1; transform: none; }

.fc-config__dialog > .fc-grain { opacity: 0.22; z-index: 0; }
.fc-config__dialog > *:not(.fc-grain) { position: relative; z-index: 1; }

/* En-tête */
.fc-config__head {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 18px 18px 14px 22px;
}

.fc-config__avatar {
	display: grid;
	place-items: center;
	width: 42px; height: 42px;
	border-radius: 14px;
	background: var(--fc-gradient);
	box-shadow: 0 8px 22px rgba(69, 0, 249, 0.35);
}

.fc-config__head-txt { display: grid; line-height: 1.3; }

.fc-config__head-txt strong {
	font-family: var(--font-display);
	font-weight: 800;
	font-stretch: 116%;
	font-size: 1.05rem;
	text-transform: uppercase;
}

.fc-config__head-txt span { font-size: 0.78rem; color: rgba(242, 241, 237, 0.55); }

.fc-config__close {
	margin-left: auto;
	display: grid;
	place-items: center;
	width: 38px; height: 38px;
	border-radius: 50%;
	color: var(--fc-bg);
	background: rgba(242, 241, 237, 0.08);
	transition: background-color 0.3s, transform 0.35s var(--ease-out);
}

.fc-config__close:hover { background: rgba(242, 241, 237, 0.2); transform: rotate(90deg); }

/* Barre de progression */
.fc-config__progress {
	height: 3px;
	margin: 0 22px;
	border-radius: var(--r-pill);
	background: rgba(242, 241, 237, 0.1);
	overflow: hidden;
}

.fc-config__progress-fill {
	display: block;
	height: 100%;
	background: linear-gradient(90deg, var(--fc-violet), var(--fc-lime));
	transform: scaleX(0);
	transform-origin: left;
	transition: transform 0.6s var(--ease-luxe);
}

/* Corps / étapes */
.fc-config__body {
	flex: 1;
	overflow-y: auto;
	overscroll-behavior: contain; /* le scroll interne ne déborde jamais sur la page */
	padding: 26px 22px;
	scrollbar-width: thin;
	scrollbar-color: rgba(242, 241, 237, 0.2) transparent;
}

.fc-config__step[hidden] { display: none; }

.fc-config__step {
	opacity: 0;
	transform: translateX(26px);
}

.fc-config__step.is-back { transform: translateX(-26px); }

.fc-config__step.is-in {
	opacity: 1;
	transform: none;
	transition: opacity 0.4s var(--ease-out), transform 0.5s var(--ease-out);
}

.fc-config__q {
	font-family: var(--font-display);
	font-weight: 800;
	font-stretch: 116%;
	font-size: clamp(1.25rem, 3.5vw, 1.6rem);
	text-transform: uppercase;
	line-height: 1.15;
	margin-bottom: 22px;
}

/* Options */
.fc-config__options { display: grid; gap: 10px; }

.fc-config__options--grid { grid-template-columns: 1fr 1fr; }

.fc-config__option {
	display: grid;
	justify-items: start;
	gap: 4px;
	padding: 18px;
	border-radius: 20px;
	background: rgba(242, 241, 237, 0.05);
	border: 1px solid rgba(242, 241, 237, 0.12);
	color: var(--fc-bg);
	text-align: left;
	transition: border-color 0.3s, background-color 0.3s, transform 0.35s var(--ease-out);
}

.fc-config__option:hover {
	border-color: rgba(135, 82, 250, 0.6);
	background: rgba(135, 82, 250, 0.12);
	transform: translateY(-2px);
}

.fc-config__option:focus-visible {
	outline: 2px solid var(--fc-lime);
	outline-offset: 2px;
}

.fc-config__option.is-picked {
	border-color: var(--fc-lime);
	background: rgba(198, 255, 62, 0.12);
	transform: scale(0.985);
}

.fc-config__option-ico {
	display: grid;
	place-items: center;
	width: 46px; height: 46px;
	border-radius: 14px;
	background: rgba(135, 82, 250, 0.16);
	color: var(--fc-lilac);
	margin-bottom: 6px;
	transition: background-color 0.3s, color 0.3s, transform 0.4s var(--ease-out);
}

.fc-config__option:hover .fc-config__option-ico {
	background: var(--fc-violet);
	color: var(--fc-white);
	transform: rotate(-6deg) scale(1.06);
}

.fc-config__option.is-picked .fc-config__option-ico {
	background: var(--fc-lime);
	color: var(--fc-dark);
}

.fc-config__option strong {
	font-family: var(--font-display);
	font-weight: 800;
	font-stretch: 112%;
	font-size: 1rem;
	text-transform: uppercase;
}

.fc-config__option span:not(.fc-config__option-ico) {
	font-size: 0.84rem;
	color: rgba(242, 241, 237, 0.6);
}

/* Résultat */
/* Flex + gap : les deux pills gardent leur espacement quand elles
   passent sur deux lignes (mobile) */
.fc-config__result-head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 14px; }

.fc-config__result-badge {
	display: inline-block;
	padding: 7px 15px;
	border-radius: var(--r-pill);
	background: rgba(198, 255, 62, 0.12);
	border: 1px solid rgba(198, 255, 62, 0.4);
	color: var(--fc-lime);
	font-size: 0.72rem;
	font-weight: 800;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.fc-config__result-card {
	position: relative;
	display: grid;
	gap: 10px;
	padding: 24px;
	border-radius: 22px;
	background: rgba(135, 82, 250, 0.14);
	border: 1px solid rgba(135, 82, 250, 0.5);
	animation: fc-bot-msg-in 0.55s var(--ease-out) backwards;
}

.fc-config__result-card.is-promo {
	background: var(--fc-lime);
	border-color: var(--fc-lime);
	color: var(--fc-dark);
}

.fc-config__result-window {
	justify-self: start;
	padding: 5px 12px;
	border-radius: var(--r-pill);
	background: rgba(242, 241, 237, 0.12);
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.fc-config__result-name {
	font-family: var(--font-display);
	font-weight: 850;
	font-stretch: 118%;
	font-size: 1.35rem;
	text-transform: uppercase;
	line-height: 1.1;
}

.fc-config__result-price {
	display: flex;
	align-items: baseline;
	gap: 8px;
}

.fc-config__result-chf { font-size: 0.85rem; font-weight: 700; opacity: 0.6; }

.fc-config__result-amount {
	font-family: var(--font-display);
	font-weight: 850;
	font-stretch: 120%;
	font-size: 2.4rem;
	line-height: 1;
	color: var(--fc-lime);
}

.fc-config__result-card.is-promo .fc-config__result-amount { color: var(--fc-dark); }

.fc-config__result-period { font-size: 0.85rem; opacity: 0.6; }
.fc-config__result-old { font-size: 0.9rem; opacity: 0.55; }

.fc-config__result-desc {
	font-size: 0.9rem;
	line-height: 1.5;
	color: rgba(242, 241, 237, 0.7);
	margin: 0;
}

.fc-config__result-card.is-promo .fc-config__result-desc { color: rgba(9, 0, 27, 0.72); }

.fc-config__cta {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 14px 20px;
	border-radius: var(--r-pill);
	background: var(--fc-lime);
	color: var(--fc-dark);
	font-weight: 700;
	font-size: 0.95rem;
	transition: transform 0.3s var(--ease-out), box-shadow 0.3s;
}

.fc-config__cta:hover {
	transform: translateY(-2px);
	box-shadow: 0 12px 30px rgba(198, 255, 62, 0.35);
}

.fc-config__cta i { font-style: normal; }

.fc-config__result-card.is-promo .fc-config__cta { background: var(--fc-dark); color: var(--fc-lime); }
.fc-config__result-card.is-promo .fc-config__cta:hover { box-shadow: 0 12px 30px rgba(9, 0, 27, 0.4); }

.fc-config__cta--ghost {
	margin-top: 10px;
	background: transparent;
	border: 1.5px solid rgba(242, 241, 237, 0.25);
	color: var(--fc-bg);
}

.fc-config__cta--ghost:hover {
	border-color: var(--fc-lime);
	color: var(--fc-lime);
	box-shadow: none;
}

.fc-config__result-note {
	margin: 12px 0 0;
	font-size: 0.85rem;
	color: rgba(242, 241, 237, 0.6);
}

/* Alternative discrète */
.fc-config__alt {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-top: 12px;
	padding: 14px 18px;
	border-radius: 16px;
	background: rgba(242, 241, 237, 0.05);
	border: 1px solid rgba(242, 241, 237, 0.12);
	color: var(--fc-bg);
	transition: border-color 0.3s, transform 0.35s var(--ease-out);
}

.fc-config__alt:hover {
	border-color: rgba(135, 82, 250, 0.55);
	transform: translateX(3px);
}

.fc-config__alt-txt { display: grid; gap: 2px; }
.fc-config__alt-txt strong { font-size: 0.9rem; font-weight: 700; }
.fc-config__alt-txt span { font-size: 0.78rem; color: rgba(242, 241, 237, 0.55); }

.fc-config__alt-arrow { font-style: normal; color: var(--fc-lilac); }

.fc-config__alt--promo { border-color: rgba(198, 255, 62, 0.4); }
.fc-config__alt--promo:hover { border-color: var(--fc-lime); }

/* Rappels */
.fc-config__extras {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 16px;
}

.fc-config__extra {
	padding: 7px 13px;
	border-radius: var(--r-pill);
	background: rgba(242, 241, 237, 0.06);
	border: 1px solid rgba(242, 241, 237, 0.12);
	font-size: 0.76rem;
	font-weight: 600;
	color: rgba(242, 241, 237, 0.7);
}

.fc-config__extra--price {
	border-color: rgba(198, 255, 62, 0.45);
	color: var(--fc-lime);
}

.fc-config__extra--course {
	border-color: rgba(135, 82, 250, 0.4);
	color: var(--fc-lilac);
}

/* Tag objectif + bloc cours conseillés */
.fc-config__result-obj {
	display: inline-block;
	padding: 7px 14px;
	border-radius: var(--r-pill);
	background: rgba(135, 82, 250, 0.16);
	border: 1px solid rgba(135, 82, 250, 0.4);
	color: var(--fc-lilac);
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.fc-config__courses { margin-top: 16px; }

.fc-config__courses-label {
	display: block;
	margin-bottom: 8px;
	font-size: 0.72rem;
	font-weight: 800;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: rgba(242, 241, 237, 0.5);
}

.fc-config__courses .fc-config__extras { margin-top: 0; }

/* Pied */
.fc-config__foot {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 14px 22px 18px;
	border-top: 1px solid rgba(242, 241, 237, 0.1);
}

.fc-config__back,
.fc-config__restart,
.fc-config__footclose {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 9px 16px;
	border-radius: var(--r-pill);
	background: rgba(242, 241, 237, 0.07);
	border: 1px solid rgba(242, 241, 237, 0.14);
	color: var(--fc-bg);
	font-size: 0.82rem;
	font-weight: 600;
	transition: background-color 0.3s, border-color 0.3s;
}

.fc-config__back:hover,
.fc-config__restart:hover,
.fc-config__footclose:hover {
	background: rgba(135, 82, 250, 0.2);
	border-color: rgba(135, 82, 250, 0.5);
}

/* L'attribut hidden doit gagner sur display:inline-flex (bug « Retour » visible en étape 1) */
.fc-config__back[hidden],
.fc-config__restart[hidden],
.fc-config__footclose[hidden] { display: none; }

.fc-config__hint {
	margin-left: auto;
	font-size: 0.72rem;
	color: rgba(242, 241, 237, 0.4);
	text-align: right;
}

/* Responsive : plein écran façon bottom-sheet sur mobile */
@media (max-width: 640px) {
	.fc-config { padding: 0; align-items: end; }
	.fc-config__dialog {
		width: 100%;
		max-height: calc(100svh - 24px);
		border-radius: 26px 26px 0 0;
		transform: translateY(40px);
	}
	.fc-config__options--grid { grid-template-columns: 1fr; }
	.fc-config__hint { display: none; }
	.fc-hero__ctas .fc-btn--config { width: 100%; justify-content: center; }
}

@media (prefers-reduced-motion: reduce) {
	.fc-btn__shine { animation: none; }
	.fc-config__step { opacity: 1; transform: none; }
	.fc-config__result-card { animation: none; }
}

/* Carte CTA « Poser ma question » (page Aide) */
.fc-bot-cta { padding: clamp(60px, 8vw, 100px) 0 0; }

.fc-bot-cta__card {
	position: relative;
	overflow: hidden;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: clamp(18px, 3vw, 34px);
	padding: clamp(28px, 4vw, 46px);
	border-radius: var(--r-xl);
	background: var(--fc-gradient);
	color: var(--fc-white);
}

.fc-bot-cta__icon {
	position: relative;
	display: grid;
	place-items: center;
	width: 64px; height: 64px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.14);
	flex: 0 0 auto;
}

.fc-bot-cta__body { position: relative; flex: 1 1 320px; }

.fc-bot-cta__card h2 {
	font-size: clamp(1.4rem, 2.6vw, 2rem);
	font-weight: 850;
	font-stretch: 116%;
	text-transform: uppercase;
}

.fc-bot-cta__card p { margin-top: 8px; color: rgba(255, 255, 255, 0.8); }

/* -----------------------------------------------------------------------------
   33c. Page Coaching
   -------------------------------------------------------------------------- */

.fc-coach-points { padding: 0 0 clamp(80px, 10vw, 150px); }

.fc-coach-points__icon {
	display: grid;
	place-items: center;
	width: 46px; height: 46px;
	margin-bottom: 16px;
	border-radius: 14px;
	background: rgba(135, 82, 250, 0.12);
	color: var(--fc-violet);
	transition: background-color 0.35s, color 0.35s, transform 0.5s var(--ease-out);
}

.fc-included__item:hover .fc-coach-points__icon {
	background: rgba(198, 255, 62, 0.35);
	color: var(--fc-dark);
	transform: rotate(-8deg) scale(1.08);
}

/* -----------------------------------------------------------------------------
   33d. Page Application mobile
   -------------------------------------------------------------------------- */

/* --- Loader dédié : compteur typographique géant + ouverture en volets ---
   100 % typo et vecteurs (clip-path) : net à toutes les tailles, zéro pixelisation. */

/* Le loader global du thème est neutralisé sur cette page (remplacé). */
body.page-template-page-application .fc-loader { display: none !important; }

.fc-app-loader { display: none; }

.fc-js-early .fc-app-loader {
	display: block;
	position: fixed;
	inset: 0;
	z-index: 1000;
	overflow: hidden;
}

/* Arrivée guidée par Five.Bot : le voile de transition tient lieu d'écran de
   chargement. Aucun loader ne doit être peint (celui-ci est en z 1000, il
   passerait DEVANT le voile avant même que main.js ne le retire). */
html.fc-veil-on .fc-app-loader,
html.fc-veil-on .fc-loader { display: none; }

/* Fond en 4 volets verticaux : ils remontent en cascade à la fin */
.fc-app-loader__panels {
	position: absolute;
	inset: 0;
	display: flex;
}

.fc-app-loader__panel {
	flex: 1;
	background: var(--fc-dark);
	will-change: transform;
}

.fc-app-loader__panel:nth-child(2) { background: #0b0222; }
.fc-app-loader__panel:nth-child(3) { background: #0d0326; }
.fc-app-loader__panel:nth-child(4) { background: #0f042b; }

/* Label + ligne de progression */
.fc-app-loader__meta {
	position: absolute;
	top: clamp(22px, 4vh, 40px);
	left: clamp(20px, 5vw, 70px);
	right: clamp(20px, 5vw, 70px);
	display: flex;
	align-items: center;
	gap: 16px;
}

.fc-app-loader__meta img { width: 30px; height: auto; }

.fc-app-loader__label {
	color: rgba(242, 241, 237, 0.6);
	font-size: 0.72rem;
	font-weight: 600;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	white-space: nowrap;
}

.fc-app-loader__line {
	position: relative;
	flex: 1;
	height: 2px;
	border-radius: var(--r-pill);
	background: rgba(242, 241, 237, 0.12);
	overflow: hidden;
}

.fc-app-loader__line-fill {
	position: absolute;
	inset: 0;
	background: var(--fc-lime);
	transform: scaleX(0);
	transform-origin: left;
}

/* Compteur géant : copie outline + copie lime révélée par clip-path */
.fc-app-loader__count {
	position: absolute;
	left: clamp(20px, 5vw, 70px);
	bottom: clamp(10px, 4vh, 40px);
	line-height: 0.82;
}

.fc-app-loader__num {
	display: block;
	font-family: var(--font-display);
	font-weight: 850;
	font-stretch: 125%;
	font-size: clamp(9rem, 26vw, 24rem);
	letter-spacing: -0.02em;
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}

.fc-app-loader__num em {
	font-style: normal;
	font-size: 0.38em;
	vertical-align: 0.12em;
	letter-spacing: 0;
}

.fc-app-loader__num--ghost {
	color: transparent;
	-webkit-text-stroke: 1.5px rgba(242, 241, 237, 0.18);
}

.fc-app-loader__num--fill {
	position: absolute;
	inset: 0;
	color: var(--fc-lime);
	clip-path: inset(100% 0% 0% 0%);
	text-shadow: 0 0 60px rgba(198, 255, 62, 0.25);
}

/* --- Hero immersif --- */

.fc-apphero {
	position: relative;
	min-height: 100svh;
	display: grid;
	/* Voir .fc-hero : la piste auto exploserait au min-content des titres */
	grid-template-columns: 100%;
	align-items: center;
	overflow: clip;
	color: var(--fc-bg);
	background:
		radial-gradient(75% 90% at 85% 8%, rgba(69, 0, 249, 0.55) 0%, transparent 60%),
		radial-gradient(60% 80% at 8% 92%, rgba(135, 82, 250, 0.4) 0%, transparent 65%),
		linear-gradient(160deg, #5a2fd0 0%, #3a13a8 45%, var(--fc-dark) 100%);
}

.fc-apphero__bg { position: absolute; inset: 0; pointer-events: none; }

.fc-apphero__orb {
	position: absolute;
	border-radius: 50%;
	filter: blur(80px);
	will-change: transform;
}

.fc-apphero__orb--1 { width: 520px; height: 520px; right: -12%; top: 50%; background: var(--fc-lime); opacity: 0.16; }
.fc-apphero__orb--2 { width: 420px; height: 420px; left: -8%; top: -12%; background: var(--fc-violet-deep); opacity: 0.55; }
.fc-apphero__orb--3 { width: 300px; height: 300px; left: 42%; bottom: -14%; background: var(--fc-lilac); opacity: 0.4; }

.fc-apphero__inner {
	position: relative;
	z-index: 2;
	width: 100%;
	max-width: var(--container);
	margin-inline: auto;
	padding: calc(var(--header-h) + 50px) var(--gutter) 110px;
	display: grid;
	grid-template-columns: 1.05fr 0.95fr;
	gap: clamp(30px, 5vw, 70px);
	align-items: center;
}

.fc-apphero__title {
	margin: 26px 0 22px;
	font-size: clamp(3rem, 7.2vw, 6.6rem);
	font-weight: 850;
	font-stretch: 122%;
	line-height: 0.94;
	text-transform: uppercase;
	letter-spacing: -0.015em;
}

/* Sur fond violet, l'accent passe en lime */
.fc-apphero .fc-hero__line--accent .fc-hero__line-inner {
	background: linear-gradient(110deg, #eaffa8 0%, var(--fc-lime) 55%, #9fe32a 100%);
	-webkit-background-clip: text;
	background-clip: text;
}

.fc-apphero__sub {
	max-width: 460px;
	font-size: clamp(1rem, 1.4vw, 1.15rem);
	color: rgba(242, 241, 237, 0.85);
}

.fc-apphero .fc-app-hero__stores { margin-top: 34px; }

/* Scène : duo de téléphones + watermark + anneau + chips flottantes */
.fc-apphero__stage { position: relative; min-height: 580px; }

.fc-apphero__watermark {
	position: absolute;
	top: 50%; left: 50%;
	transform: translate(-50%, -52%);
	z-index: 0;
	font-family: var(--font-display);
	font-weight: 850;
	font-stretch: 125%;
	font-size: clamp(7rem, 12vw, 11.5rem);
	line-height: 0.82;
	text-align: center;
	text-transform: uppercase;
	color: transparent;
	-webkit-text-stroke: 1px rgba(242, 241, 237, 0.1);
	pointer-events: none;
}

/* Anneau en orbite lente autour des téléphones (centré par marges :
   le transform reste libre pour la rotation) */
.fc-apphero__ring {
	--ring: clamp(380px, 34vw, 540px);
	position: absolute;
	top: 50%; left: 50%;
	width: var(--ring);
	height: var(--ring);
	margin: calc(var(--ring) / -2) 0 0 calc(var(--ring) / -2);
	border-radius: 50%;
	border: 1px dashed rgba(242, 241, 237, 0.18);
	animation: fc-ring-spin 46s linear infinite;
	pointer-events: none;
}

.fc-apphero__ring::before {
	content: '';
	position: absolute;
	top: -5px; left: 50%;
	width: 10px; height: 10px;
	margin-left: -5px;
	border-radius: 50%;
	background: var(--fc-lime);
	box-shadow: 0 0 18px rgba(198, 255, 62, 0.8);
}

@keyframes fc-ring-spin {
	to { transform: rotate(360deg); }
}

.fc-apphero__phone {
	border-radius: 36px;
	overflow: hidden;
	border: 1px solid rgba(242, 241, 237, 0.28);
	box-shadow: 0 50px 110px rgba(9, 0, 27, 0.55);
	will-change: transform;
}

.fc-apphero__phone img { display: block; width: 100%; height: auto; }

.fc-apphero__phone--front {
	position: relative;
	z-index: 2;
	width: clamp(250px, 25vw, 350px);
	margin-left: auto;
	margin-right: 6%;
	transform: rotate(5deg);
}

.fc-apphero__phone--back {
	position: absolute;
	z-index: 1;
	left: 0;
	top: 10%;
	width: clamp(190px, 18vw, 250px);
	transform: rotate(-9deg);
	box-shadow: 0 40px 90px rgba(9, 0, 27, 0.5);
}

/* Méta-infos sous les boutons stores */
.fc-apphero__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 22px;
	margin: 20px 0 0;
	padding: 0;
	list-style: none;
	font-size: 0.8rem;
	font-weight: 600;
	letter-spacing: 0.04em;
	color: rgba(242, 241, 237, 0.65);
}

.fc-apphero__meta li { display: inline-flex; align-items: center; gap: 8px; }

.fc-apphero__meta li::before {
	content: '';
	width: 5px; height: 5px;
	border-radius: 50%;
	background: var(--fc-lime);
}

.fc-apphero__chip {
	position: absolute;
	z-index: 4; /* toujours devant les téléphones */
	display: inline-flex;
	align-items: center;
	gap: 9px;
	padding: 12px 18px;
	border-radius: var(--r-pill);
	color: var(--fc-bg);
	font-size: 0.85rem;
	font-weight: 600;
	will-change: transform;
}

.fc-apphero__chip svg { color: var(--fc-lime); }

.fc-apphero__chip--qr { left: 2%; top: 14%; }
.fc-apphero__chip--ia { right: 0; top: 32%; }
.fc-apphero__chip--flash {
	left: 8%; bottom: 16%;
	font-family: var(--font-display);
	font-weight: 850;
	font-stretch: 118%;
	font-size: 1.15rem;
}

.fc-apphero__chip-sup { font-size: 0.65em; opacity: 0.7; }

.fc-app-hero__stores { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 8px; }

/* Boutons stores (App Store / Google Play) */
.fc-store-btn {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	padding: 12px 22px;
	border-radius: 16px;
	background: var(--fc-dark);
	color: var(--fc-bg);
	transition: transform 0.35s var(--ease-out), box-shadow 0.35s, background-color 0.3s, color 0.3s;
}

.fc-store-btn:hover {
	transform: translateY(-3px);
	box-shadow: 0 16px 36px rgba(9, 0, 27, 0.25);
	background: var(--fc-violet);
	color: var(--fc-white);
}

.fc-store-btn__txt { display: grid; line-height: 1.15; font-weight: 700; font-size: 1rem; }
.fc-store-btn__txt small { font-size: 0.66rem; font-weight: 600; opacity: 0.65; }

.fc-store-btn--light { background: var(--fc-lime); color: var(--fc-dark); }
.fc-store-btn--light:hover { background: var(--fc-white); color: var(--fc-dark); box-shadow: 0 16px 36px rgba(9, 0, 27, 0.3); }

.fc-store-btn--glass {
	background: rgba(9, 0, 27, 0.35);
	border: 1px solid rgba(242, 241, 237, 0.25);
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
}
.fc-store-btn--glass:hover { background: var(--fc-lime); color: var(--fc-dark); }

/* --- Panorama épinglé : les 5 mockups bord à bord (continuité du visuel) --- */

.fc-apppano { background: var(--fc-dark); }

.fc-apppano__pin {
	position: relative;
	min-height: 100svh;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: clamp(26px, 4vh, 46px);
	padding: clamp(70px, 9vh, 110px) 0 46px;
	overflow: hidden;
}

/* Texte géant en contre-défilement derrière la bande */
.fc-apppano__bgtext {
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	white-space: nowrap;
	font-family: var(--font-display);
	font-weight: 850;
	font-stretch: 125%;
	font-size: clamp(6rem, 16vw, 15rem);
	line-height: 1;
	text-transform: uppercase;
	color: transparent;
	-webkit-text-stroke: 1px rgba(242, 241, 237, 0.09);
	pointer-events: none;
	will-change: transform;
}

.fc-apppano__head {
	position: relative;
	z-index: 2;
	width: 100%;
	max-width: var(--container);
	margin-inline: auto;
	padding-inline: var(--gutter);
}

.fc-apppano__head .fc-h2 { font-size: clamp(2.2rem, 4.6vw, 3.8rem); }

/* Rangée alignée sur la largeur du contenu : les 5 écrans, espacés,
   tiennent tous dans le conteneur une fois déployés */
.fc-apppano__wrap {
	position: relative;
	z-index: 2;
	width: 100%;
	max-width: var(--container);
	margin-inline: auto;
	padding-inline: var(--gutter);
}

.fc-apppano__track {
	display: flex;
	gap: clamp(12px, 1.4vw, 20px);
	width: 100%;
	will-change: transform;
}

.fc-apppano__slide {
	position: relative;
	flex: 1 1 0;
	min-width: 0;
	border-radius: clamp(14px, 1.6vw, 24px);
	overflow: hidden;
	box-shadow: 0 26px 60px rgba(0, 0, 0, 0.45);
	will-change: transform;
}

.fc-apppano__slide img { display: block; width: 100%; height: auto; }

.fc-apppano__progress {
	position: relative;
	z-index: 2;
	width: min(420px, 60%);
	margin-inline: auto;
	height: 2px;
	border-radius: var(--r-pill);
	background: rgba(242, 241, 237, 0.14);
	overflow: hidden;
}

.fc-apppano__progress-fill {
	display: block;
	width: 100%;
	height: 100%;
	background: var(--fc-lime);
	transform: scaleX(0);
	transform-origin: left;
}

/* --- Deck de cartes empilées (fonctionnalités) --- */

.fc-appstack { padding: clamp(80px, 10vw, 150px) 0; }

.fc-appstack__cards { display: grid; gap: clamp(20px, 3vh, 32px); }

.fc-appstack__card {
	position: sticky;
	top: calc(var(--header-h) + 12px + (var(--i) * 16px));
	display: grid;
	grid-template-columns: 1.1fr 0.9fr;
	gap: clamp(24px, 4vw, 60px);
	min-height: min(64vh, 580px);
	padding: clamp(28px, 4vw, 56px);
	border-radius: var(--r-xl);
	overflow: hidden;
	will-change: transform;
}

.fc-appstack__card--dark { background: var(--fc-dark); color: var(--fc-bg); }
.fc-appstack__card--violet { background: var(--fc-gradient); color: var(--fc-white); }
.fc-appstack__card--lime { background: var(--fc-lime); color: var(--fc-dark); }
.fc-appstack__card--light { background: var(--fc-white); color: var(--fc-ink); border: 1px solid rgba(9, 0, 27, 0.08); }

/* Voile de profondeur : piloté par la variable --fc-veil (GSAP), part de 0
   → aucun flash sombre au chargement */
.fc-appstack__card::after {
	content: '';
	position: absolute;
	inset: 0;
	border-radius: inherit;
	background: var(--fc-dark);
	opacity: var(--fc-veil, 0);
	pointer-events: none;
	z-index: 3;
}

.fc-appstack__body {
	position: relative;
	display: grid;
	gap: 16px;
	align-content: center;
	justify-items: start;
}

.fc-appstack__num {
	font-family: var(--font-display);
	font-weight: 850;
	font-stretch: 125%;
	font-size: clamp(3.2rem, 6vw, 5.4rem);
	line-height: 1;
	color: transparent;
	-webkit-text-stroke: 1.5px currentColor;
	opacity: 0.32;
}

.fc-appstack__icon {
	display: grid;
	place-items: center;
	width: 52px; height: 52px;
	border-radius: 16px;
	background: rgba(255, 255, 255, 0.14);
}

.fc-appstack__card--lime .fc-appstack__icon { background: rgba(9, 0, 27, 0.1); }
.fc-appstack__card--light .fc-appstack__icon { background: rgba(135, 82, 250, 0.12); color: var(--fc-violet); }

.fc-appstack__card h3 {
	font-size: clamp(1.6rem, 3vw, 2.6rem);
	font-weight: 850;
	font-stretch: 116%;
	text-transform: uppercase;
}

.fc-appstack__card p { max-width: 480px; opacity: 0.82; }

.fc-appstack__pills { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }

.fc-appstack__pill {
	padding: 7px 15px;
	border-radius: var(--r-pill);
	border: 1px solid currentColor;
	opacity: 0.75;
	font-size: 0.72rem;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

.fc-appstack__shot {
	position: relative;
	min-height: 340px;
	border-radius: var(--r-lg);
	overflow: hidden;
	box-shadow: 0 30px 70px rgba(9, 0, 27, 0.25);
}

.fc-appstack__shot img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: top center;
}

/* Duo FiveClub + MyWellness (section sombre) */
.fc-app-duo {
	padding: clamp(80px, 10vw, 150px) 0;
	background: var(--fc-dark);
	border-radius: var(--r-xl);
	margin-inline: clamp(8px, 1.2vw, 20px);
}

.fc-app-duo__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 20px;
}

.fc-app-duo__card {
	padding: clamp(28px, 4vw, 44px);
	border-radius: var(--r-lg);
	background: var(--fc-dark-2);
	border: 1px solid rgba(242, 241, 237, 0.09);
	color: var(--fc-bg);
	transition: border-color 0.3s, transform 0.4s var(--ease-out);
}

.fc-app-duo__card:hover { border-color: rgba(198, 255, 62, 0.4); }

.fc-app-duo__tag {
	display: inline-block;
	padding: 6px 14px;
	border-radius: var(--r-pill);
	background: rgba(135, 82, 250, 0.22);
	color: var(--fc-lilac);
	font-size: 0.7rem;
	font-weight: 700;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.fc-app-duo__card h3 {
	margin-top: 16px;
	font-size: 1.35rem;
	font-weight: 800;
	font-stretch: 114%;
	text-transform: uppercase;
}

.fc-app-duo__card p { margin-top: 12px; font-size: 0.95rem; color: rgba(242, 241, 237, 0.66); }

/* CTA téléchargement (carte gradient) */
.fc-app-cta { padding: clamp(90px, 12vw, 170px) 0; }

.fc-app-cta__card {
	position: relative;
	overflow: hidden;
	padding: clamp(60px, 9vw, 120px) clamp(28px, 6vw, 90px);
	border-radius: var(--r-xl);
	background: var(--fc-gradient);
	color: var(--fc-white);
	text-align: center;
}

.fc-app-cta__card .fc-cta__sub { color: rgba(255, 255, 255, 0.85); }

.fc-app-cta__stores { position: relative; justify-content: center; margin-top: 38px; }

/* -----------------------------------------------------------------------------
   33d-bis. Offre exclusive (pop-up bas-gauche) + modal « Déjà membre ? »
   -------------------------------------------------------------------------- */

/* Pop-up bas-gauche (piloté depuis WP Admin → Five.Club → Offre exclusive) */
.fc-offer-pop {
	position: fixed;
	left: 22px;
	bottom: 22px;
	z-index: 930;
	width: min(340px, calc(100vw - 108px));
	display: grid;
	gap: 10px;
	justify-items: start;
	padding: 22px;
	border-radius: var(--r-lg);
	background: var(--fc-dark);
	border: 1px solid rgba(198, 255, 62, 0.28);
	box-shadow: 0 30px 70px rgba(9, 0, 27, 0.4);
	color: var(--fc-bg);
	visibility: hidden;
	opacity: 0;
	transform: translateY(24px);
	transition: opacity 0.45s var(--ease-out), transform 0.5s var(--ease-out), visibility 0s 0.5s;
}

.fc-offer-pop.is-visible {
	visibility: visible;
	opacity: 1;
	transform: none;
	transition: opacity 0.45s var(--ease-out), transform 0.5s var(--ease-out), visibility 0s;
}

/* Menu plein écran ouvert : les flottants s'effacent (le pop-up d'offre et la
   bulle Five.Bot ont un z-index supérieur au menu et passeraient devant) */
body.menu-open .fc-offer-pop,
body.menu-open .fc-offer-pop.is-visible,
body.menu-open .fc-bot {
	visibility: hidden;
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.2s, visibility 0s 0.2s;
}

.fc-offer-pop__close {
	position: absolute;
	top: 10px; right: 10px;
	display: grid;
	place-items: center;
	width: 30px; height: 30px;
	border-radius: 50%;
	background: rgba(242, 241, 237, 0.1);
	color: var(--fc-bg);
	transition: background-color 0.3s;
}

.fc-offer-pop__close:hover { background: rgba(242, 241, 237, 0.22); }

.fc-offer-pop__badge {
	padding: 5px 12px;
	border-radius: var(--r-pill);
	background: var(--fc-lime);
	color: var(--fc-dark);
	font-size: 0.66rem;
	font-weight: 800;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.fc-offer-pop__title {
	font-size: 1.15rem;
	font-weight: 800;
	font-stretch: 114%;
	text-transform: uppercase;
	padding-right: 26px;
}

.fc-offer-pop__price { display: flex; align-items: baseline; gap: 10px; }

.fc-offer-pop__price s { color: rgba(242, 241, 237, 0.5); font-size: 0.88rem; font-weight: 600; }

.fc-offer-pop__price strong {
	font-family: var(--font-display);
	font-weight: 850;
	font-stretch: 118%;
	font-size: 1.5rem;
	color: var(--fc-lime);
}

.fc-offer-pop__txt { font-size: 0.85rem; color: rgba(242, 241, 237, 0.7); }

.fc-offer-pop__cta { margin-top: 4px; }

/* Mobile : pop-up plus compact — il ne doit pas avaler la moitié du hero */
@media (max-width: 640px) {
	.fc-offer-pop {
		left: 14px;
		bottom: 14px;
		width: min(300px, calc(100vw - 96px));
		padding: 16px;
		gap: 8px;
	}
	.fc-offer-pop__title { font-size: 1rem; }
	.fc-offer-pop__price strong { font-size: 1.3rem; }
	.fc-offer-pop__txt { font-size: 0.8rem; }
}

/* Lightbox vidéo (la vidéo s'agrandit depuis sa carte) */
.fc-vlb {
	position: fixed;
	inset: 0;
	z-index: 985;
}

.fc-vlb__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(9, 0, 27, 0.82);
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
	opacity: 0;
}

.fc-vlb__frame {
	position: fixed;
	overflow: hidden;
	border-radius: var(--r-lg);
	background: var(--fc-dark);
	box-shadow: 0 50px 120px rgba(0, 0, 0, 0.55);
	will-change: top, left, width, height;
}

.fc-vlb__frame video {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	background: var(--fc-dark);
}

.fc-vlb__close {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 2;
	display: grid;
	place-items: center;
	width: 40px; height: 40px;
	border-radius: 50%;
	background: rgba(9, 0, 27, 0.6);
	color: var(--fc-bg);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	transition: background-color 0.3s, transform 0.3s var(--ease-out);
}

.fc-vlb__close:hover {
	background: var(--fc-lime);
	color: var(--fc-dark);
	transform: rotate(90deg);
}

/* Badge play sur la carte vidéo cliquable */
.fc-card__play {
	position: absolute;
	top: 18px;
	right: 18px;
	display: grid;
	place-items: center;
	width: 46px; height: 46px;
	border-radius: 50%;
	background: rgba(242, 241, 237, 0.16);
	color: var(--fc-bg);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	transition: background-color 0.3s, color 0.3s, transform 0.4s var(--ease-out);
}

.fc-card__play svg { margin-left: 2px; }

[data-video-expand] { cursor: pointer; }

[data-video-expand]:hover .fc-card__play {
	background: var(--fc-lime);
	color: var(--fc-dark);
	transform: scale(1.1);
}

/* Modal « Êtes-vous déjà membre ? » */
body.fc-modal-open { overflow: hidden; }

.fc-member-modal {
	position: fixed;
	inset: 0;
	z-index: 1200; /* au-dessus de tout, configurateur compris (sur-pop-up) */
	display: grid;
	place-items: center;
	padding: var(--gutter);
}

.fc-member-modal[hidden] { display: none; }

.fc-member-modal__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(9, 0, 27, 0.66);
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	opacity: 0;
	transition: opacity 0.35s;
}

.fc-member-modal.is-open .fc-member-modal__backdrop { opacity: 1; }

.fc-member-modal__card {
	position: relative;
	width: min(480px, 100%);
	padding: clamp(28px, 5vw, 44px);
	border-radius: var(--r-lg);
	background: var(--fc-white);
	color: var(--fc-ink);
	text-align: center;
	box-shadow: 0 40px 100px rgba(0, 0, 0, 0.4);
	opacity: 0;
	transform: translateY(18px) scale(0.97);
	transition: transform 0.4s var(--ease-out), opacity 0.35s;
}

.fc-member-modal.is-open .fc-member-modal__card { opacity: 1; transform: none; }

.fc-member-modal__close {
	position: absolute;
	top: 14px; right: 14px;
	display: grid;
	place-items: center;
	width: 34px; height: 34px;
	border-radius: 50%;
	background: rgba(9, 0, 27, 0.06);
	color: var(--fc-ink);
	transition: background-color 0.3s;
}

.fc-member-modal__close:hover { background: rgba(9, 0, 27, 0.12); }

.fc-member-modal__view { display: grid; gap: 14px; justify-items: center; }
.fc-member-modal__view[hidden] { display: none; }

.fc-member-modal__view h2 {
	font-size: clamp(1.35rem, 3vw, 1.75rem);
	font-weight: 850;
	font-stretch: 116%;
	text-transform: uppercase;
}

.fc-member-modal__view p { color: var(--fc-taupe); font-size: 0.95rem; max-width: 380px; }

.fc-member-modal__actions { display: grid; gap: 10px; width: 100%; margin-top: 6px; }
.fc-member-modal__actions .fc-btn { width: 100%; justify-content: center; }

.fc-member-modal__stores { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }

/* Alternative sur place, sous les boutons stores */
.fc-member-modal__desk {
	margin-top: 4px;
	padding-top: 16px;
	border-top: 1px solid rgba(9, 0, 27, 0.1);
	font-size: 0.92rem;
	color: var(--fc-taupe);
}

.fc-member-modal__more { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 20px; }

.fc-member-modal__more a {
	color: var(--fc-violet);
	font-weight: 600;
	border-bottom: 1px solid rgba(135, 82, 250, 0.35);
}

@media (max-width: 480px) {
	.fc-offer-pop { left: 14px; bottom: 14px; padding: 18px; }
	.fc-member-modal__stores .fc-store-btn { width: 100%; justify-content: center; }
}

/* -----------------------------------------------------------------------------
   33e. Pages légales (sommaire sticky + prose)
   -------------------------------------------------------------------------- */

.fc-legal { padding: clamp(70px, 9vw, 130px) 0; }

.fc-legal__grid {
	display: grid;
	grid-template-columns: 250px 1fr;
	gap: clamp(30px, 5vw, 80px);
	align-items: start;
}

.fc-legal__aside { position: sticky; top: 120px; }

.fc-legal__toc {
	display: grid;
	gap: 4px;
	padding: 22px;
	border-radius: var(--r-lg);
	background: var(--fc-white);
	border: 1px solid rgba(9, 0, 27, 0.08);
}

.fc-legal__toc-title {
	font-size: 0.72rem;
	font-weight: 800;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--fc-violet);
	margin-bottom: 8px;
}

.fc-legal__toc a {
	padding: 8px 12px;
	border-radius: 12px;
	font-size: 0.9rem;
	font-weight: 600;
	color: var(--fc-ink-60);
	transition: background-color 0.25s, color 0.25s, transform 0.3s var(--ease-out);
}

.fc-legal__toc a:hover {
	background: rgba(135, 82, 250, 0.08);
	color: var(--fc-violet);
	transform: translateX(3px);
}

.fc-legal__prose { max-width: 760px; }

.fc-legal__updated {
	display: inline-block;
	padding: 8px 16px;
	border-radius: var(--r-pill);
	background: rgba(135, 82, 250, 0.1);
	color: var(--fc-violet);
	font-size: 0.78rem;
	font-weight: 700;
	margin-bottom: 34px;
}

.fc-legal__prose h2 {
	margin: 44px 0 16px;
	font-size: clamp(1.3rem, 2.2vw, 1.7rem);
	font-weight: 800;
	font-stretch: 114%;
	text-transform: uppercase;
	scroll-margin-top: 110px;
}

.fc-legal__prose h2:first-of-type { margin-top: 0; }

.fc-legal__prose p { margin-bottom: 14px; color: var(--fc-ink-60); }
.fc-legal__prose strong { color: var(--fc-ink); }

.fc-legal__prose ul {
	margin: 0 0 14px;
	padding-left: 22px;
	color: var(--fc-ink-60);
	display: grid;
	gap: 8px;
}

.fc-legal__prose li::marker { color: var(--fc-violet); }

.fc-legal__prose a {
	color: var(--fc-violet);
	font-weight: 600;
	border-bottom: 1px solid rgba(135, 82, 250, 0.35);
	transition: border-color 0.25s;
}

.fc-legal__prose a:hover { border-color: var(--fc-violet); }

/* Liens légaux du footer */
.fc-footer__legal { display: flex; gap: 20px; }

.fc-footer__legal a {
	color: rgba(242, 241, 237, 0.45);
	transition: color 0.3s;
}

.fc-footer__legal a:hover { color: var(--fc-lime); }

/* -----------------------------------------------------------------------------
   34. Responsive pages intérieures
   -------------------------------------------------------------------------- */

@media (max-width: 1100px) {
	.fc-courses-grid__grid { grid-template-columns: repeat(2, 1fr); }
	.fc-equip__grid { grid-template-columns: repeat(2, 1fr); }
	.fc-passes__grid { grid-template-columns: repeat(2, 1fr); }
	.fc-included__grid { grid-template-columns: repeat(2, 1fr); }
	.fc-promo__card { grid-template-columns: 1fr; justify-items: start; }
}

@media (max-width: 900px) {
	.fc-coaching__grid { grid-template-columns: 1fr; }
	.fc-contact__grid { grid-template-columns: 1fr; }
	.fc-quick__grid { grid-template-columns: 1fr; }
	.fc-form__card { grid-template-columns: 1fr; }
	.fc-form__row { grid-template-columns: 1fr; }
	.fc-apphero__inner { grid-template-columns: 1fr; padding-bottom: 80px; }
	.fc-apphero__stage { min-height: 0; margin-top: 26px; }
	.fc-apphero__phone--front { margin-inline: auto; transform: rotate(3deg); }
	.fc-apphero__phone--back { display: none; }
	.fc-apphero__watermark { font-size: clamp(5rem, 17vw, 8rem); }
	.fc-apphero__chip--qr { left: 0; top: 8%; }
	.fc-apphero__chip--ia { right: 0; top: auto; bottom: 30%; }
	.fc-apphero__chip--flash { left: 4%; bottom: 6%; }
	.fc-appstack__card { position: static; grid-template-columns: 1fr; min-height: 0; }
	.fc-appstack__shot { min-height: 280px; }
	.fc-app-duo__grid { grid-template-columns: 1fr; }
	.fc-plan__tab { padding: 10px 14px; }
	.fc-plan__tab-full { display: none; }
	.fc-plan__tab-short { display: inline; }
	.fc-legal__grid { grid-template-columns: 1fr; }
	.fc-legal__aside { position: static; }
	.fc-footer__legal { flex-wrap: wrap; gap: 14px; }
	.fc-contact__map, .fc-contact__map iframe { min-height: 380px; }
}

@media (max-width: 640px) {
	.fc-courses-grid__grid { grid-template-columns: 1fr; }
	.fc-passes__grid { grid-template-columns: 1fr; }
	.fc-included__grid { grid-template-columns: 1fr; }

	/* Planning : les 7 jours tiennent sur une seule ligne */
	.fc-plan__tabs { display: flex; width: 100%; flex-wrap: nowrap; gap: 4px; padding: 5px; }
	.fc-plan__tab { flex: 1 1 0; padding: 9px 0; font-size: 0.8rem; text-align: center; }

	/* 16px minimum sur les champs : en dessous, iOS Safari zoome la page
	   au focus (et ne revient pas en arrière tout seul) */
	.fc-form__field input,
	.fc-form__field textarea,
	.fc-bot__input { font-size: 16px; }

	/* Écrans courts : le min-height des messages poussait le disclaimer
	   hors du panel (dernière ligne coupée) */
	.fc-bot__messages { min-height: 0; }

	/* Cibles tactiles ≥ ~32px : liens légaux du footer, croix du nudge,
	   case de consentement */
	.fc-footer__legal a { padding: 8px 6px; margin: -8px -6px; }
	.fc-bot__nudge button { width: 30px; height: 30px; }
	.fc-form__consent input { width: 22px; height: 22px; flex: 0 0 auto; }

	/* Cartes CTA : les orbes en `filter: blur()` sont promues en couche
	   composite, et WebKit (iOS) n'y applique pas le clip arrondi du parent —
	   la lueur ressort en angle droit dans les coins. On les remplace par des
	   dégradés radiaux peints sur le fond de la carte : un background est
	   toujours découpé par le border-radius, sur tous les navigateurs (et ça
	   retire trois flous de 70px du compositeur pendant le défilement). */
	.fc-cta__card .fc-cta__orbs,
	.fc-app-cta__card .fc-cta__orbs { display: none; }

	/* Rayons en px (pas en %) : ils reprennent la géométrie et l'intensité des
	   trois orbes, indépendamment de la hauteur de la carte — sinon l'ellipse
	   s'étire sur toute la longueur et la lueur se délave. */
	.fc-cta__card {
		background-image:
			radial-gradient(300px 300px at 110px 90px, rgba(135, 82, 250, 0.8) 0%, rgba(135, 82, 250, 0) 72%),
			radial-gradient(250px 250px at calc(100% - 80px) calc(100% - 50px), rgba(69, 0, 249, 0.75) 0%, rgba(69, 0, 249, 0) 72%),
			radial-gradient(170px 170px at calc(100% - 120px) 30px, rgba(205, 131, 255, 0.5) 0%, rgba(205, 131, 255, 0) 72%);
	}

	.fc-app-cta__card {
		background-image:
			radial-gradient(300px 300px at 110px 90px, rgba(205, 131, 255, 0.55) 0%, rgba(205, 131, 255, 0) 72%),
			radial-gradient(250px 250px at calc(100% - 80px) calc(100% - 50px), rgba(69, 0, 249, 0.85) 0%, rgba(69, 0, 249, 0) 72%),
			var(--fc-gradient);
	}
	.fc-equip__grid { grid-template-columns: 1fr; }
	.fc-plan__row { grid-template-columns: 54px 38px 1fr auto; padding: 13px 14px; gap: 10px; }
	.fc-plan__courses-row { gap: 6px; }
	.fc-plan__courses-row .fc-plan__course { min-width: 84px; }
	.fc-plan__course { padding: 10px 5px 9px; font-size: 0.64rem; }
	.fc-plan__course-ico { width: 38px; height: 38px; }
	.fc-plan__course-ico img { width: 22px; height: 22px; }
	.fc-plan__panel-card { padding: 14px; }
	.fc-faq__a-inner { padding-left: 26px; }
	.fc-contact__map, .fc-contact__map iframe { min-height: 320px; }
	.fc-promo__card { padding: 26px 22px; }
	.fc-bot-cta__card { padding: 26px 22px; }
	.fc-socials-band__links .fc-btn { width: 100%; justify-content: center; }
	.fc-store-btn { width: 100%; justify-content: center; }
	.fc-abos-toggle { display: flex; width: 100%; }
	.fc-abos-toggle__btn { flex: 1; justify-content: center; padding: 11px 10px; }

	/* --- Hero app recomposé : mockup en haut, texte dessous, tout plus
	       compact pour tenir sur un écran --- */
	.fc-apphero__inner { padding-top: calc(var(--header-h) + 12px); padding-bottom: 50px; gap: 16px; }
	.fc-apphero__stage { order: -1; margin-top: 0; }
	.fc-apphero__phone--front { width: min(42vw, 168px); transform: rotate(2deg); }
	.fc-apphero__watermark { display: none; }
	.fc-apphero__ring { display: none; }
	/* 9.6vw : « LE CLUB DANS » doit tenir sur une seule ligne (le split par
	   lettres casse en plein mot sinon) et « VOTRE POCHE » est insécable */
	.fc-apphero__title { font-size: clamp(1.9rem, 9.6vw, 2.9rem); }
	.fc-apphero__sub { font-size: 0.92rem; }
	.fc-apphero .fc-app-hero__stores { margin-top: 22px; }
	.fc-apphero__meta { margin-top: 14px; }
	.fc-apphero__chip { padding: 8px 12px; font-size: 0.72rem; }
	.fc-appstack__card { padding: 24px 20px; }

	/* --- Boutons stores côte à côte (hero app + CTA « Téléchargez l'app ») --- */
	.fc-app-hero__stores { flex-wrap: nowrap; gap: 10px; }
	.fc-app-hero__stores .fc-store-btn {
		width: auto;
		flex: 1 1 0;
		min-width: 0;
		justify-content: center;
		padding: 10px 10px;
		gap: 9px;
	}
	.fc-app-hero__stores .fc-store-btn svg { width: 20px; height: 20px; flex: 0 0 auto; }
	.fc-app-hero__stores .fc-store-btn__txt { font-size: 0.88rem; }
	.fc-app-hero__stores .fc-store-btn__txt small { font-size: 0.56rem; }
}

/* Tactile : les affordances révélées au survol doivent être visibles d'office */
@media (hover: none) {
	.fc-cours__go { opacity: 1; transform: none; }
	.fc-equipe__photo img { filter: grayscale(0); }
}

/* Très petits écrans : finitions */
@media (max-width: 420px) {
	:root { --gutter: 18px; }
	/* min() : garde « RÉINVENTÉ. » entier même sur les écrans de 320px */
	.fc-hero__title { font-size: min(2.4rem, 11vw); }
	.fc-h2 { font-size: 1.7rem; }
	.fc-section__head { margin-bottom: 30px; }
	.fc-stats__grid { gap: 26px 14px; }
	.fc-stats__value { font-size: 2.3rem; }
	.fc-cours__card { width: 84vw; min-height: 360px; }
	.fc-equipe__card { width: 78vw; }
	.fc-avis__card { width: 88vw; padding: 30px 22px 26px; }
	.fc-apphero__watermark { display: none; }
	.fc-apphero__chip--ia { display: none; }
	.fc-appstack__shot { min-height: 210px; }
	.fc-promo__new { font-size: 2rem; }
	.fc-app-loader__num { font-size: 7.5rem; }
	.fc-menu-overlay__link:not(.fc-menu-overlay__link--app) { font-size: 1.35rem; }
	.fc-bot__panel { max-height: calc(100svh - 110px); }
}

/* Panorama : sur mobile/tablette et en reduced-motion, scroll horizontal natif */
@media (max-width: 1023px), (prefers-reduced-motion: reduce) {
	.fc-apppano__pin { min-height: 0; }
	.fc-apppano__bgtext { display: none; }
	.fc-apppano__wrap {
		overflow-x: auto;
		scrollbar-width: none;
		-webkit-overflow-scrolling: touch;
		scroll-snap-type: x proximity;
	}
	.fc-apppano__wrap::-webkit-scrollbar { display: none; }
	.fc-apppano__track { width: max-content; gap: 14px; }
	.fc-apppano__slide { flex: 0 0 auto; scroll-snap-align: center; height: min(56vh, 520px); border-radius: 18px; }
	.fc-apppano__slide img { width: auto; height: 100%; }
	.fc-apppano__progress { display: none; }
}

