/* Landing M-OOVE Academy, autonome : jetons redeclares. La page alterne
   scenes sombres (hero, preuve, final) et surfaces claires (constat,
   dispositifs, deroule, FAQ). Tous les selecteurs a/button portent DEUX
   classes : la page 15 reste une page Elementor en base, son kit est
   enfile et blanchit les liens a une classe. */

.mv-ac {
  --mv-or: #D9B24B;
  --mv-teal: #259C99;
  --mv-teal-texte: #1a7573;
  --mv-teal-vif: #58d3cf;
  --mv-encre: #10151c;
  --mv-rayon: 5px;
  --mv-titre: Lato, ui-sans-serif, system-ui, sans-serif;
  --mv-corps: Nunito, ui-sans-serif, system-ui, sans-serif;

  font-family: var(--mv-corps);
  font-size: 17.5px;
  line-height: 28px;
  color: #333333;
  background: #ffffff;
}
.mv-ac * { box-sizing: border-box; }
.mv-ac :where(p, ul, ol, li, h1, h2, h3, figure, figcaption) { margin: 0; padding: 0; }
.mv-ac :where(ul, ol) { list-style: none; }

.mv-ac__enveloppe {
  position: relative;
  z-index: 1;
  max-width: 1280px;
  margin-inline: auto;
  padding-inline: 20px;
}

.mv-ac .mv-ac__surtitre {
  display: flex;
  align-items: center;
  gap: 14px;
  font-size: 13px;
  line-height: 18px;
  font-weight: 700;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--mv-teal-vif);
}
.mv-ac .mv-ac__surtitre::before {
  content: "";
  width: 32px;
  height: 2px;
  flex: none;
  background: linear-gradient(90deg, var(--mv-teal), var(--mv-or));
}
.mv-ac .mv-ac__surtitre--sombre { color: var(--mv-teal-texte); }

.mv-ac__h2 {
  font-family: var(--mv-titre);
  font-size: clamp(28px, 3.2vw, 42px);
  line-height: 1.14;
  font-weight: 900;
  letter-spacing: -0.025em;
  color: var(--mv-encre);
  margin-block-start: 18px;
  max-width: 18em;
}
.mv-ac__h2--clair { color: #ffffff; }
.mv-ac__texte { margin-block-start: 18px; font-size: 17.5px; line-height: 29px; max-width: 42em; }
.mv-ac__texte--clair { color: #c2cad4; }

/* ---- Boutons ---- */

.mv-ac .mv-ac__btn-or,
.mv-ac .mv-ac__btn-verre {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 52px;
  padding: 14px 28px;
  border-radius: var(--mv-rayon);
  font-family: var(--mv-corps);
  font-size: 16px;
  font-weight: 700;
  text-decoration: none;
  transition: background-color 260ms ease, border-color 260ms ease, transform 260ms cubic-bezier(0.22, 0.61, 0.36, 1), box-shadow 260ms ease;
}
.mv-ac .mv-ac__btn-or {
  background: var(--mv-or);
  border: 1px solid var(--mv-or);
  color: #10151c;
  box-shadow: 0 12px 30px -14px rgba(217, 178, 75, 0.7);
}
.mv-ac .mv-ac__btn-or svg { width: 17px; height: 17px; transition: transform 320ms cubic-bezier(0.22, 0.61, 0.36, 1); }
.mv-ac .mv-ac__btn-or:hover { background: #e3c060; border-color: #e3c060; transform: translateY(-3px); box-shadow: 0 18px 38px -14px rgba(217, 178, 75, 0.8); }
.mv-ac .mv-ac__btn-or:hover svg { transform: translateX(4px); }
.mv-ac .mv-ac__btn-verre {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.28);
  color: #ffffff;
}
.mv-ac .mv-ac__btn-verre:hover { background: rgba(255, 255, 255, 0.16); border-color: rgba(255, 255, 255, 0.45); }
.mv-ac .mv-ac__btn-or:focus-visible,
.mv-ac .mv-ac__btn-verre:focus-visible { outline: 2px solid var(--mv-teal); outline-offset: 3px; }

/* ---- Scenes sombres et aura au pointeur ---- */

.mv-ac__hero,
.mv-ac__preuve,
.mv-ac__final {
  position: relative;
  background: #10151c;
  overflow: hidden;
}
.mv-ac__hero::before,
.mv-ac__preuve::before,
.mv-ac__final::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(52% 74% at 6% 0%, rgba(37, 156, 153, 0.18) 0%, rgba(16, 21, 28, 0) 62%),
    radial-gradient(44% 62% at 96% 100%, rgba(217, 178, 75, 0.12) 0%, rgba(16, 21, 28, 0) 58%);
}
/* L'aura suit le pointeur (variables posees par academy.js) et respire
   doucement au repos. */
.mv-ac__aura {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: radial-gradient(38% 44% at var(--x, 76%) var(--y, 18%), rgba(88, 211, 207, 0.16) 0%, rgba(16, 21, 28, 0) 68%);
  transition: background-position 400ms ease;
  animation: mv-ac-respire 9s ease-in-out infinite alternate;
}
.mv-ac__aura--bas { background: radial-gradient(40% 50% at var(--x, 24%) var(--y, 80%), rgba(217, 178, 75, 0.14) 0%, rgba(16, 21, 28, 0) 66%); }
@keyframes mv-ac-respire { from { opacity: 0.75; } to { opacity: 1; } }

/* ---- Le hero ---- */

.mv-ac__hero-int {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
  gap: 72px;
  align-items: center;
  padding-block: 104px 112px;
}
.mv-ac__titre {
  font-family: var(--mv-titre);
  font-size: clamp(38px, 4.6vw, 62px);
  line-height: 1.06;
  font-weight: 900;
  letter-spacing: -0.03em;
  color: #ffffff;
  margin-block-start: 22px;
}
/* Le degrade du second vers rampe doucement, il ne clignote pas. */
.mv-ac__titre-accent {
  background: linear-gradient(96deg, #58d3cf 0%, #D9B24B 60%, #58d3cf 100%);
  background-size: 220% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  animation: mv-ac-rampe 14s ease-in-out infinite alternate;
}
@keyframes mv-ac-rampe { from { background-position: 0% 50%; } to { background-position: 100% 50%; } }
.mv-ac__chapo {
  margin-block-start: 22px;
  font-size: 18px;
  line-height: 29px;
  color: #c2cad4;
  max-width: 34em;
}
.mv-ac__actions { display: flex; flex-wrap: wrap; gap: 14px; margin-block-start: 34px; }
.mv-ac__preuves {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 26px;
  margin-block-start: 34px;
}
.mv-ac__preuves li {
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 14.5px;
  color: #aeb7c2;
}
.mv-ac__preuves li::before {
  content: "";
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--mv-teal-vif);
  box-shadow: 0 0 0 4px rgba(88, 211, 207, 0.14);
}

.mv-ac__portrait {
  position: relative;
  border-radius: var(--mv-rayon);
  overflow: hidden;
  box-shadow: 0 40px 80px -34px rgba(0, 0, 0, 0.8);
}
.mv-ac__portrait img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; }
.mv-ac__portrait figcaption {
  position: absolute;
  inset: auto 0 0 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 22px;
  background: linear-gradient(180deg, rgba(13, 18, 25, 0) 0%, rgba(13, 18, 25, 0.86) 62%);
  color: #ffffff;
}
.mv-ac__portrait figcaption strong { font-family: var(--mv-titre); font-size: 19px; font-weight: 800; letter-spacing: -0.01em; }
.mv-ac__portrait figcaption span { font-size: 14px; color: #c2cad4; }

/* ---- Les reperes chiffres ---- */

.mv-ac__reperes { background: #131920; }
.mv-ac__reperes-int {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  padding-block: 52px;
}
.mv-ac__repere { padding-inline: 4px; border-left: 2px solid rgba(255, 255, 255, 0.1); padding-left: 22px; }
.mv-ac__repere-val {
  font-family: var(--mv-titre);
  font-size: clamp(38px, 4vw, 54px);
  line-height: 1;
  font-weight: 900;
  letter-spacing: -0.03em;
  color: var(--mv-or);
}
.mv-ac__repere-unite { font-size: 0.5em; }
.mv-ac__repere-nom { margin-block-start: 10px; font-size: 16px; font-weight: 700; color: #ffffff; }
.mv-ac__repere-note { margin-block-start: 4px; font-size: 14px; line-height: 22px; color: #aeb7c2; }

/* ---- Le constat ---- */

.mv-ac__constat { background: #ffffff; }
.mv-ac__constat-int {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 0.9fr);
  gap: 64px;
  align-items: center;
  padding-block: 96px;
}
.mv-ac__contrastes { display: flex; flex-direction: column; gap: 12px; }
.mv-ac__contrastes li {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 16px;
  padding: 16px 18px;
  border-radius: var(--mv-rayon);
  background: #f4f7f7;
  transition: background-color 260ms ease, transform 260ms cubic-bezier(0.22, 0.61, 0.36, 1);
}
.mv-ac__contrastes li:hover { background: #eef3f3; transform: translateX(4px); }
.mv-ac__contrastes li::after {
  content: "";
  position: absolute;
}
/* Barre mais LISIBLE : #98a2b3 ne donnait que 2,39 sur cette surface.
   Un contenu barre reste du contenu. */
.mv-ac__contraste-non {
  font-size: 15px;
  line-height: 23px;
  color: #5f6875;
  text-decoration: line-through;
  text-decoration-color: rgba(95, 104, 117, 0.6);
}
.mv-ac__contraste-oui {
  font-size: 15.5px;
  line-height: 23px;
  font-weight: 700;
  color: var(--mv-encre);
  position: relative;
  padding-left: 26px;
}
.mv-ac__contraste-oui::before {
  content: "";
  position: absolute;
  left: 0;
  top: 3px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: rgba(37, 156, 153, 0.14);
}
.mv-ac__contraste-oui::after {
  content: "";
  position: absolute;
  left: 4.5px;
  top: 8px;
  width: 9px;
  height: 5px;
  border-left: 2px solid var(--mv-teal-texte);
  border-bottom: 2px solid var(--mv-teal-texte);
  transform: rotate(-45deg);
}
.mv-ac__contrastes li > *:nth-child(1) { grid-column: 1; }
.mv-ac__contrastes li > *:nth-child(2) { grid-column: 3; }

/* ---- Les dispositifs ---- */

.mv-ac__dispositifs { background: #f4f7f7; padding-block: 96px 104px; scroll-margin-top: 90px; }
.mv-ac__entete { margin-block-end: 44px; }
.mv-ac__grille {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
}
.mv-ac__carte {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 30px 26px 28px;
  border-radius: var(--mv-rayon);
  background: #ffffff;
  overflow: hidden;
  box-shadow: 0 12px 34px -22px rgba(16, 21, 28, 0.3);
  transition: transform 320ms cubic-bezier(0.22, 0.61, 0.36, 1), box-shadow 320ms ease;
}
.mv-ac__carte:hover { transform: translateY(-8px); box-shadow: 0 28px 52px -24px rgba(16, 21, 28, 0.35); }
/* Halo teal qui monte du bas de la carte au survol. */
.mv-ac__carte-halo {
  position: absolute;
  inset: auto 0 0 0;
  height: 60%;
  pointer-events: none;
  background: radial-gradient(70% 100% at 50% 100%, rgba(37, 156, 153, 0.14) 0%, rgba(255, 255, 255, 0) 70%);
  opacity: 0;
  transition: opacity 320ms ease;
}
.mv-ac__carte:hover .mv-ac__carte-halo { opacity: 1; }
.mv-ac__picto { width: 30px; height: 30px; color: var(--mv-teal-texte); transition: color 260ms ease, transform 320ms cubic-bezier(0.22, 0.61, 0.36, 1); }
.mv-ac__carte:hover .mv-ac__picto { color: var(--mv-or); transform: translateY(-2px); }
.mv-ac__carte-titre {
  margin-block-start: 20px;
  font-family: var(--mv-titre);
  font-size: 21px;
  line-height: 1.2;
  font-weight: 900;
  letter-spacing: -0.02em;
  color: var(--mv-encre);
}
.mv-ac__carte-pour {
  margin-block-start: 8px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--mv-teal-texte);
}
.mv-ac__carte-texte { margin-block-start: 14px; font-size: 15.5px; line-height: 25px; color: #545b65; }
.mv-ac__carte-points { margin-block-start: 18px; padding-block-start: 16px; border-top: 1px solid #e7ecef; display: flex; flex-direction: column; gap: 8px; }
.mv-ac__carte-points li { position: relative; padding-left: 18px; font-size: 14.5px; line-height: 22px; color: var(--mv-encre); }
.mv-ac__carte-points li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 9px;
  width: 8px;
  height: 2px;
  border-radius: 1px;
  background: linear-gradient(90deg, var(--mv-teal), var(--mv-or));
}

/* ---- La preuve ---- */

.mv-ac__preuve-int {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
  gap: 64px;
  align-items: center;
  padding-block: 96px;
}
.mv-ac .mv-ac__lien-clair {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  margin-block-start: 26px;
  min-height: 44px;
  padding-block: 10px;
  font-size: 15.5px;
  font-weight: 700;
  color: var(--mv-teal-vif);
  text-decoration: none;
  transition: color 260ms ease;
}
.mv-ac .mv-ac__lien-clair svg { width: 16px; height: 16px; transition: transform 320ms cubic-bezier(0.22, 0.61, 0.36, 1); }
.mv-ac .mv-ac__lien-clair:hover { color: var(--mv-or); }
.mv-ac .mv-ac__lien-clair:hover svg { transform: translateX(4px); }
.mv-ac .mv-ac__lien-clair:focus-visible { outline: 2px solid var(--mv-teal); outline-offset: 2px; }

.mv-ac__methode {
  padding: 30px 28px;
  border-radius: var(--mv-rayon);
  background-color: rgba(13, 18, 25, 0.5);
  background-image: linear-gradient(158deg, rgba(255, 255, 255, 0.12), rgba(255, 255, 255, 0.04) 38%, rgba(255, 255, 255, 0) 72%);
  -webkit-backdrop-filter: blur(22px) saturate(150%);
  backdrop-filter: blur(22px) saturate(150%);
  border: 1px solid rgba(255, 255, 255, 0.1);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.15), 0 30px 60px -30px rgba(0, 0, 0, 0.7);
}
.mv-ac__methode-titre {
  font-family: var(--mv-titre);
  font-size: 13px;
  font-weight: 900;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--mv-or);
}
.mv-ac__methode-liste { margin-block-start: 20px; display: flex; flex-direction: column; gap: 14px; }
.mv-ac__methode-liste li { display: flex; align-items: baseline; gap: 16px; }
.mv-ac__methode-liste b {
  flex: none;
  width: 30px;
  font-family: var(--mv-titre);
  font-size: 22px;
  font-weight: 900;
  color: var(--mv-teal-vif);
}
.mv-ac__methode-liste span { font-size: 15.5px; line-height: 24px; color: #dbe2ea; }

/* ---- Le deroule ---- */

.mv-ac__deroule { background: #ffffff; padding-block: 96px 104px; }
.mv-ac__etapes {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 20px;
  counter-reset: mv-ac-etape;
}
.mv-ac__etape { position: relative; padding-block-start: 26px; border-top: 2px solid #e7ecef; transition: border-color 320ms ease; }
.mv-ac__etape:hover { border-color: var(--mv-or); }
.mv-ac__etape-num {
  font-family: var(--mv-titre);
  font-size: 14px;
  font-weight: 900;
  letter-spacing: 0.1em;
  color: var(--mv-teal-texte);
}
.mv-ac__etape-titre {
  margin-block-start: 10px;
  font-family: var(--mv-titre);
  font-size: 20px;
  font-weight: 900;
  letter-spacing: -0.02em;
  color: var(--mv-encre);
}
.mv-ac__etape-texte { margin-block-start: 10px; font-size: 15.5px; line-height: 25px; color: #545b65; }

/* ---- La FAQ (structure des modules accordeon deja en place) ---- */

.mv-ac__faq { background: #f4f7f7; padding-block: 96px 104px; }
.mv-ac__faq-int { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: 64px; align-items: start; }
.mv-ac__questions { display: flex; flex-direction: column; gap: 12px; }
.mv-ac .mv-faq-item {
  border-radius: var(--mv-rayon);
  background: #ffffff;
  box-shadow: 0 10px 26px -20px rgba(16, 21, 28, 0.28);
  overflow: hidden;
}
.mv-ac .mv-faq-item__question { margin: 0; }
.mv-ac .mv-faq-item__question,
.mv-ac .mv-faq-item .mv-faq-item__bouton {
  display: flex;
  align-items: center;
  gap: 16px;
  width: 100%;
  min-height: 60px;
  padding: 18px 22px;
  border: 0;
  background: none;
  font-family: var(--mv-titre);
  font-size: 17px;
  line-height: 25px;
  font-weight: 800;
  letter-spacing: -0.01em;
  color: var(--mv-encre);
  text-align: left;
  cursor: pointer;
}
.mv-ac .mv-faq-item .mv-faq-item__bouton::after {
  content: "";
  flex: none;
  margin-left: auto;
  width: 12px;
  height: 12px;
  border-right: 2px solid var(--mv-teal-texte);
  border-bottom: 2px solid var(--mv-teal-texte);
  transform: rotate(45deg) translate(-2px, -2px);
  transition: transform 300ms cubic-bezier(0.22, 0.61, 0.36, 1);
}
.mv-ac .mv-faq-item .mv-faq-item__bouton[aria-expanded="true"]::after { transform: rotate(-135deg) translate(-2px, -2px); }
.mv-ac .mv-faq-item .mv-faq-item__bouton:hover { color: var(--mv-teal-texte); }
.mv-ac .mv-faq-item .mv-faq-item__bouton:focus-visible { outline: 2px solid var(--mv-teal); outline-offset: -3px; }
.mv-ac .mv-faq-item__reponse { padding: 0 22px 22px; }
.mv-ac .mv-faq-item__reponse p { font-size: 16px; line-height: 27px; color: #545b65; max-width: 46em; }

/* ---- Le final ---- */

.mv-ac__final-int {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 0.9fr);
  gap: 56px;
  align-items: center;
  padding-block: 104px;
}
.mv-ac__final-actions { display: flex; flex-wrap: wrap; gap: 14px; }
.mv-ac__final-note { width: 100%; margin-block-start: 8px; font-size: 14.5px; color: #aeb7c2; }
/* cible tactile de 44px, remplissage compense par la marge */
.mv-ac .mv-ac__final-note a {
  display: inline-block;
  padding-block: 11px;
  margin-block: -11px;
  color: #eef2f6;
  font-weight: 700;
  text-decoration: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}
.mv-ac .mv-ac__final-note a:hover { color: var(--mv-or); border-color: var(--mv-or); }

/* ---- Revelations (module reveler.js) ---- */

.mv-anim .mv-ac .mv-revele {
  opacity: 0;
  transform: translateY(16px);
  transition: opacity 620ms cubic-bezier(0.22, 0.61, 0.36, 1), transform 620ms cubic-bezier(0.22, 0.61, 0.36, 1);
}
.mv-anim .mv-ac .mv-revele.est-visible { opacity: 1; transform: none; }

/* ---- Reactivite ---- */

@media (prefers-reduced-motion: reduce) {
  .mv-ac__aura, .mv-ac__titre-accent { animation: none; }
  .mv-ac .mv-ac__btn-or, .mv-ac .mv-ac__btn-verre, .mv-ac__carte, .mv-ac__picto,
  .mv-ac__contrastes li, .mv-ac__etape, .mv-ac .mv-ac__lien-clair svg,
  .mv-ac .mv-faq-item .mv-faq-item__bouton::after { transition: none; }
  .mv-ac .mv-ac__btn-or:hover, .mv-ac__carte:hover, .mv-ac__contrastes li:hover { transform: none; }
}

@media (max-width: 1099.98px) {
  .mv-ac__hero-int { grid-template-columns: minmax(0, 1fr); gap: 48px; padding-block: 80px 88px; }
  .mv-ac__hero-visuel { max-width: 460px; }
  .mv-ac__constat-int, .mv-ac__preuve-int, .mv-ac__faq-int, .mv-ac__final-int { grid-template-columns: minmax(0, 1fr); gap: 40px; }
  .mv-ac__grille, .mv-ac__etapes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767.98px) {
  .mv-ac__hero-int { padding-block: 64px 72px; }
  .mv-ac__reperes-int { grid-template-columns: minmax(0, 1fr); gap: 26px; padding-block: 40px; }
  .mv-ac__constat-int, .mv-ac__preuve-int { padding-block: 64px; }
  .mv-ac__dispositifs, .mv-ac__deroule, .mv-ac__faq { padding-block: 64px 72px; }
  .mv-ac__final-int { padding-block: 72px; }
  .mv-ac__grille, .mv-ac__etapes { grid-template-columns: minmax(0, 1fr); }
  /* grid-column:3 fabriquerait une colonne IMPLICITE dans une grille a une
     seule colonne : les deux moities resteraient cote a cote. */
  .mv-ac__contrastes li { grid-template-columns: minmax(0, 1fr); gap: 8px; }
  .mv-ac__contrastes li > *:nth-child(1),
  .mv-ac__contrastes li > *:nth-child(2) { grid-column: auto; }
  .mv-ac .mv-ac__btn-or, .mv-ac .mv-ac__btn-verre { width: 100%; }
}
