@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('/assets/fonts/inter-latin-wght-normal.woff2') format('woff2');
}
@font-face {
  font-family: 'Inter';
  font-style: italic;
  font-weight: 100 900;
  font-display: swap;
  src: url('/assets/fonts/inter-latin-wght-italic.woff2') format('woff2');
}

:root,
:root[data-theme="dark"] {
  color-scheme: dark;
  --avert: #E0A65B;
  --avert-fond: #221A0E;
  --avert-trait: rgba(224, 166, 91, .28);

  --papier-2: #0A0A0B;
  --papier: #0C0C0C;
  --papier-3: #181818;
  --cadre: #111111;

  --trait: rgba(177, 177, 177, .11);
  --trait-fort: rgba(177, 177, 177, .21);

  --encre: #F5F5F7;
  --encre-2: #C7C7CB;
  --encre-3: #A6A6AD;

  --bleu: #FF8533;
  --bleu-vif: #FF9D5C;
  --bleu-clair: #FFAF78;

  --action: #FF8533;
  --action-vive: #FF9D5C;
  --sur-action: #1A0D04;
  --sur-clair: #0C0C0C;
  --sur-clair-fond: rgba(255, 255, 255, .06);

  --voile-1: rgba(255, 255, 255, .03);
  --voile-2: rgba(255, 255, 255, .055);
  --voile-3: rgba(255, 255, 255, .085);
  --voile-4: rgba(255, 255, 255, .12);
  --voile-entete: rgba(10, 10, 11, 0);
  --voile-entete-collee: rgba(10, 10, 11, .78);
  --bord-defile: rgba(10, 10, 11, .9);

  --lavis-1: #1B1B1B;
  --lavis-2: #1F1F1F;
  --lavis-3: #161616;

  --vert: #28C840;
  --rouge: #FF7A6E;

  --r-s: 12px;
  --r-l: 20px;
  --r-xl: 28px;
  --r-pill: 12px;

  --entete-h: 76px;
  --pas: clamp(64px, 7vw, 112px);
  --pas-bas: clamp(64px, 7.5vw, 120px);
  --large: 1180px;
  --etroit: 680px;

  --ombre-1: 0 1px 2px rgba(0, 0, 0, .5);
  --ombre-2: 0 10px 30px -14px rgba(0, 0, 0, .8);
  --ombre-3: 0 40px 90px -50px rgba(0, 0, 0, .95), 0 2px 10px -4px rgba(0, 0, 0, .6);

  --anneau: 0 0 0 1px rgba(255, 255, 255, .11);

  --verre-fin: blur(10px) saturate(150%);
  --verre-moyen: blur(16px) saturate(160%);
  --verre-epais: blur(26px) saturate(170%);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  margin: 0;
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  background: var(--papier-2);
  color: var(--encre);
  font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 16px;
  line-height: 1.6;
  letter-spacing: -0.006em;
  font-feature-settings: 'cv11', 'ss03';
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}

img, svg, canvas { display: block; max-width: 100%; }
[hidden] { display: none !important; }
a { color: inherit; text-decoration: none; }
::selection { background: rgba(255,133,51, .38); color: #fff; }
:focus-visible { outline: 2px solid var(--bleu-clair); outline-offset: 3px; border-radius: 6px; }

html:not(.js) [data-anim],
html:not(.js) [data-stagger] > * { opacity: 1 !important; transform: none !important; }

#fond {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: var(--papier-2);
}

body > header, body > section, body > footer, body > main {
  position: relative;
  z-index: 1;
}

[data-lueur] {
  position: relative;
  isolation: isolate;
  overflow-x: clip;
}
@supports not (overflow: clip) {
  [data-lueur] { overflow-x: hidden; }
}
.nappe {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(-1 * var(--entete-h));
  height: 1040px;
  z-index: -1;
  pointer-events: none;
  overflow: hidden;
  -webkit-mask-image: radial-gradient(1460px 1020px at 17% -6%, #000 24%, rgba(0, 0, 0, .66) 48%, rgba(0, 0, 0, .26) 68%, transparent 86%);
  mask-image: radial-gradient(1460px 1020px at 17% -6%, #000 24%, rgba(0, 0, 0, .66) 48%, rgba(0, 0, 0, .26) 68%, transparent 86%);
  will-change: transform;
}
.nappe-toile {
  position: absolute;
  inset: 0;
  opacity: .001;
  will-change: opacity;
  transition: none;
}
.nappe-toile.prete { opacity: 1; }
@media (prefers-reduced-motion: reduce) { .nappe-toile { transition: none; } }
.nappe[data-affiche] { background-repeat: no-repeat; background-position: 50% 0; background-size: 2560px 1040px; }
.nappe[data-affiche="accueil"] { background-image: url(/assets/nappe/accueil.webp?v=20260920-sans-grain-2); }
.nappe[data-affiche="applications"] { background-image: url(/assets/nappe/applications.webp?v=20260920-sans-grain-2); }
.nappe[data-affiche="telecharger"] { background-image: url(/assets/nappe/telecharger.webp?v=20260920-sans-grain-2); }
.nappe[data-affiche="tarifs"] { background-image: url(/assets/nappe/tarifs.webp?v=20260920-sans-grain-2); }
.nappe[data-affiche="cgv"] { background-image: url(/assets/nappe/cgv.webp?v=20260920-sans-grain-2); }
.nappe[data-affiche="conditions"] { background-image: url(/assets/nappe/conditions.webp?v=20260920-sans-grain-2); }
.nappe[data-affiche="confidentialite"] { background-image: url(/assets/nappe/confidentialite.webp?v=20260920-sans-grain-2); }
.nappe[data-affiche="mentions-legales"] { background-image: url(/assets/nappe/mentions-legales.webp?v=20260920-sans-grain-2); }
.nappe[data-affiche="compte"] { background-image: url(/assets/nappe/compte.webp?v=20260920-sans-grain-2); }
.nappe[data-affiche="houdini"] { background-image: url(/assets/nappe/houdini.webp?v=20260930-logiciels); }
.nappe[data-affiche="maya"] { background-image: url(/assets/nappe/maya.webp?v=20260930-logiciels); }
.nappe[data-affiche="blender"] { background-image: url(/assets/nappe/blender.webp?v=20260930-logiciels); }

.wrap { width: min(100% - 48px, var(--large)); margin-inline: auto; }
.wrap.tres-large { width: min(100% - 48px, 1560px); }
.etroit { max-width: var(--etroit); margin-inline: auto; }
section { padding-top: var(--pas); padding-bottom: var(--pas-bas); }
main { flex: 1 0 auto; }
.centre { text-align: center; }
.acte { background: transparent; }

h1, h2, h3, h4 { margin: 0; font-weight: 500; }

.display {
  font-size: clamp(2.6rem, 5.6vw, 4.5rem);
  line-height: 1.03;
  letter-spacing: -0.038em;
  font-weight: 500;
  text-wrap: balance;
}
.titre {
  font-size: clamp(1.9rem, 3.4vw, 2.85rem);
  line-height: 1.08;
  letter-spacing: -0.032em;
  font-weight: 500;
  text-wrap: balance;
}
.titre-s {
  font-size: 1.1rem;
  line-height: 1.3;
  letter-spacing: -0.014em;
  font-weight: 500;
}
.sous-titre {
  font-size: clamp(1rem, 1.15vw, 1.075rem);
  line-height: 1.62;
  letter-spacing: -0.004em;
  color: var(--encre-2);
  font-weight: 400;
  text-wrap: pretty;
}
.display + .sous-titre,
.titre + .sous-titre {
  margin-top: 18px;
  font-size: clamp(1.04rem, 1.35vw, 1.2rem);
  line-height: 1.55;
  letter-spacing: -0.006em;
  font-weight: 400;
}

.legende {
  font-size: 12.5px;
  line-height: 1.5;
  letter-spacing: 0;
  font-weight: 450;
  color: var(--encre-3);
}
.legende:has(+ .titre),
.legende:has(+ h2) {
  display: block;
  margin: 0;
  font-size: 15px;
  font-weight: 500;
  letter-spacing: -0.01em;
  color: var(--encre-2);
}
.legende:has(+ .titre) + .titre,
.legende:has(+ h2) + h2 { margin-top: 10px !important; }

.centre > .titre + .sous-titre { max-width: 60ch; margin-inline: auto; }
p { margin: 0 0 1em; }
p:last-child { margin-bottom: 0; }
strong { font-weight: 600; color: var(--encre); }
small { font-size: 13px; }

.degrade, .degrade.d1, .degrade.d2, .degrade.d3, .degrade.d4, .degrade.d5 {
  background: none;
  -webkit-background-clip: initial;
  background-clip: initial;
  -webkit-text-fill-color: currentColor;
  color: inherit;
}
.mot { display: inline-block; white-space: pre; }

.btn {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 9px;
  padding: 12px 22px;
  border-radius: var(--r-pill);
  border: 1px solid transparent;
  font: inherit;
  font-size: 14.5px;
  font-weight: 500;
  line-height: 1.25;
  letter-spacing: -0.01em;
  cursor: pointer;
  text-align: center;
  white-space: nowrap;
  transition: transform .12s ease-out, background-color .2s, border-color .2s,
              box-shadow .25s, color .2s, opacity .2s;
}
.btn:active { transform: scale(.975); }
.btn[disabled], .btn[aria-disabled="true"] { cursor: default; opacity: .55; }
.btn[disabled]:active { transform: none; }

.btn-1 {
  background-color: var(--action);
  color: var(--sur-action);
  border-color: transparent;
}
.btn-1:hover { background-color: var(--action-vive); }
.btn-1[disabled]:hover { background-color: var(--action); }

.btn-2 {
  background-color: transparent;
  border-color: rgba(255, 255, 255, .22);
  color: var(--encre);
}
.btn-2:hover { background-color: rgba(255, 255, 255, .06); border-color: rgba(255, 255, 255, .34); }
.chip, .langbtn { position: relative; }

.btn-3 { padding-inline: 6px; color: var(--encre-2); background: transparent; }
.btn-3:hover { color: var(--encre); }
.btn-bloc { width: 100%; }
.btn-l { padding: 14px 26px; font-size: 15px; }
.btn-s { padding: 11px 20px; font-size: 14.5px; }

.lien-fleche {
  font-size: 15px;
  font-weight: 500;
  color: var(--bleu-clair);
  border-bottom: 1px solid transparent;
  transition: border-color .18s, color .18s;
}
.lien-fleche::after { content: ' ›'; }
.lien-fleche:hover { color: #FFBD8A; border-color: currentColor; }

.lienbtn {
  border: 0;
  background: transparent;
  color: var(--encre-2);
  font: inherit;
  font-size: 13.5px;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: var(--trait-fort);
}
.lienbtn:hover { color: var(--encre); text-decoration-color: currentColor; }

.chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 5px 11px;
  border-radius: 8px;
  border: 1px solid var(--trait-fort);
  background: rgba(255, 255, 255, .03);
  font-size: 13px;
  font-weight: 500;
  letter-spacing: -0.004em;
  color: var(--encre-2);
}
.chip.sombre { border-color: var(--trait-fort); background: rgba(255, 255, 255, .03); color: var(--encre-2); }
.chip .pt {
  width: 6px;
  height: 6px;
  flex: none;
  border-radius: 50%;
  background: var(--vert);
}
.hero .chip,
.bandeau .chip {
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  font-size: 14px;
  color: var(--encre-3);
}
.hero .chip .pt,
.bandeau .chip .pt { display: none; }
.chip.plan { background: rgba(119, 119, 119, .12); border-color: rgba(155, 155, 155, .32); color: var(--encre); }
.chip.chip-fin { border-color: var(--avert); color: var(--avert); }
.chip.ok { background: rgba(40, 200, 64, .10); border-color: rgba(40, 200, 64, .28); color: var(--vert); }
.chip.warn { background: rgba(251, 191, 36, .10); border-color: rgba(251, 191, 36, .28); color: #FBBF24; }

.dcc { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.dcc span {
  padding: 8px 16px;
  border-radius: var(--r-pill);
  border: 1px solid var(--trait);
  background: rgba(255, 255, 255, .025);
  font-size: 14px;
  font-weight: 450;
  color: var(--encre-2);
  transition: border-color .2s, color .2s;
}
.dcc span:hover { color: var(--encre); border-color: var(--trait-fort); }

.entete {
  position: sticky;
  top: 0;
  z-index: 60;
  height: var(--entete-h);
  display: flex;
  align-items: center;
  padding-block: 0;
  background: var(--voile-entete);
  border-bottom: 1px solid transparent;
  transition: background-color .35s ease, border-color .35s ease, box-shadow .35s ease;
}
.entete.collee {
  background: var(--voile-entete-collee);
  -webkit-backdrop-filter: var(--verre-epais);
  backdrop-filter: var(--verre-epais);
  border-bottom-color: var(--trait);
}
@supports (animation-timeline: scroll()) {
  .entete {
    animation: entete-voile linear both;
    animation-timeline: scroll(root block);
    animation-range: 0 14px;
  }
  @keyframes entete-voile {
    from {
      background-color: var(--voile-entete);
      border-bottom-color: transparent;
    }
    to {
      background-color: var(--voile-entete-collee);
      border-bottom-color: var(--trait);
      -webkit-backdrop-filter: var(--verre-epais);
      backdrop-filter: var(--verre-epais);
    }
  }
}
.entete .wrap {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 20px;
  width: min(100% - 48px, 1280px);
}
.entete .menu a, .entete .outils .btn, .entete .langbtn, .entete .marque { white-space: nowrap; }
.entete .marque { justify-self: start; }
.entete .menu { justify-self: center; margin-inline: 0; }
.entete .outils { justify-self: end; }

.marque {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-weight: 500;
  font-size: 18px;
  letter-spacing: -0.03em;
  color: var(--encre);
}
.marque img { width: 30px; height: 30px; }

.menu {
  display: flex;
  align-items: center;
  gap: 2px;
  margin-inline: auto;
  padding: 5px;
  border-radius: var(--r-pill);
  border: 1px solid transparent;
  background: transparent;
}
.menu a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 17px;
  border-radius: 8px;
  font-size: 14.5px;
  font-weight: 450;
  color: var(--encre-2);
  transition: color .18s, background-color .18s;
}
.menu a:hover { color: var(--encre); background: rgba(255, 255, 255, .05); }
.menu a.on {
  color: var(--encre);
  font-weight: 500;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 7px;
  text-decoration-color: var(--action);
}

.outils { display: flex; align-items: center; gap: 10px; }
.langbtn {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 13px;
  border-radius: var(--r-pill);
  border: 1px solid transparent;
  background: transparent;
  color: var(--encre-2);
  font: inherit;
  font-size: 14px;
  cursor: pointer;
  transition: color .18s, border-color .18s, background-color .18s;
}
.langbtn:hover { color: var(--encre); border-color: var(--trait); background: rgba(255, 255, 255, .03); }
.langbtn svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.7; }

.entete .btn-2,
.entete .langbtn {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
.entete #ctaAuth {
  padding: 10px 20px;
  background-color: var(--action);
  border-color: transparent;
  color: var(--sur-action);
}
.entete #ctaAuth:hover { background-color: var(--action-vive); }
.entete #ctaAuth::before { display: none; }

.navbord { font-size: 13px; color: var(--encre-3); }

.langmenu {
  position: fixed;
  z-index: 200;
  display: none;
  min-width: 184px;
  padding: 6px;
  border-radius: 16px;
  border: 1px solid var(--trait-fort);
  background: rgba(13, 13, 13, .88);
  -webkit-backdrop-filter: blur(22px) saturate(160%);
  backdrop-filter: blur(22px) saturate(160%);
  box-shadow: 0 12px 24px -12px rgba(0, 0, 0, .8), 0 0 0 1px rgba(0, 0, 0, .4);
}
.langmenu.open { display: block; }
.langopt {
  display: block;
  width: 100%;
  text-align: left;
  padding: 9px 12px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--encre-2);
  font: inherit;
  font-size: 14px;
  cursor: pointer;
}
.langopt:hover { background: rgba(255, 255, 255, .05); color: var(--encre); }
.langopt.on, .langopt[aria-current="true"] {
  color: var(--encre);
  font-weight: 500;
  background: rgba(119, 119, 119, .14);
}
.langopt.on::after { content: '✓'; float: right; color: var(--bleu-clair); }

.comptemenu {
  min-width: 220px;
  max-width: calc(100vw - 16px);
  background: #141414;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
.comptemenu-qui { display: grid; gap: 2px; padding: 8px 12px 10px; }
.comptemenu-qui b,
.comptemenu-qui span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.comptemenu-qui b { font-size: 14px; font-weight: 500; color: var(--encre); }
.comptemenu-qui span { font-size: 13px; color: var(--encre-3); }
.comptemenu-trait { height: 1px; margin: 6px 8px; background: var(--trait); }
.comptemenu .langopt { display: flex; align-items: center; }
.comptemenu a.langopt { color: var(--encre-2); text-decoration: none; }
.comptemenu a.langopt:hover { color: var(--encre); }
@media (max-width: 760px), (hover: none) and (pointer: coarse) {
  .comptemenu .langopt { min-height: 44px; }
}

.megamenu {
  position: fixed;
  left: 0;
  right: 0;
  z-index: 150;
  background: rgba(9, 9, 9, .9);
  -webkit-backdrop-filter: blur(28px) saturate(170%);
  backdrop-filter: blur(28px) saturate(170%);
  border-bottom: 1px solid var(--trait);
  clip-path: inset(0 0 100% 0);
  transform: translateY(-6px);
  opacity: 0;
  transition: clip-path .32s cubic-bezier(.32, .72, .35, 1),
              transform .32s cubic-bezier(.32, .72, .35, 1),
              opacity .22s ease;
}
.megamenu.ouvert { clip-path: inset(0 0 0 0); transform: none; opacity: 1; }
.mega-dedans { width: min(100% - 48px, var(--large)); margin-inline: auto; padding: 30px 0 26px; }
.mega-titre {
  margin: 0 0 18px;
  font-size: 12px;
  font-weight: 500;
  color: var(--encre-3);
}
.mega-fam {
  margin: 22px 0 10px;
  font-size: 12px;
  font-weight: 500;
  color: var(--encre-3);
}
.mega-dedans > .mega-fam:first-child { margin-top: 4px; }
.mega-grille {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(4, auto);
  gap: 0 clamp(18px, 3vw, 44px);
}
.mega-col {
  display: grid;
  grid-row: span 4;
  grid-template-rows: subgrid;
  gap: 6px;
  align-content: start;
  padding: 18px;
  border-radius: var(--r-l);
  border: 1px solid transparent;
  transition: border-color .2s, background-color .2s;
}
.mega-col:hover { border-color: var(--trait); background: rgba(255, 255, 255, .02); }
@supports not (grid-template-rows: subgrid) {
  .mega-grille { grid-template-rows: none; }
  .mega-col { grid-row: auto; display: flex; flex-direction: column; gap: 6px; }
}
.mega-app { display: flex; align-items: center; gap: 12px; }
.mega-app b { font-size: clamp(17px, 1.5vw, 20px); font-weight: 500; letter-spacing: -0.02em; }
.mega-ic {
  width: 42px;
  height: 42px;
  border-radius: var(--r-s);
  display: grid;
  place-items: center;
  background: var(--papier-3);
  box-shadow: inset 0 0 0 1px var(--trait);
}
.mega-dit { font-size: 13.5px; color: var(--encre-2); line-height: 1.5; margin-bottom: 6px; max-width: 34ch; }
.mega-lien {
  justify-self: start;
  font-size: 13.5px;
  font-weight: 500;
  color: var(--encre-2);
  border: 0;
  background: transparent;
  padding: 0;
  cursor: pointer;
  font-family: inherit;
  transition: color .16s;
}
.mega-lien::after { content: ' ›'; }
.mega-lien:hover { color: var(--encre); }
.mega-tester { color: var(--bleu-clair); }
.mega-tester:hover { color: #FFBD8A; }
.mega-tout {
  display: inline-block;
  margin-top: 22px;
  padding-top: 18px;
  border-top: 1px solid var(--trait);
  width: 100%;
  font-size: 13.5px;
  font-weight: 500;
  color: var(--encre-2);
}
.mega-tout:hover { color: var(--encre); }
.mega-logiciels { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 22px; margin-top: 22px; padding-top: 18px; border-top: 1px solid var(--trait); }
.mega-logiciels > span { font-size: 13px; color: var(--encre-2); margin-right: 4px; }
.mega-logiciels a { display: inline-flex; align-items: center; gap: 9px; min-height: 44px; color: var(--encre); text-decoration: none; }
.mega-logiciels a b { font-size: 15px; font-weight: 500; }
.mega-logiciels a:hover b { text-decoration: underline; text-underline-offset: 4px; }
.mega-logiciels img { width: 22px; height: 22px; object-fit: contain; }
@media (max-width: 760px) {
  .mega-grille { grid-template-columns: 1fr; grid-template-rows: none; gap: 10px; }
  .mega-col { grid-row: auto !important; padding: 12px 0; }
  .mega-fam { margin: 18px 0 8px; }
}
body.mega-ouvert main,
body.mega-ouvert .pied { filter: blur(7px); opacity: .5; }
main, .pied { transition: filter .28s ease, opacity .28s ease; }
@media (prefers-reduced-motion: reduce) {
  .megamenu { transition: opacity .15s ease; }
  main, .pied { transition: none; }
  body.mega-ouvert main, body.mega-ouvert .pied { filter: none; opacity: .5; }
}

.hero {
  text-align: center;
  padding-block: clamp(56px, 9svh, 112px) clamp(40px, 6svh, 72px);
}
.hero .display { margin: 22px auto 0; max-width: min(100%, 1000px); font-size: clamp(2.6rem, 5vw, 4.25rem); }
.hero .sous-titre {
  margin: clamp(18px, 2vw, 26px) auto 0;
  max-width: var(--etroit);
  text-wrap: balance;
}
.hero .actions { margin-top: 32px; }
.actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }
.hero-note {
  margin: 16px 0 0;
  font-size: 13px;
  color: var(--encre-3);
}

.hero.hero-duo { text-align: left; padding-block: clamp(32px, 5svh, 56px) 56px; overflow: clip; }
.hero-duo .wrap { width: min(100% - 96px, 1920px); }
.hero-duo .hero-grille {
  display: grid;
  grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  grid-template-rows: 1fr repeat(2, auto) 1fr;
  column-gap: clamp(32px, 3vw, 64px);
  align-items: start;
}
.hero-duo .hero-grille > * { grid-column: 1; }
.hero-duo .hero-grille > :nth-child(1) { grid-row: 2; }
.hero-duo .hero-grille > :nth-child(2) { grid-row: 3; }
.hero-duo .hero-grille > .hero-visuel { grid-column: 2; grid-row: 1 / -1; align-self: center; }
.hero-duo .display {
  margin: 0;
  max-width: none;
  font-size: clamp(2.8rem, 4.3vw, 5.8rem);
  line-height: 1.04;
  letter-spacing: -.04em;
  text-wrap: balance;
}
.hero-duo .sous-titre {
  margin: 24px 0 0;
  max-width: 40ch;
  font-size: clamp(1rem, 1.2vw, 1.2rem);
  color: #E1D9D2;
  line-height: 1.65;
  text-wrap: pretty;
}

.hero-visuel {
  position: relative;
  height: clamp(600px, calc(100svh - 180px), 840px);
  width: clamp(1200px, 86vw, 1840px);
  overflow: hidden;
  border-radius: 22px 0 0 0;
  mask-image: linear-gradient(#000 90%, transparent);
}
.hero-cadre {
  margin: 0;
  padding: 0;
  border-radius: 22px 0 0 0;
  background: var(--cadre);
  line-height: 0;
}
.hero-cadre img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 22px 0 0 0;
}
@media (min-width: 1101px) {
  .hero-duo .hero-visuel {
    --hero-decalage: clamp(72px, 10svh, 120px);
    margin-top: var(--hero-decalage);
    height: calc(clamp(600px, calc(100svh - 180px), 840px) - var(--hero-decalage));
  }
}
@media (max-width: 1100px) {
  .hero.hero-duo { text-align: left; }
  .hero-duo .wrap { width: min(100% - 48px, 820px); }
  .hero-duo .hero-grille { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; }
  .hero-duo .hero-grille > * { grid-column: 1; grid-row: auto !important; }
  .hero-duo .hero-grille > .hero-visuel { grid-column: 1; margin-top: clamp(48px, 8vw, 72px); }
  .hero-duo .display { margin-inline: 0; max-width: 18ch; text-wrap: balance; font-size: clamp(2.25rem, 7.4vw, 3.7rem); }
  .hero-duo .sous-titre { margin-inline: 0; text-wrap: pretty; }
  .hero-visuel { width: max(1000px, 120vw); height: clamp(440px, 62vw, 640px); }
  .hero-cadre, .hero-cadre img { border-radius: 18px 0 0 0; }
}
@media (max-width: 600px) {
  .hero.hero-duo { padding-block: 40px 28px; }
  .hero-duo .hero-grille > .hero-visuel { margin-top: 36px; }
  .hero-duo .display { font-size: clamp(2.25rem, 8.7vw, 3.3rem); }
  .hero-visuel { width: 760px; height: 420px; }
}

.bandeau { text-align: center; padding-block: clamp(52px, 8svh, 100px) clamp(40px, 6svh, 72px); }
.fil { font-size: 13px; color: var(--encre-3); margin-bottom: 20px; }
.fil a:hover { color: var(--encre); }
.bandeau .display { margin-bottom: 20px; }
.bandeau .sous-titre { max-width: 620px; margin-inline: auto; }

.carte {
  background-color: var(--papier);
  border: 1px solid var(--trait);
  border-radius: var(--r-l);
  padding: 28px;
}
.carte:has(> img:only-child) {
  padding: 0 !important;
  overflow: hidden;
  border-color: rgba(185, 185, 185, .18);
}

.scene {
  position: relative;
  background: var(--papier);
  border-radius: 18px;
  overflow: hidden;
  width: max-content;
  max-width: calc(100% - 20px);
  margin-inline: auto;
  box-shadow: var(--anneau);
}
.cadre-app {
  display: block;
  border: 0;
  height: clamp(700px, 86svh, 800px);
  width: calc(clamp(700px, 86svh, 800px) * 1.6);
  max-width: 100%;
}
.sans-app { display: none; padding: clamp(24px, 6vw, 36px) clamp(18px, 4vw, 28px);
  text-align: center; border: 1px solid var(--trait); border-radius: 16px; margin-top: 22px; }
.sans-app h3 { font-size: 18px; font-weight: 500; letter-spacing: -0.02em; margin: 0 0 10px; }
.sans-app p { margin: 0 auto 10px; max-width: 44ch; font-size: 14.5px; color: var(--encre-2); }
.sans-app .btn { margin-top: 8px; }
@media (max-width: 1024px) {
  .sans-app { display: block; }
  [data-essai="everything"], [data-essai="usd2skel"] { display: none; }
}

.sans-lanceur {
  display: none;
  padding: clamp(28px, 7vw, 44px) clamp(20px, 5vw, 32px);
  text-align: center;
}
.sans-lanceur h3 { font-size: 19px; font-weight: 500; letter-spacing: -0.02em; margin: 0 0 10px; }
.sans-lanceur p { margin: 0 auto 10px; max-width: 44ch; font-size: 14.5px; color: var(--encre-2); }
.sans-lanceur-cta { color: var(--encre) !important; font-weight: 500; }
.sans-lanceur .btn { margin-top: 8px; }

.scene-fond { position: relative; padding-bottom: clamp(56px, 7svh, 88px); }
.scene-fond > .wrap { position: relative; z-index: 1; }
.hero + .scene-fond { padding-top: clamp(24px, 4svh, 48px); }

.acte-affiche {
  margin: 0 auto clamp(36px, 4vw, 56px);
  max-width: 880px;
  border-radius: var(--r-l);
  overflow: hidden;
  line-height: 0;
  box-shadow: 0 0 0 1px rgba(185, 185, 185, .14);
}
.acte-affiche img { width: 100%; height: auto; display: block; }

.ab-affiche {
  margin: clamp(36px, 4vw, 56px) auto 0;
  max-width: 1000px;
  line-height: 0;
}
.ab-affiche img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: 16px;
  box-shadow: var(--anneau);
}
.ab-affiche figcaption {
  margin: 26px auto 0;
  max-width: 72ch;
  font-size: 13px;
  line-height: 1.7;
  color: var(--encre-3);
  text-align: center;
}

.produit { margin: clamp(56px, 7svh, 88px) auto 0; max-width: 100%; padding: 0; }
.produit img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: var(--r-l);
  box-shadow: var(--anneau), var(--ombre-3);
}

.ea {
  position: relative;
  margin: 10px auto;
  max-width: 1300px;
  border-radius: 16px;
  overflow: hidden;
  background: var(--papier);
  height: clamp(360px, 46vw, 640px);
  box-shadow: var(--anneau);
}
.ea-cadre {
  position: absolute;
  top: 0;
  left: 0;
  width: 1300px;
  height: 820px;
  border: 0;
  transform-origin: 0 0;
  display: block;
  pointer-events: none;
}
.ea-fenetre { position: relative; }
.ea-fenetre.en-camera {
  overflow: hidden;
  border-radius: 16px;
  background: var(--papier);
  box-shadow: var(--anneau);
  isolation: isolate;
}
.ea-fenetre.en-camera > .ea {
  margin: 0;
  max-width: none;
  border-radius: 0;
  box-shadow: none;
}

.ea-affiche { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top left; }

.ea-repos {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  text-align: center;
  padding: 24px;
  overflow: hidden;
}
.ea-lueur {
  position: absolute;
  inset: -20%;
  background:
    radial-gradient(closest-side, rgba(106, 106, 106, .30), transparent 70%);
  pointer-events: none;
}
.ea-repos::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(182, 182, 182, .07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(182, 182, 182, .07) 1px, transparent 1px);
  background-size: 48px 48px;
  background-position: center;
  -webkit-mask-image: radial-gradient(50% 60% at 50% 50%, #000, transparent 80%);
  mask-image: radial-gradient(50% 60% at 50% 50%, #000, transparent 80%);
}
.ea-repos > p, .ea-repos > button { position: relative; z-index: 1; }
.ea-titre { margin: 0; font-size: clamp(18px, 2vw, 24px); font-weight: 500; letter-spacing: -0.02em; color: var(--encre); }
.ea-sous { margin: 0; font-size: 14px; color: var(--encre-2); }
.ea-go { margin-top: 14px; }
.ea-repos[data-charge] .ea-go {
  opacity: .5;
  pointer-events: none;
  position: relative;
  overflow: hidden;
}
.ea-repos[data-charge] .ea-go::after {
  content: '';
  position: absolute;
  left: 14px;
  right: 14px;
  bottom: 6px;
  height: 2px;
  border-radius: 2px;
  background: currentColor;
  opacity: .45;
  transform-origin: left center;
  animation: ea-charge 1.4s ease-in-out infinite;
}
@keyframes ea-charge {
  0% { transform: scaleX(.06); }
  50% { transform: scaleX(1); }
  100% { transform: scaleX(.06); }
}
@media (prefers-reduced-motion: reduce) {
  .ea-repos[data-charge] .ea-go::after { animation: none; transform: scaleX(.55); }
}

.ea-pointeur,
.ea-halo {
  position: absolute;
  top: 0;
  left: 0;
  pointer-events: none;
  opacity: 0;
  z-index: 3;
  will-change: transform, opacity;
}
.ea-pointeur {
  width: 14px;
  height: 20px;
  margin: -1.4px 0 0 -1.4px;
  transition: transform .52s cubic-bezier(.22, .8, .28, 1), opacity .3s ease;
}
.ea-pointeur::before {
  content: '';
  position: absolute;
  inset: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 15 21'%3E%3Cpath d='M1.5 1.5V17.1L5.3 13.5L8.1 19.6L10.9 18.4L8.2 12.4H13.7Z' fill='%23fff' stroke='%23120a1c' stroke-width='1.25' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat 0 0 / 100% 100%;
  filter: drop-shadow(0 1px 1.5px rgba(0, 0, 0, .55));
  transform-origin: 1.4px 1.4px;
  transition: scale .12s ease;
}
.ea-pointeur.on { opacity: 1; }
.ea-pointeur.clic::before { scale: .86; }
.ea-halo { display: none; }
@property --z-camera {
  syntax: '<number>';
  inherits: true;
  initial-value: 1;
}
.ea-fenetre.en-camera .ea-pointeur::before { scale: calc(1 / var(--z-camera, 1)); }
.ea-fenetre.en-camera .ea-pointeur.clic::before { scale: calc(.86 / var(--z-camera, 1)); }
.ea-glisse {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  opacity: 0;
  pointer-events: none;
  white-space: nowrap;
  transition: transform 1.2s cubic-bezier(.3, .7, .2, 1), opacity .35s ease, scale .28s ease;
  will-change: transform;
}
.ea-glisse.on { opacity: 1; }
.ea-glisse.tenu { scale: .94; }
.ea-glisse.lache { opacity: 0; scale: .5; transition: opacity .24s ease, scale .24s ease; }
.eg-dossier {
  display: block;
  width: 92px;
  height: 74px;
  filter: drop-shadow(0 12px 14px rgba(0, 0, 0, .55));
}
.eg-t {
  display: grid;
  justify-items: center;
  gap: 1px;
  line-height: 1.2;
  padding: 5px 11px 6px;
  border-radius: 10px;
  background: #151515;
  border: 1px solid rgba(192, 192, 192, .30);
  box-shadow: 0 6px 12px -6px rgba(0, 0, 0, .8);
}
.eg-t b { font-size: 13.5px; font-weight: 500; color: var(--encre); }
.eg-t small { font-size: 12px; color: var(--encre-2); }
@media (max-width: 760px) {
  .eg-dossier { width: 64px; height: 51px; }
  .eg-t { padding: 4px 9px 5px; }
  .eg-t b { font-size: 12.5px; }
  .eg-t small { font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) { .ea-glisse { display: none; } }

.ea-etape {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

@media (prefers-reduced-motion: reduce) {
  .ea-pointeur,
  .ea-halo { display: none; }
}
.ea-sources {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 7px;
  margin: 0 0 clamp(22px, 2.4vw, 32px);
  padding: 0;
  list-style: none;
  min-height: 28px;
}
.ea-src {
  padding: 5px 12px;
  border-radius: var(--r-pill);
  border: 1px solid var(--trait);
  background: rgba(255, 255, 255, .02);
  color: var(--encre-3);
  font-size: 12.5px;
  opacity: .5;
  transition: opacity .35s ease, color .35s ease, border-color .35s ease, background-color .35s ease;
}
.ea-src.on {
  opacity: 1;
  color: var(--encre);
  border-color: rgba(179, 179, 179, .45);
  background: rgba(119, 119, 119, .10);
}
.ea-src-autre {
  padding: 5px 12px;
  border-radius: var(--r-pill);
  border: 1px solid var(--trait);
  background: rgba(255, 255, 255, .02);
  color: var(--encre-3);
  font-size: 12.5px;
}
.ea-src-vous { border-color: transparent; background: none; padding-inline: 4px; }
@media (max-width: 760px) { .ea-src { opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .ea-src { transition: none; }
}
.ea-vrai {
  margin: clamp(12px, 1.6vw, 18px) auto 0;
  max-width: 640px;
  font-size: 13.5px;
  line-height: 1.65;
  color: var(--encre-2);
}
@media (max-width: 760px) {
  .ea { height: clamp(300px, 92vw, 460px); }
  .ea-vrai { font-size: 13px; }
}

.chiffres {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: clamp(40px, 5vw, 64px) 0 0;
  border-top: 1px solid var(--trait);
  border-bottom: 1px solid var(--trait);
}
.ch-case {
  text-align: left;
  padding: clamp(26px, 3vw, 40px) clamp(18px, 2.4vw, 34px);
}
.ch-case + .ch-case { border-left: 1px solid var(--trait); }
.ch-n {
  display: block;
  font-size: clamp(2.5rem, 4.6vw, 3.9rem);
  font-weight: 400;
  line-height: 1;
  letter-spacing: -0.045em;
  color: var(--encre);
  font-variant-numeric: tabular-nums;
}
.ch-t {
  display: block;
  margin: 14px 0 0;
  max-width: 24ch;
  font-size: 14px;
  line-height: 1.5;
  color: var(--encre-2);
}
.ch-source {
  margin: clamp(26px, 3vw, 38px) auto 0;
  max-width: 640px;
  font-size: 12.5px;
  line-height: 1.7;
  color: var(--encre-3);
}
@media (max-width: 860px) {
  .chiffres { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ch-case:nth-child(3) { border-left: 0; }
  .ch-case:nth-child(n + 3) { border-top: 1px solid var(--trait); }
}

.gestes {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(14px, 1.6vw, 20px);
  margin-top: clamp(32px, 4vw, 52px);
  text-align: left;
}
@media (max-width: 780px) { .gestes { grid-template-columns: 1fr; gap: 12px; } }
.geste {
  position: relative;
  padding: 26px 26px 28px;
  border-radius: var(--r-l);
  border: 1px solid var(--trait);
  background-color: var(--papier);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04);
}
.geste .n {
  display: inline-grid;
  place-items: center;
  width: 34px;
  height: 34px;
  margin-bottom: 20px;
  border-radius: 50%;
  border: 1px solid rgba(179, 179, 179, .38);
  background: rgba(119, 119, 119, .12);
  font-size: 12.5px;
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0;
  color: var(--bleu-clair);
  font-variant-numeric: tabular-nums;
}
.geste > b { display: block; font-size: 16.5px; font-weight: 500; margin-bottom: 8px; letter-spacing: -0.016em; color: var(--encre); }
.geste span:not(.n) { display: block; font-size: 14px; color: var(--encre-2); line-height: 1.6; }
.geste span b { color: var(--encre); font-weight: 500; }

.mosaique { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
@media (max-width: 900px) { .mosaique { grid-template-columns: 1fr; } }
.mosaique.duo { grid-template-columns: repeat(2, 1fr); max-width: 900px; margin-inline: auto; }
@media (max-width: 900px) { .mosaique.duo { grid-template-columns: 1fr; } }
@media (min-width: 901px) {
  .mosaique { grid-template-rows: auto auto auto auto 1fr auto auto; }
  .mosaique > .carte-gain {
    grid-row: span 7;
    display: grid;
    grid-template-rows: subgrid;
    align-content: start;
  }
  .mosaique > .carte-gain > * { margin-top: 0; margin-bottom: 0; }
}
.carte-gain {
  position: relative;
  padding: clamp(24px, 2.2vw, 30px);
  border-radius: var(--r-l);
  border: 1px solid var(--trait);
  background-color: var(--papier);
  text-align: left;
}
.carte-gain > * { position: relative; }
.carte-gain-tete { display: flex; align-items: center; gap: 10px; margin-bottom: 20px; }
.carte-gain-tete img { width: 32px; height: 32px; }
.carte-gain-tete b { font-size: 14.5px; font-weight: 500; letter-spacing: -0.02em; }
.carte-gain .gain {
  display: block;
  font-size: clamp(2rem, 3.2vw, 2.6rem);
  font-weight: 400;
  letter-spacing: -0.045em;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.carte-gain .gain-lg { display: block; font-size: 13px; color: var(--encre-2); margin-top: 8px; }
.carte-gain .reglage { margin-top: 20px; }
.carte-gain .reglage-tete {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  font-size: 13px;
  color: var(--encre-2);
  margin-bottom: 6px;
}
.carte-gain .reglage-tete b { font-variant-numeric: tabular-nums; color: var(--encre); font-weight: 500; }
.bilan { display: grid; gap: 4px; margin-top: 14px; font-size: 13px; }
.bilan div { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; }
.bilan span { color: var(--encre-2); }
.bilan b { color: var(--encre); font-weight: 500; font-variant-numeric: tabular-nums; }
.postes {
  list-style: none;
  margin: 16px 0 0;
  padding: 14px 0 0;
  border-top: 1px solid var(--trait);
  display: grid;
  gap: 6px;
  min-height: calc(var(--lignes, 3) * 22px);
}
.postes li {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr) 46px 30px;
  align-items: center;
  gap: 8px;
  font-size: 12.5px;
  line-height: 1.35;
}
.postes b { font-weight: 500; color: var(--encre); font-variant-numeric: tabular-nums; }
.postes span { color: var(--encre-2); }
.postes .part {
  display: block;
  height: 3px;
  border-radius: 999px;
  background: rgba(177, 177, 177, .12);
  position: relative;
  overflow: hidden;
}
.postes .part::after {
  content: '';
  position: absolute;
  inset: 0 auto 0 0;
  width: var(--part, 0%);
  border-radius: inherit;
  background: linear-gradient(90deg, var(--bleu), var(--bleu-clair));
}
.postes em {
  font-style: normal;
  font-size: 11.5px;
  text-align: right;
  color: var(--encre-2);
  font-variant-numeric: tabular-nums;
}
@media (max-width: 420px) {
  .postes li { grid-template-columns: 54px minmax(0, 1fr); }
  .postes .part, .postes em { display: none; }
}

input[type="range"] {
  -webkit-appearance: none;
  appearance: none;
  width: 100%;
  height: 22px;
  background: transparent;
  cursor: pointer;
  margin: 0;
}
input[type="range"]::-webkit-slider-runnable-track {
  height: 4px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--bleu-vif) var(--p, 50%), rgba(177, 177, 177, .14) var(--p, 50%));
}
input[type="range"]::-moz-range-track { height: 4px; border-radius: 999px; background: rgba(177, 177, 177, .14); }
input[type="range"]::-moz-range-progress { height: 4px; border-radius: 999px; background: var(--bleu-vif); }
input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 18px;
  height: 18px;
  margin-top: -7px;
  border-radius: 50%;
  background: #fff;
  border: 0;
  box-shadow: 0 0 0 4px rgba(119, 119, 119, .35), 0 4px 12px rgba(0, 0, 0, .5);
  transition: transform .12s ease-out, box-shadow .12s ease-out;
}
input[type="range"]::-moz-range-thumb {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #fff;
  border: 0;
  box-shadow: 0 0 0 4px rgba(119, 119, 119, .35), 0 4px 12px rgba(0, 0, 0, .5);
  transition: transform .12s ease-out, box-shadow .12s ease-out;
}
input[type="range"]:active::-webkit-slider-thumb { transform: scale(1.2); box-shadow: 0 0 0 7px rgba(119, 119, 119, .35), 0 4px 12px rgba(0, 0, 0, .5); }
input[type="range"]:active::-moz-range-thumb { transform: scale(1.2); box-shadow: 0 0 0 7px rgba(119, 119, 119, .35), 0 4px 12px rgba(0, 0, 0, .5); }

.choix { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 16px; }
.choix button {
  border: 1px solid var(--trait);
  background: rgba(255, 255, 255, .025);
  color: var(--encre-2);
  padding: 5px 12px;
  border-radius: var(--r-pill);
  font: inherit;
  font-size: 12.5px;
  font-weight: 500;
  cursor: pointer;
  transition: background-color .16s, color .16s, border-color .16s, transform .1s ease-out;
}
.choix button:hover { color: var(--encre); border-color: var(--trait-fort); }
.choix button:active { transform: scale(.96); }
.choix button[aria-pressed="true"] { background: var(--action); border-color: transparent; color: var(--sur-action); }

.faq { max-width: 860px; margin: 0 auto; }
.faq-item {
  border: 1px solid var(--trait);
  border-radius: 16px;
  background-color: var(--papier);
  transition: border-color .2s, background-color .2s;
}
.faq-item + .faq-item { margin-top: 10px; }
.faq-item[open] { border-color: var(--trait-fort); background-color: #0F0F0F; }
.faq-item > summary {
  display: flex;
  align-items: center;
  gap: 16px;
  list-style: none;
  cursor: pointer;
  padding: 20px 22px;
  font-size: clamp(1rem, 1.15vw, 1.0625rem);
  font-weight: 500;
  line-height: 1.4;
  letter-spacing: -0.012em;
  color: var(--encre);
  border-radius: 16px;
}
.faq-item > summary::-webkit-details-marker { display: none; }
.faq-item > summary:hover { color: #fff; }
.faq-item > summary:focus-visible { outline: 2px solid var(--bleu-clair); outline-offset: -2px; }
.faq-item > summary .signe {
  flex: none;
  margin-left: auto;
  position: relative;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 1px solid var(--trait-fort);
  background: rgba(255, 255, 255, .02);
  transition: background-color .2s, border-color .2s;
}
.faq-item[open] > summary .signe { background: rgba(119, 119, 119, .16); border-color: rgba(179, 179, 179, .45); }
.faq-item > summary .signe::before,
.faq-item > summary .signe::after {
  content: '';
  position: absolute;
  left: 8px;
  right: 8px;
  top: 50%;
  height: 1.5px;
  background: currentColor;
  border-radius: 2px;
  transform: translateY(-50%);
  transition: transform .26s cubic-bezier(.16, 1, .3, 1), opacity .2s ease;
}
.faq-item > summary .signe::after { transform: translateY(-50%) rotate(90deg); }
.faq-item[open] > summary .signe::after { transform: translateY(-50%) rotate(0deg); opacity: 0; }
.faq-item > .faq-r {
  margin: 0;
  padding: 0 60px 22px 22px;
  max-width: 72ch;
  color: var(--encre-2);
  font-size: 15px;
  line-height: 1.7;
}
@keyframes faq-ouvre {
  from { opacity: 0; transform: translateY(-6px); }
  to { opacity: 1; transform: none; }
}
.faq-item[open] > .faq-r { animation: faq-ouvre .3s cubic-bezier(.16, 1, .3, 1); }
.faq-sortie {
  margin: clamp(30px, 3.4vw, 44px) 0 0;
  font-size: 14px;
  color: var(--encre-3);
}
.faq-sortie a { color: var(--bleu-clair); text-decoration: underline; text-underline-offset: 3px; }
@media (prefers-reduced-motion: reduce) {
  .faq-item > summary .signe::before,
  .faq-item > summary .signe::after { transition: none; }
  .faq-item[open] > .faq-r { animation: none; }
}

.barre-appel {
  position: fixed;
  right: calc(22px + env(safe-area-inset-right, 0px));
  bottom: calc(18px + env(safe-area-inset-bottom, 0px));
  z-index: 60;
  display: flex;
  align-items: center;
  gap: 18px;
  padding: 8px 8px 8px 22px;
  border-radius: var(--r-pill);
  border: 1px solid var(--trait-fort);
  background: rgba(10, 10, 10, .78);
  -webkit-backdrop-filter: var(--verre-moyen);
  backdrop-filter: var(--verre-moyen);
  box-shadow: 0 10px 22px -12px rgba(0, 0, 0, .9);
  visibility: hidden;
  opacity: 0;
  transform: translateY(14px);
  transition: opacity .34s ease, transform .34s cubic-bezier(.16, 1, .3, 1), visibility 0s linear .34s;
}
.barre-appel.ba-on {
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0s;
}
.ba-t { font-size: 13.5px; font-weight: 500; color: var(--encre-2); white-space: nowrap; }
.ba-b { min-height: 44px; white-space: nowrap; }
@media (max-width: 720px) {
  .barre-appel {
    left: 12px;
    right: 12px;
    transform: translateY(14px);
    padding: 8px;
    justify-content: center;
  }
  .barre-appel.ba-on { transform: translateY(0); }
  .ba-t { display: none; }
  .ba-b { width: 100%; justify-content: center; }
}
@media (prefers-reduced-motion: reduce) {
  .barre-appel { transition: opacity .01s linear, visibility 0s linear .01s; }
  .barre-appel.ba-on { transition-delay: 0s; }
}

.bandeau-sources {
  margin: 0;
  font-size: 14px;
  line-height: 2;
  color: var(--encre-2);
}
.liste-points {
  list-style: none;
  margin: 20px 0 0;
  padding: 0;
  display: grid;
  gap: 12px;
  font-size: 14.5px;
  color: var(--encre-2);
  line-height: 1.6;
}
.liste-points li { padding-left: 20px; position: relative; }
.liste-points li::before {
  content: '';
  position: absolute;
  left: 0;
  top: .62em;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--encre-3);
}
.liste-points b { color: var(--encre); font-weight: 500; }

.grille { display: grid; gap: 16px; }
.g3 { grid-template-columns: repeat(3, 1fr); }
.g2 { grid-template-columns: repeat(2, 1fr); }
@media (max-width: 880px) { .g3, .g2 { grid-template-columns: 1fr; } }

.dock {
  display: inline-flex;
  gap: 4px;
  padding: 5px;
  border-radius: var(--r-pill);
  border: 1px solid var(--trait);
  background: rgba(255, 255, 255, .025);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04);
}
.dock a {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  min-height: 44px;
  padding: 7px 18px 7px 8px;
  border-radius: var(--r-pill);
  font-size: 14.5px;
  font-weight: 450;
  color: var(--encre-2);
  transition: background-color .18s, color .18s, transform .12s ease-out;
}
.dock a img { width: 30px; height: 30px; }
.dock a:hover { color: var(--encre); background: rgba(255, 255, 255, .06); }
.dock a:active { transform: scale(.97); }

.medaillon {
  width: 64px;
  height: 64px;
  border-radius: 18px;
  display: grid;
  place-items: center;
  background: var(--papier-3);
  box-shadow: inset 0 0 0 1px var(--trait-fort);
  margin-bottom: 22px;
}
.medaillon img { width: 46px; height: 46px; }

.claims {
  margin-top: 26px;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  grid-template-rows: auto auto auto;
  gap: 12px;
}
.claim {
  padding: 22px 20px 24px;
  display: grid;
  gap: 6px;
  align-content: start;
  grid-row: span 3;
  grid-template-rows: subgrid;
  border-radius: 16px;
  border: 1px solid var(--trait);
  background-color: var(--papier);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04);
}
.claim::before {
  content: '';
  width: 8px;
  height: 8px;
  margin-bottom: 8px;
  border-radius: 50%;
  background: var(--encre-3);
}
.claim b { font-size: 14.5px; font-weight: 500; color: var(--encre); line-height: 1.35; }
.claim span { font-size: 13.5px; color: var(--encre-2); line-height: 1.55; }
.grille .claims {
  grid-template-columns: 1fr;
  grid-template-rows: none;
  gap: 0;
  border-radius: 16px;
  border: 1px solid var(--trait);
  background-color: var(--papier);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04);
  overflow: hidden;
}
.grille .claim {
  grid-row: auto;
  grid-template-rows: none;
  grid-template-columns: 14px minmax(0, 1fr);
  column-gap: 12px;
  row-gap: 4px;
  padding: 16px 18px;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.grille .claim + .claim { border-top: 1px solid var(--trait); }
.grille .claim::before { grid-row: 1 / span 2; margin: 6px 0 0; }
.grille .claim b, .grille .claim span { grid-column: 2; }
@media (max-width: 900px) {
  .claims { grid-template-columns: 1fr; }
  .claim { grid-row: auto; grid-template-rows: none; }
}

.essai-fond {
  position: fixed;
  inset: 0;
  z-index: 200;
  background: rgba(7, 3, 11, .74);
  -webkit-backdrop-filter: blur(40px) saturate(160%);
  backdrop-filter: blur(40px) saturate(160%);
  display: grid;
  place-items: center;
  padding: 14px;
  animation: essai-voile .42s cubic-bezier(.32, .72, .35, 1);
}
@keyframes essai-voile {
  from { opacity: 0; }
  to { opacity: 1; }
}
.essai-panneau:focus,
.essai-panneau:focus-visible { outline: none; }
.essai-panneau {
  position: relative;
  width: auto;
  height: auto;
  border-radius: var(--r-l);
  animation: essai-entre .52s cubic-bezier(.22, 1.18, .36, 1);
}
@keyframes essai-entre {
  from { opacity: 0; transform: scale(.97); }
  to { opacity: 1; transform: scale(1); }
}
.essai-echelle {
  overflow: hidden;
  border-radius: var(--r-l);
  border: 0;
  box-shadow: 0 0 0 1px rgba(185, 185, 185, .16);
}
.essai-app { display: block; border: 0; background: #101014; transform-origin: 0 0; }
.essai-attente {
  position: absolute;
  inset: 0;
  z-index: 4;
  display: grid;
  place-items: center;
  background: #101014;
  border-radius: inherit;
  pointer-events: none;
}
.essai-rond {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  border: 2px solid rgba(179, 179, 179, .18);
  border-top-color: rgba(179, 179, 179, .85);
  animation: essai-tourne .8s linear infinite;
}
@keyframes essai-tourne { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
  .essai-fond, .essai-panneau { animation: none; }
  .essai-rond { animation: none; border-top-color: rgba(179, 179, 179, .5); }
}

.segment {
  position: relative;
  isolation: isolate;
  display: inline-flex;
  padding: 5px;
  gap: 0;
  border-radius: var(--r-pill);
  border: 1px solid var(--trait);
  background: rgba(255, 255, 255, .025);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04);
}
.segment::before {
  content: '';
  position: absolute;
  z-index: -1;
  top: 5px;
  bottom: 5px;
  left: 5px;
  width: calc(50% - 5px);
  border-radius: var(--r-pill);
  background: rgba(255, 255, 255, .075);
  box-shadow: inset 0 0 0 1px rgba(192, 192, 192, .12), inset 0 1px 0 rgba(255, 255, 255, .08);
  transition: transform .44s cubic-bezier(.32, .72, .35, 1);
}
.segment:has(button:nth-child(2).on)::before,
.segment:has(button:nth-child(2)[aria-pressed="true"])::before { transform: translateX(100%); }
@media (prefers-reduced-motion: reduce) { .segment::before { transition: none; } }
.segment button {
  border: 0;
  background: transparent;
  flex: 1 1 0;
  min-width: 0;
  padding: 8px 22px;
  border-radius: var(--r-pill);
  font: inherit;
  font-size: 14px;
  font-weight: 450;
  color: var(--encre-2);
  cursor: pointer;
  transition: color .2s;
}
.segment button[aria-pressed="true"], .segment button.on { color: var(--encre); font-weight: 500; }
.economie { color: var(--vert); font-size: 14px; font-weight: 500; }

.tarifs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; align-items: start; }
@supports (grid-template-rows: subgrid) {
  @media (min-width: 1081px) {
    .tarifs { grid-template-rows: repeat(7, auto); align-items: stretch; }
    .tarifs > .plan {
      display: grid;
      grid-row: span 7;
      grid-template-rows: subgrid;
      align-content: start;
    }
    .tarifs > .plan > .plan-tete { grid-row: 1; }
    .tarifs > .plan > .sieges { grid-row: 2; }
    .tarifs > .plan > .prix { grid-row: 3; align-self: start; }
    .tarifs > .plan > .plan-lead { grid-row: 4; align-self: start; }
    .tarifs > .plan > .btn { grid-row: 5; align-self: start; }
    .tarifs > .plan > hr { grid-row: 6; }
    .tarifs > .plan > .liste { grid-row: 7; align-self: start; }
  }
}
@media (max-width: 1080px) { .tarifs { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 620px) { .tarifs { grid-template-columns: 1fr; } }

.pcard {
  position: relative;
  overflow: hidden;
  padding: 28px 24px 30px;
  border-radius: var(--r-l);
  border: 1px solid var(--trait);
  background-color: var(--papier);
}
.pcard > * { position: relative; z-index: 1; }
.pcard.vedette {
  border-color: rgba(255,133,51, .55);
  background-color: #111111;
}
.plan-tete { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
.plan-nom { font-size: 15px; font-weight: 500; letter-spacing: -0.01em; }
.puce {
  font-size: 11.5px;
  font-weight: 500;
  padding: 4px 10px;
  border-radius: var(--r-pill);
  background: var(--action);
  color: var(--sur-action);
}
.prix { display: flex; align-items: baseline; gap: 8px; margin-bottom: 12px; flex-wrap: wrap; }
.prix b {
  font-size: clamp(2.1rem, 2.9vw, 2.6rem);
  font-weight: 400;
  letter-spacing: -0.045em;
  line-height: 1;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.prix b small { font-size: 13px; font-weight: 400; letter-spacing: normal; color: var(--encre-2); }
.prix span { font-size: 13.5px; color: var(--encre-2); }
.plan-lead { font-size: 14px; color: var(--encre-2); line-height: 1.55; margin-bottom: 22px; min-height: 42px; }
.pcard .btn { margin-bottom: 24px; }
.pcard hr { border: 0; border-top: 1px solid var(--trait); margin: 0 0 20px; }
.liste { list-style: none; margin: 0; padding: 0; display: grid; gap: 11px; }
.liste li { display: flex; gap: 10px; font-size: 14px; line-height: 1.45; color: var(--encre-2); }
.liste svg { width: 15px; height: 15px; flex: none; margin-top: 2px; stroke: var(--bleu-clair); fill: none; stroke-width: 2.4; }
.liste b { color: var(--encre); font-weight: 500; }

.pcard .sieges {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 16px;
  font-size: 13.5px;
  color: var(--encre-2);
}
.pcard .sieges button {
  width: 32px;
  height: 32px;
  display: inline-grid;
  place-items: center;
  border-radius: 50%;
  border: 1px solid var(--trait-fort);
  background: rgba(255, 255, 255, .03);
  color: var(--encre);
  font: inherit;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
}
.pcard .sieges button:hover { border-color: rgba(179, 179, 179, .5); background: rgba(119, 119, 119, .12); }
.pcard .sieges b { min-width: 2ch; text-align: center; font-weight: 500; color: var(--encre); font-variant-numeric: tabular-nums; }

.estim {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0;
  align-items: center;
  padding: clamp(26px, 3vw, 38px) clamp(24px, 3vw, 40px);
  border-radius: var(--r-l);
  border: 1px solid var(--trait);
  background-color: var(--papier);
}
.estim-reglage { padding-right: clamp(24px, 4vw, 56px); }
.estim-lecture {
  text-align: right;
  padding-left: clamp(24px, 4vw, 56px);
  border-left: 1px solid var(--trait);
}
.estim-tete { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 20px; gap: 14px; }
.estim-tete b { font-size: 15.5px; font-weight: 500; letter-spacing: -0.012em; }
.estim-tete span { font-size: 14px; color: var(--encre-2); font-variant-numeric: tabular-nums; font-weight: 500; }
.graduations { display: flex; justify-content: space-between; margin-top: 12px; }
.graduations span { font-size: 12px; color: var(--encre-3); font-variant-numeric: tabular-nums; }
.estim-chip { display: block; font-size: 12.5px; font-weight: 500; color: var(--encre-3); margin-bottom: 12px; }
.estim-lecture b {
  display: block;
  line-height: 1;
  font-size: clamp(2.5rem, 3.8vw, 3.3rem);
  font-weight: 400;
  letter-spacing: -0.045em;
  font-variant-numeric: tabular-nums;
}
.estim-lecture small { display: block; margin-top: 12px; color: var(--encre-2); font-size: 13px; }
@media (max-width: 760px) {
  .estim { grid-template-columns: 1fr; }
  .estim-reglage { padding-right: 0; }
  .estim-lecture { text-align: left; padding-left: 0; border-left: 0; border-top: 1px solid var(--trait); padding-top: 22px; margin-top: 26px; }
}

.cadre-table { overflow-x: auto; }
.compare { width: 100%; border-collapse: collapse; font-size: 14px; min-width: 640px; table-layout: fixed; }
.compare th:first-child { width: 28%; }
.compare thead th {
  font-size: 13px;
  font-weight: 500;
  color: var(--encre-2);
  padding: 0 14px 16px;
  text-align: center;
}
.compare thead th:first-child { text-align: left; }
.compare .groupe td {
  font-size: 12.5px;
  font-weight: 500;
  color: var(--bleu-clair);
  padding: 26px 14px 10px;
}
.compare tbody td {
  padding: 14px;
  border-top: 1px solid var(--trait);
  text-align: center;
  color: var(--encre-2);
}
.compare tbody td:first-child { text-align: left; color: var(--encre); }
.compare tbody .groupe td:first-child { color: var(--bleu-clair); }
.compare th:nth-child(3), .compare td:nth-child(3) { background: rgba(119, 119, 119, .07); color: var(--encre); }
@media (min-width: 761px) {
  .cadre-table { overflow-x: visible; }
  .compare thead th {
    position: sticky;
    top: var(--entete-h);
    z-index: 3;
    padding-top: 14px;
    background: var(--papier-2);
  }
  .compare thead th:nth-child(3) { background: #0F0F0F; }
}

.ban-essai {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin-top: 26px;
  margin-inline: auto;
  padding: 13px 16px;
  max-width: 62ch;
  text-align: left;
  border: 1px solid var(--avert-trait);
  border-radius: var(--r-s);
  background: var(--avert-fond);
  color: var(--avert);
  font-size: .92rem;
  line-height: 1.5;
}
.ban-essai svg {
  width: 18px; height: 18px; flex: none; margin-top: 1px;
  fill: none; stroke: currentColor; stroke-width: 1.9;
  stroke-linecap: round; stroke-linejoin: round;
}
.ban-essai[hidden] { display: none; }

.accords-boite {
  width: min(100% - 28px, 470px);
  padding: clamp(24px, 3vw, 32px);
  border: 1px solid var(--trait-fort);
  border-radius: var(--r-l);
  background: var(--papier);
  color: var(--encre);
}
.accords-boite::backdrop {
  background: rgba(7, 3, 11, .6);
  -webkit-backdrop-filter: blur(40px) saturate(160%);
  backdrop-filter: blur(40px) saturate(160%);
}
.accords-boite h2 { font-size: 1.2rem; letter-spacing: -0.02em; margin: 0 0 6px; }
.accords-plan { margin: 0 0 18px; font-size: 13px; color: var(--encre-2); font-weight: 500; }
.accords-boite .accords { margin: 0 0 20px; }
.accords-pied { display: flex; gap: 10px; justify-content: flex-end; }
@media (max-width: 420px) {
  .accords-pied { flex-direction: column-reverse; }
  .accords-pied .btn { width: 100%; }
}

.dl-meta { margin: 18px 0 0; font-size: 13.5px; color: var(--encre-2); font-variant-numeric: tabular-nums; }
.dl-note { margin: 10px 0 0; font-size: 13px; color: var(--encre-3); }
.dl-tete { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.dl-tete img { width: 40px; height: 40px; flex: none; }
.dl-tete h2 { margin: 0; }
.carte[data-app] { display: flex; flex-direction: column; }
.carte[data-app] > .chip { margin-top: auto; align-self: flex-start; }
.empreinte { margin: 12px 0 0; }
.empreinte > summary {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  list-style: none;
  cursor: pointer;
  font-size: 13px;
  color: var(--encre-3);
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid transparent;
  transition: color .18s ease, background-color .18s ease, border-color .18s ease;
}
.empreinte > summary::-webkit-details-marker { display: none; }
.empreinte > summary::before {
  content: '';
  width: 6px; height: 6px; flex: none;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(-45deg) translate(-1px, -1px);
  transition: transform .22s cubic-bezier(.16, 1, .3, 1);
}
.empreinte[open] > summary::before { transform: rotate(45deg) translate(-2px, -2px); }
.empreinte > summary:hover { color: var(--encre); background: rgba(255, 255, 255, .03); border-color: var(--trait); }
.empreinte > summary:focus-visible { outline: 2px solid var(--bleu-clair); outline-offset: 2px; }
.empreinte > p {
  margin: 8px auto 0;
  max-width: 62ch;
  font-size: 12px;
  line-height: 1.7;
  color: var(--encre-3);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  word-break: break-all;
  background: var(--papier);
  border: 1px solid var(--trait);
  border-radius: var(--r-s);
  padding: 10px 13px;
}
.empreinte:not([open]) > p { display: none; }
@media (prefers-reduced-motion: reduce) {
  .empreinte > summary, .empreinte > summary::before { transition: none; }
}

.champ { display: block; margin-bottom: 16px; }
.champ > span, .champ > label {
  display: block;
  font-size: 12.5px;
  font-weight: 500;
  color: var(--encre-3);
  margin-bottom: 8px;
}
input[type="text"], input[type="email"], input[type="password"], input[type="number"], select, textarea {
  width: 100%;
  padding: 12px 14px;
  border-radius: var(--r-s);
  border: 1px solid var(--trait-fort);
  background: #0A0A0A;
  color: var(--encre);
  font: inherit;
  font-size: 15px;
  transition: border-color .16s, box-shadow .16s;
}
input::placeholder, textarea::placeholder { color: var(--encre-3); }
input[type="text"]:focus, input[type="email"]:focus, input[type="password"]:focus,
input[type="number"]:focus, input[type="search"]:focus, input[type="tel"]:focus,
input[type="url"]:focus, input:not([type]):focus, select:focus, textarea:focus {
  outline: 0;
  border-color: rgba(164, 164, 164, .8);
  box-shadow: 0 0 0 4px rgba(119, 119, 119, .22);
}

.onglets {
  display: flex;
  padding: 5px;
  gap: 2px;
  border-radius: var(--r-pill);
  background: rgba(255, 255, 255, .025);
  border: 1px solid var(--trait);
  margin-bottom: 24px;
}
.onglets button {
  flex: 1;
  border: 0;
  background: transparent;
  padding: 9px 14px;
  border-radius: var(--r-pill);
  font: inherit;
  font-size: 14px;
  font-weight: 500;
  color: var(--encre-2);
  cursor: pointer;
  transition: background-color .2s, color .2s, box-shadow .2s;
}
.onglets button[aria-selected="true"], .onglets button.on {
  background: rgba(255, 255, 255, .075);
  color: var(--encre);
  box-shadow: inset 0 0 0 1px rgba(192, 192, 192, .12);
}

.cpt { padding-block: clamp(26px, 4.4svh, 72px) clamp(60px, 10svh, 120px); }
.cpt-colonne { width: min(100%, 470px); margin-inline: auto; }
.nappe.nappe-compte {
  -webkit-mask-image: radial-gradient(1560px 760px at 50% 30%, #000 34%, rgba(0, 0, 0, .5) 60%, transparent 86%);
  mask-image: radial-gradient(1560px 760px at 50% 30%, #000 34%, rgba(0, 0, 0, .5) 60%, transparent 86%);
}
.identite {
  position: relative;
  width: 100%;
  margin-inline: auto;
  padding: clamp(32px, 4vw, 44px) clamp(24px, 3.2vw, 38px) clamp(28px, 3.4vw, 38px);
  text-wrap: pretty;
  border-radius: var(--r-xl);
  border: 1px solid rgba(185, 185, 185, .18);
  background-color: rgba(12, 12, 12, .92);
  box-shadow: none;
}
.identite::before {
  content: '';
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(180deg, rgba(205, 205, 205, .6), rgba(205, 205, 205, .1) 30%, transparent 58%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
}
.identite > .volet > * { width: 100%; }
.identite .titre {
  font-size: clamp(1.6rem, 2.5vw, 2rem);
  line-height: 1.14;
  letter-spacing: -0.032em;
  text-align: center;
  text-wrap: balance;
  margin-bottom: 10px;
}
.identite .sous-titre { font-size: 14.5px; text-align: center; text-wrap: balance; max-width: 52ch; margin: 0 auto 24px; }
.identite .champ {
  display: block;
  margin-bottom: 10px;
  padding: 9px 14px 10px;
  border: 1px solid var(--trait-fort);
  border-radius: var(--r-s);
  background: #0A0A0A;
  cursor: text;
  transition: border-color .16s ease, box-shadow .16s ease;
}
.identite .champ:focus-within { border-color: rgba(164, 164, 164, .8); box-shadow: 0 0 0 4px rgba(119, 119, 119, .22); }
.identite .champ > span { display: block; font-size: 12px; font-weight: 500; color: var(--encre-3); margin-bottom: 0; }
.identite .champ input[type="text"],
.identite .champ input[type="email"],
.identite .champ input[type="password"] {
  width: 100%;
  border: 0;
  background: transparent;
  padding: 0;
  border-radius: 0;
  font-size: 16px;
  line-height: 1.4;
  color: var(--encre);
}
.identite .champ input:focus { outline: 0; box-shadow: none; background: transparent; }
.identite .champ.err input,
.identite .champ.err select { border-color: var(--rouge); }
.identite .champ .ferr { display: block; margin: 6px 0 0; font-size: 12.5px; color: var(--rouge); min-height: 0; }
.identite .btn-bloc { margin-top: 14px; }
.identite .onglets {
  display: flex;
  justify-content: center;
  margin: 18px 0 0;
  padding: 0;
  background: none;
  border: 0;
  box-shadow: none;
}
.identite .onglets button {
  flex: none;
  padding: 0;
  border: 0;
  background: none;
  box-shadow: none;
  font-size: 14px;
  font-weight: 500;
  color: var(--bleu-clair);
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: rgba(179, 179, 179, .35);
  transition: text-decoration-color .16s ease;
}
.identite .onglets button.on { display: none; }
.identite .onglets button:hover { text-decoration-color: currentColor; }
.identite .cpt-mark { display: block; width: 56px; margin: 0 auto 18px; }
.identite .cpt-mark img { display: block; width: 100%; height: auto; filter: drop-shadow(0 12px 28px rgba(106, 106, 106, .55)); }
.identite .cpt-essai {
  display: flex;
  align-items: center;
  gap: 10px;
  width: max-content;
  max-width: 100%;
  margin: -6px auto 20px;
  padding: 5px 15px 5px 5px;
  border-radius: var(--r-pill);
  background: #151515;
  border: 1px solid rgba(179, 179, 179, .3);
  font-size: 13.5px;
  font-weight: 500;
  line-height: 1.3;
  color: var(--encre);
}
.identite .cpt-essai img { display: block; flex: none; width: 26px; height: 26px; border-radius: 7px; }

.accords { display: grid; gap: 10px; margin: 22px 0 16px; }
.accord {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 10px;
  align-items: start;
  font-size: 13px;
  line-height: 1.5;
  color: var(--encre-2);
  cursor: pointer;
}
.accord input { width: 17px; height: 17px; margin: 1px 0 0; accent-color: var(--bleu-vif); cursor: pointer; }
.accord a { color: var(--encre); text-decoration: underline; text-underline-offset: 2px; text-decoration-color: rgba(179, 179, 179, .45); }
.accord a:hover { color: var(--bleu-clair); }

.bascule {
  width: 44px;
  height: 26px;
  padding: 3px;
  border-radius: 999px;
  border: 1px solid var(--trait-fort);
  background: var(--papier-3);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  transition: background-color .2s, border-color .2s;
}
.bascule > span {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #fff;
  box-shadow: var(--ombre-1);
  transition: transform .2s cubic-bezier(.2, .7, .3, 1);
}
.bascule[aria-checked="true"] { background: var(--action); border-color: rgba(164, 164, 164, .6); }
.bascule[aria-checked="true"] > span { transform: translateX(18px); }
.bascule:disabled { opacity: .55; cursor: default; }

.rassure { list-style: none; margin: clamp(40px, 6svh, 60px) 0 0; padding: 0; display: grid; grid-template-columns: 1fr; }
.rassure li {
  display: grid;
  grid-template-columns: calc(1px + clamp(24px, 3.2vw, 36px)) 1fr;
  grid-template-areas: 'ico titre' '. texte';
  column-gap: 0;
  row-gap: 5px;
  align-items: center;
  padding: clamp(17px, 2vw, 23px) 0;
  border-top: 1px solid var(--trait);
}
.rassure li:first-child { border-top: 0; padding-top: 0; }
.rassure li:last-child { padding-bottom: 0; }
.rassure svg {
  grid-area: ico;
  justify-self: start;
  width: 20px;
  height: 20px;
  fill: none;
  stroke: var(--bleu-clair);
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.rassure b { grid-area: titre; font-size: 15px; font-weight: 500; letter-spacing: -0.012em; }
.rassure span { grid-area: texte; font-size: 13.5px; color: var(--encre-3); line-height: 1.55; max-width: 46ch; }

.ferr { color: var(--rouge); font-size: 13.5px; min-height: 18px; margin-bottom: 6px; }
.ferr:empty { min-height: 0; }
.tiers { margin-top: 22px; }
.tiers-ou { position: relative; text-align: center; margin-bottom: 14px; font-size: 12.5px; color: var(--encre-3); }
.tiers-ou::before { content: ''; position: absolute; left: 0; right: 0; top: 50%; border-top: 1px solid var(--trait); }
.tiers-ou span { position: relative; background: var(--papier); padding: 0 12px; font-weight: 500; }
.tiers .btn + .btn { margin-top: 8px; }
.forgot { margin-top: 16px; text-align: center; }
.sousform { margin-top: 20px; }
.oactions { display: flex; gap: 10px; flex-wrap: wrap; }
.oactions .btn { flex: 1; min-width: 0; }

.me { display: none; }
.avatar {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  flex: none;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: var(--action);
  color: var(--sur-action);
  font-weight: 500;
  font-size: 18px;
}
.avatar img { display: block; width: 100%; height: 100%; object-fit: cover; }

.me .sieges { margin-top: 20px; padding-top: 16px; border-top: 1px solid var(--trait); }
.sieges-t {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 10px;
  font-size: 12.5px;
  font-weight: 500;
  color: var(--encre-3);
  margin-bottom: 10px;
}
.sieges-q { font-size: 12px; }
.sieges-l { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.sieges-l li {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  align-items: center;
  padding: 10px 12px;
  border-radius: var(--r-s);
  background: #0A0A0A;
  border: 1px solid var(--trait);
}
.sieges-l .sid {
  font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  font-size: 12px;
  color: var(--encre);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sieges-l .sdate { display: block; font-size: 11.5px; color: var(--encre-3); font-family: inherit; }
.sieges-l button {
  flex: none;
  padding: 6px 12px;
  font-size: 12.5px;
  font-weight: 500;
  border-radius: var(--r-pill);
  cursor: pointer;
  color: var(--encre-2);
  background: transparent;
  border: 1px solid var(--trait-fort);
  transition: color .18s ease, border-color .18s ease, background .18s ease;
}
.sieges-l button:hover:not(:disabled) { color: var(--encre); border-color: rgba(179, 179, 179, .5); background: rgba(119, 119, 119, .1); }
.sieges-l button:disabled { opacity: .5; cursor: default; }
.sieges-n { margin: 10px 0 0; font-size: 12px; line-height: 1.55; color: var(--encre-3); }

.cpt.connecte { padding-block: clamp(20px, 3.4svh, 52px) clamp(60px, 10svh, 120px); }
.cpt.connecte .cpt-colonne { width: min(100%, 1040px); }
.cpt.connecte .identite { padding: 0; }
.cpt.connecte .cpt-mark,
.cpt.connecte .rassure { display: none; }
.cpt.attente .cpt-colonne { visibility: hidden; }

.pr { display: grid; grid-template-columns: 250px minmax(0, 1fr); min-height: 640px; text-align: left; }
.pr-cote { display: flex; flex-direction: column; padding: 28px 14px; border-right: 1px solid var(--trait); }
.pr-h1 { margin: 0 12px 14px; font-size: 13px; font-weight: 500; letter-spacing: .01em; color: var(--encre-3); }
.pr-nav { position: relative; display: flex; flex-direction: column; gap: 2px; }
.pr-onglet {
  display: flex;
  align-items: center;
  gap: 11px;
  width: 100%;
  min-height: 42px;
  padding: 9px 12px;
  border: 0;
  border-radius: 12px;
  background: transparent;
  color: var(--encre-2);
  font: inherit;
  font-size: 14.5px;
  font-weight: 500;
  letter-spacing: -0.01em;
  text-align: left;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color .16s ease, color .16s ease;
}
.pr-onglet svg { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.pr-onglet:hover { background: rgba(255, 255, 255, .045); color: var(--encre); }
.pr-onglet[aria-selected="true"] { background: rgba(255, 255, 255, .085); color: var(--encre); box-shadow: inset 0 0 0 1px rgba(192, 192, 192, .1); }
.pr-quitter {
  display: flex;
  align-items: center;
  gap: 11px;
  width: 100%;
  min-height: 42px;
  margin-top: auto;
  padding: 9px 12px;
  border: 0;
  border-top: 1px solid var(--trait);
  border-radius: 0 0 12px 12px;
  background: transparent;
  color: var(--encre-2);
  font: inherit;
  font-size: 14.5px;
  font-weight: 500;
  letter-spacing: -0.01em;
  text-align: left;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color .16s ease, color .16s ease;
}
.pr-quitter svg { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.pr-quitter:hover { background: rgba(255, 255, 255, .045); color: var(--encre); }

.pr-contenu { min-width: 0; padding: 28px clamp(22px, 3.2vw, 44px) 34px; }
.pr-section { padding: 0; }
.pr-h2 { margin: 0; padding-bottom: 18px; border-bottom: 1px solid var(--trait); font-size: 21px; font-weight: 500; line-height: 1.2; letter-spacing: -0.024em; }

.pr-carte-id { display: flex; align-items: center; gap: 18px; padding: 24px 0; border-bottom: 1px solid var(--trait); }
.pr-photo { position: relative; flex: none; width: 76px; height: 76px; padding: 0; border: 0; border-radius: 50%; background: none; cursor: pointer; }
.pr-photo .avatar { width: 76px; height: 76px; font-size: 29px; }
.pr-photo-cam {
  position: absolute;
  right: -3px;
  bottom: -3px;
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  border: 1px solid var(--trait-fort);
  background: var(--papier-3);
  color: var(--encre);
  box-shadow: 0 4px 14px rgba(0, 0, 0, .55);
  transition: background-color .16s ease, border-color .16s ease;
}
.pr-photo-cam svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linejoin: round; }
.pr-photo:hover .pr-photo-cam { background: var(--action); border-color: transparent; color: var(--sur-action); }
.pr-photo.depot .avatar { box-shadow: 0 0 0 3px var(--bleu-clair); }
.pr-carte-t { min-width: 0; }
.pr-nom { font-size: 19px; font-weight: 500; letter-spacing: -0.02em; overflow-wrap: anywhere; }
.pr-mail { margin-top: 2px; font-size: 14px; color: var(--encre-2); overflow-wrap: anywhere; }
.pr-carte-t .chip { margin-top: 10px; padding: 3px 12px; font-size: 12.5px; }

.pr-ligne {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  column-gap: 20px;
  row-gap: 12px;
  padding: 18px 0;
  border-bottom: 1px solid var(--trait);
}
.pr-ligne:last-child { border-bottom: 0; }
.pr-lib { flex: 1 1 260px; min-width: 0; }
.pr-lib b { display: block; font-size: 14.5px; font-weight: 500; letter-spacing: -0.01em; color: var(--encre); }
.pr-lib span { display: block; max-width: 54ch; margin-top: 3px; font-size: 13.5px; line-height: 1.5; color: var(--encre-3); overflow-wrap: anywhere; }
.pr-val { flex: none; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 10px; font-size: 14px; color: var(--encre-2); }
.pr-note { font-size: 13px; color: var(--encre-3); }
.pr-vide { margin: 18px 0 0; padding: 16px 18px; border: 1px dashed var(--trait-fort); border-radius: var(--r-s); font-size: 13.5px; line-height: 1.55; color: var(--encre-3); }
.me .pr .sieges { margin-top: 0; padding-top: 18px; border-top: 0; }

.pr-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 36px;
  padding: 7px 16px;
  border: 1px solid var(--trait-fort);
  border-radius: var(--r-pill);
  background: rgba(255, 255, 255, .03);
  color: var(--encre);
  font: inherit;
  font-size: 13.5px;
  font-weight: 500;
  line-height: 1.2;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color .16s ease, border-color .16s ease, color .16s ease;
}
.pr-btn:hover { background: rgba(255, 255, 255, .075); border-color: rgba(192, 192, 192, .36); }
.pr-btn:disabled { opacity: .5; cursor: default; }
.pr-btn:disabled:hover { background: rgba(255, 255, 255, .03); border-color: var(--trait-fort); }
.pr-btn.plein { background: var(--action); border-color: transparent; color: var(--sur-action); }
.pr-btn.plein:hover { background: var(--action-vive); }
.pr-btn.plein:disabled:hover { background: var(--action); border-color: transparent; }
.pr-btn.danger { color: var(--rouge); border-color: rgba(255, 122, 110, .38); }
.pr-btn.danger:hover { background: rgba(255, 122, 110, .1); border-color: rgba(255, 122, 110, .62); }
.pr-btn.danger.plein { background: #C9372C; border-color: rgba(255, 122, 110, .6); color: #fff; }
.pr-btn.danger.plein:hover { background: #B5302A; }
.pr-btn.danger.plein:disabled:hover { background: #C9372C; }

.pr-form { flex: 1 0 100%; max-width: 460px; margin-top: 4px; }
.pr-form-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 8px; }

.pr-dialog {
  width: min(92vw, 440px);
  max-height: min(92svh, 760px);
  padding: 0;
  border: 1px solid rgba(185, 185, 185, .2);
  border-radius: var(--r-l);
  background: #0F0F0F;
  color: var(--encre);
  overscroll-behavior: contain;
}
.pr-dialog::backdrop { background: rgba(6, 3, 10, .74); }
.pr-dialog[open] { animation: pr-dialog-entre .18s cubic-bezier(.2, .7, .3, 1); }
@keyframes pr-dialog-entre { from { opacity: 0; transform: translateY(8px) scale(.985); } }
.pr-dialog-corps { padding: 26px 26px 22px; text-align: left; }
.pr-dialog-t { margin: 0 0 8px; font-size: 18px; font-weight: 500; letter-spacing: -0.02em; }
.pr-dialog-p { margin: 0 0 18px; font-size: 14px; line-height: 1.55; color: var(--encre-2); }
.pr-dialog-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 18px; }
.pr-dialog .pr-note { display: block; margin: 10px 0 0; text-align: center; }

.rognage {
  position: relative;
  width: min(100%, 300px);
  aspect-ratio: 1;
  margin: 6px auto 0;
  overflow: hidden;
  border-radius: var(--r-l);
  background: #0B0B0C;
  touch-action: none;
  cursor: grab;
}
.rognage:active { cursor: grabbing; }
.rognage canvas { display: block; width: 100%; height: 100%; }
.rognage::after {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 50%;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .55), 0 0 0 600px rgba(10, 10, 11, .6);
  pointer-events: none;
}
.rognage:focus-visible { outline: 2px solid var(--bleu-clair); outline-offset: 3px; }
.rognage-zoom { display: flex; align-items: center; gap: 12px; width: min(100%, 300px); margin: 16px auto 0; color: var(--encre-3); }
.rognage-zoom svg { width: 16px; height: 16px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
.rognage-zoom input[type="range"] { flex: 1; min-width: 0; accent-color: var(--bleu-vif); }

@media (prefers-reduced-motion: reduce) {
  .pr-dialog[open] { animation: none; }
}

@media (max-width: 760px) {
  .pr { grid-template-columns: minmax(0, 1fr); min-height: 0; }
  .pr-cote { padding: 18px 0 0; border-right: 0; border-bottom: 1px solid var(--trait); }
  .pr-cote { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
  .pr-cote > .pr-nav { grid-column: 1 / -1; }
  .pr-quitter { grid-row: 1; grid-column: 2; width: auto; min-height: 44px; margin: 0 14px 10px 0; padding: 8px 15px;
    border: 1px solid var(--trait); border-radius: var(--r-pill); font-size: 14px; }
  .pr-quitter svg { width: 16px; height: 16px; }
  .pr-h1 { margin: 0 18px 10px; }
  .pr-nav { flex-direction: row; gap: 6px; padding: 0 14px 14px; overflow-x: auto; scrollbar-width: none; }
  .pr-nav::-webkit-scrollbar { display: none; }
  .pr-onglet { flex: none; width: auto; min-height: 44px; padding: 8px 15px; border-radius: var(--r-pill); font-size: 14px; }
  .pr-onglet svg { display: none; }
  .pr-contenu { padding: 22px 18px 26px; }
  .pr-val { justify-content: flex-start; }
  .pr-btn, .sieges-l button { min-height: 44px; }
  .pr-btn { padding-inline: 18px; }
  .pr-carte-id { gap: 14px; }
  .pr-photo, .pr-photo .avatar { width: 64px; height: 64px; }
  .pr-photo .avatar { font-size: 25px; }
  .pr-dialog-corps { padding: 22px 18px 18px; }
  .pr-dialog-actions { flex-direction: column-reverse; }
  .pr-dialog-actions .pr-btn { width: 100%; }
}

.verico {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  display: inline-grid;
  place-items: center;
  margin: 0 auto 20px;
  background: var(--papier-3);
  color: var(--encre-2);
  box-shadow: inset 0 0 0 1px var(--trait-fort);
}
.verico svg { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.verico.ok { background: rgba(40, 200, 64, .1); color: var(--vert); }
.verico.non { background: rgba(255, 122, 110, .1); color: var(--rouge); }

.carte.centre h1 { font-size: clamp(1.6rem, 2.6vw, 2rem); letter-spacing: -0.03em; line-height: 1.15; margin-bottom: 10px; }
.carte.centre .sous-titre { margin-bottom: 22px; }

.prose { max-width: 70ch; margin-inline: auto; font-size: 16px; line-height: 1.75; color: var(--encre-2); overflow-wrap: break-word; }
.prose h1 {
  color: var(--encre);
  font-size: clamp(2rem, 4vw, 3rem);
  line-height: 1.08;
  letter-spacing: -0.035em;
  margin-bottom: 22px;
}
.prose h2 { font-size: 1.35rem; font-weight: 500; letter-spacing: -0.024em; margin: 48px 0 14px; color: var(--encre); }
.prose h3 { font-size: 1.06rem; font-weight: 500; letter-spacing: -0.016em; margin: 30px 0 10px; color: var(--encre); }
.prose h2:first-child, .prose h3:first-child { margin-top: 0; }
.prose ul, .prose ol { padding-left: 22px; margin: 0 0 1em; }
.prose li { margin-bottom: .45em; }
.prose li::marker { color: var(--bleu-clair); }
.prose b, .prose strong { color: var(--encre); font-weight: 500; }
.prose a {
  color: var(--encre);
  text-decoration: underline;
  text-underline-offset: 3px;
  text-decoration-color: rgba(179, 179, 179, .45);
  overflow-wrap: anywhere;
}
.prose a:hover { color: var(--bleu-clair); text-decoration-color: currentColor; }
.prose table { width: 100%; border-collapse: collapse; font-size: 14.5px; margin: 0 0 1.4em; }
.prose th, .prose td { text-align: left; padding: 11px 12px; border-top: 1px solid var(--trait); vertical-align: top; }
.prose th { color: var(--encre); font-weight: 500; }
.prose .maj { font-size: 13.5px; color: var(--encre-3); }
.prose .foinote {
  display: inline-block;
  padding: 7px 14px;
  border-radius: var(--r-pill);
  border: 1px solid var(--trait);
  background: rgba(255, 255, 255, .025);
  font-size: 13px;
  color: var(--encre-2);
}
.prose .chapo { color: var(--encre); font-size: 1.05rem; }
.todo { background: rgba(224, 166, 91, .16); color: #F0BF7A; padding: 1px 6px; border-radius: 5px; font-weight: 600; }

.pied {
  padding-block: 40px 44px;
  border-top: 1px solid var(--trait);
  color: var(--encre-3);
  font-size: 13.5px;
}
.pied .wrap { display: flex; flex-wrap: wrap; gap: 24px; align-items: center; padding-right: clamp(60px, 11vw, 170px); }
.pied a { color: var(--encre-2); transition: color .16s; }
.pied a:hover { color: var(--encre); }
.pied nav { display: flex; flex-wrap: wrap; gap: 22px; margin-left: auto; }
body:has(.barre-appel) .pied { padding-bottom: 116px; }

#toast {
  position: fixed;
  left: 50%;
  bottom: 26px;
  transform: translate(-50%, 14px);
  z-index: 300;
  padding: 11px 18px;
  border-radius: var(--r-pill);
  border: 1px solid var(--trait-fort);
  background: rgba(11, 11, 11, .92);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  color: #fff;
  font-size: 14px;
  font-weight: 500;
  opacity: 0;
  pointer-events: none;
  transition: opacity .24s, transform .24s;
  max-width: min(90vw, 460px);
  text-align: center;
  box-shadow: 0 20px 50px -20px rgba(0, 0, 0, .9);
}
#toast.show { opacity: 1; transform: translate(-50%, 0); }
#toast.err { background: rgba(120, 28, 20, .94); border-color: rgba(255, 122, 110, .4); }
#toast.ok { border-color: rgba(40, 200, 64, .35); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .12s !important;
  }
  .nappe-toile { display: none; }
}

@media (prefers-reduced-transparency: reduce) {
  .entete, .entete.collee, .dock {
    background: var(--papier-2) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
  .langmenu, .megamenu {
    background: var(--papier) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
  .btn-2, .langbtn,
  .chip:not(.ok):not(.warn):not(.plan) {
    background: var(--papier-3) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
  .entete #ctaAuth { background: var(--action) !important; }
  .barre-appel {
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    background: var(--papier);
  }
  .accords-boite::backdrop, .essai-fond {
    background: var(--papier-2) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
  #toast { background: var(--papier-3); -webkit-backdrop-filter: none; backdrop-filter: none; }
  .nappe { display: none; }
}

@media (prefers-contrast: more) {
  :root, html:root[data-theme="dark"] {
    --encre-2: #DBDBDB;
    --encre-3: #BDBDBD;
    --trait: rgba(192, 192, 192, .30);
    --trait-fort: rgba(192, 192, 192, .45);
  }
}

@media (max-width: 760px) {
  :root, :root[data-theme="dark"] { --entete-h: 104px; }
  .entete { height: var(--entete-h); }
  .entete .wrap {
    width: min(100% - 28px, var(--large));
    grid-template-columns: auto 1fr;
    gap: 8px 10px;
  }
  .entete .marque { grid-row: 1; grid-column: 1; }
  .entete .outils { grid-row: 1; grid-column: 2; justify-self: end; margin-left: 14px; }
  .entete .outils .btn, .entete .langbtn { white-space: nowrap; }
  .entete #ctaAuth { padding: 0 16px; min-height: 44px; }
  .btn { min-height: 48px; }
  .entete .menu {
    grid-row: 2;
    grid-column: 1 / -1;
    justify-self: stretch;
    justify-content: flex-start;
    overflow-x: auto;
    gap: 2px;
    padding: 0;
    border: 0;
    background: none;
    box-shadow: none;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .entete .menu::-webkit-scrollbar { display: none; }
  .entete .menu.defile-suite {
    -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 26px), transparent);
    mask-image: linear-gradient(to right, #000 calc(100% - 26px), transparent);
  }
  .entete .menu.defile-debut.defile-suite {
    -webkit-mask-image: linear-gradient(to right, transparent, #000 20px, #000 calc(100% - 26px), transparent);
    mask-image: linear-gradient(to right, transparent, #000 20px, #000 calc(100% - 26px), transparent);
  }
  .entete .menu.defile-debut:not(.defile-suite) {
    -webkit-mask-image: linear-gradient(to right, transparent, #000 20px);
    mask-image: linear-gradient(to right, transparent, #000 20px);
  }
  .entete .menu a { white-space: nowrap; flex: none; padding-inline: 13px; font-size: 14px; }
  .entete .menu a.on::before { display: none; }
  .entete .menu a.menu-compte:not(.on) { display: none; }

  .entete .menu a, .entete .marque, .pied nav a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }
  .entete .menu a { padding-block: 0; }
  .langbtn, .segment button, .btn-s, .lien-fleche,
  .choix button, .marque, .onglets button, #sgMoins, #sgPlus {
    min-height: 44px;
  }
  #sgMoins, #sgPlus { min-width: 44px; }
  .carte > a { min-height: 44px; }
  .carte > a .dl-tete { min-height: 44px; }
  .lien-fleche { display: inline-flex; align-items: center; }

  input[type="text"], input[type="email"], input[type="password"],
  input[type="number"], input[type="search"], input[type="tel"], input[type="url"],
  input, select, textarea,
  .identite input[type="text"], .identite input[type="email"], .identite input[type="password"] {
    font-size: 16px;
  }
  .champ > span, .identite .champ > span, .puce,
  .compare thead th, .compare .groupe td,
  #dlSha, .legende {
    font-size: 12.5px;
  }

  .nappe-toile { display: none; }

  .display { letter-spacing: -0.03em; }
  .hero .display { max-width: none; }
  .hero-duo .display { max-width: none; }

  .scene { overflow-x: visible; max-width: calc(100% - 20px); }
  .cadre-app { display: none; }
  .sans-lanceur { display: block; }

  .claim { grid-template-columns: 1fr; gap: 4px; }
  .dock { flex-wrap: wrap; justify-content: flex-start; }
  .faq-item > .faq-r { padding-right: 22px; }

  section { padding-block: clamp(52px, 11vw, 80px); }

  .cadre-table {
    -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 26px), transparent);
    mask-image: linear-gradient(to right, #000 calc(100% - 26px), transparent);
  }
  .compare th:first-child, .compare td:first-child {
    position: sticky;
    left: 0;
    background: var(--papier-2);
    z-index: 1;
  }
  .compare { min-width: 560px; }

  .pied .wrap { display: block; padding-right: 0; }
  .pied nav { margin-left: 0; display: grid; grid-template-columns: 1fr; gap: 0; justify-items: start; }
  .pied .wrap > span { display: block; margin-top: 16px; }
}

@media (max-width: 520px) {
  .hero { padding-top: clamp(32px, 7svh, 52px); }
  .btn { padding: 12px 18px; }
  .btn-l { padding: 14px 22px; font-size: 14.5px; }
  .actions .btn { flex: 1 1 auto; }
  .ch-case { padding-inline: 14px; }
}

@media (max-width: 400px) {
  .entete .menu a { padding-inline: 11px; }
  .entete .langbtn #langCur { display: none; }
  .entete .langbtn { padding-inline: 0; min-width: 44px; gap: 0; justify-content: center; }
  .hero .display { font-size: clamp(2rem, 9vw, 2.5rem); }
  @media (min-width: 341px) {
    .entete .wrap { width: min(100% - 20px, var(--large)); }
  }
}

@media (max-width: 340px) {
  .entete .marque { font-size: 0; gap: 0; min-width: 44px; justify-content: center; }
  .entete .wrap { width: min(100% - 16px, var(--large)); }
  .entete .outils { margin-left: 4px; }
  .entete .outils .btn { padding-inline: 13px; }
}

@media (min-width: 761px) and (max-width: 1023px) {
  .entete .wrap { grid-template-columns: max-content minmax(0, 1fr) max-content; gap: 12px; }
  .entete .menu {
    min-width: 0;
    max-width: 100%;
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  .entete .menu::-webkit-scrollbar { display: none; }
  .entete .menu a { flex: none; padding-inline: 12px; }
  .entete .menu a.menu-compte:not(.on) { display: none; }
  .entete .langbtn #langCur { display: none; }
  .entete .langbtn { padding-inline: 0; min-width: 44px; gap: 0; justify-content: center; }
  .entete #ctaAuth { padding-inline: 16px; }
  .entete .menu.defile-suite {
    -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 26px), transparent);
    mask-image: linear-gradient(to right, #000 calc(100% - 26px), transparent);
  }
  .entete .menu.defile-debut.defile-suite {
    -webkit-mask-image: linear-gradient(to right, transparent, #000 20px, #000 calc(100% - 26px), transparent);
    mask-image: linear-gradient(to right, transparent, #000 20px, #000 calc(100% - 26px), transparent);
  }
  .entete .menu.defile-debut:not(.defile-suite) {
    -webkit-mask-image: linear-gradient(to right, transparent, #000 20px);
    mask-image: linear-gradient(to right, transparent, #000 20px);
  }
}

@media (hover: none) and (pointer: coarse) {
  .entete .menu a, .entete .langbtn, .entete #ctaAuth, .entete .marque {
    min-height: 44px;
  }
  .entete .menu a { padding-block: 0; }
}

.menu a:active,
.accord a:active,
.pied a:active,
.lien-fleche:active,
.marque:active { opacity: .6; }
.marque, .langbtn { transition: transform .1s ease-out, color .18s, border-color .18s, background-color .18s; }
.marque:active, .langbtn:active { transform: scale(.97); }
.accord a:focus-visible,
.rassure a:focus-visible,
.sous-titre a:focus-visible { outline-offset: 1px; border-radius: 3px; }

@media (prefers-reduced-motion: no-preference) {
  html.bascule-theme,
  html.bascule-theme *,
  html.bascule-theme *::before,
  html.bascule-theme *::after {
    transition: background-color 220ms ease, color 220ms ease,
                border-color 220ms ease, fill 220ms ease, stroke 220ms ease,
                box-shadow 220ms ease !important;
  }
}

.themebtn { display: none; }


.tete-sec {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
  column-gap: clamp(32px, 7vw, 120px);
  align-items: end;
  margin-bottom: clamp(38px, 4.8vw, 66px);
}
.tete-sec > * { grid-column: 1; }
.tete-sec > .tete-sec-p {
  grid-column: 2;
  grid-row: 1 / span 4;
  align-self: end;
  margin: 0;
  max-width: 46ch;
  font-size: 15px;
  line-height: 1.65;
  color: var(--encre-2);
}
.tete-sec > .legende { justify-self: start; }
.tete-sec .legende:has(+ .titre) + .titre { margin-top: 18px !important; }

.scene-bloc { width: max-content; max-width: 100%; margin-inline: auto; }
.scene-bloc > .scene { max-width: 100%; margin-inline: 0; }
.tete-scene {
  margin: 0 0 clamp(24px, 3.4vh, 38px);
  max-width: 100%;
  text-align: center;
  font-size: clamp(2.2rem, 4.4vw, 3.6rem);
}

.ev-grille {
  width: min(100% - 48px, 1320px);
  display: grid;
  grid-template-columns: minmax(0, 360px) minmax(0, 1fr);
  column-gap: clamp(40px, 5vw, 76px);
  align-items: center;
}
.ev-texte .titre { font-size: clamp(1.9rem, 2.6vw, 2.35rem); }
.ev-etapes {
  --chap-axe: y;
  list-style: none;
  counter-reset: ev;
  margin: clamp(26px, 3vw, 36px) 0 0;
  padding: 0;
}
.ev-etapes li { counter-increment: ev; position: relative; }
.ev-etapes .chap {
  position: relative;
  display: flex;
  align-items: baseline;
  gap: 14px;
  width: 100%;
  margin: 0;
  padding: 10px 12px 10px 20px;
  border: 0;
  border-radius: 0 8px 8px 0;
  background: transparent;
  color: var(--encre-3);
  font: inherit;
  font-size: 15px;
  line-height: 1.35;
  text-align: left;
  cursor: pointer;
  transition: color .2s ease, background-color .2s ease;
}
.ev-etapes .chap::before {
  content: counter(ev, decimal-leading-zero);
  flex: none;
  font-size: 12px;
  font-weight: 500;
  color: var(--encre-3);
  font-variant-numeric: tabular-nums;
  transition: color .2s ease;
}
.ev-etapes .chap-t { min-width: 0; }
.ev-etapes .chap-barre {
  position: absolute;
  left: 0;
  top: 5px;
  bottom: 5px;
  width: 2px;
  border-radius: 2px;
  background: var(--trait);
  overflow: hidden;
  pointer-events: none;
}
.ev-etapes .chap-barre i {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: var(--action);
  transform: scaleY(0);
  transform-origin: 0 0;
}
.ev-etapes li.fait .chap { color: var(--encre-2); }
.ev-etapes li.fait .chap-barre i { background: var(--encre-3); }
.ev-etapes li.on .chap { color: var(--encre); }
.ev-etapes li.on .chap::before { color: var(--bleu-clair); }
@media (hover: hover) {
  .ev-etapes .chap:hover { color: var(--encre); background: rgba(255, 255, 255, .045); }
  .ev-etapes .chap:hover::before { color: var(--encre-2); }
  .ev-etapes li.on .chap:hover::before { color: var(--bleu-clair); }
}
.ev-etapes .chap:focus-visible { outline: 2px solid var(--action); outline-offset: -2px; }
.ev-etapes.chap-inerte .chap { cursor: default; }
.ev-etapes.chap-inerte .chap:hover { background: transparent; color: var(--encre-3); }
.ev-etapes.chap-inerte .chap-barre { display: none; }

.ev-etapes.chap-frise {
  --chap-axe: x;
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(0, 1fr);
  column-gap: 12px;
}
.chap-frise .chap {
  display: block;
  padding: 16px 12px 12px 0;
  border-radius: 0 0 8px 8px;
}
.chap-frise .chap::before { display: block; margin-bottom: 6px; }
.chap-frise .chap-barre {
  left: 0;
  right: 0;
  top: 0;
  bottom: auto;
  width: auto;
  height: 2px;
}
.chap-frise .chap-barre i { transform: scaleX(0); }
@media (hover: hover) {
  .chap-frise .chap:hover { background: transparent; }
}
@media (prefers-reduced-motion: reduce) {
  .ev-etapes .chap, .ev-etapes .chap::before { transition: none; }
}
.ev-cta {
  margin: clamp(28px, 3.2vw, 40px) 0 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px 24px;
}
.ev-cta .lien-fleche { width: fit-content; }
.ev-sous { margin: 12px 0 0; max-width: 34ch; font-size: 12.5px; line-height: 1.55; color: var(--encre-3); }
.ev-scene { min-width: 0; }
.ev-scene .ea { margin: 0; max-width: none; }
.ev-pied {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  column-gap: clamp(24px, 3vw, 44px);
  align-items: start;
  margin-top: 22px;
}
.ev-pied .ea-sources { justify-content: flex-start; margin: 0; }
.ev-pied .ea-vrai { margin: 0; max-width: none; }
@media (min-width: 1001px) {
  .ev-grille.miroir { grid-template-columns: minmax(0, 1fr) minmax(0, 360px); }
  .ev-grille.miroir > .ev-scene { grid-column: 1; grid-row: 1; }
  .ev-grille.miroir > .ev-texte { grid-column: 2; grid-row: 1; }
}
.ev-scene > .ea-vrai { margin: 22px 0 0; max-width: 720px; }
#bibliotheque .ev-cta { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; }
#vent .ev-scene > .ea-vrai { margin: 22px 0 0; max-width: 720px; }
@media (min-width: 1001px) {
  #vent .ev-grille {
    width: min(100% - 48px, 1280px);
    grid-template-columns: minmax(0, 1fr) minmax(0, 320px);
    column-gap: clamp(32px, 4vw, 60px);
    align-items: start;
  }
  #vent .ev-grille > .ev-texte,
  #vent .ev-grille > .ev-scene { display: contents; }

  #vent .ev-grille > .ev-texte > .legende { grid-column: 1; grid-row: 1; }
  #vent .ev-grille > .ev-texte > .titre { grid-column: 1; grid-row: 2; max-width: 20ch; }
  #vent .ev-grille > .ev-scene > .ea,
  #vent .ev-grille > .ev-scene > .ea-fenetre {
    grid-column: 1 / -1;
    grid-row: 3;
    margin-top: clamp(26px, 3vw, 38px);
  }
  #vent .ev-grille > .ev-texte > .ev-etapes { grid-column: 1 / -1; grid-row: 4; }
  #vent .ev-grille > .ev-texte > .ev-cta { grid-column: 1; grid-row: 5; }
  #vent .ev-grille > .ev-scene > .ea-vrai {
    grid-column: 2;
    grid-row: 5;
    margin: clamp(28px, 3.2vw, 40px) 0 0;
    max-width: none;
  }

  #vent .ea { height: auto; aspect-ratio: 16 / 10; max-width: none; }

  #vent .ev-etapes {
    --chap-axe: x;
    display: grid;
    grid-auto-flow: column;
    grid-auto-columns: minmax(0, 1fr);
    column-gap: 12px;
    margin-top: clamp(20px, 2.2vw, 28px);
  }
  #vent .ev-etapes .chap { display: block; padding: 16px 12px 12px 0; border-radius: 0; }
  #vent .ev-etapes .chap::before { display: block; margin-bottom: 6px; }
  #vent .ev-etapes .chap-barre { left: 0; right: 0; top: 0; bottom: auto; width: auto; height: 2px; }
  #vent .ev-etapes .chap-barre i { transform: scaleX(0); }
}
@media (min-width: 1001px) and (hover: hover) {
  #vent .ev-etapes .chap:hover { background: transparent; }
}
@media (min-width: 1001px) and (max-width: 1239px) {
  #vent .ev-etapes {
    grid-auto-flow: row;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    row-gap: 10px;
  }
}


.ch-grille {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr);
  column-gap: clamp(40px, 6vw, 100px);
  align-items: center;
}
.ch-grille > .chiffres { grid-column: 1; grid-row: 1; margin: 0; }
.ch-grille > .ch-tete { grid-column: 2; grid-row: 1; }
.ch-tete .ch-source { margin: 22px 0 0; max-width: 44ch; }
.ch-grille .chiffres {
  grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr);
  grid-template-rows: repeat(3, auto);
  border-top: 0;
  border-bottom: 0;
}
.ch-grille .ch-case + .ch-case { border-left: 0; }
.ch-grille .ch-case:first-child {
  grid-row: 1 / span 3;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding-left: 0;
  border-right: 1px solid var(--trait);
}
.ch-grille .ch-case:first-child .ch-n { font-size: clamp(3.4rem, 6.2vw, 5.8rem); letter-spacing: -0.055em; white-space: nowrap; }
.ch-grille .ch-case:nth-child(n + 2) { padding-block: clamp(18px, 2vw, 26px); }
.ch-grille .ch-case:nth-child(n + 3) { border-top: 1px solid var(--trait); }
.ch-grille .ch-case:nth-child(n + 2) .ch-n { font-size: clamp(2rem, 3.2vw, 2.8rem); }

.gestes-grille {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.35fr);
  column-gap: clamp(40px, 6vw, 100px);
  align-items: start;
}
.gestes-tete { position: sticky; top: calc(var(--entete-h) + 40px); }
.gestes.escalier { grid-template-columns: 1fr; gap: 14px; margin-top: 0; }
.gestes.escalier .geste {
  width: 80%;
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  column-gap: 20px;
  align-items: start;
}
.gestes.escalier .geste .n { grid-row: 1 / span 2; margin: 0; }
.gestes.escalier .geste > b { margin-top: 5px; }
.gestes.escalier .geste:nth-child(2) { margin-left: 10%; }
.gestes.escalier .geste:nth-child(3) { margin-left: 20%; }



.mosaique.duo.inegale { max-width: none; margin-inline: 0; grid-template-columns: minmax(0, 1.18fr) minmax(0, 1fr); }

.acte-grille {
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
  column-gap: clamp(40px, 5vw, 80px);
  align-items: center;
}
.acte-texte .titre { font-size: clamp(2.2rem, 4.1vw, 3.5rem); }
.acte-texte .actions { justify-content: flex-start; margin-top: clamp(28px, 3vw, 40px); }
.acte-note { margin: 14px 0 0; font-size: 12.5px; color: var(--encre-3); }
.acte-grille .acte-affiche {
  margin: 0 calc((100vw - min(100vw - 48px, var(--large))) / -2 - 40px) 0 0;
  max-width: none;
  border-radius: var(--r-l) 0 0 var(--r-l);
}

.acte.acte-exports > .wrap.acte-grille { grid-template-columns: minmax(0, 1fr); gap: 40px; }
.acte.acte-exports > .wrap.acte-grille .ef-flow { margin: 0; padding: 0; border: 1px solid #303030; border-radius: 24px; background: #0D0D0D; overflow: hidden; }
.ef-flow { line-height: 1.5; color: #E5E5E7; }
.prep-header { padding: 32px 36px 0; }
.prep-header h3 { margin: 0; font-size: clamp(23px, 2.2vw, 30px); font-weight: 600; letter-spacing: -.025em; line-height: 1.25; max-width: 34ch; }
.prep-steps { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .95fr) minmax(0, 1.05fr); list-style: none; padding: 0; margin: 28px 0 0; }
.prep-steps > li { position: relative; min-width: 0; padding: 8px 36px 36px; }
.prep-steps > li + li { border-left: 1px solid #303030; }
.prep-stage { margin: 0 0 26px; display: flex; align-items: center; gap: 10px; color: #FFAD70; font-size: 13px; font-weight: 600; }
.prep-stage > span:first-child { width: 26px; height: 26px; display: grid; place-items: center; border: 1px solid #73513A; border-radius: 50%; font-size: 12px; flex: none; }
.prep-steps h4 { margin: 0 0 14px; font-size: clamp(20px, 1.7vw, 25px); font-weight: 600; line-height: 1.25; letter-spacing: -.02em; }
.prep-description { margin: 0; font-size: 14px; line-height: 1.65; color: #B5B5BB; }
.prep-files { margin-top: 24px; }
.prep-files > div { display: flex; gap: 12px; align-items: center; padding: 13px 0; border-top: 1px solid #292929; }
.prep-files svg { width: 30px; height: 30px; color: #B5B5BB; flex: none; }
.prep-files b { display: block; font-size: 14px; font-weight: 500; }
.prep-files small { display: block; margin-top: 4px; font-size: 11px; line-height: 1.6; color: #96969E; }
.prep-note { margin: 20px 0 0; color: #ACACB2; font-size: 12px; line-height: 1.65; }
.prep-work { background: #1C1713; }
.prep-work::before, .prep-result::before { content: '→'; position: absolute; top: 50%; left: -16px; display: grid; place-items: center; width: 30px; height: 30px; border: 1px solid #4A392B; border-radius: 50%; background: #1C1713; color: #FFAD70; z-index: 1; }
.ef-flow .prep-logo { display: block; width: 64px; height: 64px; object-fit: contain; margin-bottom: 22px; }
.prep-actions, .prep-checks { list-style: none; margin: 0; padding: 0; }
.prep-actions li { padding: 12px 0; border-top: 1px solid #3A2E25; font-size: 15px; line-height: 1.55; }
.prep-actions li:first-child { padding-top: 0; border-top: 0; }
.prep-checks { margin-top: 24px; }
.prep-checks li { position: relative; padding: 8px 0 8px 23px; font-size: 14px; }
.prep-checks li::before { content: '✓'; position: absolute; left: 0; color: #FFAD70; }
.ef-details { padding: 0 36px; border-top: 1px solid #303030; }
.ef-details summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 20px 0; cursor: pointer; color: #E5E5E7; font-size: 13px; }
.ef-details summary::-webkit-details-marker { display: none; }
.ef-details summary:hover { color: #FFAD70; }
.ef-details summary:focus-visible { outline: 2px solid #FFAD70; outline-offset: 4px; }
.ef-details-icon { font-size: 20px; line-height: 1; }
.ef-details[open] .ef-details-icon { transform: rotate(45deg); }
.prep-catalog { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 44px; padding: 12px 0 24px; }
.prep-catalog h4 { margin: 0 0 18px; font-size: 18px; font-weight: 500; }
.prep-catalog h5 { margin: 18px 0 8px; color: #ACACB2; font-size: 12px; font-weight: 500; }
.ef-flow dl, .ef-flow dd { margin: 0; }
.ef-sources > div { padding: 13px 0; border-top: 1px solid #292929; }
.ef-sources dt { font-size: 14px; font-weight: 500; margin-bottom: 6px; }
.ef-sources dd { font-size: 12px; line-height: 1.8; color: #ACACB2; }
.ef-formats, .ef-scenes code, .ef-formats-list dd { font-family: ui-monospace, 'Cascadia Mono', Consolas, monospace; }
.ef-scenes > div { display: grid; grid-template-columns: 80px minmax(0, 1fr); gap: 12px; padding: 12px 0; border-bottom: 1px solid #292929; }
.ef-scenes dt { font-size: 14px; font-weight: 500; }
.ef-scenes dd { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 5px 12px; }
.ef-scenes code { font-size: 12px; color: #FFAD70; }
.ef-scenes dd span { font-size: 12px; color: #ACACB2; }
.ef-formats-list > div { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 12px; padding: 8px 0; }
.ef-formats-list dt { font-size: 12px; color: #ACACB2; }
.ef-formats-list dd { font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; }
.ef-formats-list dd span { font: 11px sans-serif; color: #ACACB2; }
.ef-detail-body { padding: 20px 0 26px; border-top: 1px solid #292929; }
.ef-detail-body p { margin: 0 0 12px; font-size: 13px; line-height: 1.7; color: #ACACB2; max-width: 95ch; }
.ef-detail-body p:last-child { margin-bottom: 0; }
@media (min-width: 901px) {
  .acte-exports .acte-texte { display: flex; align-items: center; justify-content: space-between; gap: 32px; }
  .acte-exports .acte-texte .actions { margin-top: 0; }
}
@media (max-width: 1100px) {
  .prep-steps > li { padding-inline: 24px; }
  .prep-header, .ef-details { padding-inline: 24px; }
  .prep-stage { font-size: 12px; }
}
@media (max-width: 800px) {
  .prep-steps { grid-template-columns: minmax(0, 1fr); margin-top: 24px; }
  .prep-steps > li { padding: 28px; }
  .prep-steps > li + li { border-left: 0; border-top: 1px solid #303030; }
  .prep-stage { font-size: 13px; margin-bottom: 18px; }
  .prep-header { padding: 28px 28px 0; }
  .prep-header h3 { max-width: 22ch; }
  .prep-work::before, .prep-result::before { top: -16px; left: calc(50% - 15px); transform: rotate(90deg); }
  .ef-flow .prep-logo { float: right; width: 48px; height: 48px; margin: 0 0 12px 16px; }
  .prep-actions { clear: both; }
  .prep-catalog { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .ef-details { padding-inline: 28px; }
  .ef-scenes dd { flex-direction: column; align-items: start; }
  .ef-formats-list > div { grid-template-columns: minmax(0, 1fr); gap: 3px; }
}

.faq-grille {
  display: grid;
  grid-template-columns: minmax(0, .82fr) minmax(0, 1.38fr);
  column-gap: clamp(40px, 6vw, 100px);
  align-items: start;
}
.faq-tete { position: sticky; top: calc(var(--entete-h) + 40px); }
.faq-tete .faq-sortie { margin: 26px 0 0; max-width: 32ch; line-height: 1.6; }
.faq-grille .faq { max-width: none; margin: 0; }

.hero:not(.hero-duo),
.bandeau { text-align: left; }
.hero:not(.hero-duo) .display { margin: 22px 0 0; max-width: 18ch; }
.hero:not(.hero-duo) .wrap > .display:first-child { margin-top: 0; }
.hero:not(.hero-duo) .sous-titre,
.bandeau .sous-titre { margin-left: 0; margin-right: 0; max-width: 54ch; }
.hero:not(.hero-duo) .actions,
.bandeau .actions { justify-content: flex-start; }
.bandeau .ban-essai { margin-inline: 0; }

@media (min-width: 901px) {
  .gestes:not(.escalier),
  .claims.inegales,
  .grille.g3.inegales { grid-template-columns: minmax(0, 1.34fr) minmax(0, 1fr) minmax(0, 1fr); }
}

.scene-leg { margin: clamp(14px, 2vw, 20px) 0 0; max-width: 66ch; font-size: 13.5px; line-height: 1.65; color: var(--encre-2); }
.acte-grille.acte-inverse { grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); }
.acte-grille.acte-inverse .acte-affiche {
  margin: 0 0 0 calc((100vw - min(100vw - 48px, var(--large))) / -2 - 40px);
  border-radius: 0 var(--r-l) var(--r-l) 0;
}

section > .wrap.etroit:not(:has(> .carte.centre)) {
  margin-left: max(24px, calc((100% - var(--large)) / 2));
  margin-right: auto;
}

.wrap.etroit:has(> .prose) { max-width: var(--large); }
.prose {
  max-width: none;
  display: grid;
  grid-template-columns: minmax(0, 290px) minmax(0, 70ch);
  column-gap: clamp(40px, 6vw, 100px);
  align-items: start;
}
.prose > * { grid-column: 2; }
.prose > h1 {
  grid-column: 1;
  grid-row: 1 / span 400;
  position: sticky;
  top: calc(var(--entete-h) + 36px);
  font-size: clamp(1.9rem, 2.6vw, 2.5rem);
  text-wrap: balance;
}
.prose > h2:first-of-type { margin-top: 36px; }
.prose > .foinote { justify-self: start; }

@media (min-width: 1081px) {
  .tarifs { grid-template-columns: minmax(0, 1fr) minmax(0, 1.16fr) minmax(0, 1fr) minmax(0, 1fr); }
}
.tarifs-note { margin: 22px 0 0; max-width: 72ch; font-size: 13px; color: var(--encre-3); }

@media (max-width: 1000px) {
  .ev-grille { grid-template-columns: 1fr; row-gap: 34px; }
  .ev-pied { grid-template-columns: 1fr; row-gap: 14px; }
}
@media (max-width: 900px) {
  .tete-sec,
  .ch-grille,
  .gestes-grille,
  .acte-grille,
  .faq-grille { grid-template-columns: 1fr; row-gap: 30px; }
  .tete-sec > .tete-sec-p { grid-column: 1; grid-row: auto; }
  .ch-grille > .ch-tete { grid-column: 1; grid-row: 1; }
  .ch-grille > .chiffres { grid-row: 2; }
  .gestes-tete, .faq-tete { position: static; }
  .gestes.escalier .geste,
  .gestes.escalier .geste:nth-child(2),
  .gestes.escalier .geste:nth-child(3) { width: 100%; margin-left: 0; }
  .acte-grille .acte-affiche { margin: 0; border-radius: var(--r-l); }
  .mosaique.duo.inegale { grid-template-columns: 1fr; }
  .acte-grille.acte-inverse { grid-template-columns: 1fr; }
  .acte-grille.acte-inverse .acte-affiche { margin: 0; border-radius: var(--r-l); }
  .prose { grid-template-columns: 1fr; }
  .prose > h1 { grid-column: 1; grid-row: auto; position: static; }
  .prose > * { grid-column: 1; }
}
@media (max-width: 760px) {
  .ch-grille .chiffres { grid-template-columns: 1fr 1fr; grid-template-rows: none; }
  .ch-grille .ch-case:first-child { grid-column: 1 / span 2; grid-row: auto; border-right: 0; }
  .ch-grille .ch-case:nth-child(2) { border-top: 1px solid var(--trait); }
  .ch-grille .ch-case:nth-child(3) { border-left: 1px solid var(--trait); }
}

@media (min-width: 1101px) {
  main > section > .wrap.grille-barre,
  main > section > .wrap.cote-d,
  main > section > .wrap.cote-g,
  #bibliotheque > .ev-grille { width: min(100% - 48px, 1280px); max-width: none; margin-inline: auto; }
  #montage .ev-scene .ea,
  #bibliotheque .ev-scene .ea { max-width: 1300px; }
}
@media (min-width: 1400px) {
  main > section {
    --bord: clamp(32px, calc(3vw - 12px), 64px);
    --axe: max(var(--bord), calc((100% - 1280px) / 2));
  }
  main > section > .wrap.cote-d { width: auto; margin-left: var(--axe); margin-right: var(--bord); }
  main > section > .wrap.cote-g,
  #bibliotheque > .ev-grille { width: auto; margin-left: var(--bord); margin-right: var(--axe); }

  #chiffres > .wrap.grille-barre > .chiffres {
    margin-left: calc((100vw - 1280px) / -2);
    padding-left: calc((100vw - 1280px) / 2);
    background-color: var(--papier);
    border: 1px solid var(--trait);
    border-left: 0;
    border-radius: 0 var(--r-l) var(--r-l) 0;
  }

  #temps > .wrap.grille-barre .carte-gain:first-child {
    margin-left: calc((100vw - 1280px) / -2);
    padding-left: calc((100vw - 1280px) / 2 + clamp(24px, 2.2vw, 30px));
    border-left: 0;
    border-radius: 0 var(--r-l) var(--r-l) 0;
  }

  .acte > .wrap.grille-barre .acte-affiche { margin-right: calc((100vw - 1280px) / -2); }
}

@media (min-width: 1400px) and (min-height: 880px) {
  #cadreLauncher { width: 1280px; height: 800px; }
}
@media (min-width: 1600px) and (min-height: 940px) {
  #cadreLauncher {
    width: clamp(1344px, (100svh - var(--entete-h) - 24px) * 1.6, min(1560px, 100vw - 2 * var(--bord) - 64px));
    height: auto;
    aspect-ratio: 16 / 10;
  }
}


.pa-ouverture { padding-block: clamp(40px, 7svh, 96px) clamp(40px, 6svh, 88px); }
.pa-ouverture-grille {
  display: grid;
  grid-template-columns: minmax(0, 1.36fr) minmax(0, .82fr);
  grid-template-rows: 1fr auto auto;
  column-gap: clamp(40px, 6vw, 120px);
  align-items: end;
}
.pa-ouverture-grille > * { grid-column: 1; }
.pa-ouverture-grille > .dock { grid-column: 2; grid-row: 1 / span 3; align-self: end; }
.pa-ouverture-grille > .pa-titre { grid-row: 2; }
.pa-ouverture-grille > .pa-lead { grid-row: 3; }
.pa-titre {
  margin: 0;
  max-width: none;
  font-size: clamp(2.8rem, 4.3vw, 4.3rem);
  line-height: 1.02;
  letter-spacing: -0.044em;
}
.pa-lead {
  margin: 30px 0 0;
  max-width: 44ch;
  font-size: clamp(1.18rem, 1.5vw, 1.5rem);
  line-height: 1.55;
  letter-spacing: -0.008em;
  color: var(--encre-2);
  text-wrap: pretty;
}

.pa-ouverture .dock {
  display: grid;
  gap: 12px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
}
.pa-ouverture .dock a {
  display: flex;
  align-items: center;
  gap: 18px;
  min-height: 92px;
  padding: 18px 26px 18px 22px;
  border-radius: var(--r-l);
  border: 1px solid var(--trait);
  background-color: var(--papier);
  color: var(--encre);
  transition: border-color .2s, background-color .2s;
}
.pa-ouverture .dock a:hover {
  border-color: rgba(179, 179, 179, .38);
  background-color: #101010;
}
.pa-ouverture .dock a img { width: 48px; height: 48px; flex: none; }
.pa-som { display: grid; gap: 3px; min-width: 0; }
.pa-som b { font-size: clamp(1.2rem, 1.45vw, 1.45rem); font-weight: 500; letter-spacing: -0.02em; line-height: 1.2; }
.pa-som span { font-size: 15.5px; line-height: 1.4; color: var(--encre-2); }
@media (min-width: 1101px) {
  .pa-ouverture .dock a:nth-child(2) { margin-left: 8%; }
  .pa-ouverture .dock a:nth-child(3) { margin-left: 16%; }
}

.pa-chap { padding-block: clamp(96px, 11vw, 176px) 0; }
.pa-tete {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(0, .8fr);
  column-gap: clamp(40px, 6vw, 120px);
  align-items: end;
  margin-bottom: clamp(48px, 5.4vw, 84px);
}
.pa-marque {
  display: flex;
  align-items: center;
  gap: 14px;
  margin: 0 0 28px;
}
.pa-marque img { width: 44px; height: 44px; flex: none; }
.pa-marque b { font-size: clamp(1.25rem, 1.6vw, 1.55rem); font-weight: 500; letter-spacing: -0.02em; line-height: 1.2; }
.pa-h {
  font-size: clamp(2.4rem, 4.3vw, 4.15rem);
  line-height: 1.04;
  letter-spacing: -0.038em;
  font-weight: 500;
  max-width: 17ch;
  text-wrap: balance;
}
.pa-h3 {
  font-size: clamp(1.6rem, 2.3vw, 2.2rem);
  line-height: 1.12;
  letter-spacing: -0.028em;
  font-weight: 500;
  text-wrap: balance;
}
.pa-chapeau {
  margin: 0;
  max-width: 40ch;
  font-size: clamp(1.15rem, 1.4vw, 1.4rem);
  line-height: 1.6;
  letter-spacing: -0.006em;
  color: var(--encre-2);
  text-wrap: pretty;
}
.pa-texte { margin: 0; font-size: 18px; line-height: 1.65; color: var(--encre-2); max-width: 46ch; }
.pa-leg { margin: 0; font-size: 15px; line-height: 1.65; color: var(--encre-3); max-width: 72ch; }
.pa-note { margin: 16px 0 0; font-size: 15px; line-height: 1.55; color: var(--encre-3); }
.pa-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 16px 28px;
  margin: 34px 0 0;
}
.pa-actions .lien-fleche { font-size: 16.5px; }

.pa-passage { display: grid; justify-items: center; gap: 16px; }
.pa-passage img {
  width: 56px;
  height: 56px;
  filter: drop-shadow(0 12px 26px rgba(106, 106, 106, .55));
}
.pa-fleche {
  position: relative;
  display: block;
  width: clamp(44px, 4.6vw, 88px);
  height: 2px;
  border-radius: 2px;
  background: linear-gradient(90deg, rgba(179, 179, 179, .15), var(--bleu-clair));
}
.pa-fleche::after {
  content: '';
  position: absolute;
  right: -1px;
  top: 50%;
  width: 9px;
  height: 9px;
  border-top: 2px solid var(--bleu-clair);
  border-right: 2px solid var(--bleu-clair);
  transform: translateY(-50%) rotate(45deg);
}

.pa-livraison {
  display: grid;
  grid-template-columns: minmax(0, .9fr) auto minmax(0, 1.3fr);
  column-gap: clamp(18px, 2.4vw, 40px);
  row-gap: 22px;
  align-items: center;
}
.pa-livraison > .pa-leg { grid-column: 1 / -1; }
.pa-dossier {
  margin: 0;
  padding: clamp(24px, 2.6vw, 38px);
  border-radius: 22px;
  border: 1px solid var(--trait);
  background-color: var(--papier);
  min-width: 0;
}
.pa-sortie { border-color: rgba(179, 179, 179, .28); background-color: #0F0F0F; }
.pa-dossier-t {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0 0 20px;
  font-size: 15px;
  font-weight: 500;
  color: var(--bleu-clair);
}
.pa-dossier-t::before {
  content: '';
  width: 7px;
  height: 7px;
  flex: none;
  border-radius: 50%;
  background: var(--bleu-clair);
}
.pa-racine,
.pa-fichiers { font-family: ui-monospace, "Cascadia Mono", Consolas, Menlo, monospace; }
.pa-racine {
  margin: 0 0 12px;
  font-size: 16px;
  color: var(--encre);
  overflow-wrap: anywhere;
}
.pa-fichiers {
  margin: 0;
  padding: 0 0 0 16px;
  list-style: none;
  border-left: 1px solid var(--trait-fort);
  font-size: 15px;
  line-height: 1.9;
  color: var(--encre-2);
}
.pa-fichiers li { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pa-fichiers .ext { color: var(--bleu-clair); }
.pa-groupes {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 30px clamp(20px, 2.4vw, 36px);
}
.pa-groupe-t { margin: 0 0 10px; font-size: 16px; font-weight: 500; line-height: 1.35; color: var(--encre); }

.pa-duel {
  display: grid;
  grid-template-columns: minmax(0, .92fr) minmax(0, 1.08fr);
  gap: clamp(16px, 2vw, 26px);
  margin-top: clamp(64px, 7vw, 112px);
}
.pa-main,
.pa-avec { padding: clamp(28px, 3.2vw, 52px); border-radius: 24px; }
.pa-main { border: 1px solid var(--trait); }
.pa-avec {
  border: 1px solid rgba(179, 179, 179, .34);
  background-color: #111111;
}
.pa-duel-t { margin: 0 0 20px; font-size: 15px; font-weight: 500; color: var(--encre-3); }
.pa-avec .pa-duel-t { color: var(--bleu-clair); }
.pa-etapes { margin: 0; padding: 0; list-style: none; counter-reset: pa; }
.pa-etapes li {
  counter-increment: pa;
  display: flex;
  align-items: baseline;
  gap: 18px;
  padding: 12px 0;
  border-top: 1px solid var(--trait);
  font-size: 18px;
  line-height: 1.45;
  color: var(--encre-2);
}
.pa-etapes li::before {
  content: counter(pa, decimal-leading-zero);
  flex: none;
  font-size: 13px;
  font-weight: 500;
  color: var(--encre-3);
  font-variant-numeric: tabular-nums;
}
.pa-verdict { margin: 20px 0 0; font-size: 16.5px; line-height: 1.55; color: var(--encre-3); }
.pa-seul {
  margin: 4px 0 0;
  font-size: clamp(2.3rem, 4vw, 3.8rem);
  line-height: 1.04;
  letter-spacing: -0.038em;
  font-weight: 500;
  color: var(--encre);
}
.pa-avec .pa-verdict { max-width: 34ch; font-size: 18px; color: var(--encre-2); }
.pa-puces { display: flex; flex-wrap: wrap; gap: 9px; margin: 30px 0 0; padding: 0; list-style: none; }
.pa-puces li {
  padding: 9px 16px;
  border-radius: var(--r-pill);
  border: 1px solid var(--trait-fort);
  background: rgba(255, 255, 255, .03);
  font-size: 15px;
  font-weight: 500;
  color: var(--encre);
}

.pa-bande { margin-top: clamp(64px, 7vw, 112px); }
.pa-conv {
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr);
  align-items: center;
  column-gap: clamp(12px, 1.5vw, 24px);
}
.pa-source {
  display: grid;
  justify-items: center;
  gap: 10px;
  width: clamp(132px, 12.5vw, 172px);
  padding: 20px 14px;
  border: 1px solid var(--trait);
  border-radius: 22px;
  background:
    radial-gradient(120% 90% at 50% 0%, rgba(179, 179, 179, .12), transparent 70%),
    rgba(255, 255, 255, .02);
  color: var(--bleu-clair);
}
.pa-fichier { display: block; width: 36px; height: 44px; }
.pa-src-t { font-size: 14.5px; line-height: 1.3; text-align: center; color: var(--encre); }
.pa-src-ext { display: flex; flex-wrap: wrap; justify-content: center; gap: 5px; }
.pa-fmt {
  padding: 3px 8px;
  border: 1px solid var(--trait);
  border-radius: 999px;
  font-size: 12px;
  line-height: 1.25;
  color: var(--encre-3);
  animation: pa-fmt 6s linear infinite;
  animation-delay: calc(var(--i) * 1.2s);
}
@keyframes pa-fmt {
  0%, 9% { color: var(--encre); border-color: rgba(179, 179, 179, .55); background: rgba(179, 179, 179, .14); }
  22%, 100% { color: var(--encre-3); border-color: var(--trait); background: transparent; }
}
.pa-fleche { color: var(--bleu-clair); }
.pa-fleche svg { display: block; width: clamp(56px, 7vw, 132px); height: 16px; }
.pa-fleche .pa-trait { opacity: .45; animation: pa-file 1.6s linear infinite; }
.pa-fleche .pa-pulse { animation: pa-pulse 1.9s ease-in-out infinite; }
@keyframes pa-file { to { stroke-dashoffset: -15px; } }
@keyframes pa-pulse {
  0% { transform: translateX(0); opacity: 0; }
  12% { opacity: 1; }
  78% { opacity: .85; }
  100% { transform: translateX(94px); opacity: 0; }
}
.pa-mur {
  overflow: hidden;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 28px, #000 calc(100% - 110px), transparent);
  mask-image: linear-gradient(90deg, transparent, #000 28px, #000 calc(100% - 110px), transparent);
}
.pa-train { display: flex; gap: 14px; width: max-content; animation: pa-defile 72s linear infinite; }
@keyframes pa-defile { to { transform: translateX(calc(-50% - 7px)); } }
.pa-mur:hover .pa-train,
.pa-mur:focus-within .pa-train { animation-play-state: paused; }
.pa-train figure {
  position: relative;
  margin: 0;
  width: clamp(150px, 14vw, 196px);
  aspect-ratio: 1 / 1;
  border-radius: 20px;
  overflow: hidden;
  border: 1px solid var(--trait);
  background: #151416;
  transition: transform .35s cubic-bezier(.2, .7, .3, 1), border-color .35s;
}
.pa-train figure:hover { transform: translateY(-6px); border-color: rgba(179, 179, 179, .5); }
.pa-train img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pa-train figcaption b {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  white-space: normal;
  line-height: 1.25;
}
.pa-train figcaption span { display: block; margin-top: 2px; color: var(--encre-3); font-size: 12px; }
@media (prefers-reduced-motion: reduce) {
  .pa-fleche .pa-trait { animation: none; }
  .pa-fleche .pa-pulse { animation: none; }
  .pa-fmt { animation: none; color: var(--encre); }
  .pa-train { animation: none; }
  .pa-mur { overflow-x: auto; scroll-snap-type: x proximity; }
  .pa-train figure { scroll-snap-align: start; }
}
.pa-cibles { list-style: none; margin: 26px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 12px 32px; }
.pa-cibles li { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
.pa-cibles b {
  font-size: 12px;
  font-weight: 500;
  letter-spacing: .09em;
  text-transform: uppercase;
  color: var(--encre-3);
}
.pa-cibles span {
  padding: 7px 14px;
  border: 1px solid var(--trait);
  border-radius: 999px;
  font-size: 14.5px;
  line-height: 1.2;
  color: var(--encre);
  background: rgba(255, 255, 255, .02);
}
.pa-train figcaption,

.pa-arbre figcaption {
  position: absolute;
  left: 10px;
  right: 10px;
  bottom: 10px;
  padding: 7px 13px;
  border-radius: var(--r-pill);
  background: rgba(10, 10, 11, .82);
  border: 1px solid rgba(192, 192, 192, .18);
  font-size: 13.5px;
  font-weight: 500;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.pa-bande > .pa-leg { margin-top: 18px; }

.pa-ab {
  display: grid;
  grid-template-columns: minmax(0, 1.14fr) minmax(0, .86fr);
  column-gap: clamp(40px, 6vw, 120px);
  row-gap: 22px;
  align-items: center;
}
.pa-ab-visuel { position: relative; padding-bottom: 17%; min-width: 0; }
.pa-capture {
  margin: 0;
  line-height: 0;
  border-radius: 18px;
  overflow: hidden;
  background: var(--papier);
  box-shadow: var(--anneau);
}
.pa-capture img { width: 100%; height: auto; display: block; }
.pa-capture-grille {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 54%;
  box-shadow: var(--anneau);
}
.pa-capture-mur { width: 88%; }
.pa-ab-texte { min-width: 0; }
.pa-ab .pa-h { max-width: 14ch; }

.pa-geste {
  display: grid;
  grid-template-columns: 3.2rem minmax(0, 1fr);
  column-gap: 18px;
  padding: 26px 0 4px;
  border-top: 1px solid var(--trait-fort);
}
.pa-geste + .pa-geste { margin-top: 18px; }
.pa-geste-n {
  font-size: clamp(1.9rem, 2.6vw, 2.5rem);
  font-weight: 400;
  line-height: 1;
  letter-spacing: -0.04em;
  color: var(--bleu-clair);
  font-variant-numeric: tabular-nums;
}
.pa-geste > div > b { display: block; margin: 2px 0 10px; font-size: 20px; font-weight: 500; line-height: 1.3; letter-spacing: -0.016em; color: var(--encre); }
.pa-geste > div > p { margin: 0; font-size: 17px; line-height: 1.65; color: var(--encre-2); }
.pa-geste > div > p b { color: var(--encre); font-weight: 500; }

.pa-rig {
  display: grid;
  grid-template-columns: minmax(0, .78fr) minmax(0, 1fr) auto minmax(0, 1fr);
  column-gap: clamp(18px, 2.4vw, 40px);
  align-items: center;
}
.pa-rig-chiffre { min-width: 0; }
.pa-rig-n {
  display: block;
  font-size: clamp(3.4rem, 6.2vw, 6.2rem);
  font-weight: 400;
  line-height: .95;
  letter-spacing: -0.055em;
  color: var(--encre);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.pa-rig-t { margin: 14px 0 0; max-width: 20ch; font-size: 18px; line-height: 1.45; color: var(--encre-2); }
.pa-rig-chiffre .pa-leg { margin-top: 24px; max-width: 34ch; }
.pa-arbre {
  position: relative;
  margin: 0;
  aspect-ratio: 1 / 1;
  border-radius: 22px;
  overflow: hidden;
  border: 1px solid var(--trait);
  background: #121113;
  min-width: 0;
}
.pa-arbre img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pa-arbre-rig { border-color: rgba(179, 179, 179, .34); }

.pa-vent {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  column-gap: clamp(40px, 6vw, 120px);
  align-items: center;
  margin-top: clamp(72px, 8vw, 128px);
}
.pa-vent-scene { display: grid; gap: clamp(14px, 1.6vw, 22px); align-content: start; min-width: 0; }
.pa-vent-cadre { min-width: 0; border-radius: 22px; border: 1px solid var(--trait); background: #121113; }
.vt-fixes { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.vt-fixes > * { width: 100%; height: auto; display: block; border-radius: 16px; border: 1px solid var(--trait); background: #151416; }
.pa-forces {
  display: grid;
  gap: 22px;
  margin: 0;
  padding: clamp(28px, 3.2vw, 52px);
  list-style: none;
  border-radius: 24px;
  border: 1px solid var(--trait);
  background-color: var(--papier);
}
.pa-forces li {
  display: grid;
  grid-template-columns: minmax(8.5em, auto) minmax(0, 1fr) minmax(5.5em, auto);
  align-items: center;
  column-gap: 20px;
  font-size: 18px;
}
.pa-force-n { font-weight: 500; color: var(--encre); transition: color .3s ease; }
.pa-forces li.on .pa-force-n { color: var(--bleu-clair); }
.pa-forces li.on .pa-force-v { color: var(--encre); }
.pa-forces li.on .pa-force-barre::after { box-shadow: 0 0 20px rgba(179, 179, 179, .55); }
.pa-force-barre::after { transition: box-shadow .3s ease; }
.pa-force-v { text-align: right; color: var(--encre-2); font-variant-numeric: tabular-nums; white-space: nowrap; }
.pa-force-barre { position: relative; height: 10px; border-radius: var(--r-pill); background: rgba(255, 255, 255, .06); overflow: hidden; }
.pa-force-barre::after {
  content: '';
  position: absolute;
  inset: 0 auto 0 0;
  border-radius: inherit;
  background: linear-gradient(90deg, rgba(106, 106, 106, .55), var(--bleu-clair));
}
.pa-forces li:nth-child(1) .pa-force-barre::after { width: 12.5%; }
.pa-forces li:nth-child(2) .pa-force-barre::after { width: 34.375%; }
.pa-forces li:nth-child(3) .pa-force-barre::after { width: 62.5%; }
.pa-forces li:nth-child(4) .pa-force-barre::after { width: 100%; }
.pa-vent-texte .pa-h3 { margin: 0 0 18px; }
.pa-points { display: grid; gap: 18px; margin: 30px 0 0; padding: 0; list-style: none; }
.pa-points li { display: grid; gap: 4px; padding-left: 20px; border-left: 2px solid rgba(179, 179, 179, .4); }
.pa-points b { font-size: 18px; font-weight: 500; color: var(--encre); }
.pa-points span { font-size: 16.5px; line-height: 1.6; color: var(--encre-2); }

.pa-logiciels { padding-top: clamp(112px, 12vw, 192px); }
.pa-logiciels-grille {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
  column-gap: clamp(40px, 6vw, 120px);
  align-items: start;
}
.pa-logiciels-grille .pa-chapeau { margin-top: 26px; }
.pa-familles { display: grid; gap: 30px; }
.pa-famille { padding-top: 20px; border-top: 1px solid var(--trait); }
.pa-famille-t { margin: 0 0 14px; font-size: 15px; font-weight: 500; color: var(--encre-3); }
.pa-famille .dcc { justify-content: flex-start; gap: 10px; margin: 0; }
.pa-famille .dcc span { padding: 10px 19px; font-size: 16.5px; color: var(--encre); }

.pa-appel-grille {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr);
  column-gap: clamp(40px, 6vw, 120px);
  align-items: end;
}
.pa-appel-h { max-width: 14ch; font-size: clamp(2.6rem, 4.8vw, 4.6rem); }
.pa-appel .pa-actions { justify-content: flex-start; }

@media (min-width: 1400px) {
  main > section > .wrap.cote-d.pa-bande { margin-right: 0; }
}

@media (max-width: 1320px) {
  .pa-livraison { grid-template-columns: minmax(0, 1fr); }
  .pa-livraison > .pa-passage { grid-auto-flow: column; justify-content: start; align-items: center; }
  .pa-livraison > .pa-passage .pa-fleche { transform: rotate(90deg); margin-left: 10px; }
}
@media (max-width: 1240px) {
  .pa-rig { grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); row-gap: 34px; }
  .pa-rig > .pa-rig-chiffre { grid-column: 1 / -1; }
}
@media (max-width: 1100px) {
  .pa-ouverture-grille,
  .pa-tete,
  .pa-duel,
  .pa-ab,
  .pa-vent,
  .pa-logiciels-grille,
  .pa-appel-grille { grid-template-columns: minmax(0, 1fr); row-gap: 30px; }
  .pa-ouverture-grille { grid-template-rows: none; }
  .pa-ouverture-grille > .dock,
  .pa-ouverture-grille > .pa-titre,
  .pa-ouverture-grille > .pa-lead { grid-row: auto; }
  .pa-ouverture-grille > .dock { grid-column: 1; margin-top: 18px; }
  .pa-ab-texte { grid-row: 1; }
  .pa-vent-texte { grid-row: 1; }
  .pa-conv { grid-template-columns: auto minmax(0, 1fr); row-gap: 16px; }
  .pa-fleche { display: none; }
}
@media (max-width: 760px) {
  .pa-titre { font-size: clamp(2.4rem, 10vw, 3.2rem); }
  .pa-h { font-size: clamp(2rem, 8.4vw, 2.6rem); }
  .pa-chap { padding-top: clamp(72px, 18vw, 104px); }
  .pa-ouverture .dock a { min-height: 76px; padding: 14px 18px; gap: 14px; }
  .pa-ouverture .dock a img { width: 40px; height: 40px; }
  .pa-groupes { grid-template-columns: minmax(0, 1fr); gap: 24px; }
  .pa-rig { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 12px; }
  .pa-rig > .pa-passage { display: none; }
  .pa-conv { grid-template-columns: minmax(0, 1fr); row-gap: 14px; }
  .pa-source { width: auto; grid-auto-flow: column; justify-items: start;
    align-items: center; gap: 12px; padding: 12px 16px; }
  .pa-src-t, .pa-src-ext { text-align: left; }
  .pa-forces li { grid-template-columns: minmax(0, 1fr) auto; row-gap: 8px; font-size: 16.5px; }
  .pa-forces .pa-force-barre { grid-column: 1 / -1; grid-row: 2; }
  .pa-etapes li { font-size: 17px; }
  .pa-arbre figcaption, .pa-train figcaption { font-size: 12.5px; white-space: normal; line-height: 1.25; }
  .pa-train figcaption span { font-size: 12.5px; }
  .pa-fichiers li { white-space: normal; overflow-wrap: anywhere; line-height: 1.5; padding-block: 3px; }
}

@media (hover: none) and (pointer: coarse) and (min-width: 1001px) and (max-width: 1400px) {
  .ev-grille,
  .ev-grille.miroir { grid-template-columns: minmax(0, 1fr); row-gap: 34px; }
  .ev-grille.miroir > .ev-scene,
  .ev-grille.miroir > .ev-texte { grid-column: auto; grid-row: auto; }
}

@media (max-width: 760px) {
  .ea-vrai, .scene-leg, .claim span, .rassure span,
  .pr-lib span, .pr-vide {
    font-size: 15px;
    line-height: 1.6;
  }
  .ch-source, .ev-sous, .hero-note, .acte-note, .tarifs-note,
  .dl-note, .dl-meta, .legende, .estim-lecture small, .pr-note,
  .carte-gain .gain-lg, .bilan, .faq-sortie,
  .prose .maj, .prose .foinote, .ab-affiche figcaption, .sieges-n,
  .accord, .tiers-ou {
    font-size: 14px;
    line-height: 1.55;
  }
  .ev-sous { max-width: 44ch; }
  .postes li, .empreinte > summary { font-size: 13.5px; }
  .postes em { font-size: 12.5px; }
  .ea-src, .ea-src-autre, .graduations span, .estim-chip, .compare thead th, .compare .groupe td,
  .champ > span, .identite .champ > span, .geste .n, .puce, #dlSha,
  .pa-cibles b, .pa-fmt, .ac-t, .ac-moteurs span, .mega-titre, .mega-fam {
    font-size: 13px;
  }
  .pied { font-size: 15px; }
  .pa-train figure { width: 172px; }
  .pa-arbre figcaption, .pa-train figcaption { font-size: 13.5px; }
  .pa-train figcaption span { font-size: 13px; }

  .fil a, .faq-sortie a { padding-block: 12px; }
  .fil a { padding-inline: 4px; margin-inline: -4px; }
  .empreinte > summary { min-height: 44px; }

  .prose table, .prose tbody, .prose tr, .prose td { display: block; }
  .prose thead { display: none; }
  .prose table { overflow-x: visible; }
  .prose tr { padding: 14px 0; border-top: 1px solid var(--trait); }
  .prose td { padding: 0; border: 0; }
  .prose td:first-child { color: var(--encre); font-weight: 500; }
  .prose td + td { margin-top: 5px; }
  .prose td:nth-child(3):last-child { font-size: 13.5px; color: var(--encre-3); }
}

@media (max-width: 760px) {
  .ev-grille > .ev-texte,
  .ev-grille > .ev-scene { display: contents; }
  .ev-grille { row-gap: 18px; }
  .ev-grille > .ev-texte > * { order: 3; margin-top: 0; margin-bottom: 0; }
  .ev-grille > .ev-scene > * { order: 7; margin-top: 0; margin-bottom: 0; }
  .ev-grille > .ev-texte > .legende { order: 1; }
  .ev-grille > .ev-texte > .titre { order: 2; }
  .ev-grille > .ev-scene > .ea,
  .ev-grille > .ev-scene > .ea-fenetre { order: 4; }
  .ev-grille > .ev-texte > .ev-etapes { order: 5; }
  .ev-grille > .ev-texte > .ev-cta { order: 6; }
  .ev-grille > .ev-texte > .ev-sous { order: 8; }
  .ev-grille > .ev-scene > .ev-pied { order: 9; }
  .ev-etapes .chap { padding: 8px 10px 8px 16px; gap: 12px; }
}

.nappe { filter: saturate(2.5) contrast(1.16); }
.nappe::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background: url('/assets/nappe/grain.svg') repeat;
  opacity: .24;
  mix-blend-mode: soft-light;
}
.nappe-live-frame .nappe[data-affiche] { background-image: none; }
.hero-duo .hero-cadre {
  position: relative;
  border: 1px solid rgba(245,245,247,.2);
  border-radius: 20px;
  padding: 7px;
  box-shadow: none;
}
.hero-duo .hero-cadre img { border-radius: 13px; }
.hero-interface {
  position: absolute; left: 7px; top: 7px;
  width: calc(100% - 14px); height: calc(100% - 14px);
  border: 0; border-radius: 13px; pointer-events: none; visibility: hidden;
}
.hero-cadre.interface-prete .hero-interface { visibility: visible; }
.hero-cadre.interface-prete picture { visibility: hidden; }
@media (min-width: 1101px) {
  body:has(.hero-duo) .entete > .wrap { width: min(100% - 96px, 1920px); }
}
.hero-duo h1 { letter-spacing: -.045em; text-wrap: balance; }
.hero-duo h1 .degrade { color: var(--encre); }
.hero-duo .sous-titre { color: #E0DCD8; }
.scene-fond .legende { color: var(--lien, #FFAF78); }
.entete .menu a { color: #DEDEE2; }
.entete .menu a:hover, .entete .menu a[aria-current="page"] { color: #FFF; }
.hero-duo .chapeau { max-width: 42ch; line-height: 1.65; }
.btn { transition: background-color .16s ease, border-color .16s ease, color .16s ease; }
.btn:focus-visible { outline: 2px solid var(--action); outline-offset: 4px; }
@media (prefers-reduced-transparency: reduce) {
  .nappe { filter: none; }
}

.dc-showcase{padding:100px 0;overflow:hidden;background:var(--papier)}
.dc-heading{max-width:900px;margin:0 auto 44px;text-align:center}
.dc-kicker{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--encre-3);margin:0 0 24px}
.dc-heading h2{font-size:clamp(36px,4.8vw,68px);line-height:1.08;letter-spacing:-.04em;font-weight:550;text-wrap:balance;margin:0 0 24px}
.dc-intro{max-width:580px;margin:auto;font-size:18px;line-height:1.6;color:var(--encre-2)}
.dc-session{margin:0 auto 24px;border:1px solid #ffffff20;border-radius:10px;overflow:hidden;background:#171719}
.dc-toolbar{display:flex;align-items:center;gap:18px;padding:12px 16px}
.dc-hosts{display:flex;gap:4px}.dc-hosts button,.dc-play{font:inherit;font-size:13px;color:var(--encre-2);background:transparent;border:0;border-radius:5px;padding:10px 14px;cursor:pointer;white-space:nowrap}
.dc-hosts button[aria-pressed=true]{color:var(--encre);background:#ffffff13}.dc-play{margin-left:auto;border:1px solid #ffffff25}.dc-context{font-size:11px;color:var(--encre-3)}
.dc-play:hover,.dc-hosts button:hover{background:#ffffff16}.dc-showcase :focus-visible{outline:2px solid var(--bleu);outline-offset:-2px}
.dc-stage{position:relative;aspect-ratio:8/5;overflow:hidden;background:#202124}
.dc-world{position:absolute;width:1440px;height:900px;transform-origin:0 0}
.dc-screen{display:block;width:1440px;height:900px;max-width:none}
.dc-video,.dc-tile,.dc-pointer{position:absolute;display:none;max-width:none;pointer-events:none}
.dc-video{object-fit:fill}.dc-tile{width:64px;height:64px;object-fit:contain;opacity:.9}.dc-pointer{width:25px;height:32px;filter:drop-shadow(0 2px 3px #0008)}
.dc-session-controls{padding:15px 20px;min-height:50px}.dc-phase{font-size:13px;color:var(--encre-2);margin:0}
.dc-footer{display:flex;align-items:start;justify-content:space-between;gap:30px}.dc-footer p{font-size:11px;color:var(--encre-3);max-width:600px;margin:0;line-height:1.6}.dc-footer a{font-size:13px;white-space:nowrap}
@media(min-width:1600px){.dc-session{max-width:1440px}}
@media(max-width:760px){.dc-showcase{padding:65px 0}.dc-heading{margin-bottom:30px}.dc-intro{font-size:16px}.dc-toolbar{gap:6px;padding:8px;flex-wrap:wrap}.dc-hosts{gap:0;flex:1}.dc-hosts button{padding:9px 7px;font-size:11px}.dc-play{font-size:11px;padding:8px}.dc-context{display:none}.dc-session-controls{padding:12px}.dc-phase{font-size:11px}.dc-footer{flex-direction:column;gap:14px}}
.dc-chapitres { margin: 0; padding: 16px 20px 2px; }
.dc-chapitres .chap { font-size: 14px; }
.dc-session-controls { display: flex; align-items: baseline; justify-content: space-between; gap: 18px; }
.dc-session-controls .dc-context { white-space: nowrap; }
@media (max-width: 760px) {
  .ev-etapes.chap-frise.dc-chapitres { grid-auto-flow: row; grid-template-columns: repeat(3, minmax(0, 1fr)); row-gap: 6px; padding: 12px 12px 0; }
  .ev-etapes.chap-frise.dc-chapitres .chap { font-size: 12.5px; padding: 12px 6px 8px 0; }
  .dc-session-controls .dc-context { display: none; }
}
.dc-footer { align-items: baseline; }
.dc-footer p { font-size: 13px; }
@media (max-width: 760px) {
  .dc-heading .dc-kicker { font-size: 12px; }
  .dc-session-controls .dc-phase { font-size: 14px; }
  .dc-footer p { font-size: 14px; }
  .prep-files small, .ef-formats-list dd span { font-size: 12px; }
}
.dc-heading .dc-kicker {
  font-size: 15px; font-weight: 500; letter-spacing: -0.01em;
  text-transform: none; color: var(--encre-2); margin-bottom: 14px;
}
.orbis-studio .dc-heading .dc-kicker { color: #FFAD70; }
.dc-session-controls .dc-context { font-size: 13px; }
.prep-files small { font-size: 12px; }


@media (max-width: 640px) {
  .cadre-table {
    overflow: visible;
    -webkit-mask-image: none;
    mask-image: none;
  }
  .compare { display: block; min-width: 0; table-layout: auto; font-size: 13.5px; }
  .compare thead, .compare tbody { display: block; }
  .compare tr { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .compare thead {
    position: sticky;
    top: var(--entete-h);
    z-index: 3;
    background: var(--papier-2);
    border-bottom: 1px solid var(--trait);
  }
  .compare thead th {
    position: static;
    padding: 12px 4px 10px;
    font-size: 12.5px;
    line-height: 1.25;
    background: transparent;
  }
  .compare thead th:first-child { display: none; }
  .compare th:nth-child(3), .compare td:nth-child(3),
  .compare thead th:nth-child(3) { background: transparent; }
  .compare tbody td:nth-child(3) { color: var(--encre); font-weight: 500; }
  .compare tbody td {
    padding: 4px 6px 14px;
    border-top: 0;
    font-size: 12.5px;
    line-height: 1.3;
    hyphens: auto;
    -webkit-hyphens: auto;
  }
  .compare th:first-child, .compare td:first-child { position: static; width: auto; background: none; }
  .compare tbody td:first-child {
    grid-column: 1 / -1;
    padding: 14px 0 6px;
    border-top: 1px solid var(--trait);
    font-size: 14px;
    font-weight: 450;
  }
  .compare .groupe td,
  .compare tbody .groupe td:first-child {
    grid-column: 1 / -1;
    padding: 26px 0 8px;
    border-top: 0;
    font-size: 12.5px;
  }
}

.ea-repos { z-index: 2; background: var(--papier); }

.ea-fenetre.en-camera::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 4;
  pointer-events: none;
  border-radius: inherit;
  background: linear-gradient(90deg, var(--papier), transparent 22px, transparent calc(100% - 22px), var(--papier));
}

@media (hover: none) and (pointer: coarse) {
  [data-anim="monte"],
  [data-anim="monte"] > *,
  [data-stagger] > * { opacity: 1 !important; }
}

@media (max-width: 900px) {
  .ch-grille .chiffres { grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: none; }
  .ch-grille .ch-case:first-child {
    grid-column: 1 / -1;
    grid-row: auto;
    padding: 0 0 clamp(22px, 4vw, 30px);
    border-right: 0;
  }
  .ch-grille .ch-case:nth-child(n + 2) {
    border-top: 1px solid var(--trait);
    border-left: 1px solid var(--trait);
    padding: clamp(18px, 3vw, 24px) clamp(12px, 2.4vw, 22px) 0;
  }
  .ch-grille .ch-case:nth-child(2) { border-left: 0; padding-left: 0; }
  .ch-grille .ch-case:nth-child(n + 2) .ch-t { font-size: 13.5px; }
}

@media (max-width: 640px) {
  .ev-etapes.chap-frise.dc-chapitres { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 16px; }
  .ev-etapes.chap-frise.dc-chapitres .chap { font-size: 13.5px; }
}

@media (min-width: 1001px) and (max-width: 1024px) {
  #vent .ev-grille > .ev-texte > .sans-app {
    grid-column: 1 / -1;
    grid-row: 6;
    justify-self: start;
    width: min(100%, 640px);
  }
}

@media (max-width: 760px) {
  .entete .menu:has(> a.menu-compte.on) { gap: 0; }
  .entete .menu:has(> a.menu-compte.on) > a { padding-inline: 6px; font-size: 13px; }
}