
.page-vente main { overflow-x: clip; }
.page-vente {
  --rayon-bloc: 20px;
  --rayon-offre: 28px;
  --courbe-sortie: cubic-bezier(0.22, 1, 0.36, 1);
  --courbe-ressort: cubic-bezier(0.34, 1.56, 0.64, 1);
  --courbe-roue: cubic-bezier(0.16, 1, 0.3, 1);
  --haut-collant: calc(var(--hauteur-header-defile) + var(--esp-5xl));
  --bordure-degrade: linear-gradient(135deg, var(--couleur-accent),
                     var(--couleur-bordure) 50%, var(--voile-accent-lueur));
  --verre: linear-gradient(160deg,
           color-mix(in srgb, var(--couleur-fond-alternatif) 94%, transparent),
           color-mix(in srgb, var(--couleur-fond-principal) 98%, transparent));
}
.page-vente .entete,
.page-vente .entete.est-defile {
  height: var(--hauteur-header-defile);
  background: transparent;
  -webkit-backdrop-filter: none;
          backdrop-filter: none;
  border-bottom-color: transparent;
  transition: none;
}
.page-vente .entete::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--couleur-fond-entete-defile);
  -webkit-backdrop-filter: blur(var(--flou-barre));
          backdrop-filter: blur(var(--flou-barre));
  border-bottom: var(--epaisseur-filet) solid var(--couleur-filet);
  opacity: 0;
  transition: opacity var(--duree-standard) var(--courbe-defaut);
}
.page-vente .entete.est-defile::before { opacity: 1; }
.page-vente .entete__inner {
  width: 100%;
  gap: var(--esp-sm);
}
.page-vente .entete__logo { margin-right: auto; }
.page-vente .entete__logo img {
  transform-origin: 0 50%;
  transition: transform var(--duree-standard) var(--courbe-defaut);
}
.page-vente .entete.est-defile .entete__logo img { transform: scale(0.92); }
.entete__menu {
  display: flex;
  align-items: center;
  gap: var(--esp-xl);
}
.entete__connexion { font-size: var(--taille-dense); }
.entete__cta { white-space: nowrap; }
.sentinelle-defile {
  position: absolute;
  top: var(--esp-4xl);
  left: 0;
  width: 1px;
  height: 1px;
  pointer-events: none;
}
.commande-pause {
  display: grid;
  place-items: center;
  flex: none;
  width: 40px;
  height: 40px;
  padding: 0;
  border: var(--epaisseur-filet) solid var(--couleur-filet-marque);
  border-radius: var(--rayon-pilule);
  background: color-mix(in srgb, var(--couleur-fond-principal) 60%, transparent);
  color: var(--couleur-texte-secondaire);
  cursor: pointer;
  transition: transform var(--duree-rapide) var(--courbe-defaut);
}
.commande-pause[hidden] { display: none; }
.commande-pause:hover {
  color: var(--couleur-texte-principal);
  border-color: var(--voile-accent-lueur);
  transform: scale(1.06);
}
.commande-pause::before {
  content: "";
  width: 10px;
  height: 12px;
  border-inline: 3px solid currentColor;
}
.commande-pause[aria-pressed="true"] { color: var(--couleur-accent); }
.commande-pause[aria-pressed="true"]::before {
  width: 0;
  height: 0;
  margin-left: 3px;
  border-inline: 0;
  border-left: 11px solid currentColor;
  border-block: 6.5px solid transparent;
}
.page-vente .burger {
  width: 44px;
  height: 44px;
  flex: none;
}
@media (min-width: 769px) {
  .commande-pause { margin-left: var(--esp-xs); }
}
@media (max-width: 768px) {
  .entete__menu {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    display: none;
    flex-direction: column;
    align-items: stretch;
    gap: var(--esp-md);
    padding: var(--esp-xl) var(--esp-xl) var(--esp-3xl);
    background: var(--couleur-fond-alternatif);
    border-bottom: var(--epaisseur-filet) solid var(--couleur-bordure);
    box-shadow: var(--ombre-carte-avant);
  }
  .entete__menu.est-ouvert { display: flex; }
  .entete__connexion {
    justify-content: center;
    padding: var(--esp-sm) 0;
    font-size: var(--taille-corps);
    text-align: center;
  }
  .entete__cta {
    font-size: var(--taille-corps);
    padding: var(--esp-md);
  }
}
@media (max-width: 400px) {
  .page-vente .entete__logo img { max-height: 32px; }
}
.atelier {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 62rem;
  overflow: hidden;
  pointer-events: none;
  z-index: var(--couche-decor);
  -webkit-mask-image: linear-gradient(#000 62%, transparent);
          mask-image: linear-gradient(#000 62%, transparent);
}
.atelier__halo {
  position: absolute;
  aspect-ratio: 1;
  border-radius: var(--rayon-cercle);
}
.atelier__halo--violet {
  width: min(66rem, 170vw);
  top: -26rem;
  right: -22rem;
  background: radial-gradient(closest-side,
              color-mix(in srgb, var(--couleur-bordure) 85%, transparent),
              transparent);
}
.atelier__halo--accent {
  width: min(46rem, 130vw);
  top: 12rem;
  left: -22rem;
  background: radial-gradient(closest-side,
              color-mix(in srgb, var(--couleur-accent) 20%, transparent),
              transparent);
}
.atelier__plan {
  --case: 40px;
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(var(--couleur-filet) 1px, transparent 1px),
    linear-gradient(90deg, var(--couleur-filet) 1px, transparent 1px);
  background-size: var(--case) var(--case);
  background-position: right top;
  -webkit-mask-image: radial-gradient(75% 55% at 78% 26%, #000, transparent 78%);
          mask-image: radial-gradient(75% 55% at 78% 26%, #000, transparent 78%);
}
.atelier__module {
  position: absolute;
  width: calc(var(--case) - 1px);
  height: calc(var(--case) - 1px);
  margin: 1px 0 0;
  border-radius: 3px;
  background: var(--voile-accent-fond);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--voile-accent-lisere);
  opacity: 0.55;
}
.atelier__module:nth-child(1) { right: calc(var(--case) * 2);  top: calc(var(--case) * 3); }
.atelier__module:nth-child(2) { right: calc(var(--case) * 5);  top: calc(var(--case) * 2); }
.atelier__module:nth-child(3) { right: calc(var(--case) * 4);  top: calc(var(--case) * 6); }
.atelier__module:nth-child(4) { right: calc(var(--case) * 8);  top: calc(var(--case) * 4); }
.atelier__module:nth-child(5) { right: calc(var(--case) * 1);  top: calc(var(--case) * 8); }
.atelier__module:nth-child(6) { right: calc(var(--case) * 7);  top: calc(var(--case) * 9); }
.atelier__module:nth-child(7) { right: calc(var(--case) * 11); top: calc(var(--case) * 7); }
.atelier__module:nth-child(8) { right: calc(var(--case) * 10); top: calc(var(--case) * 2); }
@media (min-width: 992px) {
  .atelier__plan { --case: 56px; }
}
.hero {
  position: relative;
  padding-top: var(--esp-3xl);
  overflow-x: clip;
}
.hero__grille {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--esp-4xl);
}
.hero__tagline {
  display: inline-flex;
  align-items: center;
  gap: var(--esp-caractere);
  padding: var(--esp-2xs) var(--esp-md) var(--esp-2xs) var(--esp-sm);
  margin-bottom: var(--esp-xl);
  border-radius: var(--rayon-pilule);
  background: var(--voile-accent-fond);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--voile-accent-lisere);
  font-family: var(--police-technique);
  font-size: var(--taille-mention);
  letter-spacing: var(--approche-capitales-md);
  line-height: var(--interligne-ui);
  text-transform: uppercase;
  color: var(--couleur-texte-secondaire);
}
.hero__tagline::before {
  content: "";
  flex: none;
  width: var(--esp-carre-marque);
  height: var(--esp-carre-marque);
  margin-right: var(--esp-3xs);
  background: var(--couleur-accent);
}
.tambour {
  display: inline-grid;
  justify-items: start;
  perspective: 26em;
}
.tambour > span {
  grid-area: 1 / 1;
  white-space: nowrap;
  backface-visibility: hidden;
}
.tambour > span:not(:first-child) { opacity: 0; }
.tambour--tagline {
  font-weight: var(--graisse-semi);
  color: var(--couleur-accent);
}
.hero__titre {
  margin: 0;
  font-size: clamp(2rem, 1rem + 3.6vw, 3.625rem);
  line-height: 1.04;
  letter-spacing: -0.035em;
  text-wrap: balance;
}
.hero__mots .mot { display: inline-block; }
.hero__ligne {
  display: block;
  text-wrap: balance;
}
.hero__mots br { display: none; }
.hero__ligne--probleme { color: var(--couleur-texte-secondaire); }
.hero__titre .tambour--titre {
  display: inline-grid;
  color: var(--couleur-accent);
  text-shadow: 0 0 40px var(--voile-accent-lisere);
}
.hero__ligne--solution { color: var(--couleur-texte-principal); }
.hero__contenu {
  display: flex;
  flex-direction: column;
  gap: var(--esp-xl);
}
.hero__texte p { margin: 0; }
.hero__texte {
  display: grid;
  gap: var(--esp-md);
  max-width: var(--largeur-bloc);
}
.hero__probleme,
.hero__offre {
  font-size: var(--taille-corps);
  line-height: var(--interligne-corps);
}
.hero__promesse {
  font-family: var(--police-titre);
  font-size: var(--taille-titre-xs);
  line-height: var(--interligne-titre);
  letter-spacing: var(--approche-titre-fine);
}
.hero__promesse strong {
  font-weight: var(--graisse-forte);
  color: var(--couleur-texte-principal);
}
.hero__signature {
  display: flex;
  align-items: center;
  gap: var(--esp-sm);
}
.hero__signature img {
  flex: none;
  width: 44px;
  height: 44px;
  border-radius: var(--rayon-cercle);
  object-fit: cover;
  padding: 2px;
  background: conic-gradient(from 210deg, var(--couleur-accent), var(--couleur-bordure) 45%,
              var(--couleur-accent-survol) 75%, var(--couleur-accent));
}
.hero__signature span {
  display: flex;
  flex-direction: column;
  font-size: var(--taille-mention);
  line-height: var(--interligne-ui);
  color: var(--couleur-texte-secondaire);
}
.hero__signature strong {
  font-size: var(--taille-dense);
  color: var(--couleur-texte-principal);
}
.hero__boutons {
  display: flex;
  flex-wrap: wrap;
  gap: var(--esp-sm);
}
.hero__bouton { padding: var(--esp-md) var(--esp-2xl); }
.hero__sous-texte {
  display: flex;
  align-items: baseline;
  gap: var(--esp-xs);
  margin: var(--esp-md) 0 0;
  font-size: var(--taille-mention);
  line-height: var(--interligne-ui);
}
.hero__sous-texte::before {
  content: "";
  flex: none;
  width: 6px;
  height: 6px;
  translate: 0 -1px;
  background: var(--couleur-accent);
}
@media (max-width: 767px) {
  .hero__actions { order: -1; }
  .hero__boutons .btn { width: 100%; }
}
.hero__visuel {
  position: relative;
  isolation: isolate;
  justify-self: center;
  width: 100%;
  max-width: 28rem;
  perspective: 1400px;
}
.hero__visuel::before {
  content: "";
  position: absolute;
  inset: 10% -8% -6%;
  z-index: -1;
  border-radius: var(--rayon-cercle);
  background: radial-gradient(closest-side,
              color-mix(in oklab, var(--couleur-accent) 34%, var(--couleur-bordure)),
              transparent);
  opacity: 0.55;
  filter: blur(20px);
}
.hero__cadre {
  position: relative;
  aspect-ratio: 1;
  border-radius: var(--rayon-bloc);
  overflow: hidden;
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--couleur-filet-marque),
              0 40px 90px -30px var(--voile-accent-lueur),
              var(--ombre-visuel);
  transform: rotateY(calc(var(--scene-x, 0) * 10deg))
             rotateX(calc(var(--scene-y, 0) * -10deg));
  transition: transform 0.9s var(--courbe-sortie);
}
.hero__cadre img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 62%;
}
.hero__cadre::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(120deg, var(--couleur-voile-blanc), transparent 28%,
              transparent 72%, var(--voile-accent-fond));
  opacity: 0.35;
  pointer-events: none;
}
.hero__module {
  --z: 1;
  position: absolute;
  width: var(--t, 18px);
  aspect-ratio: 1;
  pointer-events: none;
  transform: translate3d(calc(var(--scene-x, 0) * var(--z) * 36px),
                         calc(var(--scene-y, 0) * var(--z) * 36px), 0);
  transition: transform 1.1s var(--courbe-sortie);
}
.hero__module::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 3px;
  background: var(--couleur-accent);
  box-shadow: 0 0 22px var(--voile-accent-lueur);
}
.hero__module--1 { --t: 26px; --z: 1.6; top: 5%;  left: -6%; }
.hero__module--2 { --t: 14px; --z: 0.8; top: 18%; left: 4%; }
.hero__module--3 { --t: 20px; --z: 1.3; top: 2%;  right: 10%; }
.hero__module--4 { --t: 12px; --z: 2;   bottom: 22%; right: -4%; }
.hero__module--5 { --t: 32px; --z: 1;   bottom: -3%; left: 12%; }
.hero__module--2::before,
.hero__module--5::before {
  background: transparent;
  box-shadow: inset 0 0 0 2px var(--couleur-accent), 0 0 18px var(--voile-accent-lisere);
}
@media (min-width: 768px) {
  .hero__cadre { aspect-ratio: 4 / 5; }
}
@media (min-width: 992px) {
  .hero { padding-top: var(--esp-5xl); }
  .hero__grille {
    grid-template-columns: minmax(0, 1.18fr) minmax(0, 0.82fr);
    grid-template-areas:
      "entete    entete"
      "contenu   visuel"
      "confiance visuel";
    grid-template-rows: auto auto 1fr;
    column-gap: var(--esp-6xl);
    row-gap: var(--esp-4xl);
  }
  .hero__entete   { grid-area: entete; }
  .hero__contenu  { grid-area: contenu; }
  .hero__visuel   { grid-area: visuel; align-self: start; justify-self: end; }
  .confiance      { grid-area: confiance; align-self: end; }
  .hero__cadre {
    transform: rotateY(calc(-11deg + var(--scene-x, 0) * 10deg))
               rotateX(calc(4deg + var(--scene-y, 0) * -10deg));
  }
}
.confiance {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  border-top: var(--epaisseur-filet) solid var(--couleur-filet);
  border-bottom: var(--epaisseur-filet) solid var(--couleur-filet);
}
.confiance__item {
  display: grid;
  grid-template-columns: minmax(7.5rem, auto) minmax(0, 1fr);
  align-items: center;
  gap: var(--esp-md);
  padding: var(--esp-md) 0;
}
.confiance__item + .confiance__item { border-top: var(--epaisseur-filet) solid var(--couleur-filet); }
.confiance__valeur {
  --roue-h: 1em;
  font-family: var(--police-titre);
  font-weight: var(--graisse-forte);
  font-size: var(--taille-titre-md);
  line-height: 1;
  letter-spacing: -0.03em;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
  color: var(--couleur-texte-principal);
}
.confiance__libelle {
  font-size: var(--taille-mention);
  line-height: var(--interligne-ui);
  color: var(--couleur-texte-secondaire);
}
@media (min-width: 768px) {
  .confiance { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .confiance__item {
    grid-template-columns: minmax(0, 1fr);
    align-items: start;
    align-content: start;
    gap: var(--esp-xs);
    padding: var(--esp-xl) var(--esp-lg);
  }
  .confiance__item:first-child { padding-left: 0; }
  .confiance__item + .confiance__item {
    border-top: 0;
    border-left: var(--epaisseur-filet) solid var(--couleur-filet);
  }
  .confiance__valeur { font-size: clamp(1.75rem, 1rem + 1.6vw, 2.5rem); }
}
.compteur { white-space: nowrap; }
.roue {
  display: inline-block;
  height: var(--roue-h);
  overflow: hidden;
  vertical-align: top;
}
.roue__bande {
  display: block;
  transition: transform 1.6s var(--courbe-roue);
}
.roue__bande > span {
  display: block;
  height: var(--roue-h);
}
.titre-section {
  margin: 0;
  font-size: clamp(2.25rem, 1.2rem + 3.6vw, 4rem);
  line-height: 1.05;
  letter-spacing: -0.03em;
  text-wrap: balance;
}
.titre-section--xl {
  font-size: clamp(2.5rem, 1rem + 5vw, 5rem);
  line-height: 1;
  letter-spacing: -0.04em;
}
.titre-mots .mot { display: inline-block; }
.page-vente .entete-section { margin-bottom: var(--esp-5xl); }
.page-vente .entete-section__chapo {
  max-width: var(--largeur-bloc);
  margin-inline: auto;
}
.page-vente .entete-section--gauche .entete-section__chapo { margin-inline: 0; }
.section--alternatif { position: relative; }
.section--alternatif::before {
  content: "";
  position: absolute;
  top: 0;
  left: 10%;
  right: 10%;
  height: var(--epaisseur-filet);
  background: var(--filet-lumineux-carte);
  opacity: var(--opacite-effacee);
  pointer-events: none;
}
.diagnostic {
  position: relative;
  isolation: isolate;
  overflow: clip;
}
.desordre {
  position: absolute;
  z-index: -1;
  top: 0;
  left: 50%;
  width: max(100%, 1200px);
  height: auto;
  aspect-ratio: 1200 / 760;
  translate: -50% 0;
  overflow: visible;
  pointer-events: none;
  -webkit-mask-image: linear-gradient(#000 55%, transparent);
          mask-image: linear-gradient(#000 55%, transparent);
}
.desordre__baton,
.desordre__module {
  transform-box: fill-box;
  transform-origin: center;
}
.desordre__baton { fill: color-mix(in srgb, var(--couleur-texte-secondaire) 9%, transparent); }
.desordre__module {
  fill: none;
  stroke: var(--voile-accent-lueur);
  stroke-width: 2;
}
.desordre__baton:nth-of-type(1)  { --r: -24deg; }
.desordre__baton:nth-of-type(2)  { --r: 38deg; }
.desordre__baton:nth-of-type(3)  { --r: 12deg; }
.desordre__baton:nth-of-type(4)  { --r: -62deg; }
.desordre__baton:nth-of-type(5)  { --r: 71deg; }
.desordre__baton:nth-of-type(6)  { --r: -8deg; }
.desordre__baton:nth-of-type(7)  { --r: -33deg; }
.desordre__baton:nth-of-type(8)  { --r: 52deg; }
.desordre__baton:nth-of-type(9)  { --r: -79deg; }
.desordre__baton:nth-of-type(10) { --r: 27deg; }
.desordre__module:nth-of-type(11) { --r: 18deg; }
.desordre__module:nth-of-type(12) { --r: -31deg; }
.desordre__module:nth-of-type(13) { --r: 44deg; }
.desordre__baton,
.desordre__module { transform: rotate(var(--r, 0deg)); }
.diagnostic__entete {
  max-width: 56rem;
  margin: 0 auto var(--esp-5xl);
  text-align: center;
}
.diagnostic__accroche {
  margin: var(--esp-xl) 0 var(--esp-md);
  font-family: var(--police-titre);
  font-weight: var(--graisse-forte);
  font-size: var(--taille-titre-xs);
  line-height: var(--interligne-titre);
  letter-spacing: var(--approche-titre-fine);
  color: var(--couleur-texte-principal);
}
.diagnostic__chapo {
  max-width: var(--largeur-colonne);
  margin: 0 auto;
  font-size: var(--taille-corps);
}
.constats {
  display: grid;
  gap: var(--esp-xl);
  margin-bottom: var(--esp-5xl);
}
.constat {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: var(--esp-xl);
  border-radius: var(--rayon-bloc);
  background: var(--couleur-fond-principal);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--couleur-filet-marque),
              var(--ombre-carte);
}
.constat__visuel {
  display: flex;
  align-items: center;
  gap: var(--esp-lg);
  height: 4.5rem;
  margin-bottom: var(--esp-lg);
}
.constat__titre {
  margin: 0 0 var(--esp-md);
  font-size: var(--taille-titre-xs);
  line-height: var(--interligne-titre);
}
.constat__texte {
  margin: 0 0 var(--esp-md);
  font-size: var(--taille-dense);
  line-height: var(--interligne-corps);
}
.constat__texte:last-child { margin-bottom: 0; }
.slop {
  position: relative;
  display: grid;
  gap: 7px;
  width: min(100%, 15rem);
  overflow: hidden;
}
.slop > span {
  display: block;
  height: 5px;
  border-radius: var(--rayon-pilule);
  background: color-mix(in srgb, var(--couleur-texte-secondaire) 24%, transparent);
}
.slop::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg, transparent 30%, var(--couleur-voile-blanc) 50%, transparent 70%);
  transform: translateX(-100%);
  opacity: 0;
}
.horloge {
  position: relative;
  flex: none;
  width: 3.5rem;
  height: 3.5rem;
  border-radius: var(--rayon-cercle);
  box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--couleur-texte-secondaire) 45%, transparent);
}
.horloge::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 6px;
  height: 6px;
  translate: -50% -50%;
  border-radius: var(--rayon-cercle);
  background: var(--couleur-accent);
}
.horloge__heures,
.horloge__minutes {
  position: absolute;
  left: calc(50% - 1px);
  bottom: 50%;
  width: 2px;
  border-radius: var(--rayon-pilule);
  background: var(--couleur-texte-principal);
  transform-origin: 50% 100%;
}
.horloge__heures  { height: 14px; transform: rotate(67deg); }
.horloge__minutes { height: 21px; transform: rotate(84deg); opacity: 0.8; }
.fil-casse {
  width: 10rem;
  height: auto;
  overflow: visible;
}
.fil-casse path {
  fill: none;
  stroke: color-mix(in srgb, var(--couleur-texte-secondaire) 45%, transparent);
  stroke-width: 2.5;
  stroke-linecap: round;
}
.fil-casse__etincelle { fill: var(--couleur-accent); }
.verdict {
  max-width: 54rem;
  margin-inline: auto;
  padding: var(--esp-3xl) var(--esp-xl);
  border-radius: var(--rayon-offre);
  background: var(--verre);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--voile-accent-lisere),
              0 30px 80px -40px var(--voile-accent-lueur),
              var(--ombre-carte);
  text-align: center;
}
.verdict__constat {
  margin: 0 0 var(--esp-md);
  font-weight: var(--graisse-semi);
  font-size: var(--taille-titre-xs);
  line-height: var(--interligne-titre);
  color: var(--couleur-texte-principal);
}
.verdict__texte {
  max-width: var(--largeur-bloc);
  margin: 0 auto var(--esp-xl);
}
.verdict__chute {
  margin: 0;
  font-family: var(--police-titre);
  font-weight: var(--graisse-forte);
  font-size: clamp(1.5rem, 1rem + 2vw, 2.5rem);
  line-height: 1.15;
  letter-spacing: -0.025em;
  color: var(--couleur-texte-principal);
  text-wrap: balance;
}
.verdict__ligne { display: inline-block; }
.verdict__suite {
  display: inline-block;
  margin-top: var(--esp-md);
  font-size: var(--taille-titre-xs);
  letter-spacing: var(--approche-titre-fine);
  color: var(--couleur-accent);
}
.verdict__suite::after {
  content: "";
  display: inline-block;
  width: 0.5em;
  height: 0.5em;
  margin-left: 0.45em;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: translateY(-0.2em) rotate(45deg);
}
@media (min-width: 768px) {
  .constat { padding: var(--esp-3xl); }
  .verdict { padding: var(--esp-5xl) var(--esp-6xl); }
}
@media (min-width: 992px) {
  .constats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--role-gap-grille);
  }
}
.personas__grille {
  display: grid;
  gap: var(--esp-xl);
}
.persona {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  gap: var(--esp-xl);
  padding: var(--esp-xl);
  border-radius: var(--rayon-bloc);
  background: var(--couleur-fond-alternatif);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--couleur-bordure),
              var(--ombre-carte);
}
.persona__corps {
  flex: 1;
  display: flex;
  flex-direction: column;
  text-align: center;
}
.socle {
  position: relative;
  display: grid;
  place-items: center;
  height: 7.5rem;
  margin-bottom: var(--esp-lg);
}
.socle::before,
.socle::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 2px;
  translate: -50% 0;
  border-radius: var(--rayon-cercle);
}
.socle::before {
  width: 9rem;
  height: 2.25rem;
  background: radial-gradient(closest-side, var(--voile-accent-lueur), transparent);
}
.socle::after {
  width: 6.5rem;
  height: 1.4rem;
  bottom: 9px;
  box-shadow: inset 0 0 0 1.5px var(--voile-accent-lisere);
}
.socle__icone {
  position: relative;
  z-index: 1;
  height: 5.75rem;
  width: auto;
  filter: drop-shadow(0 14px 18px rgba(0, 0, 0, 0.45));
  transition: transform var(--duree-standard) var(--courbe-ressort);
}
@media (hover: hover) and (pointer: fine) {
  .persona:hover .socle__icone,
  .systeme:hover .socle__icone { transform: translateY(-6px) rotate(-3deg) scale(1.04); }
}
.persona__tag {
  display: block;
  margin-bottom: var(--esp-xs);
  font-family: var(--police-technique);
  font-size: var(--taille-micro);
  letter-spacing: var(--approche-capitales-lg);
  text-transform: uppercase;
  color: var(--couleur-accent);
}
.persona__titre {
  margin: 0 0 var(--esp-md);
  font-size: var(--taille-titre-xs);
  line-height: var(--interligne-titre);
  letter-spacing: var(--approche-titre-fine);
}
.persona__texte {
  flex: 1;
  margin: 0;
  font-size: var(--taille-dense);
  line-height: var(--interligne-corps);
}
.persona__cta {
  width: 100%;
  font-size: var(--taille-dense);
  padding: var(--esp-sm) var(--esp-md);
}
@media (min-width: 768px) {
  .personas__grille {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--esp-lg);
  }
  .persona { padding: var(--esp-xl) var(--esp-lg); }
}
@media (min-width: 992px) {
  .personas__grille { gap: var(--role-gap-grille); }
  .persona { padding: var(--esp-3xl); }
}
.fondateur {
  position: relative;
  overflow-x: clip;
}
.fondateur__etiquette {
  margin-bottom: var(--esp-3xl);
  text-align: center;
}
.fondateur__grille {
  display: grid;
  gap: var(--esp-4xl);
}
.lettre {
  position: relative;
  isolation: isolate;
  max-width: 48rem;
  padding: var(--esp-3xl) var(--esp-xl);
  border-radius: var(--rayon-offre);
  background: var(--couleur-fond-principal);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--couleur-bordure),
              var(--ombre-carte-avant);
}
.lettre::before {
  content: "«";
  content: "«" / "";
  position: absolute;
  z-index: -1;
  top: -0.2em;
  left: 0.15em;
  font-family: var(--police-titre);
  font-weight: var(--graisse-forte);
  font-size: var(--taille-guillemet-decoratif);
  line-height: 1;
  color: var(--couleur-accent);
  opacity: 0.12;
  pointer-events: none;
}
.lettre::after {
  content: "";
  position: absolute;
  left: -1px;
  top: var(--esp-6xl);
  bottom: var(--esp-6xl);
  width: var(--epaisseur-filet-marque);
  border-radius: var(--rayon-pilule);
  background: var(--degrade-progression);
  transform-origin: 50% 0;
}
.lettre__titre {
  margin: 0 0 var(--esp-3xl);
  font-size: clamp(1.75rem, 1.2rem + 2vw, 2.75rem);
  line-height: 1.1;
  letter-spacing: -0.03em;
  text-wrap: balance;
}
.lettre p {
  margin: 0 0 var(--esp-lg);
  font-size: var(--taille-corps);
  line-height: 1.75;
}
.lettre__aveu {
  padding: var(--esp-xs) 0 var(--esp-xs) var(--esp-lg);
  border-left: var(--epaisseur-filet-marque-fort) solid var(--couleur-accent);
}
.lettre__aveu strong {
  font-family: var(--police-titre);
  font-weight: var(--graisse-forte);
  font-size: var(--taille-titre-xs);
  line-height: var(--interligne-titre);
  letter-spacing: var(--approche-titre-fine);
}
.lettre p.lettre__chute {
  margin-bottom: 0;
  font-weight: var(--graisse-semi);
  color: var(--couleur-texte-principal);
}
.lettre__signature {
  display: flex;
  align-items: center;
  gap: var(--esp-lg);
  margin-top: var(--esp-4xl);
  padding-top: var(--esp-xl);
  border-top: var(--epaisseur-filet) solid var(--couleur-filet);
}
.lettre__photo {
  flex: none;
  width: 4.5rem;
  height: 4.5rem;
  border-radius: var(--rayon-cercle);
  object-fit: cover;
  padding: 3px;
  background: conic-gradient(from 210deg, var(--couleur-accent), var(--couleur-bordure) 45%,
              var(--couleur-accent-survol) 75%, var(--couleur-accent));
}
.lettre__auteur strong {
  display: block;
  font-family: var(--police-titre);
  font-weight: var(--graisse-forte);
  font-size: var(--taille-titre-xs);
  line-height: var(--interligne-titre);
}
.lettre__auteur span {
  display: block;
  font-size: var(--taille-mention);
  color: var(--couleur-texte-secondaire);
}
.etabli { display: grid; justify-items: center; }
.etabli__plateau {
  position: relative;
  isolation: isolate;
  display: grid;
  place-items: center;
  width: 100%;
  max-width: 26rem;
  aspect-ratio: 1;
  overflow: hidden;
  border-radius: var(--rayon-offre);
  background:
    radial-gradient(60% 60% at 50% 45%, var(--voile-accent-fond), transparent 70%),
    var(--couleur-fond-principal);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--couleur-filet-marque),
              var(--ombre-carte);
}
.etabli__plateau::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background-image:
    linear-gradient(var(--couleur-filet) 1px, transparent 1px),
    linear-gradient(90deg, var(--couleur-filet) 1px, transparent 1px);
  background-size: 32px 32px;
  background-position: center;
  -webkit-mask-image: radial-gradient(closest-side, #000, transparent);
          mask-image: radial-gradient(closest-side, #000, transparent);
}
.etabli__marque {
  width: 86%;
  height: auto;
  overflow: visible;
}
.piece {
  transform-box: fill-box;
  transform-origin: center;
}
.piece--barre {
  fill: var(--couleur-texte-principal);
  transform: rotate(-45deg);
}
.piece--module {
  fill: var(--couleur-accent);
  filter: drop-shadow(0 0 6px var(--voile-accent-lueur));
}
.piece--rebut {
  fill: color-mix(in srgb, var(--couleur-texte-secondaire) 40%, transparent);
  opacity: 0;
  transform: var(--envol);
}
.piece--a  { --desordre: translate(-34px, -26px) rotate(-128deg); }
.piece--b  { --desordre: translate(26px, 30px) rotate(24deg); }
.piece--c  { --desordre: translate(-18px, 34px) rotate(-172deg); }
.piece--m1 { --desordre: translate(-52px, 40px) rotate(57deg); }
.piece--m2 { --desordre: translate(-74px, -10px) rotate(-38deg); }
.piece--m3 { --desordre: translate(12px, 58px) rotate(81deg); }
.piece--r1 { --desordre: translate(4px, 22px) rotate(64deg);    --envol: translate(-90px, -70px) rotate(-30deg); }
.piece--r2 { --desordre: translate(-26px, -4px) rotate(-14deg); --envol: translate(80px, -90px) rotate(40deg); }
.piece--r3 { --desordre: translate(30px, -40px) rotate(103deg); --envol: translate(-100px, 60px) rotate(-60deg); }
.piece--r4 { --desordre: translate(-50px, 30px) rotate(-71deg); --envol: translate(90px, -40px) rotate(20deg); }
.piece--r5 { --desordre: translate(10px, -60px) rotate(36deg);  --envol: translate(-60px, 110px) rotate(70deg); }
.piece--r6 { --desordre: translate(-60px, -30px) rotate(-148deg); --envol: translate(100px, 80px) rotate(-20deg); }
@media (min-width: 768px) {
  .lettre { padding: var(--esp-6xl) var(--esp-5xl); }
  .lettre p { font-size: 1.125rem; }
}
@media (min-width: 992px) {
  .fondateur__grille {
    grid-template-columns: minmax(0, 1.35fr) minmax(0, 0.65fr);
    align-items: start;
    column-gap: var(--esp-6xl);
  }
  .etabli {
    position: sticky;
    top: var(--haut-collant);
  }
}
.methode__intro {
  display: grid;
  gap: var(--esp-3xl);
  margin-bottom: var(--esp-6xl);
}
.methode__texte p {
  margin: 0 0 var(--esp-md);
  font-size: var(--taille-corps);
  line-height: var(--interligne-corps);
}
.methode__texte p:last-child { margin-bottom: 0; }
.methode__texte p.methode__lead {
  font-size: var(--taille-titre-xs);
  line-height: var(--interligne-ui);
  color: var(--couleur-texte-principal);
}
.resultat {
  display: grid;
  gap: var(--esp-3xs);
  padding: var(--esp-sm) var(--esp-md);
  border-radius: var(--rayon-carte);
  background: var(--surface-relief-2);
  font-size: var(--taille-mention);
  line-height: var(--interligne-ui);
}
.resultat__label {
  font-weight: var(--graisse-semi);
  color: var(--couleur-accent);
}
.resultat__avant {
  color: var(--couleur-texte-secondaire);
  text-decoration: line-through;
  text-decoration-color: var(--voile-accent-lueur);
  text-decoration-thickness: 1.5px;
  opacity: 0.7;
}
.resultat__apres {
  font-weight: var(--graisse-semi);
  color: var(--couleur-texte-principal);
}
.resultat--grand {
  gap: var(--esp-xs);
  padding: var(--esp-xl) var(--esp-xl);
  border-radius: var(--rayon-bloc);
  background: var(--voile-accent-fond);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--voile-accent-lisere),
              0 30px 70px -40px var(--voile-accent-lueur);
  font-size: var(--taille-dense);
}
.resultat--grand .resultat__label { font-size: var(--taille-corps); }
.resultat--grand .resultat__apres { font-size: var(--taille-corps); font-weight: var(--graisse-semi); }
.methode__atelier {
  display: grid;
  gap: var(--esp-4xl);
}
.machine {
  position: relative;
  width: 100%;
  max-width: 32rem;
  margin-inline: auto;
  padding: var(--esp-sm);
  border-radius: var(--rayon-bloc);
  background: linear-gradient(165deg, var(--surface-relief-2), var(--couleur-fond-principal) 70%);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--couleur-filet-marque),
              0 40px 90px -40px var(--voile-accent-lueur),
              var(--ombre-carte-avant);
}
.machine__barre {
  display: flex;
  gap: 6px;
  padding: var(--esp-3xs) var(--esp-3xs) var(--esp-sm);
}
.machine__barre i {
  width: 9px;
  height: 9px;
  border-radius: var(--rayon-cercle);
  background: var(--couleur-filet-marque);
}
.machine__corps {
  display: grid;
  grid-template-columns: minmax(0, 0.42fr) minmax(0, 1fr);
  gap: var(--esp-sm);
}
.machine__bibliotheque {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-content: start;
  gap: 6px;
  padding: var(--esp-xs);
  border-radius: var(--rayon-carte);
  background: color-mix(in srgb, var(--couleur-fond-principal) 70%, transparent);
}
.machine__bibliotheque > span {
  aspect-ratio: 1;
  border-radius: 5px;
  background: var(--surface-relief-2);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--couleur-filet);
  transition: background var(--duree-standard) var(--courbe-defaut),
              box-shadow var(--duree-standard) var(--courbe-defaut),
              transform var(--duree-standard) var(--courbe-ressort);
}
.machine__poste {
  display: grid;
  gap: var(--esp-xs);
}
.machine__video {
  position: relative;
  display: grid;
  place-items: center;
  aspect-ratio: 16 / 8;
  border-radius: var(--rayon-interne);
  background: linear-gradient(135deg, var(--couleur-surface-violette), var(--couleur-fond-principal));
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--couleur-filet);
}
.machine__lecture {
  display: grid;
  place-items: center;
  width: 2rem;
  height: 2rem;
  border-radius: var(--rayon-cercle);
  background: var(--couleur-voile-blanc);
  transition: background var(--duree-standard) var(--courbe-defaut),
              transform var(--duree-standard) var(--courbe-ressort);
}
.machine__lecture::before {
  content: "";
  margin-left: 3px;
  border-left: 10px solid var(--couleur-texte-principal);
  border-block: 6px solid transparent;
}
.machine__guide {
  display: grid;
  gap: 5px;
}
.machine__guide > span,
.machine__champ > span {
  position: relative;
  display: block;
  height: 5px;
  border-radius: var(--rayon-pilule);
  background: var(--couleur-filet-marque);
  overflow: hidden;
}
.machine__guide > span:nth-child(2) { width: 82%; }
.machine__guide > span:nth-child(3) { width: 64%; }
.machine__guide > span::after,
.machine__champ > span::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  transform: scaleX(0);
  transform-origin: 0 50%;
  transition: transform 0.6s var(--courbe-sortie);
}
.machine__guide > span::after { background: var(--voile-accent-lueur); }
.machine__champ > span::after { background: var(--couleur-texte-principal); }
.machine__guide > span:nth-child(2)::after,
.machine__champ > span:nth-child(2)::after { transition-delay: 120ms; }
.machine__guide > span:nth-child(3)::after,
.machine__champ > span:nth-child(3)::after { transition-delay: 240ms; }
.machine__champ {
  display: grid;
  gap: 5px;
  padding: var(--esp-xs);
  border-radius: var(--rayon-interne);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--couleur-filet-marque);
  background: color-mix(in srgb, var(--couleur-fond-principal) 70%, transparent);
}
.machine__champ > span { background: var(--couleur-filet); }
.machine__champ > span:nth-child(1) { width: 88%; }
.machine__champ > span:nth-child(2) { width: 70%; }
.machine__champ > span:nth-child(3) { width: 46%; }
.machine__bouton {
  position: relative;
  display: grid;
  place-items: center;
  height: 2rem;
  border-radius: var(--rayon-interne);
  background: var(--couleur-surface-violette);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--couleur-bordure);
  overflow: hidden;
  isolation: isolate;
  transition: transform var(--duree-rapide) var(--courbe-defaut);
}
.machine__bouton::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--couleur-accent);
  opacity: 0;
  transition: opacity var(--duree-standard) var(--courbe-defaut);
}
.machine__bouton > span {
  width: 40%;
  height: 5px;
  border-radius: var(--rayon-pilule);
  background: var(--couleur-texte-principal);
  opacity: 0.75;
}
.machine__sortie {
  position: relative;
  aspect-ratio: 16 / 6;
  overflow: hidden;
  border-radius: var(--rayon-interne);
  background: var(--couleur-fond-principal);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--couleur-filet-marque);
}
.machine__soleil {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(40% 90% at 50% 100%, var(--couleur-accent), transparent 70%),
    linear-gradient(180deg, var(--couleur-surface-violette), var(--couleur-fond-principal));
  opacity: 0;
  transform: scale(1.1);
  transition: opacity 0.7s var(--courbe-sortie), transform 0.9s var(--courbe-sortie);
}
.machine:is([data-etape="1"], [data-etape="2"], [data-etape="3"], [data-etape="4"]) .machine__choisi {
  background: var(--couleur-accent);
  box-shadow: 0 0 16px var(--voile-accent-lueur);
  transform: scale(1.12);
}
.machine:is([data-etape="2"], [data-etape="3"], [data-etape="4"]) .machine__lecture {
  background: var(--couleur-accent);
}
.machine:is([data-etape="2"], [data-etape="3"], [data-etape="4"]) .machine__guide > span::after { transform: scaleX(1); }
.machine:is([data-etape="3"], [data-etape="4"]) .machine__champ > span::after { transform: scaleX(1); }
.machine[data-etape="4"] .machine__bouton::before { opacity: 1; }
.machine[data-etape="4"] .machine__bouton { transform: scale(0.97); }
.machine[data-etape="4"] .machine__soleil {
  opacity: 1;
  transform: none;
}
.methode__titre {
  margin: 0 0 var(--esp-xl);
  font-family: var(--police-technique);
  font-weight: var(--graisse-normale);
  font-size: var(--taille-mention);
  letter-spacing: var(--approche-capitales-md);
  text-transform: uppercase;
  color: var(--couleur-accent);
}
.methode__etapes { display: grid; gap: var(--esp-lg); align-content: start; }
.methode__etapes .methode__titre { margin-bottom: var(--esp-3xs); }
.etape {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--esp-lg);
  padding: var(--esp-xl);
  border-radius: var(--rayon-bloc);
  background: var(--couleur-fond-alternatif);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--couleur-bordure);
}
.etape::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--voile-accent-lueur),
              inset 0 0 60px var(--voile-accent-fond);
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--duree-standard) var(--courbe-defaut);
}
.etape.est-active::after { opacity: 1; }
.etape__numero {
  display: grid;
  place-items: center;
  width: var(--esp-5xl);
  height: var(--esp-5xl);
  border-radius: var(--rayon-cercle);
  background: var(--voile-accent-fond);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--voile-accent-lisere);
  font-family: var(--police-titre);
  font-weight: var(--graisse-forte);
  font-size: var(--taille-titre-xs);
  color: var(--couleur-accent);
  transition: transform var(--duree-standard) var(--courbe-ressort);
}
.etape.est-active .etape__numero { transform: scale(1.1); }
.etape__titre {
  margin: 0 0 var(--esp-3xs);
  font-size: var(--taille-corps);
  line-height: var(--interligne-titre);
}
.etape__texte {
  margin: 0;
  font-size: var(--taille-dense);
  line-height: var(--interligne-ui);
}
.methode__chute {
  margin: var(--esp-md) 0 0;
  font-weight: var(--graisse-semi);
  color: var(--couleur-accent);
}
@media (min-width: 992px) {
  .methode__intro {
    grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr);
    align-items: center;
    column-gap: var(--esp-6xl);
  }
  .methode__atelier {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    align-items: start;
    column-gap: var(--esp-6xl);
  }
  .machine-colonne {
    position: sticky;
    top: var(--haut-collant);
  }
  .methode__etapes { gap: clamp(var(--esp-xl), 9vh, 5rem); }
  .methode__etapes .methode__titre { margin-bottom: 0; }
}
.vitrine-section { overflow-x: clip; }
.vitrine {
  --diapo: min(62rem, calc(100% - 3rem));
  position: relative;
}
.vitrine__piste {
  display: flex;
  gap: var(--esp-xl);
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  overscroll-behavior-x: contain;
  padding: var(--esp-xl) calc((100% - var(--diapo)) / 2) var(--esp-lg);
  perspective: 1600px;
  scrollbar-width: none;
}
.vitrine__piste::-webkit-scrollbar { display: none; }
.capture {
  flex: 0 0 var(--diapo);
  margin: 0;
  scroll-snap-align: center;
}
.capture__fenetre {
  overflow: hidden;
  border-radius: var(--rayon-carte);
  background: var(--couleur-fond-alternatif);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--couleur-filet-marque),
              0 40px 90px -40px var(--voile-accent-lueur),
              var(--ombre-carte-avant);
}
.capture__barre {
  display: flex;
  gap: 6px;
  padding: var(--esp-xs) var(--esp-sm);
  border-bottom: var(--epaisseur-filet) solid var(--couleur-filet);
}
.capture__barre i {
  width: 9px;
  height: 9px;
  border-radius: var(--rayon-cercle);
  background: var(--couleur-filet-marque);
}
.capture__fenetre img {
  width: 100%;
  aspect-ratio: 1400 / 787;
  object-fit: cover;
}
.capture__legende {
  max-width: var(--largeur-bloc);
  margin: var(--esp-lg) auto 0;
  font-size: var(--taille-dense);
  line-height: var(--interligne-ui);
  text-align: center;
  color: var(--couleur-texte-secondaire);
}
.vitrine__btn {
  position: absolute;
  top: calc(var(--esp-xl) + (var(--diapo) * 787 / 1400 / 2));
  z-index: 2;
  display: none;
  translate: 0 -50%;
}
.vitrine__btn--prec { left: max(var(--esp-xs), calc(50% - var(--diapo) / 2 - 1.25rem)); }
.vitrine__btn--suiv { right: max(var(--esp-xs), calc(50% - var(--diapo) / 2 - 1.25rem)); }
.vitrine__reperes {
  display: flex;
  justify-content: center;
  gap: var(--esp-xs);
  margin-top: var(--esp-xl);
}
.vitrine__reperes > span {
  width: var(--esp-xl);
  height: 3px;
  border-radius: var(--rayon-pilule);
  background: var(--couleur-filet-marque);
  transition: background var(--duree-standard) var(--courbe-defaut),
              transform var(--duree-standard) var(--courbe-defaut);
}
.vitrine__reperes > span:nth-child(1),
.vitrine__reperes[data-actif] > span:nth-child(1) { background: var(--couleur-filet-marque); }
.vitrine__reperes:not([data-actif]) > span:nth-child(1),
.vitrine__reperes[data-actif="0"] > span:nth-child(1),
.vitrine__reperes[data-actif="1"] > span:nth-child(2),
.vitrine__reperes[data-actif="2"] > span:nth-child(3),
.vitrine__reperes[data-actif="3"] > span:nth-child(4) {
  background: var(--couleur-accent);
  transform: scaleX(1.5);
}
@media (min-width: 768px) {
  .vitrine__btn { display: inline-flex; }
}
.catalogue__entete .titre-section { margin-bottom: var(--esp-lg); }
.catalogue__compte {
  display: inline-block;
  margin: 0 0 var(--esp-xl);
  padding: var(--esp-2xs) var(--esp-md);
  border-radius: var(--rayon-pilule);
  background: var(--surface-relief-1);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--couleur-filet-marque);
  font-family: var(--police-technique);
  font-size: var(--taille-mention);
  letter-spacing: var(--approche-capitales-sm);
  color: var(--couleur-texte-secondaire);
}
.catalogue__compte strong { color: var(--couleur-accent); }
.catalogue__intro {
  max-width: var(--largeur-colonne);
  margin: 0 auto var(--esp-md);
  font-size: var(--taille-corps);
}
.catalogue__intro:last-child { margin-bottom: 0; }
.rayon {
  --marge: max(var(--esp-xl), calc((100% - var(--largeur-page)) / 2 + var(--esp-3xl)));
  position: relative;
}
.rayon__piste {
  display: flex;
  gap: var(--esp-xl);
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x mandatory;
  overscroll-behavior-x: contain;
  padding: var(--esp-xl) var(--marge) var(--esp-3xl);
  scroll-padding-inline: var(--marge);
  scrollbar-width: none;
}
.rayon__piste::-webkit-scrollbar { display: none; }
.systeme {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  flex: 0 0 min(21.5rem, 84%);
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: var(--esp-lg);
  padding: var(--esp-xl);
  border-radius: var(--rayon-bloc);
  background: var(--couleur-fond-alternatif);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--couleur-bordure),
              var(--ombre-carte);
  scroll-snap-align: start;
}
.systeme__haut { display: flex; flex-direction: column; }
.socle--systeme {
  height: 6.5rem;
  margin-bottom: var(--esp-md);
}
.socle--systeme .socle__icone { height: 5rem; }
.systeme__badge {
  align-self: flex-start;
  margin-bottom: var(--esp-sm);
  padding: var(--esp-4xs) var(--esp-sm);
  border-radius: var(--rayon-pilule);
  background: var(--surface-relief-1);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--couleur-filet-marque);
  font-family: var(--police-technique);
  font-size: 0.625rem;
  letter-spacing: var(--approche-capitales-sm);
  line-height: var(--interligne-ui);
  text-transform: uppercase;
  color: var(--couleur-texte-secondaire);
}
.systeme__badge--alerte,
.systeme__badge--suite {
  background: var(--voile-accent-fond);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--voile-accent-lisere);
  color: var(--couleur-accent-survol);
}
.systeme__nom {
  margin: 0 0 var(--esp-xs);
  font-size: var(--taille-titre-xs);
  line-height: var(--interligne-titre);
  letter-spacing: var(--approche-titre-fine);
}
.systeme__sous-nom {
  font-family: var(--police-texte);
  font-weight: var(--graisse-semi);
  font-size: var(--taille-dense);
  letter-spacing: 0;
  color: var(--couleur-accent);
}
.systeme__role {
  margin: 0 0 var(--esp-sm);
  font-family: var(--police-technique);
  font-size: var(--taille-micro);
  letter-spacing: var(--approche-capitales-sm);
  line-height: var(--interligne-ui);
  text-transform: uppercase;
  color: var(--couleur-accent);
}
.systeme__texte {
  margin: 0;
  font-size: var(--taille-dense);
  line-height: 1.6;
}
.systeme--suite {
  background:
    var(--degrade-carte-avant) padding-box,
    linear-gradient(var(--couleur-fond-alternatif), var(--couleur-fond-alternatif)) padding-box,
    var(--bordure-degrade) border-box;
  border: var(--epaisseur-filet) solid transparent;
  box-shadow: var(--ombre-halo-accent), var(--ombre-carte-avant);
}
.socle--suite::before { background: radial-gradient(closest-side, var(--couleur-accent), transparent); opacity: 0.6; }
.systeme__cta {
  width: 100%;
  padding-inline: var(--esp-md);
  font-size: var(--taille-dense);
}
.vitrine__btn,
.rayon__btn { font-family: var(--police-texte); }
.rayon__btn {
  position: absolute;
  top: 50%;
  z-index: 2;
  display: none;
  translate: 0 -50%;
  box-shadow: var(--ombre-carte);
}
.rayon__btn--prec { left: max(var(--esp-xs), calc(var(--marge) - 1.25rem)); }
.rayon__btn--suiv { right: max(var(--esp-xs), calc(var(--marge) - 1.25rem)); }
.rayon__jauge {
  position: relative;
  height: 2px;
  margin: 0 var(--marge);
  border-radius: var(--rayon-pilule);
  background: var(--couleur-filet);
  overflow: hidden;
}
.rayon__jauge-barre {
  position: absolute;
  inset: 0;
  background: var(--degrade-progression);
  transform-origin: 0 50%;
  transform: scaleX(var(--rayon-part, 0.18));
  transition: transform 0.25s linear;
}
.rayon__indice {
  margin: var(--esp-lg) 0 0;
  font-family: var(--police-technique);
  font-size: var(--taille-micro);
  letter-spacing: var(--approche-capitales-sm);
  text-align: center;
  color: var(--couleur-texte-secondaire);
  opacity: var(--opacite-mention);
}
@media (min-width: 768px) {
  .rayon__btn { display: inline-flex; }
  .systeme { padding: var(--esp-3xl) var(--esp-xl); }
}
.fiche-technique {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: var(--esp-filet);
  margin-top: var(--esp-5xl);
  border-radius: var(--rayon-bloc);
  background: var(--couleur-filet-marque);
  overflow: hidden;
}
.fiche-technique__cellule {
  position: relative;
  isolation: isolate;
  display: grid;
  gap: var(--esp-xs);
  align-content: start;
  padding: var(--esp-xl);
  background: var(--couleur-fond-alternatif);
}
.fiche-technique__cellule::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: radial-gradient(120% 90% at 0% 0%, var(--voile-accent-lisere), transparent 65%);
  opacity: 0;
  transition: opacity var(--duree-standard) var(--courbe-defaut);
}
.fiche-technique__cellule:hover::before { opacity: 1; }
.fiche-technique__label {
  font-family: var(--police-technique);
  font-size: var(--taille-micro);
  letter-spacing: var(--approche-capitales-md);
  text-transform: uppercase;
  color: var(--couleur-accent);
}
.fiche-technique__valeur {
  font-size: var(--taille-dense);
  line-height: var(--interligne-corps);
  color: var(--couleur-texte-secondaire);
}
.fiche-technique__icone {
  position: relative;
  width: 36px;
  height: 36px;
  margin-bottom: var(--esp-xs);
  border-radius: var(--rayon-carte);
  background: var(--voile-accent-fond);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--voile-accent-lisere);
}
.fiche-technique__icone::before,
.fiche-technique__icone::after {
  content: "";
  position: absolute;
  transition: transform var(--duree-apparition) var(--courbe-sortie);
}
.fiche-technique__icone--fichier::before {
  top: 9px;
  left: 11px;
  width: 14px;
  height: 18px;
  border: 1.5px solid var(--couleur-accent);
  border-radius: 2px;
  clip-path: polygon(0 0, 62% 0, 100% 30%, 100% 100%, 0 100%);
}
.fiche-technique__icone--fichier::after {
  top: 9px;
  left: 19px;
  width: 6px;
  height: 6px;
  border-left: 1.5px solid var(--couleur-accent);
  border-bottom: 1.5px solid var(--couleur-accent);
}
.fiche-technique__cellule:hover .fiche-technique__icone--fichier::before { transform: translateY(-2px); }
.fiche-technique__icone--guide::before {
  top: 11px;
  left: 13px;
  width: 8px;
  height: 13px;
  border-right: 2px solid var(--couleur-accent);
  border-bottom: 2px solid var(--couleur-accent);
  transform: rotate(45deg);
}
.fiche-technique__cellule:hover .fiche-technique__icone--guide::before { transform: rotate(45deg) scale(1.15); }
.fiche-technique__icone--annee::before {
  inset: 9px;
  border: 1.5px solid var(--couleur-accent);
  border-right-color: transparent;
  border-radius: var(--rayon-cercle);
}
.fiche-technique__icone--annee::after {
  top: 8px;
  right: 9px;
  border-left: 5px solid var(--couleur-accent);
  border-block: 4px solid transparent;
}
.fiche-technique__cellule:hover .fiche-technique__icone--annee::before { transform: rotate(1turn); }
@media (min-width: 768px) {
  .fiche-technique { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .fiche-technique__cellule { padding: var(--esp-xl) var(--esp-3xl) var(--esp-3xl); }
}
.perimetre__grille {
  display: grid;
  gap: var(--esp-xl);
}
.perimetre__carte {
  position: relative;
  padding: var(--esp-3xl) var(--esp-xl);
  border-radius: var(--rayon-bloc);
}
.perimetre__carte--dedans {
  border: var(--epaisseur-filet) solid transparent;
  background:
    linear-gradient(var(--couleur-fond-principal), var(--couleur-fond-principal)) padding-box,
    var(--bordure-degrade) border-box;
  box-shadow: var(--ombre-halo-accent), var(--ombre-carte-avant);
}
.perimetre__carte--dehors {
  border: var(--epaisseur-filet) dashed var(--couleur-filet-marque);
  background: color-mix(in srgb, var(--couleur-fond-principal) 40%, transparent);
}
.perimetre__titre {
  margin: 0 0 var(--esp-md);
  font-size: var(--taille-titre-sm);
  line-height: var(--interligne-titre);
}
.perimetre__carte--dehors .perimetre__titre { color: var(--couleur-texte-secondaire); }
.perimetre__intro {
  margin: 0 0 var(--esp-xl);
  padding-bottom: var(--esp-lg);
  border-bottom: var(--epaisseur-filet) solid var(--couleur-filet);
  font-size: var(--taille-dense);
}
.perimetre__liste {
  display: grid;
  gap: var(--esp-md);
  margin: 0;
  padding: 0;
  list-style: none;
}
.perimetre__liste li {
  position: relative;
  padding-left: var(--esp-3xl);
  font-size: var(--taille-corps);
  line-height: var(--interligne-ui);
  color: var(--couleur-texte-secondaire);
}
.perimetre__liste li::before {
  position: absolute;
  left: 0;
  top: 1px;
  font-size: var(--taille-dense);
}
.perimetre__carte--dedans li { color: var(--couleur-texte-principal); }
.perimetre__carte--dedans li::before { content: "✅"; }
.perimetre__carte--dehors li::before { content: "❌"; opacity: var(--opacite-attenuee); }
.perimetre__outro {
  margin: var(--esp-xl) 0 0;
  padding-top: var(--esp-lg);
  border-top: var(--epaisseur-filet) solid var(--couleur-filet);
  font-size: var(--taille-dense);
}
@media (min-width: 768px) {
  .perimetre__carte { padding: var(--esp-5xl); }
}
@media (min-width: 992px) {
  .perimetre__grille {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--role-gap-grille);
  }
}
.evolution { overflow-x: clip; }
.evolution__grille {
  display: grid;
  gap: var(--esp-5xl);
  align-items: center;
}
.evolution__visuel {
  position: relative;
  width: 100%;
  max-width: 24rem;
  margin-inline: auto;
  perspective: 1400px;
}
.evolution__cadre {
  aspect-ratio: 4 / 5;
  overflow: hidden;
  border-radius: var(--rayon-bloc);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--couleur-filet-marque),
              0 40px 90px -30px var(--voile-accent-lueur),
              var(--ombre-visuel);
  transform: rotateY(9deg) rotateX(3deg);
}
.evolution__cadre img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 70%;
}
.envol {
  position: absolute;
  inset: -8% -16%;
  pointer-events: none;
}
.envol__icone {
  position: absolute;
  width: var(--t, 64px);
  aspect-ratio: 1;
  background: center / contain no-repeat;
  filter: drop-shadow(0 14px 20px rgba(0, 0, 0, 0.45));
}
.envol__icone--1 { --t: 76px; --v: 1.2; top: 6%;  left: 0;     background-image: url("../img/icone-hookmaster.webp"); }
.envol__icone--2 { --t: 60px; --v: 0.7; top: 30%; right: 0;    background-image: url("../img/icone-titlemaster.webp"); }
.envol__icone--3 { --t: 52px; --v: 1.6; top: 58%; left: 2%;    background-image: url("../img/icone-videomaster.webp"); }
.envol__icone--4 { --t: 70px; --v: 0.9; top: 74%; right: 4%;   background-image: url("../img/icone-retentioncraft.webp"); }
.envol__icone--5 { --t: 46px; --v: 1.4; top: -2%; right: 18%;  background-image: url("../img/icone-moteur-video.webp"); }
.evolution__lead {
  margin: 0 0 var(--esp-lg);
  font-family: var(--police-titre);
  font-weight: var(--graisse-forte);
  font-size: var(--taille-titre-sm);
  line-height: var(--interligne-titre);
  letter-spacing: var(--approche-titre);
  color: var(--couleur-texte-principal);
}
.evolution__corps { margin: 0 0 var(--esp-3xl); }
.regles {
  position: relative;
  display: grid;
  gap: var(--esp-lg);
  padding-left: var(--esp-3xl);
}
.regles::before {
  content: "";
  position: absolute;
  left: 7px;
  top: var(--esp-xs);
  bottom: var(--esp-xs);
  width: var(--epaisseur-filet-marque);
  border-radius: var(--rayon-pilule);
  background: linear-gradient(var(--couleur-accent), var(--couleur-bordure));
}
.regle {
  position: relative;
  padding: var(--esp-lg) var(--esp-xl);
  border-radius: var(--rayon-carte);
  background: var(--couleur-fond-alternatif);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--couleur-filet-marque);
}
.regle::before {
  content: "";
  position: absolute;
  left: calc(var(--esp-3xl) * -1);
  top: var(--esp-xl);
  width: 16px;
  height: 16px;
  border-radius: 3px;
  background: var(--couleur-accent);
  box-shadow: 0 0 0 4px var(--couleur-fond-principal), 0 0 16px var(--voile-accent-lueur);
}
.regle__titre {
  margin: 0 0 var(--esp-3xs);
  font-size: var(--taille-corps);
  line-height: var(--interligne-titre);
}
.regle__texte {
  margin: 0;
  font-size: var(--taille-dense);
  line-height: var(--interligne-ui);
}
.evolution__chute {
  max-width: 44rem;
  margin: var(--esp-5xl) auto 0;
  font-size: var(--taille-titre-xs);
  line-height: var(--interligne-ui);
  text-align: center;
  color: var(--couleur-texte-principal);
}
@media (min-width: 992px) {
  .evolution__grille {
    grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
    column-gap: var(--esp-6xl);
  }
}
.doutes__grille {
  display: grid;
  gap: var(--esp-3xl);
}
.doutes__entete { margin-bottom: 0; }
@media (min-width: 992px) {
  .doutes__entete .titre-section--xl { font-size: clamp(2.5rem, 0.8rem + 3.4vw, 4rem); }
}
.jauge {
  display: flex;
  gap: var(--esp-sm);
  margin-top: var(--esp-3xl);
}
.jauge > span {
  width: 18px;
  height: 18px;
  border-radius: 4px;
  background: var(--couleur-accent);
  box-shadow: 0 0 16px var(--voile-accent-lueur);
  transition: background var(--duree-standard) var(--courbe-defaut),
              box-shadow var(--duree-standard) var(--courbe-defaut),
              transform 0.5s var(--courbe-ressort);
}
.jauge[data-leves] > span {
  background: transparent;
  box-shadow: inset 0 0 0 1.5px var(--couleur-filet-marque);
}
.jauge[data-leves="1"] > span:nth-child(-n+1),
.jauge[data-leves="2"] > span:nth-child(-n+2),
.jauge[data-leves="3"] > span:nth-child(-n+3),
.jauge[data-leves="4"] > span {
  background: var(--couleur-accent);
  box-shadow: 0 0 16px var(--voile-accent-lueur);
  transform: rotate(90deg);
}
.doutes__liste {
  display: grid;
  gap: var(--esp-xl);
}
.doute {
  position: relative;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: var(--esp-xl);
  padding: var(--esp-3xl) var(--esp-xl);
  border-radius: var(--rayon-bloc);
  background: var(--couleur-fond-principal);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--couleur-bordure),
              var(--ombre-carte);
}
.doute__tag {
  display: inline-flex;
  align-items: center;
  gap: var(--esp-sm);
  margin-bottom: var(--esp-md);
  font-family: var(--police-technique);
  font-size: var(--taille-micro);
  letter-spacing: var(--approche-capitales-lg);
  text-transform: uppercase;
  color: var(--couleur-accent);
}
.cadenas {
  position: relative;
  flex: none;
  width: 14px;
  height: 16px;
}
.cadenas::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 9px;
  border-radius: 2px;
  background: var(--couleur-accent);
  transition: background var(--duree-standard) var(--courbe-defaut);
}
.cadenas::after {
  content: "";
  position: absolute;
  left: 2px;
  bottom: 7px;
  width: 10px;
  height: 9px;
  border: 2px solid var(--couleur-accent);
  border-bottom: 0;
  border-radius: 6px 6px 0 0;
  transform-origin: 100% 100%;
  transform: translateY(-3px) rotate(28deg);
  transition: transform 0.5s var(--courbe-ressort);
}
.doute.est-verrouille .cadenas::before { background: var(--couleur-texte-secondaire); }
.doute.est-verrouille .cadenas::after {
  border-color: var(--couleur-texte-secondaire);
  transform: none;
}
.doute__titre {
  margin: 0 0 var(--esp-lg);
  font-size: var(--taille-titre-sm);
  line-height: var(--interligne-titre);
}
.doute__texte {
  margin: 0 0 var(--esp-md);
  font-size: var(--taille-dense);
  line-height: var(--interligne-corps);
}
.doute__texte:last-child { margin-bottom: 0; }
.doute__conclusion {
  position: relative;
  margin: 0;
  padding: var(--esp-sm) 0 var(--esp-sm) var(--esp-lg);
  font-weight: var(--graisse-semi);
  font-size: var(--taille-dense);
  line-height: var(--interligne-ui);
  color: var(--couleur-texte-principal);
}
.doute__conclusion::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: var(--epaisseur-filet-marque);
  border-radius: var(--rayon-pilule);
  background: var(--couleur-accent);
  transform-origin: 50% 0;
  transition: transform 0.6s var(--courbe-sortie);
}
.doute.est-verrouille .doute__conclusion::before { transform: scaleY(0.25); }
@media (min-width: 768px) {
  .doute { padding: var(--esp-5xl); }
}
@media (min-width: 992px) {
  .doutes__grille {
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    align-items: start;
    column-gap: var(--esp-6xl);
  }
  .doutes__entete {
    position: sticky;
    top: var(--haut-collant);
  }
}
.cout__volets {
  display: grid;
  gap: var(--esp-xl);
  margin-bottom: var(--esp-5xl);
}
.volet {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: var(--esp-3xl) var(--esp-xl);
  border-radius: var(--rayon-bloc);
  background: var(--couleur-fond-alternatif);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--couleur-bordure),
              var(--ombre-carte);
}
.volet__numero {
  display: block;
  margin-bottom: var(--esp-md);
  font-family: var(--police-titre);
  font-weight: var(--graisse-forte);
  font-size: clamp(3.5rem, 2.4rem + 3vw, 5rem);
  line-height: 0.9;
  letter-spacing: -0.04em;
  color: transparent;
  -webkit-text-stroke: 1.5px var(--couleur-accent);
}
.volet__titre {
  margin: 0 0 var(--esp-md);
  font-size: var(--taille-titre-sm);
  line-height: var(--interligne-titre);
}
.volet__texte {
  margin: 0 0 var(--esp-md);
  font-size: var(--taille-dense);
  line-height: var(--interligne-corps);
}
.volet__texte:last-child { margin-bottom: 0; }
.tassement { display: none; }
.equation {
  display: grid;
  gap: var(--esp-sm);
  justify-items: center;
  padding: var(--esp-3xl) var(--esp-xl);
  border-radius: var(--rayon-bloc);
  background: var(--voile-accent-fond);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--voile-accent-lisere);
  font-size: var(--taille-corps);
  line-height: var(--interligne-ui);
  text-align: center;
}
.equation__depart { color: var(--couleur-texte-secondaire); }
.equation__etape {
  font-weight: var(--graisse-semi);
  color: var(--couleur-texte-principal);
}
.equation__arrivee {
  font-family: var(--police-titre);
  font-weight: var(--graisse-forte);
  font-size: var(--taille-titre-xs);
  line-height: var(--interligne-titre);
  color: var(--couleur-accent);
}
.equation__fleche {
  display: inline-block;
  font-size: var(--taille-titre-xs);
  line-height: 1;
  color: var(--couleur-accent);
  transform: rotate(90deg);
}
@media (min-width: 768px) {
  .cout__volets {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--role-gap-grille);
  }
  .volet { padding: var(--esp-5xl); }
}
@media (min-width: 992px) {
  .equation,
  .tassement {
    grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr) auto minmax(0, 1fr);
    column-gap: var(--esp-xl);
  }
  .equation {
    align-items: center;
    padding: var(--esp-3xl) var(--esp-4xl);
  }
  .equation__fleche { transform: none; }
  .tassement {
    display: grid;
    align-items: end;
    height: 7.5rem;
    margin: 0 var(--esp-4xl) var(--esp-md);
  }
  .tassement > :nth-child(1) { grid-column: 1; }
  .tassement > :nth-child(2) { grid-column: 3; }
  .tassement > :nth-child(3) { grid-column: 5; }
}
.tassement__pile {
  position: relative;
  justify-self: center;
  width: 8rem;
  height: 6.5rem;
}
.tassement__pile > span {
  position: absolute;
  left: 0;
  right: 0;
  height: 10px;
  border-radius: var(--rayon-pilule);
  background: var(--couleur-surface-violette);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--couleur-bordure);
}
.tassement__pile > span:nth-child(1) { bottom: 0;    --desordre: translate(-14px, -10px) rotate(-14deg); }
.tassement__pile > span:nth-child(2) { bottom: 13px; --desordre: translate(18px, -26px) rotate(22deg); }
.tassement__pile > span:nth-child(3) { bottom: 26px; --desordre: translate(-26px, -30px) rotate(-33deg); }
.tassement__pile > span:nth-child(4) { bottom: 39px; --desordre: translate(22px, -44px) rotate(41deg); }
.tassement__pile > span:nth-child(5) { bottom: 52px; --desordre: translate(-10px, -58px) rotate(-9deg); }
.tassement__pile > span:nth-child(6) { bottom: 65px; --desordre: translate(30px, -50px) rotate(64deg); }
.tassement__pile > span:nth-child(7) { bottom: 78px; --desordre: translate(-34px, -62px) rotate(-52deg); }
.tassement__pile > span:nth-child(3),
.tassement__pile > span:nth-child(6) { background: var(--voile-accent-lisere); box-shadow: none; }
.tassement__fichiers {
  display: flex;
  justify-content: center;
  gap: var(--esp-sm);
}
.tassement__fichiers > span {
  width: 2.25rem;
  height: 2.875rem;
  border-radius: 4px;
  background: linear-gradient(180deg, var(--surface-relief-2), var(--couleur-fond-alternatif));
  box-shadow: inset 0 0 0 1.5px var(--couleur-filet-marque);
  clip-path: polygon(0 0, 68% 0, 100% 26%, 100% 100%, 0 100%);
}
.tassement__fichiers > span:nth-child(2) { translate: 0 -10px; box-shadow: inset 0 0 0 1.5px var(--voile-accent-lueur); }
.tassement__module {
  display: grid;
  place-items: center;
}
.tassement__module > span {
  width: 3rem;
  height: 3rem;
  border-radius: 6px;
  background: var(--couleur-accent);
  box-shadow: 0 0 40px var(--voile-accent-lueur), 0 0 0 8px var(--voile-accent-fond);
}
.frise {
  position: relative;
  display: grid;
  gap: var(--esp-xl);
  margin: 0 0 var(--esp-6xl);
  padding: 0;
  list-style: none;
}
.frise::before,
.frise::after {
  content: "";
  position: absolute;
  left: 9px;
  top: 10px;
  bottom: 10px;
  width: var(--epaisseur-filet-marque);
  border-radius: var(--rayon-pilule);
}
.frise::before { background: var(--couleur-filet-marque); }
.frise::after {
  background: var(--degrade-progression);
  transform-origin: 50% 0;
}
.frise__etape {
  position: relative;
  padding-left: var(--esp-3xl);
}
.frise__noeud {
  position: absolute;
  z-index: 1;
  left: 0;
  top: 1px;
  width: 20px;
  height: 20px;
  border-radius: 5px;
  background: var(--couleur-accent);
  box-shadow: 0 0 0 5px var(--couleur-fond-alternatif), 0 0 18px var(--voile-accent-lueur);
}
.frise__quand {
  display: block;
  margin-bottom: var(--esp-xs);
  font-family: var(--police-technique);
  font-size: var(--taille-micro);
  letter-spacing: var(--approche-capitales-md);
  text-transform: uppercase;
  color: var(--couleur-accent);
}
.frise__titre {
  margin: 0 0 var(--esp-xs);
  font-size: var(--taille-corps);
  line-height: var(--interligne-titre);
}
.frise__texte {
  margin: 0;
  font-size: var(--taille-dense);
  line-height: var(--interligne-ui);
}
@media (min-width: 992px) {
  .frise {
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--esp-3xl);
  }
  .frise::before,
  .frise::after {
    left: 10px;
    right: 10px;
    top: 9px;
    bottom: auto;
    width: auto;
    height: var(--epaisseur-filet-marque);
    transform-origin: 0 50%;
  }
  .frise__etape { padding: var(--esp-4xl) 0 0; }
}
.acces__grille {
  display: grid;
  gap: var(--esp-5xl);
}
.cadre {
  padding: var(--esp-3xl) var(--esp-xl);
  border-left: var(--epaisseur-filet-marque-fort) solid var(--couleur-accent);
  border-radius: 0 var(--rayon-bloc) var(--rayon-bloc) 0;
  background: color-mix(in srgb, var(--couleur-bordure) 22%, transparent);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--couleur-filet);
}
.cadre__titre {
  margin: 0 0 var(--esp-lg);
  font-size: var(--taille-titre-sm);
  line-height: var(--interligne-titre);
  color: var(--couleur-accent-survol);
}
.cadre__texte {
  margin: 0 0 var(--esp-md);
  font-size: var(--taille-dense);
  line-height: var(--interligne-corps);
}
.cadre__annuel {
  margin-top: var(--esp-xl);
  padding-top: var(--esp-xl);
  border-top: var(--epaisseur-filet) solid var(--couleur-filet);
}
.cadre__annuel .cadre__texte:last-child { margin-bottom: 0; }
.cadre__sous-titre {
  margin: 0 0 var(--esp-sm);
  font-size: var(--taille-titre-xs);
}
@media (min-width: 768px) {
  .cadre { padding: var(--esp-5xl); }
}
@media (min-width: 992px) {
  .acces__grille {
    grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
    align-items: center;
    column-gap: var(--esp-6xl);
  }
}
.prix {
  position: relative;
  isolation: isolate;
}
.prix__cadran {
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 50%;
  display: none;
  width: 135%;
  aspect-ratio: 1;
  translate: -50% -50%;
  pointer-events: none;
}
.cadran-coffre {
  width: 100%;
  height: 100%;
  overflow: visible;
}
.cadran-coffre circle { fill: none; }
.cadran-coffre__orbite {
  stroke: var(--couleur-filet-marque);
  stroke-width: 0.5;
}
.cadran-coffre__graduations {
  stroke: var(--couleur-filet-marque);
  stroke-width: 3;
  stroke-dasharray: 0.6 4.112;
  transform-origin: 0 0;
}
.cadran-coffre__crans {
  stroke: var(--voile-accent-lisere);
  stroke-width: 6;
  stroke-dasharray: 2 18.42;
}
.cadran-coffre__anneau {
  stroke: var(--couleur-filet-marque);
  stroke-width: 0.6;
  stroke-dasharray: 2 3;
}
.cadran-coffre__molette {
  transform-origin: 0 0;
  transition: transform 1.2s var(--courbe-ressort);
}
.cadran-coffre .cadran-coffre__disque {
  fill: color-mix(in srgb, var(--couleur-fond-principal) 70%, transparent);
  stroke: var(--couleur-filet-marque);
  stroke-width: 0.8;
}
.cadran-coffre__poignee {
  fill: var(--couleur-filet-marque);
  transition: fill var(--duree-standard) var(--courbe-defaut);
}
.cadran-coffre .cadran-coffre__goupille {
  fill: var(--couleur-fond-principal);
  stroke: var(--voile-accent-lueur);
  stroke-width: 1.2;
  transition: fill var(--duree-standard) var(--courbe-defaut);
}
.prix:has(.serrure[data-goupilles="1"]) .cadran-coffre .cadran-coffre__goupille--1,
.prix:has(.serrure[data-goupilles="2"]) .cadran-coffre .cadran-coffre__goupille { fill: var(--couleur-accent); }
.prix:has(.offre.est-ouverte) .cadran-coffre__molette { transform: rotate(90deg); }
.prix:has(.offre.est-ouverte) .cadran-coffre__poignee { fill: var(--couleur-accent); }
.offre {
  position: relative;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  gap: var(--esp-xl);
  padding: var(--esp-3xl) var(--esp-lg);
  border: var(--epaisseur-filet) solid transparent;
  border-radius: var(--rayon-offre);
  background:
    radial-gradient(90% 50% at 100% 0%, var(--voile-accent-fond), transparent 70%) padding-box,
    var(--verre) padding-box,
    var(--bordure-degrade) border-box;
  box-shadow: 0 50px 120px -50px var(--voile-accent-lueur),
              var(--ombre-carte-avant);
}
.offre__lumiere {
  position: absolute;
  inset: -1px;
  z-index: 1;
  padding: 1.5px;
  border-radius: inherit;
  overflow: hidden;
  pointer-events: none;
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
}
.offre__lumiere > span {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 250%;
  aspect-ratio: 1;
  translate: -50% -50%;
  background: conic-gradient(from 0deg,
              transparent 0 55%,
              var(--voile-accent-lisere) 66%,
              var(--couleur-accent) 77%,
              var(--couleur-accent-survol) 81%,
              var(--couleur-bordure) 90%,
              transparent 100%);
  opacity: 0.9;
}
.offre__titre {
  margin: 0 0 var(--esp-3xs);
  font-size: var(--taille-titre-md);
  line-height: var(--interligne-titre);
}
.offre__sous-titre {
  margin: 0;
  font-size: var(--taille-dense);
}
.offre__prix {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0 var(--esp-xs);
  margin: var(--esp-xl) 0 var(--esp-lg);
}
.offre__montant {
  font-family: var(--police-titre);
  font-weight: var(--graisse-forte);
  font-size: clamp(4.25rem, 2.6rem + 6vw, 7rem);
  line-height: 0.92;
  letter-spacing: -0.05em;
  white-space: nowrap;
  color: var(--couleur-texte-principal);
  text-shadow: 0 0 60px var(--voile-accent-lueur);
}
.offre__periode {
  font-size: var(--taille-titre-xs);
  color: var(--couleur-texte-secondaire);
}
.offre__livrables {
  display: grid;
  gap: var(--esp-sm);
  margin: 0;
  padding: var(--esp-lg) 0 0;
  border-top: var(--epaisseur-filet) solid var(--couleur-filet);
  list-style: none;
}
.offre__livrables li {
  position: relative;
  padding-left: var(--esp-2xl);
  font-size: var(--taille-dense);
  line-height: var(--interligne-ui);
  color: var(--couleur-texte-secondaire);
}
.offre__livrables li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 1px;
  display: grid;
  place-items: center;
  width: 18px;
  height: 18px;
  border-radius: 4px;
  background: var(--voile-accent-fond);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--voile-accent-lisere);
  font-size: var(--taille-micro);
  font-weight: var(--graisse-forte);
  line-height: 1;
  color: var(--couleur-accent);
}
.serrure {
  padding: var(--esp-lg) var(--esp-md);
  border-radius: var(--rayon-bloc);
  background: var(--surface-relief-1);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--couleur-filet-marque);
  transition: box-shadow var(--duree-standard) var(--courbe-defaut);
}
.serrure.nudge { box-shadow: inset 0 0 0 1.5px var(--couleur-accent); }
.serrure__titre {
  display: flex;
  align-items: center;
  gap: var(--esp-sm);
  margin: 0 0 var(--esp-md);
  font-family: var(--police-technique);
  font-size: var(--taille-micro);
  letter-spacing: var(--approche-capitales-sm);
  line-height: var(--interligne-ui);
  text-transform: uppercase;
  color: var(--couleur-accent-survol);
}
.serrure__cadenas {
  position: relative;
  flex: none;
  width: 18px;
  height: 20px;
}
.serrure__cadenas::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 11px;
  border-radius: 3px;
  background: var(--couleur-accent);
}
.serrure__cadenas::after {
  content: "";
  position: absolute;
  left: 3px;
  bottom: 9px;
  width: 12px;
  height: 11px;
  border: 2px solid var(--couleur-accent);
  border-bottom: 0;
  border-radius: 7px 7px 0 0;
  transform-origin: 100% 100%;
  transition: transform 0.6s var(--courbe-ressort);
}
.serrure__cadenas i {
  position: absolute;
  z-index: 1;
  bottom: 4px;
  width: 4px;
  height: 4px;
  border-radius: var(--rayon-cercle);
  background: var(--couleur-fond-principal);
  transition: background var(--duree-standard) var(--courbe-defaut),
              transform var(--duree-standard) var(--courbe-ressort);
}
.serrure__cadenas i:nth-child(1) { left: 4px; }
.serrure__cadenas i:nth-child(2) { right: 4px; }
.serrure[data-goupilles="1"] .serrure__cadenas i:nth-child(1),
.serrure[data-goupilles="2"] .serrure__cadenas i {
  background: var(--couleur-texte-principal);
  transform: translateY(-1px);
}
.offre.est-ouverte .serrure__cadenas::after { transform: translateY(-3px) rotate(30deg); }
.serrure__cases {
  display: grid;
  gap: var(--esp-xs);
}
.serrure__label {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  align-items: start;
  gap: var(--esp-sm);
  padding: var(--esp-sm);
  border-radius: var(--rayon-carte);
  font-size: var(--taille-dense);
  line-height: var(--interligne-ui);
  color: var(--couleur-texte-secondaire);
  cursor: pointer;
  -webkit-user-select: none;
          user-select: none;
  transition: background var(--duree-rapide) var(--courbe-defaut),
              color var(--duree-rapide) var(--courbe-defaut);
}
.serrure__label:hover { color: var(--couleur-texte-principal); background: var(--voile-accent-fond); }
.serrure__label:has(.serrure__case:checked) {
  color: var(--couleur-texte-principal);
  background: var(--voile-accent-fond);
}
.serrure__case {
  appearance: none;
  -webkit-appearance: none;
  position: relative;
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  margin: 0;
  border-radius: 6px;
  background: transparent;
  box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--couleur-texte-secondaire) 70%, transparent);
  cursor: pointer;
  transition: background var(--duree-rapide) var(--courbe-defaut),
              box-shadow var(--duree-rapide) var(--courbe-defaut);
}
.serrure__case::before {
  content: "";
  width: 6px;
  height: 11px;
  margin-top: -3px;
  border-right: 2.5px solid var(--couleur-texte-principal);
  border-bottom: 2.5px solid var(--couleur-texte-principal);
  transform: rotate(45deg) scale(0);
  transition: transform 0.35s var(--courbe-ressort);
}
.serrure__case:checked {
  background: var(--couleur-accent);
  box-shadow: 0 0 16px var(--voile-accent-lueur);
}
.serrure__case:checked::before { transform: rotate(45deg) scale(1); }
.serrure__case:focus-visible { outline-offset: 3px; }
.offre__aimant {
  transform: translate(var(--aimant-x, 0px), var(--aimant-y, 0px));
  transition: transform 0.35s var(--courbe-sortie);
}
.offre__bouton {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  width: 100%;
  min-height: 4rem;
  padding: var(--esp-md) var(--esp-xl);
  border-radius: var(--rayon-bloc);
  font-size: 1.125rem;
  box-shadow: 0 16px 40px -14px var(--voile-accent-lueur);
}
.offre__bouton::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--couleur-surface-violette);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--couleur-bordure);
  border-radius: inherit;
  opacity: 0;
  transition: opacity 0.45s var(--courbe-defaut);
}
.page-vente .offre__bouton[aria-disabled="true"] {
  opacity: 1;
  cursor: not-allowed;
  color: var(--couleur-texte-secondaire);
  box-shadow: none;
}
.offre__bouton[aria-disabled="true"]::before { opacity: 1; }
.page-vente .offre__bouton[aria-disabled="true"]:hover { transform: none; }
.offre__bouton > span {
  display: inline-flex;
  align-items: center;
  gap: var(--esp-sm);
}
.offre__bouton[aria-disabled="true"] > span::before {
  content: "";
  flex: none;
  width: 14px;
  height: 16px;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 16'%3E%3Cpath d='M3.5 7.5V5a3.5 3.5 0 0 1 7 0v2.5' fill='none' stroke='%23000' stroke-width='2'/%3E%3Crect x='1' y='7' width='12' height='9' rx='2'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 16'%3E%3Cpath d='M3.5 7.5V5a3.5 3.5 0 0 1 7 0v2.5' fill='none' stroke='%23000' stroke-width='2'/%3E%3Crect x='1' y='7' width='12' height='9' rx='2'/%3E%3C/svg%3E") center / contain no-repeat;
}
@media (max-width: 359.98px) {
  .offre { padding-inline: var(--esp-md); }
  .serrure { padding-inline: var(--esp-sm); }
  .serrure__label { padding-inline: var(--esp-xs); }
  .offre__bouton { padding-inline: var(--esp-sm); font-size: var(--taille-corps); }
  .offre__bouton > span { gap: var(--esp-xs); }
}
.offre__indice {
  margin: calc(var(--esp-sm) * -1) 0 0;
  font-size: var(--taille-mention);
  line-height: var(--interligne-ui);
  text-align: center;
  color: var(--couleur-accent-survol);
}
.offre__note {
  margin: 0;
  padding-left: var(--esp-sm);
  border-left: var(--epaisseur-filet) solid var(--couleur-filet-marque);
  font-size: var(--taille-mention);
  line-height: var(--interligne-ui);
  color: var(--couleur-texte-secondaire);
}
.offre__note strong { color: var(--couleur-texte-principal); }
.offre__note--discrete {
  border-left-color: transparent;
  font-family: var(--police-technique);
  font-size: var(--taille-micro);
  letter-spacing: var(--approche-capitales-sm);
  opacity: var(--opacite-mention);
}
.offre__etoile {
  font-weight: var(--graisse-semi);
  color: var(--couleur-accent);
}
.offre__bas {
  display: flex;
  flex-direction: column;
  gap: var(--esp-md);
}
@media (min-width: 768px) {
  .offre { padding: var(--esp-5xl); }
  .serrure { padding: var(--esp-xl); }
}
@media (min-width: 992px) {
  .prix__cadran { display: block; }
}
.questions__grille {
  display: grid;
  gap: 0;
}
.questions__sous-titre {
  display: block;
  margin-top: var(--esp-md);
  font-family: var(--police-texte);
  font-weight: var(--graisse-normale);
  font-size: var(--taille-corps);
  line-height: var(--interligne-ui);
  letter-spacing: 0;
  color: var(--couleur-texte-secondaire);
}
.page-vente .faq {
  display: grid;
  gap: var(--esp-sm);
  max-width: none;
  margin: 0;
}
.page-vente .faq__item {
  position: relative;
  margin: 0;
  border: 0;
  border-radius: var(--rayon-bloc);
  background: var(--couleur-fond-alternatif);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--couleur-bordure);
  overflow: visible;
}
.page-vente .faq__item::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--voile-accent-lueur),
              0 0 40px var(--voile-accent-fond);
  opacity: 0;
  pointer-events: none;
  transition: opacity var(--duree-standard) var(--courbe-defaut);
}
.page-vente .faq__item[open]::after { opacity: 1; }
.page-vente .faq__question {
  position: relative;
  isolation: isolate;
  padding: var(--esp-lg) var(--esp-xl);
  border-radius: var(--rayon-bloc);
  list-style: none;
  font-size: var(--taille-corps);
}
.page-vente .faq__question::-webkit-details-marker { display: none; }
.page-vente .faq__question::marker { content: ""; }
.page-vente .faq__question::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  background: radial-gradient(80% 140% at 0% 50%, var(--voile-accent-fond), transparent 70%);
  opacity: 0;
  transition: opacity var(--duree-standard) var(--courbe-defaut);
}
.page-vente .faq__question:hover::before { opacity: 1; }
.page-vente .faq__question:focus-visible { outline-offset: calc(var(--rayon-focus) * -1); }
.page-vente .faq__item[open] .faq__question { color: var(--couleur-accent-survol); }
.page-vente .faq__signe {
  display: grid;
  place-items: center;
  width: 32px;
  height: 32px;
  border-radius: var(--rayon-cercle);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--voile-accent-lisere);
  font-size: var(--taille-micro);
  color: var(--couleur-accent);
  transition: transform var(--duree-standard) var(--courbe-ressort);
}
.page-vente .faq__item[open] .faq__signe { transform: rotate(180deg); }
.page-vente .faq__panneau {
  display: block;
  transition: none;
}
.page-vente .faq__reponse {
  padding: 0 var(--esp-xl) var(--esp-lg);
  font-size: var(--taille-dense);
}
.page-vente .faq__reponse:last-child { padding-bottom: var(--esp-xl); }
@media (min-width: 768px) {
  .page-vente .faq__question { font-size: var(--taille-titre-xs); padding: var(--esp-xl) var(--esp-3xl); }
  .page-vente .faq__reponse  { padding: 0 var(--esp-3xl) var(--esp-lg); }
  .page-vente .faq__reponse:last-child { padding-bottom: var(--esp-3xl); }
}
@media (min-width: 992px) {
  .questions__grille {
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    align-items: start;
    column-gap: var(--esp-6xl);
  }
  .questions__entete {
    position: sticky;
    top: var(--haut-collant);
  }
  .page-vente .questions__entete { margin-bottom: 0; }
}
.final {
  position: relative;
  isolation: isolate;
  overflow: clip;
}
.filigrane {
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 50%;
  width: min(54rem, 130vw);
  height: auto;
  translate: -50% -50%;
  overflow: visible;
  pointer-events: none;
}
.filigrane__barre,
.filigrane__module {
  transform-box: fill-box;
  transform-origin: center;
}
.filigrane__barre {
  fill: var(--couleur-texte-principal);
  opacity: 0.05;
  transform: rotate(-45deg);
}
.filigrane__module {
  fill: var(--couleur-accent);
  opacity: 0.16;
}
.recap {
  position: relative;
  max-width: 44rem;
  margin-inline: auto;
  padding: var(--esp-4xl) var(--esp-xl);
  border: var(--epaisseur-filet) solid transparent;
  border-radius: var(--rayon-offre);
  background:
    var(--verre) padding-box,
    var(--bordure-degrade) border-box;
  box-shadow: 0 50px 120px -50px var(--voile-accent-lueur),
              var(--ombre-carte-avant);
  text-align: center;
}
.recap__titre {
  margin: var(--esp-xs) 0 var(--esp-3xl);
  font-size: clamp(1.75rem, 1.2rem + 2vw, 2.5rem);
  line-height: var(--interligne-titre-xl);
  letter-spacing: -0.03em;
}
.recap__liste {
  display: grid;
  gap: var(--esp-sm);
  max-width: 30rem;
  margin: 0 auto var(--esp-3xl);
  padding: 0;
  list-style: none;
  text-align: left;
}
.recap__liste li {
  position: relative;
  padding-left: var(--esp-2xl);
  font-size: var(--taille-dense);
  line-height: var(--interligne-ui);
  color: var(--couleur-texte-secondaire);
}
.recap__liste li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 1px;
  display: grid;
  place-items: center;
  width: 18px;
  height: 18px;
  border-radius: 4px;
  background: var(--voile-accent-fond);
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--voile-accent-lisere);
  font-size: var(--taille-micro);
  font-weight: var(--graisse-forte);
  line-height: 1;
  color: var(--couleur-accent);
}
.recap__bouton {
  width: 100%;
  max-width: var(--largeur-element);
  min-height: 3.5rem;
  font-size: 1.125rem;
}
@media (max-width: 359.98px) {
  .recap__bouton { padding-inline: var(--esp-md); font-size: var(--taille-corps); }
}
.recap__note {
  margin: var(--esp-md) 0 0;
  font-family: var(--police-technique);
  font-size: var(--taille-micro);
  letter-spacing: var(--approche-capitales-sm);
  color: var(--couleur-texte-secondaire);
  opacity: var(--opacite-mention);
}
.sortie {
  display: grid;
  gap: var(--esp-xl);
  max-width: 56rem;
  margin: var(--esp-5xl) auto 0;
}
.sortie__item {
  padding: var(--esp-3xl) var(--esp-xl);
  border: var(--epaisseur-filet) dashed var(--couleur-filet-marque);
  border-radius: var(--rayon-bloc);
  text-align: center;
}
.sortie__titre {
  margin: 0 0 var(--esp-sm);
  font-size: var(--taille-titre-xs);
  line-height: var(--interligne-titre);
}
.sortie__texte {
  margin: 0 0 var(--esp-xl);
  font-size: var(--taille-dense);
}
@media (min-width: 768px) {
  .recap { padding: var(--esp-6xl) var(--esp-5xl); }
}
@media (min-width: 992px) {
  .sortie { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.page-vente .pied { border-top-color: var(--couleur-filet-marque); }
.pied__inner {
  display: grid;
  justify-items: center;
  gap: var(--esp-lg);
  text-align: center;
}
.page-vente .pied__logo {
  max-height: var(--logo-hauteur-entete);
  width: auto;
}
.pied__texte {
  max-width: 32.5rem;
  margin: 0;
  font-size: var(--taille-dense);
}
.page-vente .pied__nav {
  justify-content: center;
  margin-left: 0;
}
.page-vente .pied__nav .lien-nav { font-size: var(--taille-dense); }
.page-vente .pied__mention {
  margin: 0;
  font-size: var(--taille-mention);
}
html:has(.page-vente) { scroll-padding-bottom: var(--rythme-pied-degagement); }
.page-vente .bandeau {
  visibility: hidden;
  transition: none;
}
.page-vente .bandeau.est-visible { visibility: visible; }
.page-vente .bandeau__capsule {
  justify-content: center;
  padding: var(--esp-xs);
}
.bandeau__bouton {
  width: 100%;
  padding: var(--esp-sm) var(--esp-xl);
}
.page-vente .btn--primaire {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.page-vente .btn--primaire::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(110deg, transparent 35%, var(--couleur-voile-blanc) 50%, transparent 65%);
  transform: translateX(-100%);
  pointer-events: none;
}
@media (hover: hover) and (pointer: fine) {
  .page-vente .btn--primaire:not([aria-disabled="true"]):hover::after {
    transform: translateX(100%);
    transition: transform 0.7s var(--courbe-sortie);
  }
}
.page-vente .btn--secondaire {
  box-shadow: inset 0 0 0 var(--epaisseur-filet) var(--couleur-bordure);
}
.lien-trace { position: relative; }
.lien-trace::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: calc(var(--esp-4xs) * -1);
  height: var(--epaisseur-filet);
  background: currentColor;
  transform: scaleX(0);
  transform-origin: 0 50%;
  transition: transform var(--duree-standard) var(--courbe-defaut);
}
.lien-trace:hover::after,
.lien-trace:focus-visible::after { transform: scaleX(1); }
[data-inclinable] {
  --incl-max: 5deg;
  transition: transform var(--duree-standard) var(--courbe-defaut);
}
[data-inclinable]::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  left: 0;
  width: 26rem;
  height: 26rem;
  margin: -13rem 0 0 -13rem;
  border-radius: var(--rayon-cercle);
  background: radial-gradient(closest-side, var(--voile-accent-lisere), transparent);
  opacity: 0;
  transform: translate(var(--lueur-x, 50%), var(--lueur-y, 50%));
  transition: opacity var(--duree-standard) var(--courbe-defaut);
  pointer-events: none;
}
@media (hover: hover) and (pointer: fine) {
  [data-inclinable]:hover {
    transform: perspective(1000px)
               rotateX(calc(var(--incl-y, 0) * var(--incl-max) * -1))
               rotateY(calc(var(--incl-x, 0) * var(--incl-max)))
               translateY(var(--translation-carte));
  }
  [data-inclinable]:hover::before { opacity: 1; }
}
.systeme[data-inclinable] { --incl-max: 3deg; }
.progression__barre {
  width: 100%;
  transform-origin: 0 50%;
  transform: scaleX(var(--progression, 0));
  transition: none;
}
@media print {
  .atelier,
  .texture-motif,
  .texture-grain,
  .progression,
  .commande-pause,
  .burger,
  .bandeau,
  .desordre,
  .hero__module,
  .etabli,
  .machine-colonne,
  .envol,
  .tassement,
  .prix__cadran,
  .offre__lumiere,
  .filigrane,
  .vitrine__btn,
  .vitrine__reperes,
  .rayon__btn,
  .rayon__jauge,
  .constat__visuel,
  [data-inclinable]::before { display: none !important; }
  body,
  .section,
  .persona,
  .systeme,
  .constat,
  .verdict,
  .lettre,
  .etape,
  .perimetre__carte,
  .regle,
  .doute,
  .volet,
  .equation,
  .cadre,
  .offre,
  .serrure,
  .recap,
  .faq__item,
  .fiche-technique,
  .fiche-technique__cellule,
  .resultat {
    background: none !important;
    box-shadow: none !important;
  }
  body,
  h1, h2, h3, h4,
  p, li, div, span, strong, em, a, summary, figcaption, label {
    color: CanvasText !important;
    text-shadow: none !important;
  }
  .page-vente .entete { position: static; }
  .vitrine__piste,
  .rayon__piste {
    display: grid;
    overflow: visible;
    padding: 0;
  }
  .tambour > span:not(:first-child) { display: none; }
  .revele-attente,
  .hero__mots .mot,
  .hero__tagline,
  .hero__texte,
  .hero__signature,
  .confiance {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
  }
}
.hero__tagline,
.hero__signature,
.confiance {
  animation: monte 0.7s var(--courbe-sortie) both;
}
.hero__tagline   { animation-delay: 0ms; }
.hero__signature { animation-delay: 380ms; }
.confiance       { animation-delay: 520ms; }
.hero__mots .mot {
  animation: mot-monte 0.75s var(--courbe-sortie) both;
  animation-delay: calc(var(--i, 0) * 35ms + 60ms);
}
.hero__ligne--probleme > .mot:nth-child(2)  { --i: 1; }
.hero__ligne--probleme > .mot:nth-child(3)  { --i: 2; }
.hero__ligne--probleme > .mot:nth-child(4)  { --i: 3; }
.hero__ligne--probleme > .mot:nth-child(5)  { --i: 4; }
.hero__ligne--probleme > .mot:nth-child(6)  { --i: 5; }
.hero__ligne--solution > .mot:nth-child(1)  { --i: 6; }
.hero__ligne--solution > .mot:nth-child(2)  { --i: 7; }
.hero__ligne--solution > .mot:nth-child(3)  { --i: 8; }
.hero__ligne--solution > .mot:nth-child(4)  { --i: 9; }
.hero__ligne--solution > .mot:nth-child(5)  { --i: 10; }
.hero__ligne--solution > .mot:nth-child(6)  { --i: 11; }
.hero__ligne--solution > .mot:nth-child(7)  { --i: 12; }
.hero__cadre {
  animation: cadre-entree 1.2s var(--courbe-sortie) 100ms both;
}
.hero__visuel::before {
  animation: fondu 1.6s var(--courbe-defaut) 200ms both;
}
.hero__module::before {
  animation: module-pop 0.7s var(--courbe-ressort) both;
  animation-delay: var(--pop, 600ms);
}
.hero__module--1 { --pop: 520ms; }
.hero__module--2 { --pop: 640ms; }
.hero__module--3 { --pop: 700ms; }
.hero__module--4 { --pop: 820ms; }
.hero__module--5 { --pop: 900ms; }
@keyframes monte {
  from {
    opacity: 0;
    transform: translateY(var(--esp-xl));
  }
}
@keyframes mot-monte {
  from {
    opacity: 0;
    transform: perspective(600px) translateY(0.45em) rotateX(-55deg);
  }
}
@keyframes cadre-entree {
  from { scale: 0.93; }
}
@keyframes fondu {
  from { opacity: 0; }
}
@keyframes module-pop {
  from {
    opacity: 0;
    scale: 0.2;
  }
}
.revele-attente {
  opacity: 0;
  transform: translateY(var(--translation-apparition));
}
.revele {
  animation: reveler var(--duree-apparition) var(--courbe-defaut) var(--revele-delai, 0ms) backwards;
}
@keyframes reveler {
  from {
    opacity: 0;
    transform: translateY(var(--translation-apparition));
  }
}
.revele .titre-mots .mot {
  animation: mot-monte 0.85s var(--courbe-sortie)
             calc(var(--revele-delai, 0ms) + var(--i, 0) * 40ms + 120ms) backwards;
}
.persona__corps.revele .socle__icone {
  animation: socle 0.75s var(--courbe-ressort) calc(var(--revele-delai, 0ms) + 220ms) backwards;
}
@keyframes socle {
  from {
    opacity: 0;
    transform: translateY(18px) scale(0.6) rotate(-8deg);
  }
}
.perimetre__liste li:nth-child(2) { --n: 1; }
.perimetre__liste li:nth-child(3) { --n: 2; }
.perimetre__liste li:nth-child(4) { --n: 3; }
.perimetre__liste li:nth-child(5) { --n: 4; }
.perimetre__liste li:nth-child(6) { --n: 5; }
.perimetre__carte.revele .perimetre__liste li {
  animation: reveler 0.6s var(--courbe-sortie)
             calc(var(--revele-delai, 0ms) + var(--n, 0) * 70ms + 160ms) backwards;
}
.frise { --frise-depart: scaleY(0); }
.frise.revele::after {
  animation: frise-trait 1.4s var(--courbe-sortie) calc(var(--revele-delai, 0ms) + 150ms) backwards;
}
.frise__etape:nth-child(2) { --n: 1; }
.frise__etape:nth-child(3) { --n: 2; }
.frise__etape:nth-child(4) { --n: 3; }
.frise.revele .frise__noeud {
  animation: noeud 0.55s var(--courbe-ressort)
             calc(var(--revele-delai, 0ms) + var(--n, 0) * 180ms + 250ms) backwards;
}
.regle.revele::before {
  animation: noeud 0.55s var(--courbe-ressort) calc(var(--revele-delai, 0ms) + 200ms) backwards;
}
@keyframes frise-trait {
  from { transform: var(--frise-depart); }
}
@keyframes noeud {
  from {
    opacity: 0;
    transform: scale(0.3) rotate(-45deg);
  }
}
@media (min-width: 992px) {
  .frise { --frise-depart: scaleX(0); }
}
.page-vente .faq__item[open] .faq__reponse {
  animation: reponse 0.45s var(--courbe-sortie) both;
}
@keyframes reponse {
  from {
    opacity: 0;
    transform: translateY(calc(var(--esp-xs) * -1));
  }
}
.serrure.nudge {
  animation: secousse-serrure var(--duree-secousse) var(--courbe-defaut);
}
@keyframes secousse-serrure {
  0%, 100% { transform: translateX(0); }
  20%, 60% { transform: translateX(calc(var(--translation-secousse) * -1)); }
  40%, 80% { transform: translateX(var(--translation-secousse)); }
}
.offre.est-ouverte .offre__bouton::after {
  animation: deverrouille 1s var(--courbe-sortie) 120ms;
}
@keyframes deverrouille {
  from { transform: translateX(-100%); }
  to   { transform: translateX(100%); }
}
@media (prefers-reduced-motion: reduce) {
  .hero__tagline,
  .hero__signature,
  .confiance,
  .hero__mots .mot,
  .hero__cadre,
  .hero__visuel::before,
  .hero__module::before,
  .revele,
  .revele .titre-mots .mot,
  .persona__corps.revele .socle__icone,
  .perimetre__carte.revele .perimetre__liste li,
  .frise.revele::after,
  .frise.revele .frise__noeud,
  .regle.revele::before,
  .page-vente .faq__item[open] .faq__reponse,
  .serrure.nudge,
  .offre.est-ouverte .offre__bouton::after { animation: none; }
  .revele-attente {
    opacity: 1;
    transform: none;
  }
}
.tambour > span:nth-child(2) { --n: 1; }
.tambour > span:nth-child(3) { --n: 2; }
.tambour > span:nth-child(4) { --n: 3; }
.anime .tambour > span:nth-child(-n+4) {
  animation: tambour 10s var(--courbe-mots) infinite both;
  animation-delay: calc(var(--n, 0) * 2.5s - 0.6s);
}
@keyframes tambour {
  0%        { opacity: 0; transform: translateY(0.55em) rotateX(-80deg); }
  5%, 22%   { opacity: 1; transform: none; }
  27%, 100% { opacity: 0; transform: translateY(-0.55em) rotateX(80deg); }
}
.atelier__module::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: var(--couleur-accent);
  box-shadow: 0 0 28px var(--voile-accent-lueur);
  opacity: 0;
}
.atelier__module:nth-child(1)::after,
.atelier__module:nth-child(4)::after { opacity: 0.6; }
.atelier__module:nth-child(2) { --k: 3; }
.atelier__module:nth-child(3) { --k: 6; }
.atelier__module:nth-child(4) { --k: 1; }
.atelier__module:nth-child(5) { --k: 4; }
.atelier__module:nth-child(6) { --k: 7; }
.atelier__module:nth-child(7) { --k: 2; }
.atelier__module:nth-child(8) { --k: 5; }
.anime .atelier__module::after {
  animation: module-allume 9.6s ease-in-out infinite;
  animation-delay: calc(var(--k, 0) * -1.2s);
}
@keyframes module-allume {
  0%, 100% { opacity: 0; }
  6%       { opacity: 0.9; }
  20%      { opacity: 0; }
}
.hero__module--1 { --flot: 6.5s; }
.hero__module--2 { --flot: 8s; }
.hero__module--3 { --flot: 7.2s; }
.hero__module--4 { --flot: 5.8s; }
.hero__module--5 { --flot: 9s; }
.anime .hero__module::before {
  animation: module-pop 0.7s var(--courbe-ressort) var(--pop, 600ms) both,
             flotte var(--flot, 7s) ease-in-out var(--pop, 600ms) infinite alternate;
}
@keyframes flotte {
  from { translate: 0 -6px; rotate: -6deg; }
  to   { translate: 0 8px; rotate: 8deg; }
}
.desordre__baton:nth-of-type(even),
.desordre__module:nth-of-type(12) { --sens: -1; }
.desordre__baton:nth-of-type(2)  { --k: 1; }
.desordre__baton:nth-of-type(3)  { --k: 5; }
.desordre__baton:nth-of-type(4)  { --k: 2; }
.desordre__baton:nth-of-type(5)  { --k: 7; }
.desordre__baton:nth-of-type(6)  { --k: 3; }
.desordre__baton:nth-of-type(7)  { --k: 6; }
.desordre__baton:nth-of-type(8)  { --k: 4; }
.desordre__baton:nth-of-type(9)  { --k: 8; }
.desordre__baton:nth-of-type(10) { --k: 9; }
.desordre__module:nth-of-type(11) { --k: 2; }
.desordre__module:nth-of-type(12) { --k: 5; }
.desordre__module:nth-of-type(13) { --k: 8; }
.anime .desordre__baton,
.anime .desordre__module {
  animation: derive 15s ease-in-out infinite alternate;
  animation-delay: calc(var(--k, 0) * -1.7s);
}
@keyframes derive {
  from { transform: translate(0, 0) rotate(var(--r, 0deg)); }
  to   {
    transform: translate(calc(var(--sens, 1) * 14px), -10px)
               rotate(calc(var(--r, 0deg) + var(--sens, 1) * 11deg));
  }
}
.anime .slop::after { animation: slop 5s ease-in-out infinite; }
@keyframes slop {
  0%        { opacity: 0; transform: translateX(-100%); }
  12%       { opacity: 1; }
  55%       { opacity: 1; transform: translateX(100%); }
  56%, 100% { opacity: 0; transform: translateX(100%); }
}
.fil-casse__etincelle {
  transform-box: fill-box;
  transform-origin: center;
}
.anime .fil-casse__etincelle { animation: etincelle 2.6s steps(1, end) infinite; }
@keyframes etincelle {
  0%        { opacity: 1; }
  6%        { opacity: 0.15; }
  10%       { opacity: 1; }
  44%       { opacity: 0.1; }
  47%       { opacity: 0.9; }
  50%       { opacity: 0.2; }
  53%, 100% { opacity: 1; }
}
.anime .horloge__minutes { animation: aiguille-minutes 60s linear infinite; }
.anime .horloge__heures  { animation: aiguille-heures 720s linear infinite; }
@keyframes aiguille-minutes {
  from { transform: rotate(84deg); }
  to   { transform: rotate(444deg); }
}
@keyframes aiguille-heures {
  from { transform: rotate(67deg); }
  to   { transform: rotate(427deg); }
}
.anime .machine[data-etape="1"] .machine__choisi,
.anime .machine[data-etape="2"] .machine__lecture {
  animation: pouls 1.6s ease-in-out infinite;
}
@keyframes pouls {
  0%, 100% { scale: 1; }
  50%      { scale: 1.14; }
}
.anime .offre__lumiere > span { animation: tourne 8s linear infinite; }
.anime .cadran-coffre__graduations { animation: tourne 120s linear infinite; }
.cadran-coffre__crans { transform-origin: 0 0; }
.anime .cadran-coffre__crans { animation: tourne-inverse 160s linear infinite; }
@keyframes tourne {
  to { transform: rotate(1turn); }
}
@keyframes tourne-inverse {
  to { transform: rotate(-1turn); }
}
.est-en-pause .tambour > span,
.est-en-pause .atelier__module::after,
.est-en-pause .desordre__baton,
.est-en-pause .desordre__module,
.est-en-pause .slop::after,
.est-en-pause .fil-casse__etincelle,
.est-en-pause .horloge__heures,
.est-en-pause .horloge__minutes,
.est-en-pause .machine__choisi,
.est-en-pause .machine__lecture,
.est-en-pause .offre__lumiere > span,
.est-en-pause .cadran-coffre__graduations,
.est-en-pause .cadran-coffre__crans { animation-play-state: paused !important; }
.est-en-pause .hero__module::before { animation-play-state: running, paused !important; }
.hors-champ .tambour > span,
.hors-champ .atelier__module::after,
.hors-champ.atelier .atelier__module::after,
.hors-champ .desordre__baton,
.hors-champ .desordre__module,
.hors-champ .slop::after,
.hors-champ .fil-casse__etincelle,
.hors-champ .horloge__heures,
.hors-champ .horloge__minutes,
.hors-champ .machine__choisi,
.hors-champ .machine__lecture,
.hors-champ .offre__lumiere > span,
.hors-champ .cadran-coffre__graduations,
.hors-champ .cadran-coffre__crans { animation-play-state: paused !important; }
.hors-champ .hero__module::before { animation-play-state: running, paused !important; }
@media (prefers-reduced-motion: reduce) {
  .tambour > span,
  .atelier__module::after,
  .hero__module::before,
  .desordre__baton,
  .desordre__module,
  .slop::after,
  .fil-casse__etincelle,
  .horloge__heures,
  .horloge__minutes,
  .machine__choisi,
  .machine__lecture,
  .offre__lumiere > span,
  .cadran-coffre__graduations,
  .cadran-coffre__crans { animation: none !important; }
}
@supports (animation-timeline: view()) {
  .progression__barre {
    animation: progression linear both;
    animation-timeline: scroll(root block);
  }
  .atelier__halo--violet {
    animation: halo-profondeur linear both;
    animation-timeline: scroll(root block);
    animation-range: 0px 1000px;
  }
  .fondateur { view-timeline: --fondateur block; }
  .etabli { view-timeline: --etabli block; }
  .piece--barre  { --range: translate(0px, 0px) rotate(-45deg); }
  .piece--module { --range: translate(0px, 0px) rotate(0deg); }
  .piece--barre,
  .piece--module {
    animation: ranger linear both;
    animation-timeline: --etabli;
    animation-range: entry 35% cover 60%;
  }
  .piece--rebut {
    animation: rebut linear both;
    animation-timeline: --etabli;
    animation-range: entry 35% cover 60%;
  }
  .lettre::after {
    animation: fil-lecture linear both;
    animation-timeline: view();
    animation-range: contain 0% contain 100%;
  }
  .verdict__ligne,
  .verdict__suite {
    animation: allume linear both;
    animation-timeline: view();
    animation-range: entry 70% cover 48%;
  }
  .vitrine-section { view-timeline: --vitrine block; }
  .vitrine__piste {
    animation: porte-coffre linear both;
    animation-timeline: --vitrine;
    animation-range: entry 0% cover 38%;
  }
  .capture {
    animation: carrousel-3d linear both;
    animation-timeline: view(inline);
  }
  .evolution { view-timeline: --evolution block; }
  .envol__icone {
    animation: envol linear both;
    animation-timeline: --evolution;
    animation-range: entry 0% exit 100%;
  }
  .cout { view-timeline: --cout block; }
  .tassement__pile > span {
    animation: tasse linear both;
    animation-timeline: --cout;
    animation-range: entry 55% cover 62%;
  }
  .tassement__fichiers > span {
    animation: fichiers linear both;
    animation-timeline: --cout;
    animation-range: entry 60% cover 64%;
  }
  .tassement__module > span {
    animation: module-naissance linear both;
    animation-timeline: --cout;
    animation-range: entry 70% cover 66%;
  }
  .filigrane {
    animation: filigrane linear both;
    animation-timeline: view();
    animation-range: entry 0% cover 50%;
  }
}
@supports (animation-timeline: view()) {
  @media (min-width: 992px) {
    .piece--barre,
    .piece--module,
    .piece--rebut {
      animation-timeline: --fondateur;
      animation-range: cover 14% cover 52%;
    }
    .hero__visuel {
      animation: visuel-profondeur linear both;
      animation-timeline: scroll(root block);
      animation-range: 0px 900px;
    }
  }
}
@keyframes progression {
  from { transform: scaleX(0); }
  to   { transform: scaleX(1); }
}
@keyframes halo-profondeur {
  to { translate: 0 140px; }
}
@keyframes visuel-profondeur {
  to { translate: 0 -48px; }
}
@keyframes ranger {
  from { transform: var(--desordre); }
  to   { transform: var(--range); }
}
@keyframes rebut {
  from { transform: var(--desordre); opacity: 0.75; }
  60%  { opacity: 0.6; }
  to   { transform: var(--envol); opacity: 0; }
}
@keyframes fil-lecture {
  from { transform: scaleY(0); }
}
@keyframes allume {
  from {
    opacity: 0.16;
    transform: translateY(0.3em);
  }
}
@keyframes porte-coffre {
  from {
    opacity: 0.5;
    transform: perspective(1600px) rotateX(16deg) scale(0.94);
  }
}
@keyframes carrousel-3d {
  0%   { opacity: 0.5; transform: rotateY(32deg) scale(0.86); }
  50%  { opacity: 1; transform: rotateY(0deg) scale(1); }
  100% { opacity: 0.5; transform: rotateY(-32deg) scale(0.86); }
}
@keyframes envol {
  from { translate: 0 calc(var(--v, 1) * 70px); }
  to   { translate: 0 calc(var(--v, 1) * -70px); }
}
@keyframes tasse {
  from { transform: var(--desordre); opacity: 0.55; }
  to   { transform: translate(0, 0) rotate(0deg); opacity: 1; }
}
@keyframes fichiers {
  from { opacity: 0; translate: 0 16px; }
}
@keyframes module-naissance {
  from { opacity: 0.25; transform: scale(0.4) rotate(-45deg); }
}
@keyframes filigrane {
  from { scale: 0.86; opacity: 0.4; }
}
@media (prefers-reduced-motion: reduce) {
  .progression__barre,
  .atelier__halo--violet,
  .hero__visuel,
  .piece--barre,
  .piece--module,
  .piece--rebut,
  .lettre::after,
  .verdict__ligne,
  .verdict__suite,
  .vitrine__piste,
  .capture,
  .envol__icone,
  .tassement__pile > span,
  .tassement__fichiers > span,
  .tassement__module > span,
  .filigrane { animation: none !important; }
  .progression { display: none; }
}
