/* ═══════════════════════════════════════════════════════════════════════
 * Eden Studio : la suite de la landing (après le hero)
 * Logos, réalisations, comparatif, inclus, étapes, tarifs, garantie,
 * avis, FAQ, appel final, footer, barre mobile. Préfixe es-.
 * ═══════════════════════════════════════════════════════════════════════ */

/* ── Commun ── */
.es-sec { position: relative; padding-block: var(--sec) 0; overflow-x: clip; }
.es-head { display: flex; flex-direction: column; gap: 16px; max-width: 46rem; margin-bottom: clamp(36px, 4vw, 56px); }
.es-head-row { flex-direction: row; align-items: flex-end; justify-content: space-between; gap: 32px; max-width: none; }
.es-head-aside { max-width: 30ch; font-size: 15.5px; line-height: 1.5; color: rgba(11, 11, 15, .62); }
.es-k { display: inline-flex; align-items: center; gap: .65em; font: 500 12px/1 var(--f-mono); letter-spacing: .16em; text-transform: uppercase; color: rgba(11, 11, 15, .58); }
.es-k::before { content: ""; width: 6px; height: 6px; border-radius: 1px; background: var(--bleu); box-shadow: 0 0 10px rgba(var(--bleu-rgb), .7); flex: none; }
.es-k-c { justify-content: center; width: 100%; }
.es-h2 { font-size: var(--t-h2); }
.es-h2-b { display: block; color: var(--bleu-titre); }
.es-center { display: flex; justify-content: center; margin-top: clamp(36px, 4vw, 52px); }
.es-btn-l { min-height: 58px; padding: 0 9px 0 26px; font-size: 16.5px; gap: 16px; }
.es-btn-w { color: var(--nuit); }
.es-btn-w .pk-btn-bg { background: linear-gradient(220deg, #fff 0%, var(--glace) 100%); box-shadow: 0 0 0 1px rgba(255, 255, 255, .6) inset, 0 12px 30px -10px rgba(124, 155, 255, .7); }
.es-btn-w .es-ico { background: var(--nuit); box-shadow: none; }
.es-note { max-width: 62ch; margin-top: 28px; font-size: 14px; line-height: 1.55; color: rgba(11, 11, 15, .58); }
.es-note-c { margin-inline: auto; text-align: center; }
.es-note a { color: var(--cobalt); font-weight: 600; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.es-note a:hover { text-decoration-thickness: 2px; }
#faq-en-ligne { scroll-margin-top: 110px; }

/* Places (5 pastilles qui s'allument) */
.es-places { display: inline-flex; align-items: center; gap: 4px; font: 500 12px/1 var(--f-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--ciel); white-space: nowrap; }
.es-places i { width: 8px; height: 8px; border-radius: 50%; background: var(--bleu-clair); box-shadow: 0 0 8px rgba(124, 155, 255, .9); animation: es-place 3s var(--pk-ease) infinite; }
.es-places i:nth-child(2) { animation-delay: .15s; } .es-places i:nth-child(3) { animation-delay: .3s; }
.es-places i:nth-child(4) { animation-delay: .45s; } .es-places i:nth-child(5) { animation-delay: .6s; margin-right: 6px; }
@keyframes es-place { 0%, 100% { opacity: 1; } 50% { opacity: .45; } }

/* ── Logos ── */
.es-logos { padding-top: clamp(48px, 6vw, 72px); overflow-x: clip; }
.es-logos-rail { margin-top: 26px; overflow: hidden; }
.es-logos-track { --g: clamp(48px, 6vw, 88px); display: flex; align-items: center; gap: var(--g); width: max-content; margin: 0; padding: 6px 0; list-style: none; animation: es-logos 46s linear infinite; }
.es-logos-track li { flex: none; display: flex; align-items: center; gap: 8px; height: 40px; transition: transform var(--pk-anim); }
.es-logos-track li:hover { transform: scale(1.04); }
.es-logos-track img { width: auto; height: 24px; }
.es-logos-track .lg-adeo { height: 40px; }
.es-logos-track .lg-zadig { height: 18px; }
.es-logos-track .lg-shipup { height: 22px; }
.es-logos-track .lg-pis { height: 28px; }
.es-logos-track .lg-favikon { height: 26px; border-radius: 6px; }
.es-logo-favikon span { font-size: 19px; font-weight: 700; letter-spacing: -.03em; }
.es-logos-rail:hover .es-logos-track { animation-play-state: paused; }
@keyframes es-logos { to { transform: translateX(calc(-50% - var(--g) / 2)); } }

/* ── Réalisations ── */
.es-real-g { display: grid; grid-template-columns: repeat(6, 1fr); gap: clamp(14px, 1.6vw, 22px); margin: 0; padding: 0; list-style: none; }
.es-real-c { grid-column: span 2; display: flex; flex-direction: column; gap: 12px; }
.es-real-big { grid-column: span 3; }
.es-real-img { position: relative; overflow: hidden; border-radius: var(--r-l); background: var(--papier-2); box-shadow: var(--pk-sh-base); aspect-ratio: 16 / 10; }
.es-real-img::after { content: ""; position: absolute; inset: 0; border-radius: inherit; box-shadow: 0 0 0 1px rgba(var(--nuit-rgb), .06) inset; pointer-events: none; }
.es-real-img img { width: 100%; height: 100%; object-fit: cover; object-position: top; transition: transform 1.2s var(--pk-ease), filter .6s var(--pk-ease); }
.es-real-c:hover .es-real-img img { transform: scale(1.035); }
.es-real-c p { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; padding-inline: 4px; }
.es-real-c b { font-size: 16px; font-weight: 700; letter-spacing: -.02em; }
.es-real-c span { font: 500 12px/1.2 var(--f-mono); letter-spacing: .06em; text-transform: uppercase; color: rgba(11, 11, 15, .5); text-align: right; }
.es-real-g > li:nth-child(n+9) { grid-column: span 3; }

/* ── Comparatif : une matrice, la colonne Eden Studio en lumière ── */
.es-vs { --pad: clamp(14px, 1.5vw, 22px); position: relative; display: grid; grid-template-columns: minmax(120px, .78fr) 1fr 1fr 1.14fr; margin-top: 14px; padding: 6px clamp(8px, 1vw, 14px); border-radius: var(--r-xl); background: var(--carte); box-shadow: var(--pk-sh-label), var(--pk-sh-base); }
.es-vs-r { display: contents; }
.es-vs-m { display: none; }
.es-vs-r > * { position: relative; z-index: 1; grid-row: var(--row); }
.es-vs-r > :nth-child(1) { grid-column: 1; } .es-vs-r > :nth-child(2) { grid-column: 2; } .es-vs-r > :nth-child(3) { grid-column: 3; } .es-vs-r > :nth-child(4) { grid-column: 4; }

/* La colonne mise en avant : une carte nuit qui dépasse en haut et en bas */
.es-vs-hl { position: relative; z-index: 0; grid-column: 4; grid-row: 1 / 7; margin: -22px 0; border-radius: var(--r-l); overflow: hidden;
  background: radial-gradient(130% 60% at 75% 0%, #22379A 0%, #12205F 42%, var(--nuit) 100%);
  box-shadow: var(--pk-sh-dark, 0 30px 60px -20px rgba(10, 16, 51, .55)), 0 40px 80px -30px rgba(var(--bleu-rgb), .45); }
.es-vs-hl .pk-border-glow { z-index: 2; }
.es-vs-hl-dots { position: absolute; inset: 0; background-image: radial-gradient(rgba(169, 193, 255, .13) 1px, transparent 1.3px); background-size: 14px 14px; -webkit-mask: linear-gradient(180deg, #000, transparent 70%); mask: linear-gradient(180deg, #000, transparent 70%); }
.es-vs-hl-sweep { position: absolute; inset: 0; background: linear-gradient(180deg, transparent 0%, rgba(124, 155, 255, .16) 50%, transparent 100%); background-size: 100% 40%; background-repeat: no-repeat; animation: es-vs-scan 5.5s var(--pk-ease-io) infinite; }
@keyframes es-vs-scan { 0% { background-position: 0 -60%; } 60%, 100% { background-position: 0 260%; } }

/* En-têtes de colonnes */
.es-vs-o { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; padding: calc(var(--pad) + 8px) var(--pad) var(--pad); }
.es-vs-o b { margin-top: 10px; font-size: 17px; font-weight: 700; letter-spacing: -.02em; }
.es-vs-o small { font: 500 11px/1.2 var(--f-mono); letter-spacing: .1em; text-transform: uppercase; color: rgba(11, 11, 15, .48); }
.es-vs-ic { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 13px; background: rgba(var(--nuit-rgb), .06); box-shadow: inset 0 0 0 1px rgba(var(--nuit-rgb), .05); }
.es-vs-ic svg { width: 21px; height: 21px; fill: none; stroke: rgba(11, 11, 15, .62); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.es-vs-o.es-vs-us b { color: #fff; }
.es-vs-o.es-vs-us small { color: var(--ciel); }
.es-vs-logo { background: linear-gradient(145deg, var(--bleu) 0%, var(--cobalt) 100%); box-shadow: 0 10px 24px -8px rgba(var(--bleu-rgb), .8), inset 0 1px 0 rgba(255, 255, 255, .3); }
.es-vs-logo svg { width: 22px; stroke: none; }
.es-vs-logo .s1 { fill: #fff; } .es-vs-logo .s2 { fill: var(--glace); }
.es-vs-k { font: 500 11px/1.3 var(--f-mono); letter-spacing: .14em; text-transform: uppercase; color: rgba(11, 11, 15, .42); }
.es-vs-head .es-vs-lab { align-items: flex-end; border-top: 0; }

/* Lignes */
.es-vs-lab { display: flex; align-items: center; padding: var(--pad); border-top: 1px dashed rgba(var(--nuit-rgb), .13); font: 500 12px/1.3 var(--f-mono); letter-spacing: .12em; text-transform: uppercase; color: rgba(11, 11, 15, .55); }
.es-vs-c { display: grid; grid-template-columns: 22px 1fr; align-content: center; column-gap: 11px; row-gap: 12px; padding: var(--pad); border-top: 1px dashed rgba(var(--nuit-rgb), .13); font-size: 15px; line-height: 1.4; }
.es-vs-c:not(.is-no):not(.is-ok) { grid-template-columns: 1fr; }
.es-vs-c.is-no { color: rgba(11, 11, 15, .56); }
.es-vs-c.is-no::before, .es-vs-c.is-ok::before { content: ""; width: 22px; height: 22px; border-radius: 50%; background-position: center; background-repeat: no-repeat; background-size: 12px; }
.es-vs-c.is-no::before { background-color: rgba(var(--nuit-rgb), .07);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M3 3l6 6M9 3l-6 6' stroke='%230A1033' stroke-opacity='.55' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E"); }
.es-vs-c.is-ok::before { background-color: rgba(var(--bleu-rgb), .14);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2l2.3 2.3 4.7-5' fill='none' stroke='%230A2CD8' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.es-vs-c.es-vs-us { color: var(--papier); font-weight: 600; border-top-color: rgba(255, 255, 255, .12); }
.es-vs-c.es-vs-us.is-ok::before { background-color: var(--bleu); box-shadow: 0 0 14px rgba(var(--bleu-rgb), .8);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2l2.3 2.3 4.7-5' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.es-vs-big { font-size: clamp(1.15rem, .8rem + .9vw, 1.6rem); font-weight: 800; letter-spacing: -.045em; line-height: 1.05; }
.es-vs-c.es-vs-us .es-vs-big { font-size: clamp(1.5rem, 1rem + 1.4vw, 2.25rem); }
.es-vs-big small { display: inline-block; margin-left: 6px; padding: 5px 9px; border-radius: var(--r-pill); background: rgba(124, 155, 255, .2); font: 500 11px/1 var(--f-mono); letter-spacing: .06em; text-transform: uppercase; color: var(--ciel); vertical-align: middle; transform: translateY(-2px); }

/* Jauges : la même échelle pour les trois, on voit l'écart d'un coup d'œil */
.es-vs-bar { grid-column: 1 / -1; position: relative; display: block; height: 6px; border-radius: 6px; background: rgba(var(--nuit-rgb), .07); }
.es-vs-bar::after { content: ""; position: absolute; top: 0; bottom: 0; left: calc(var(--a) * 100%); width: max(8px, calc((var(--b) - var(--a)) * 100%)); border-radius: inherit; background: rgba(11, 11, 15, .32); transform-origin: left; transition: transform 1.1s var(--pk-ease) calc(var(--row) * 70ms + 450ms); }
.es-vs-bar.is-hot::after { background: rgba(11, 11, 15, .58); }
.es-vs-bar.is-flou::after { background: repeating-linear-gradient(90deg, rgba(11, 11, 15, .34) 0 6px, transparent 6px 11px); animation: es-vs-flou 3.2s ease-in-out infinite; }
@keyframes es-vs-flou { 0%, 100% { translate: 0 0; opacity: .9; } 35% { translate: 14% 0; opacity: .45; } 70% { translate: -9% 0; opacity: .8; } }
.es-vs-us .es-vs-bar { background: rgba(255, 255, 255, .1); }
.es-vs-bar.is-us::after { background: linear-gradient(90deg, var(--ciel), #fff); box-shadow: 0 0 12px rgba(169, 193, 255, .9), 0 0 2px #fff; }
.es-vs-bar.is-us::before { content: ""; position: absolute; top: 50%; left: max(8px, calc(var(--b) * 100%)); width: 10px; height: 10px; margin: -5px 0 0 -5px; border-radius: 50%; background: #fff; box-shadow: 0 0 0 4px rgba(169, 193, 255, .25), 0 0 14px rgba(169, 193, 255, .9); animation: es-vs-ping 2.4s var(--pk-ease) infinite; z-index: 1; }
@keyframes es-vs-ping { 0%, 100% { box-shadow: 0 0 0 3px rgba(169, 193, 255, .3), 0 0 14px rgba(169, 193, 255, .9); } 50% { box-shadow: 0 0 0 8px rgba(169, 193, 255, 0), 0 0 22px rgba(169, 193, 255, 1); } }

/* Apparition : ligne par ligne, par le flou ; les jauges se remplissent ensuite */
.es-vs-o, .es-vs-lab, .es-vs-c { transition: opacity .7s var(--pk-ease), filter .7s var(--pk-ease), transform .7s var(--pk-ease); transition-delay: calc(var(--row) * 70ms + var(--c, 0) * 55ms); }
.es-vs-hl { transition: opacity .9s var(--pk-ease), transform 1s var(--pk-ease); }
.pk-motion .es-vs:not(.is-in) :is(.es-vs-o, .es-vs-lab, .es-vs-c) { opacity: 0; filter: blur(8px); transform: translateY(12px); }
.pk-motion .es-vs:not(.is-in) .es-vs-hl { opacity: 0; transform: translateY(28px) scale(.97); }
.pk-motion .es-vs:not(.is-in) .es-vs-bar::after { transform: scaleX(0); }
.es-vs:not(.is-vis) *, .es-vs:not(.is-vis) *::before, .es-vs:not(.is-vis) *::after { animation-play-state: paused !important; }

/* Pied : la phrase qui résume, puis l'action */
.es-vs-foot { display: flex; align-items: center; justify-content: space-between; gap: 20px 32px; flex-wrap: wrap; margin-top: clamp(42px, 4vw, 60px); }
.es-vs-foot p { margin: 0; font-size: clamp(1.25rem, .95rem + 1vw, 1.75rem); font-weight: 750; letter-spacing: -.035em; line-height: 1.15; text-wrap: balance; }
.es-vs-foot p span { color: rgba(11, 11, 15, .45); }
.es-vs-foot p em { font-style: normal; background: linear-gradient(90deg, var(--cobalt), var(--bleu)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.es-vs-act { display: flex; align-items: center; gap: 10px 24px; flex-wrap: wrap; }
.es-cmp-lien { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-size: 15px; font-weight: 600; color: var(--cobalt); text-decoration: none; }
.es-cmp-lien svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: transform var(--pk-anim); }
.es-cmp-lien:hover svg { transform: translateY(3px); }
@media (prefers-reduced-motion: reduce) {
  .es-vs-hl-sweep, .es-vs-bar.is-flou::after, .es-vs-bar.is-us::before { animation: none; }
  .es-vs-bar::after, .es-vs-o, .es-vs-lab, .es-vs-c, .es-vs-hl { transition: none; }
}

/* ── Ce qui est inclus : bento illustré ── */
.es-inclus .es-head { flex-direction: row; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; column-gap: 40px; max-width: none; }
.es-inclus .es-head .es-k { width: 100%; }
.es-inclus .es-h2 { max-width: 20ch; }
.es-inclus-sub { max-width: 36ch; }

.es-bento { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.es-bt-design { grid-column: 1 / 3; grid-row: 1 / 3; }
.es-bt-mobile { grid-column: 3; grid-row: 1 / 3; }
.es-bt-textes { grid-column: 1; grid-row: 3; }
.es-bt-cms { grid-column: 2; grid-row: 3; }
.es-bt-form { grid-column: 3; grid-row: 3; }
.es-bt-pages { grid-column: 1; grid-row: 4; }
.es-bt-web { grid-column: 2; grid-row: 4; }
.es-bt-retouches { grid-column: 3; grid-row: 4; }

.es-bt { position: relative; display: flex; flex-direction: column; min-width: 0; border-radius: var(--r-l); background: var(--carte); box-shadow: var(--pk-sh-base); overflow: hidden; isolation: isolate; }
.es-bt-ill { position: relative; flex: 1; min-height: 210px; display: grid; place-items: center; padding: 22px; overflow: hidden;
  background: radial-gradient(rgba(var(--bleu-rgb), .13) 1px, transparent 1.3px) 0 0 / 14px 14px, linear-gradient(180deg, rgba(230, 237, 255, .7), rgba(230, 237, 255, 0));
  -webkit-mask-image: linear-gradient(180deg, #000 82%, transparent); mask-image: linear-gradient(180deg, #000 82%, transparent); }
.es-bt-txt { position: relative; padding: 4px 24px 24px; }
.es-bt-n { display: block; margin-bottom: 10px; font: 500 12px/1 var(--f-mono); letter-spacing: .14em; color: var(--cobalt); }
.es-bt-txt h3 { font-size: 19px; letter-spacing: -.02em; margin-bottom: 6px; }
.es-bt-txt p { font-size: 14.5px; line-height: 1.5; color: rgba(11, 11, 15, .62); max-width: 44ch; }
.es-bt.is-dark { background: radial-gradient(120% 80% at 50% 0%, #16217A 0%, var(--nuit) 62%); color: var(--papier); box-shadow: var(--pk-sh-dark, var(--sh-nuit)); }
.es-bt.is-dark .es-bt-ill { background: radial-gradient(rgba(169, 193, 255, .12) 1px, transparent 1.3px) 0 0 / 14px 14px; }
.es-bt.is-dark .es-bt-n { color: var(--bleu-clair); }
.es-bt.is-dark .es-bt-txt p { color: rgba(244, 241, 234, .62); }
.es-bt-tag { position: absolute; top: 18px; left: 22px; font: 500 11.5px/1 var(--f-mono); letter-spacing: .14em; text-transform: uppercase; color: var(--ciel); }
.es-bt-chip { position: absolute; z-index: 5; bottom: 22px; left: 50%; translate: -50% 0; display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; white-space: nowrap; border-radius: var(--r-pill);
  background: rgba(255, 255, 255, .1); box-shadow: 0 0 0 1px rgba(255, 255, 255, .16) inset; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); font: 500 12px/1 var(--f-mono); letter-spacing: .06em; text-transform: uppercase; color: #fff; }
.es-bt-chip i { width: 7px; height: 7px; border-radius: 50%; background: #7BE0A4; box-shadow: 0 0 8px #7BE0A4; }
.es-bt-chip-c { top: 16px; bottom: auto; left: auto; right: 16px; translate: none; background: var(--carte); color: var(--nuit); box-shadow: var(--pk-sh-base); }
.es-bento i { font-style: normal; }

/* 01 · Trois propositions en éventail, une est choisie à tour de rôle */
.es-bt-design .es-bt-ill { min-height: 400px; }
.es-dz-zone { position: relative; width: 100%; height: 100%; min-height: 300px; perspective: 1200px; }
.es-dz { position: absolute; left: 50%; top: 48%; width: min(36%, 270px); aspect-ratio: 4 / 3.3; translate: calc(-50% + var(--x)) -50%; rotate: var(--r); animation: es-dz-z 9s calc(var(--k) * 3s - 9s) infinite steps(1); }
.es-dz-in { position: relative; display: flex; flex-direction: column; gap: 7px; height: 100%; padding: 12px; border-radius: 14px; overflow: hidden;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .1) inset, 0 24px 40px -18px rgba(0, 0, 0, .7); transform: scale(.92); filter: saturate(.7) brightness(.82);
  animation: es-dz-pick 9s calc(var(--k) * 3s - 9s) infinite var(--pk-ease); }
.es-dz-in > i, .es-dz-in i { display: block; border-radius: 4px; }
.es-dz-nav { height: 6px; width: 40%; border-radius: 9px !important; opacity: .5; }
.es-dz-h { height: 9px; width: var(--w); }
.es-dz-btn { width: 32%; height: 12px; border-radius: 9px !important; margin-top: 2px; }
.es-dz-img { flex: 1; min-height: 0; border-radius: 8px !important; }
.es-dz-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px; height: 18%; }
.es-dz-split { flex: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
.es-dz-split > span { display: flex; flex-direction: column; gap: 7px; justify-content: center; }
.es-dz-a .es-dz-in { background: linear-gradient(160deg, #142070, #070C2A); }
.es-dz-a .es-dz-nav, .es-dz-a .es-dz-h { background: var(--glace); }
.es-dz-a .es-dz-h + .es-dz-h { background: var(--bleu-clair); }
.es-dz-a .es-dz-btn { background: var(--bleu); }
.es-dz-a .es-dz-img { background: radial-gradient(80% 90% at 70% 20%, rgba(124, 155, 255, .8), transparent 60%), linear-gradient(140deg, var(--cobalt), #0A1033); }
.es-dz-b .es-dz-in { background: var(--papier); align-items: center; }
.es-dz-b .es-dz-nav, .es-dz-b .es-dz-h { background: var(--nuit); }
.es-dz-b .es-dz-h + .es-dz-h { background: rgba(10, 16, 51, .35); }
.es-dz-b .es-dz-img { width: 100%; background: radial-gradient(circle at 50% 120%, var(--ciel) 0 38%, transparent 39%), var(--glace); }
.es-dz-b .es-dz-row { width: 100%; }
.es-dz-b .es-dz-row i { background: #fff; box-shadow: 0 0 0 1px rgba(10, 16, 51, .08) inset; }
.es-dz-c .es-dz-in { background: var(--glace); }
.es-dz-c .es-dz-nav, .es-dz-c .es-dz-h { background: var(--cobalt); }
.es-dz-c .es-dz-h + .es-dz-h { background: rgba(10, 44, 216, .35); }
.es-dz-c .es-dz-btn { background: var(--nuit); width: 54%; }
.es-dz-c .es-dz-img { background: linear-gradient(200deg, var(--bleu), var(--cobalt) 60%, var(--nuit)); }
.es-dz-lab { position: absolute; top: 10px; right: 10px; display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: rgba(255, 255, 255, .85); color: var(--nuit); font: 600 10.5px/1 var(--f-mono); }
.es-dz-ok { position: absolute; left: 50%; bottom: 12px; translate: -50% 0; display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px 7px 8px; border-radius: var(--r-pill); background: var(--bleu); color: #fff; font-size: 12.5px; font-weight: 600; white-space: nowrap;
  box-shadow: var(--sh-bleu); opacity: 0; filter: blur(6px); scale: .8; animation: es-dz-ok 9s calc(var(--k) * 3s - 9s) infinite var(--pk-ease); }
.es-dz-ok::before { content: ""; width: 16px; height: 16px; border-radius: 50%; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.3l2.2 2.2 4.8-5' fill='none' stroke='%232F5BFF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 100% no-repeat; }
@keyframes es-dz-pick {
  0%, 4% { transform: scale(.92); filter: saturate(.7) brightness(.82); box-shadow: 0 0 0 1px rgba(255, 255, 255, .1) inset, 0 24px 40px -18px rgba(0, 0, 0, .7); }
  10%, 28% { transform: translateY(-18px) scale(1.06); filter: none; box-shadow: 0 0 0 1.5px rgba(124, 155, 255, .9) inset, 0 0 40px -6px rgba(var(--bleu-rgb), .75), 0 30px 50px -20px rgba(0, 0, 0, .8); }
  34%, 100% { transform: scale(.92); filter: saturate(.7) brightness(.82); box-shadow: 0 0 0 1px rgba(255, 255, 255, .1) inset, 0 24px 40px -18px rgba(0, 0, 0, .7); }
}
@keyframes es-dz-z { 0% { z-index: 3; } 33% { z-index: 1; } }
@keyframes es-dz-ok { 0%, 8% { opacity: 0; filter: blur(6px); scale: .8; } 13%, 27% { opacity: 1; filter: none; scale: 1; } 32%, 100% { opacity: 0; filter: blur(6px); scale: .9; } }

/* 02 · Téléphone dont la page défile */
.es-bt-mobile .es-bt-ill { padding-top: 30px; align-items: start; }
.es-bt-mobile .es-bt-ill::before { content: ""; position: absolute; left: 50%; top: 46%; width: 300px; height: 300px; translate: -50% -50%; border-radius: 50%; background: radial-gradient(rgba(var(--bleu-rgb), .3), transparent 65%); filter: blur(20px); }
.es-ph { position: relative; width: 200px; height: 400px; padding: 7px; border-radius: 36px; background: linear-gradient(160deg, #23262F, var(--encre)); box-shadow: 0 0 0 1px rgba(255, 255, 255, .08) inset, 0 40px 60px -28px rgba(10, 16, 51, .65), 0 14px 24px -14px rgba(10, 16, 51, .4); }
.es-ph::before { content: ""; position: absolute; z-index: 3; top: 15px; left: 50%; translate: -50% 0; width: 62px; height: 18px; border-radius: 12px; background: var(--encre); }
.es-ph-ecran { position: relative; height: 100%; border-radius: 29px; overflow: hidden; background: var(--papier); }
.es-ph-scroll { display: flex; flex-direction: column; gap: 9px; padding: 42px 16px 60px; animation: es-ph-scroll 12s var(--pk-ease-io, ease-in-out) infinite; }
.es-ph-scroll i, .es-ph-scroll b { display: block; }
.es-ph-nav { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.es-ph-nav i { width: 54px; height: 9px; border-radius: 6px; background: var(--nuit); }
.es-ph-nav b { width: 18px; height: 10px; background: linear-gradient(var(--nuit) 0 2px, transparent 2px 4px, var(--nuit) 4px 6px, transparent 6px 8px, var(--nuit) 8px); }
.es-ph-k { width: 40%; height: 7px; border-radius: 6px; background: var(--bleu); opacity: .7; }
.es-ph-h { width: var(--w); height: 14px; border-radius: 5px; background: var(--nuit); }
.es-ph-h2 { margin-top: 12px; height: 11px; }
.es-ph-p { width: var(--w); height: 7px; border-radius: 4px; background: rgba(10, 16, 51, .18); }
.es-ph-btn { width: 60%; height: 30px; margin: 6px 0; border-radius: 99px; background: var(--bleu); box-shadow: var(--sh-bleu); }
.es-ph-img { height: 130px; border-radius: 14px; background: radial-gradient(70% 70% at 70% 25%, rgba(169, 193, 255, .9), transparent 60%), linear-gradient(150deg, var(--cobalt), var(--nuit)); }
.es-ph-img2 { height: 100px; background: radial-gradient(circle at 30% 110%, var(--ciel) 0 40%, transparent 41%), var(--glace); }
.es-ph-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.es-ph-cards i { height: 64px; border-radius: 10px; background: var(--carte); box-shadow: 0 0 0 1px rgba(10, 16, 51, .07) inset, 0 6px 12px -8px rgba(10, 16, 51, .3); }
.es-ph-avis { display: flex; flex-direction: column; gap: 7px; padding: 14px; border-radius: 14px; background: var(--nuit); }
.es-ph-avis i { width: var(--w); height: 7px; border-radius: 4px; background: rgba(230, 237, 255, .5); }
.es-ph-avis i:first-child { background: var(--bleu-clair); }
.es-ph-foot { height: 70px; border-radius: 12px; background: var(--nuit); }
.es-ph-cta { position: absolute; z-index: 2; left: 12px; right: 12px; bottom: 12px; display: grid; place-items: center; height: 34px; border-radius: 99px; background: var(--nuit); color: #fff; font-size: 12px; font-weight: 600; box-shadow: 0 10px 20px -10px rgba(10, 16, 51, .8); }
@keyframes es-ph-scroll { 0%, 10% { transform: translateY(0); } 32%, 44% { transform: translateY(-34%); } 66%, 78% { transform: translateY(-58%); } 94%, 100% { transform: translateY(0); } }

/* 03 · Les textes qui s'écrivent */
.es-tx { position: relative; width: min(100%, 300px); padding: 16px 18px 18px; border-radius: var(--r-m); background: var(--carte); box-shadow: var(--pk-sh-base); rotate: -2deg; }
.es-tx-bar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; font: 500 11px/1 var(--f-mono); letter-spacing: .1em; text-transform: uppercase; color: rgba(10, 16, 51, .5); }
.es-tx-bar em, .es-fm-bar em { padding: 4px 7px; border-radius: var(--r-pill); background: rgba(var(--bleu-rgb), .1); font-style: normal; color: var(--cobalt); }
.es-tx-h { display: flex; flex-direction: column; margin-bottom: 12px; font-size: 19px; font-weight: 700; line-height: 1.15; letter-spacing: -.03em; color: var(--nuit); }
.es-tx-h span, .es-tx-p { justify-self: start; clip-path: inset(0 0 0 0); animation: es-tx-w 8s calc(var(--l) * .55s) infinite var(--pk-ease); }
.es-tx-h span { width: max-content; }
.es-tx-h span:last-child { color: var(--cobalt); }
.es-tx-p { display: block; width: var(--w); height: 7px; margin-top: 7px; border-radius: 4px; background: rgba(10, 16, 51, .15); }
.es-tx-ok { position: absolute; right: -10px; bottom: -12px; display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px 7px 8px; border-radius: var(--r-pill); background: var(--nuit); color: #fff; font-size: 12.5px; font-weight: 600; rotate: 2deg; box-shadow: var(--sh-nuit);
  animation: es-tx-ok 8s infinite var(--pk-ease); }
.es-tx-ok::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #7BE0A4; box-shadow: 0 0 8px #7BE0A4; }
@keyframes es-tx-w { 0%, 4% { clip-path: inset(0 100% 0 0); } 14%, 88% { clip-path: inset(0 0 0 0); } 96%, 100% { clip-path: inset(0 100% 0 0); } }
@keyframes es-tx-ok { 0%, 40% { opacity: 0; filter: blur(6px); transform: translateY(6px) scale(.9); } 46%, 86% { opacity: 1; filter: none; transform: none; } 92%, 100% { opacity: 0; filter: blur(6px); transform: translateY(6px) scale(.9); } }

/* 04 · Espace de gestion */
.es-bt-cms .es-cms { width: min(100%, 320px); margin: 0; rotate: 1.5deg; }

/* 05 · Les demandes qui arrivent */
.es-fm { width: min(100%, 320px); }
.es-fm-bar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 12px; font-size: 13px; font-weight: 600; }
.es-fm-bar span { display: inline-flex; align-items: center; gap: 8px; }
.es-fm-bar span i { width: 7px; height: 7px; border-radius: 50%; background: #7BE0A4; box-shadow: 0 0 8px #7BE0A4; animation: es-ping 1.6s infinite; }
.es-fm-bar em { background: rgba(255, 255, 255, .08); color: var(--ciel); font: 500 11px/1 var(--f-mono); letter-spacing: .08em; text-transform: uppercase; }
.es-fm-feed { position: relative; height: 196px; -webkit-mask-image: linear-gradient(180deg, #000 70%, transparent); mask-image: linear-gradient(180deg, #000 70%, transparent); }
.es-fm-n { position: absolute; inset: 0 0 auto; display: grid; grid-template-columns: 34px 1fr auto; align-items: center; gap: 11px; padding: 11px 12px; border-radius: 14px;
  background: rgba(255, 255, 255, .08); box-shadow: 0 0 0 1px rgba(255, 255, 255, .1) inset; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  transform: translateY(calc(var(--k) * 66px)); animation: es-fm 9s calc(var(--k) * -3s) infinite var(--pk-ease); }
.es-fm-n > b { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: linear-gradient(160deg, var(--bleu-clair), var(--cobalt)); font: 600 11.5px/1 var(--f-mono); color: #fff; }
.es-fm-n > b.is-rdv { background: var(--glace); }
.es-fm-n > b svg { width: 17px; height: 17px; fill: none; stroke: var(--cobalt); stroke-width: 1.5; stroke-linecap: round; }
.es-fm-n span { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.es-fm-n strong { font-size: 13.5px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.es-fm-n small { font-size: 12px; color: rgba(244, 241, 234, .6); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.es-fm-n time { align-self: start; font: 500 10.5px/1 var(--f-mono); color: rgba(244, 241, 234, .45); }
@keyframes es-fm {
  0% { transform: translateY(-30px) scale(.96); opacity: 0; filter: blur(8px); }
  6%, 33% { transform: translateY(0); opacity: 1; filter: none; box-shadow: 0 0 0 1px rgba(124, 155, 255, .5) inset, 0 0 24px -6px rgba(var(--bleu-rgb), .7); }
  39%, 66% { transform: translateY(66px) scale(.97); opacity: .8; filter: none; box-shadow: 0 0 0 1px rgba(255, 255, 255, .1) inset; }
  72%, 92% { transform: translateY(132px) scale(.94); opacity: .45; filter: none; }
  100% { transform: translateY(170px) scale(.9); opacity: 0; filter: blur(6px); }
}
@keyframes es-ping { 0% { box-shadow: 0 0 0 0 rgba(123, 224, 164, .7); } 100% { box-shadow: 0 0 0 9px rgba(123, 224, 164, 0); } }

/* 06 · Le plan du site qui se dessine */
.es-map { position: relative; width: min(100%, 360px); aspect-ratio: 400 / 180; }
.es-map-l { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.es-map-l path { fill: none; stroke: var(--bleu); stroke-width: 1.6; stroke-dasharray: 1 1; stroke-dashoffset: 0; animation: es-map-l 7s infinite var(--pk-ease); }
.es-map-l path:nth-child(2) { animation-delay: .12s; } .es-map-l path:nth-child(3) { animation-delay: .24s; } .es-map-l path:nth-child(4) { animation-delay: .36s; }
.es-map-n { position: absolute; left: var(--x); top: var(--y); translate: -50% -50%; padding: 8px 10px; border-radius: 10px; background: var(--carte); box-shadow: var(--pk-sh-base); font-size: 12px; font-weight: 600; color: var(--nuit); white-space: nowrap;
  animation: es-map-n 7s calc(.5s + var(--k) * .14s) infinite var(--pk-ease); }
.es-map-n.is-root { padding: 9px 14px; background: var(--nuit); color: #fff; box-shadow: var(--sh-nuit), 0 10px 24px -10px rgba(var(--bleu-rgb), .7); animation-delay: 0s; }
@keyframes es-map-l { 0%, 8% { stroke-dashoffset: 1; } 30%, 88% { stroke-dashoffset: 0; } 96%, 100% { stroke-dashoffset: 1; } }
@keyframes es-map-n { 0%, 4% { opacity: 0; filter: blur(6px); scale: .85; } 14%, 86% { opacity: 1; filter: none; scale: 1; } 94%, 100% { opacity: 0; filter: blur(6px); scale: .9; } }

/* 07 · En ligne : l'adresse puis le résultat de recherche */
.es-web { display: flex; flex-direction: column; gap: 12px; width: min(100%, 320px); }
.es-web-url { display: flex; align-items: center; gap: 8px; height: 40px; padding: 0 14px; border-radius: var(--r-pill); background: var(--carte); box-shadow: var(--pk-sh-base); font-size: 13.5px; font-weight: 500; color: var(--nuit); }
.es-web-url svg { flex: none; width: 15px; height: 15px; fill: none; stroke: var(--cobalt); stroke-width: 1.6; stroke-linecap: round; }
.es-web-url span { clip-path: inset(0 0 0 0); animation: es-web-url 7s infinite steps(18, end); }
.es-web-res { display: flex; flex-direction: column; gap: 6px; padding: 14px 16px; border-radius: var(--r-m); background: var(--carte); box-shadow: var(--pk-sh-base); animation: es-web-res 7s infinite var(--pk-ease); }
.es-web-site { display: inline-flex; align-items: center; gap: 7px; font: 500 11px/1 var(--f-mono); color: rgba(10, 16, 51, .55); }
.es-web-site i { width: 16px; height: 16px; border-radius: 50%; background: linear-gradient(160deg, var(--bleu), var(--cobalt)); }
.es-web-res b { font-size: 14.5px; font-weight: 600; line-height: 1.3; color: var(--cobalt); letter-spacing: -.01em; }
.es-web-p { display: block; width: var(--w); height: 7px; border-radius: 4px; background: rgba(10, 16, 51, .14); }
.es-web-on i { animation: es-ping 1.6s infinite; }
.es-bt-textes .es-bt-chip-c { left: 16px; right: auto; }
@keyframes es-web-url { 0%, 6% { clip-path: inset(0 100% 0 0); } 30%, 92% { clip-path: inset(0 0 0 0); } 100% { clip-path: inset(0 100% 0 0); } }
@keyframes es-web-res { 0%, 34% { opacity: 0; filter: blur(8px); transform: translateY(12px); } 44%, 90% { opacity: 1; filter: none; transform: none; } 98%, 100% { opacity: 0; filter: blur(8px); transform: translateY(12px); } }

/* 08 · Retouches pointées puis corrigées */
.es-rt { position: relative; display: flex; flex-direction: column; gap: 8px; width: min(100%, 300px); padding: 16px; border-radius: var(--r-m); background: var(--carte); box-shadow: var(--pk-sh-base); }
.es-rt > i, .es-rt-cols i { display: block; border-radius: 4px; }
.es-rt-nav { width: 34%; height: 7px; background: rgba(10, 16, 51, .25); margin-bottom: 4px; }
.es-rt-h { width: var(--w); height: 11px; background: var(--nuit); }
.es-rt-cols { display: grid; grid-template-columns: 1.1fr 1fr; gap: 10px; margin-top: 6px; }
.es-rt-img { height: 72px; border-radius: 8px !important; background: radial-gradient(circle at 30% 120%, var(--ciel) 0 42%, transparent 43%), var(--glace); }
.es-rt-cols span { display: flex; flex-direction: column; justify-content: center; gap: 7px; }
.es-rt-cols span i { height: 7px; background: rgba(10, 16, 51, .15); }
.es-rt-cols span i:last-child { width: 60%; height: 18px; border-radius: 99px; background: var(--bleu); }
.es-rt-tour { position: absolute; top: -12px; right: 12px; padding: 6px 10px; border-radius: var(--r-pill); background: var(--nuit); color: rgba(244, 241, 234, .7); font: 500 11px/1 var(--f-mono); letter-spacing: .06em; box-shadow: var(--sh-nuit); }
.es-rt-tour b { color: #fff; }
.es-rt-pin { position: absolute; left: var(--x); top: var(--y); display: flex; align-items: center; gap: 6px; animation: es-rt-pin 8s calc(var(--k) * 1.1s) infinite var(--pk-ease); }
.es-rt-pin b { display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50% 50% 50% 4px; background: var(--bleu); color: #fff; font: 600 11px/1 var(--f-mono); box-shadow: 0 0 0 3px rgba(var(--bleu-rgb), .25), 0 8px 16px -6px rgba(var(--bleu-rgb), .8); }
.es-rt-pin em { padding: 6px 9px; border-radius: 8px; background: var(--nuit); color: #fff; font-size: 11.5px; font-style: normal; font-weight: 500; white-space: nowrap; box-shadow: var(--sh-nuit); animation: es-rt-em 8s calc(var(--k) * 1.1s) infinite var(--pk-ease); }
.es-rt-done { position: absolute; left: 50%; bottom: -14px; translate: -50% 0; display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px 7px 8px; border-radius: var(--r-pill); background: var(--bleu); color: #fff; font-size: 12.5px; font-weight: 600; box-shadow: var(--sh-bleu); animation: es-rt-done 8s infinite var(--pk-ease); }
.es-rt-done::before { content: ""; width: 16px; height: 16px; border-radius: 50%; background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.3l2.2 2.2 4.8-5' fill='none' stroke='%232F5BFF' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 100% no-repeat; }
@keyframes es-rt-pin { 0%, 6% { opacity: 0; scale: .4; filter: blur(4px); } 12%, 62% { opacity: 1; scale: 1; filter: none; } 70%, 100% { opacity: 0; scale: .6; filter: blur(4px); } }
@keyframes es-rt-em { 0%, 12% { opacity: 0; translate: -6px 0; } 18%, 48% { opacity: 1; translate: 0 0; } 54%, 100% { opacity: 0; translate: -6px 0; } }
@keyframes es-rt-done { 0%, 70% { opacity: 0; filter: blur(6px); scale: .85; } 76%, 94% { opacity: 1; filter: none; scale: 1; } 100% { opacity: 0; filter: blur(6px); scale: .9; } }

/* Les boucles ne tournent qu'à l'écran */
.es-bento:not(.is-vis) .es-bt-ill *, .es-bento:not(.is-vis) .es-bt-ill *::before { animation-play-state: paused !important; }

/* L'espace de gestion qui s'écrit tout seul */
.es-cms { display: flex; flex-direction: column; gap: 8px; margin-bottom: 14px; padding: 16px; border-radius: var(--r-m); background: var(--nuit); color: var(--papier); box-shadow: var(--sh-nuit); }
.es-cms-bar { display: flex; justify-content: space-between; align-items: center; padding-bottom: 10px; margin-bottom: 4px; border-bottom: 1px solid rgba(255, 255, 255, .08); font-size: 13px; font-weight: 600; }
.es-cms-bar em { padding: 4px 8px; border-radius: var(--r-pill); background: rgba(255, 255, 255, .08); font: 500 12px/1 var(--f-mono); font-style: normal; letter-spacing: .06em; text-transform: uppercase; color: var(--ciel); }
.es-cms label { font: 500 12px/1 var(--f-mono); letter-spacing: .06em; text-transform: uppercase; color: rgba(244, 241, 234, .55); }
.es-cms-field { display: flex; align-items: center; min-height: 44px; padding: 0 14px; border-radius: 10px; background: var(--nuit-3); box-shadow: 0 0 0 1px rgba(124, 155, 255, .35) inset; font-size: 15px; font-weight: 500; }
.es-caret { width: 2px; height: 18px; margin-left: 2px; background: var(--bleu-clair); animation: es-caret 1s steps(1) infinite; }
@keyframes es-caret { 50% { opacity: 0; } }
.es-cms-pub { display: flex; justify-content: flex-end; align-items: center; gap: 12px; margin-top: 4px; }
.es-cms-pub b { padding: 9px 16px; border-radius: var(--r-pill); background: var(--bleu); font-size: 13px; box-shadow: var(--sh-bleu); transition: transform .2s var(--pk-ease); }
.es-cms-ok { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--ciel); opacity: 0; filter: blur(6px); transform: translateY(4px); transition: opacity .45s var(--pk-ease), filter .45s var(--pk-ease), transform .45s var(--pk-ease); }
.es-cms-ok::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #7BE0A4; box-shadow: 0 0 8px #7BE0A4; }
.es-cms.is-pub .es-cms-ok { opacity: 1; filter: none; transform: none; }
.es-cms.is-pub .es-cms-pub b { transform: scale(.95); }

/* ── Comment ça marche : frise ── */
.es-frise { position: relative; }
.es-frise-l { position: absolute; left: 0; right: 0; top: 23px; height: 2px; background: repeating-linear-gradient(90deg, rgba(var(--nuit-rgb), .2) 0 6px, transparent 6px 12px); }
.es-frise-l i { position: absolute; inset: 0; transform-origin: left; transform: scaleX(var(--p, 0)); background: linear-gradient(90deg, var(--cobalt), var(--bleu-clair)); border-radius: 2px; box-shadow: 0 0 12px rgba(var(--bleu-rgb), .5); }
.es-steps { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(14px, 1.6vw, 22px); margin: 0; padding: 0; list-style: none; counter-reset: s; }
.es-steps li { display: flex; flex-direction: column; gap: 10px; }
.es-step-j { display: inline-grid; place-items: center; width: fit-content; min-width: 48px; height: 48px; padding: 0 12px; margin-bottom: 14px; border-radius: var(--r-pill); background: var(--carte);
  box-shadow: var(--pk-sh-label), var(--pk-sh-base), 0 0 0 6px var(--papier); font: 600 14px/1 var(--f-mono); color: var(--cobalt); transition: background-color .5s var(--pk-ease), color .5s var(--pk-ease); }
.es-steps li.is-on .es-step-j { background: var(--nuit); color: #fff; box-shadow: 0 0 0 6px var(--papier), 0 8px 20px -6px rgba(var(--bleu-rgb), .6); }
.es-steps h3 { font-size: 18px; }
.es-steps p { max-width: 30ch; font-size: 15px; line-height: 1.5; color: rgba(11, 11, 15, .62); }

/* ── Tarifs ── */
.es-echelle { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin: -16px 0 28px; }
.es-echelle span { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 16px; border-radius: var(--r-pill); background: var(--carte); box-shadow: var(--pk-sh-label), var(--pk-sh-base); font-size: 14px; color: rgba(11, 11, 15, .6); }
.es-echelle span b { color: var(--encre); font-weight: 700; }
.es-echelle span i { width: 8px; height: 8px; border-radius: 50%; background: rgba(var(--nuit-rgb), .2); }
.es-echelle span.is-on { background: var(--nuit); color: rgba(244, 241, 234, .8); box-shadow: var(--pk-sh-btn); }
.es-echelle span.is-on b { color: #fff; }
.es-echelle span.is-on i { position: relative; background: var(--bleu-clair); color: var(--bleu-clair); }
.es-echelle span.is-on i::before { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 1px solid currentColor; animation: pk-pulse 2.2s var(--pk-ease) infinite; }
.es-echelle svg { width: 34px; height: 10px; fill: none; stroke: rgba(var(--nuit-rgb), .35); stroke-width: 1.4; stroke-linecap: round; stroke-linejoin: round; }

.es-prix-grid { display: grid; grid-template-columns: 1.35fr 1fr; gap: clamp(14px, 1.6vw, 22px); align-items: start; }
.es-offre { position: relative; overflow: hidden; isolation: isolate; display: flex; flex-direction: column; gap: 22px; padding: clamp(26px, 3vw, 44px); border-radius: var(--r-xl);
  background: radial-gradient(120% 70% at 85% 0%, #1B2A78 0%, var(--nuit) 62%); color: var(--papier); box-shadow: 0 40px 80px -30px rgba(10, 16, 51, .6), var(--sh-nuit); }
.es-offre .pk-border-glow { --pk-glow: var(--bleu-clair); }
.es-offre-halo { z-index: -1; width: 520px; top: -260px; right: -180px; opacity: .45; }
.es-offre-top { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; }
.es-offre-top h3 { font-size: 20px; }
.es-offre-prix { display: flex; align-items: flex-end; gap: 18px; }
.es-offre-prix b { font-size: clamp(3.6rem, 2.6rem + 4vw, 6rem); font-weight: 800; letter-spacing: -.06em; line-height: .9; background: linear-gradient(180deg, #fff 30%, var(--ciel)); -webkit-background-clip: text; background-clip: text; color: transparent; }
.es-offre-prix span { display: flex; flex-direction: column; gap: 4px; padding-bottom: 6px; font-size: 14px; line-height: 1.3; color: rgba(244, 241, 234, .66); }
.es-offre-prix s { font-size: 22px; font-weight: 700; letter-spacing: -.03em; color: #FF6B6B; text-decoration: line-through 2px #FF4D4F; }
.es-offre-l { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 22px; margin: 0; padding: 22px 0 0; list-style: none; border-top: 1px solid rgba(255, 255, 255, .1); }
.es-offre-l li { position: relative; padding-left: 28px; font-size: 15px; line-height: 1.45; color: rgba(244, 241, 234, .86); }
.es-offre-l li b { color: #fff; }
.es-offre-l li::before { content: ""; position: absolute; left: 0; top: 1px; width: 19px; height: 19px; border-radius: 50%; background: rgba(124, 155, 255, .2) center / 11px no-repeat
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 6.2l2.3 2.3 4.7-5' fill='none' stroke='%23A9C1FF' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.es-offre .es-btn { align-self: flex-start; margin-top: 4px; min-height: 50px; padding: 0 7px 0 22px; gap: 14px; font-size: 15px; }
.es-offre-call { margin-top: -10px; font-size: 13.5px; line-height: 1.5; color: rgba(244, 241, 234, .6); }

.es-prix-side { display: flex; flex-direction: column; gap: clamp(14px, 1.6vw, 22px); }
.es-sur, .es-options { display: flex; flex-direction: column; gap: 12px; padding: clamp(22px, 2.4vw, 32px); border-radius: var(--r-l); background: var(--carte); box-shadow: var(--pk-sh-label), var(--pk-sh-base); }
.es-sur h3, .es-options h3 { font-size: 18px; }
.es-sur-prix { display: flex; align-items: baseline; gap: 10px; font-size: 2.4rem; font-weight: 800; letter-spacing: -.045em; line-height: 1; }
.es-sur-prix small { font-size: 14px; font-weight: 500; letter-spacing: 0; color: rgba(11, 11, 15, .55); }
.es-sur p:not(.es-sur-prix) { font-size: 15px; line-height: 1.5; color: rgba(11, 11, 15, .62); }
.es-sur .es-ghost { align-self: flex-start; margin-top: 6px; background: var(--papier); }
.es-options ul { display: flex; flex-direction: column; margin: 0; padding: 0; list-style: none; }
.es-options li { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 13px 0; border-top: 1px dashed rgba(var(--nuit-rgb), .14); font-size: 15px; }
.es-options li span { color: rgba(11, 11, 15, .72); }
.es-options li b { flex: none; font-weight: 700; }

/* ── Garantie ── */
.es-gar { display: grid; grid-template-columns: auto 1fr; align-items: center; gap: clamp(28px, 5vw, 72px); padding: clamp(28px, 4vw, 56px); border-radius: var(--r-xl); background: var(--carte); box-shadow: var(--pk-sh-label), var(--pk-sh-base);
  background-image: radial-gradient(rgba(var(--nuit-rgb), .06) 1px, transparent 1.2px); background-size: 14px 14px; }
.es-gar-sceau { position: relative; display: grid; place-items: center; width: clamp(150px, 16vw, 210px); aspect-ratio: 1; border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, #3F6BFF, var(--cobalt) 55%, var(--outremer)); box-shadow: 0 0 0 8px var(--carte), 0 0 0 9px rgba(var(--bleu-rgb), .2), 0 30px 50px -20px rgba(var(--bleu-rgb), .7); }
.es-gar-sceau svg { position: absolute; inset: 0; width: 100%; height: 100%; animation: es-tourne 26s linear infinite; }
.es-gar-sceau text { font: 600 10px var(--f-mono); letter-spacing: .2em; fill: var(--glace); }
.es-gar-sceau b { font-size: clamp(1.8rem, 1.3rem + 1.4vw, 2.5rem); font-weight: 800; letter-spacing: -.05em; color: #fff; }
.es-gar-txt { display: flex; flex-direction: column; gap: 16px; }
.es-gar-steps { display: flex; flex-direction: column; gap: 10px; margin: 8px 0 0; padding: 0; list-style: none; counter-reset: g; }
.es-gar-steps li { counter-increment: g; display: flex; align-items: baseline; gap: 12px; font-size: 16px; line-height: 1.5; color: rgba(11, 11, 15, .72); }
.es-gar-steps li::before { content: counter(g); flex: none; display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--nuit); color: #fff; font: 600 12px/1 var(--f-mono); transform: translateY(-1px); }
.es-gar-steps b { color: var(--encre); }

.es-humains { display: grid; grid-template-columns: 1fr 1.3fr; align-items: center; gap: clamp(24px, 4vw, 64px); margin-top: clamp(48px, 6vw, 80px); }
.es-humains-t { font-size: clamp(1.7rem, 1.2rem + 2vw, 2.7rem); font-weight: 800; letter-spacing: -.045em; line-height: 1.05; text-wrap: balance; }
.es-humains-t span { display: block; color: rgba(11, 11, 15, .4); }
.es-humains ul { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 0; padding: 0; list-style: none; }
.es-humains li { display: flex; align-items: center; gap: 12px; min-height: 64px; padding: 14px 18px; border-radius: var(--r-m); background: var(--carte); box-shadow: var(--pk-sh-label), var(--pk-sh-base); font-size: 15px; font-weight: 600; letter-spacing: -.015em; line-height: 1.35; }
.es-humains li::before { content: ""; flex: none; width: 8px; height: 8px; border-radius: 50%; background: var(--bleu); box-shadow: 0 0 10px rgba(var(--bleu-rgb), .7); }

/* ── Avis ── */
.es-murs { columns: 3 300px; column-gap: clamp(14px, 1.6vw, 22px); }
.es-t { break-inside: avoid; display: flex; flex-direction: column; gap: 18px; margin: 0 0 clamp(14px, 1.6vw, 22px); padding: clamp(22px, 2.2vw, 28px); border-radius: var(--r-l); background: var(--carte); box-shadow: var(--pk-sh-label), var(--pk-sh-base); }
.es-t blockquote { margin: 0; font-size: 15.5px; line-height: 1.55; color: rgba(11, 11, 15, .8); }
.es-t figcaption { display: flex; align-items: center; gap: 12px; }
.es-t img { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; background: var(--papier-2); box-shadow: 0 0 0 2px var(--carte), 0 0 0 3px rgba(var(--bleu-rgb), .25); }
.es-t figcaption span { display: flex; flex-direction: column; gap: 2px; font-size: 13.5px; line-height: 1.35; color: rgba(11, 11, 15, .58); }
.es-t figcaption b { font-size: 15px; color: var(--encre); }
.es-t-big { background: var(--nuit); color: var(--papier); box-shadow: var(--sh-nuit), 0 30px 60px -24px rgba(10, 16, 51, .55); }
.es-t-big blockquote { font-size: clamp(16.5px, 1.2vw, 18.5px); font-weight: 500; letter-spacing: -.015em; color: rgba(244, 241, 234, .92); }
.es-t-big figcaption span { color: rgba(244, 241, 234, .6); }
.es-t-big figcaption b { color: #fff; }
.es-t-big img { box-shadow: 0 0 0 2px var(--nuit), 0 0 0 3px rgba(124, 155, 255, .5); }

/* ── FAQ ── */
.es-faq-grid { display: grid; grid-template-columns: 1fr 1.5fr; gap: clamp(28px, 5vw, 80px); align-items: start; }
.es-faq-head { position: sticky; top: 100px; margin: 0; }
.es-faq-aside { margin-top: 8px; font-size: 15.5px; line-height: 1.55; color: rgba(11, 11, 15, .62); }
.es-faq-aside a { color: var(--cobalt); font-weight: 600; text-underline-offset: 3px; }
/* FAQ : bloc « Vous voulez parler ? » (WhatsApp) */
.es-faq-wa { margin-top: 28px; max-width: 380px; padding: 18px; border-radius: var(--r-l); background: var(--carte); box-shadow: var(--pk-sh-base); }
.es-faq-wa-top { display: flex; align-items: center; gap: 14px; }
.es-faq-wa-top > span:last-child { display: grid; gap: 2px; }
.es-faq-wa-top b { font-size: 17px; font-weight: 700; letter-spacing: -.02em; }
.es-faq-wa-top small { font-size: 13px; color: rgba(11, 11, 15, .55); }
.es-faq-wa-av { position: relative; flex: none; width: 56px; height: 56px; }
.es-faq-wa-av img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; box-shadow: 0 0 0 3px #fff, 0 8px 18px -8px rgba(var(--nuit-rgb), .45); }
.es-faq-wa-av i { position: absolute; right: 1px; bottom: 1px; width: 13px; height: 13px; border-radius: 50%; background: #25D366; box-shadow: 0 0 0 2.5px #fff; }
.es-faq-wa-av i::after { content: ""; position: absolute; inset: 0; border-radius: 50%; background: #25D366; animation: es-faq-ping 2.4s var(--pk-ease) infinite; }
@keyframes es-faq-ping { 0% { transform: scale(1); opacity: .7; } 80%, 100% { transform: scale(2.6); opacity: 0; } }
.es-faq-wa-msg { position: relative; margin: 16px 0 0; padding: 12px 14px; border-radius: 4px 16px 16px 16px; font-size: 14.5px; line-height: 1.5; color: var(--encre);
  background: radial-gradient(circle at 1px 1px, rgba(var(--nuit-rgb), .06) 1px, transparent 1.5px) 0 0 / 12px 12px, var(--papier); }
.es-faq-wa-go { display: flex; align-items: center; justify-content: center; gap: 10px; margin-top: 14px; min-height: 48px; border-radius: var(--r-pill, 999px);
  font-weight: 600; font-size: 15px; color: #fff; text-decoration: none; background: #25D366; box-shadow: 0 10px 22px -10px rgba(29, 168, 81, .8); transition: transform var(--pk-anim), background var(--pk-anim); }
.es-faq-wa-go:hover { background: #1FBF5B; transform: translateY(-1px); }
.es-faq-wa-go:active { transform: scale(.98); }
.es-faq-wa-go svg { width: 20px; height: 20px; }
.es-faq-l { border-top: 1px dashed rgba(var(--nuit-rgb), .18); }
.es-faq-l details { border-bottom: 1px dashed rgba(var(--nuit-rgb), .18); }
.es-faq-l summary { position: relative; display: flex; align-items: center; min-height: 64px; padding: 16px 52px 16px 0; cursor: pointer; list-style: none; font-size: 17px; font-weight: 650; letter-spacing: -.02em; line-height: 1.35; }
.es-faq-l summary::-webkit-details-marker { display: none; }
.es-faq-l summary::after { content: ""; position: absolute; right: 0; top: 50%; width: 36px; height: 36px; margin-top: -18px; border-radius: 50%; background: var(--carte) center / 14px no-repeat
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Cpath d='M7 2v10M2 7h10' stroke='%230A1033' stroke-width='1.6' stroke-linecap='round'/%3E%3C/svg%3E");
  box-shadow: var(--pk-sh-label), var(--pk-sh-base); transition: transform var(--pk-anim), background-color var(--pk-anim); }
.es-faq-l details[open] summary::after { transform: rotate(45deg); }
.es-faq-l summary:hover::after { background-color: #fff; }
.es-faq-l details p { max-width: 58ch; padding: 0 52px 22px 0; font-size: 15.5px; line-height: 1.6; color: rgba(11, 11, 15, .66); }
.es-faq-l details[open] p { animation: es-faq .45s var(--pk-ease) both; }
@keyframes es-faq { from { opacity: 0; transform: translateY(-6px); filter: blur(6px); } }

/* ── Appel final ── */
.es-final { padding-block: var(--sec); overflow-x: clip; }
.es-final-c { position: relative; overflow: hidden; isolation: isolate; padding: clamp(56px, 8vw, 120px) var(--gut); border-radius: var(--r-xl);
  background: radial-gradient(90% 80% at 50% 0%, #1B2A78 0%, var(--nuit) 60%); color: var(--papier); text-align: center; box-shadow: 0 50px 100px -40px rgba(10, 16, 51, .7), var(--sh-nuit); }
.es-final-c .pk-guides { --pk-guides-pad: clamp(24px, 6vw, 80px); z-index: -1; color: var(--glace); opacity: .5; }
.es-final-halo { z-index: -1; width: min(760px, 90vw); left: 50%; top: -40%; margin-left: calc(min(760px, 90vw) / -2); opacity: .5; }
.es-final-logo { position: absolute; z-index: -1; right: -6%; bottom: -18%; width: min(520px, 60vw); aspect-ratio: 118 / 112; opacity: .55; }
.es-final-in { display: flex; flex-direction: column; align-items: center; gap: 22px; max-width: 46rem; margin-inline: auto; }
.es-final-in .es-h2-b { color: var(--bleu-clair); }
.es-final-in > p { max-width: 44ch; font-size: var(--t-lead); line-height: 1.55; color: rgba(244, 241, 234, .74); }
.es-places-l { padding: 9px 14px; border-radius: var(--r-pill); background: rgba(255, 255, 255, .06); box-shadow: 0 0 0 1px rgba(255, 255, 255, .1) inset; }
.es-ctas-c { justify-content: center; margin-top: 10px; }
.es-ghost-d { background: rgba(255, 255, 255, .07); color: var(--papier); box-shadow: 0 0 0 1px rgba(255, 255, 255, .14) inset; backdrop-filter: blur(8px); }
.es-ghost-d:hover { background: rgba(255, 255, 255, .12); box-shadow: 0 0 0 1px rgba(255, 255, 255, .22) inset; }

/* ── Footer ── */
.es-foot { position: relative; overflow-x: clip; padding: clamp(40px, 5vw, 64px) 0 calc(28px + env(safe-area-inset-bottom)); border-top: 1px dashed rgba(var(--nuit-rgb), .14); }
.es-foot-top { display: grid; grid-template-columns: 1fr 1.6fr; gap: 40px; }
.es-foot-id { display: flex; flex-direction: column; gap: 14px; }
.es-foot-id p { max-width: 32ch; font-size: 15px; line-height: 1.55; color: rgba(11, 11, 15, .62); }
.es-foot-id p a { color: var(--cobalt); font-weight: 600; text-underline-offset: 3px; }
.es-foot-nav { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.es-foot-nav div { display: flex; flex-direction: column; gap: 2px; }
.es-foot-nav .es-k { margin-bottom: 10px; }
.es-foot-nav a, .es-foot-nav .ck-gerer { display: flex; align-items: center; min-height: 40px; font-size: 15px; color: rgba(11, 11, 15, .74); text-decoration: none; transition: color var(--pk-anim); }
.es-foot-nav a:hover, .es-foot-nav .ck-gerer:hover { color: var(--cobalt); text-decoration: none; }
.es-foot-nav { grid-template-columns: repeat(4, 1fr); }
.es-rs-i { display: grid; place-items: center; flex: none; width: 28px; height: 28px; margin-right: 10px; border-radius: 50%; background: var(--glace, #E6EDFF); color: var(--nuit); box-shadow: inset 0 0 0 1px rgba(10, 44, 216, .1); transition: background-color var(--pk-anim), color var(--pk-anim), transform var(--pk-anim); }
.es-rs-i svg { width: 15px; height: 15px; fill: currentColor; }
.es-foot-rs a:hover .es-rs-i { background: var(--cobalt); color: #fff; transform: translateY(-1px); }
.es-foot-villes { margin-top: clamp(32px, 4vw, 48px); padding-top: 22px; border-top: 1px dashed rgba(var(--nuit-rgb), .14); }
.es-foot-villes ul { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 14px 0 0; padding: 0; list-style: none; }
.es-foot-villes li { font-size: 14.5px; color: rgba(11, 11, 15, .62); }
.es-foot-big { position: relative; display: flex; align-items: flex-end; gap: clamp(12px, 2vw, 28px); margin-top: clamp(40px, 6vw, 80px); }
.es-foot-logo { flex: none; width: clamp(80px, 14vw, 200px); aspect-ratio: 118 / 112; }
.es-foot-word { font-size: clamp(3.4rem, 1rem + 11vw, 11.5rem); font-weight: 800; letter-spacing: -.065em; line-height: .78; color: var(--nuit);
  background: linear-gradient(180deg, var(--nuit) 30%, rgba(var(--nuit-rgb), .2)); -webkit-background-clip: text; background-clip: text; color: transparent; white-space: nowrap; }
.es-foot-bas { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 8px 24px; margin-top: 28px; padding-top: 20px; border-top: 1px dashed rgba(var(--nuit-rgb), .14); font-size: 13px; color: rgba(11, 11, 15, .55); }

/* ── Barre collée en bas (mobile) ── */
.es-barre { display: none; }

/* ═════════ Tablette ═════════ */
@media (max-width: 1080px) {
  .es-head-row { flex-direction: column; align-items: flex-start; }
  .es-real-g { grid-template-columns: repeat(2, 1fr); }
  .es-real-c, .es-real-big, .es-real-g > li:nth-child(n+9) { grid-column: span 1; }
  .es-vs { grid-template-columns: minmax(96px, .6fr) 1fr 1fr 1.1fr; --pad: 14px; }
  .es-vs-c { font-size: 14px; }
  .es-vs-o b { font-size: 15px; }
  .es-bento { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .es-bento > .es-bt { grid-column: auto; grid-row: auto; }
  .es-bento > .es-bt-design { grid-column: 1 / -1; }
  .es-bento > .es-bt-mobile { grid-row: span 2; }
  .es-inclus .es-head { flex-direction: column; align-items: flex-start; }
  .es-steps { grid-template-columns: 1fr 1fr; row-gap: 36px; }
  .es-frise-l { display: none; }
  .es-prix-grid { grid-template-columns: 1fr; }
  .es-prix-side { display: grid; grid-template-columns: 1fr 1fr; }
  .es-humains { grid-template-columns: 1fr; }
  .es-faq-grid { grid-template-columns: 1fr; }
  .es-faq-head { position: static; }
  .es-foot-top { grid-template-columns: 1fr; }
}

/* ═════════ Mobile ═════════ */
@media (max-width: 700px) {
  .es-logos-track { --g: 44px; }
  .es-logos-track img { height: 20px; }
  .es-logos-track .lg-adeo { height: 34px; }
  .es-real-g { grid-template-columns: 1fr; }
  .es-real-g > li:nth-child(n+7) { display: none; }
  /* Comparatif : un vrai tableau à trois colonnes, Eden Studio en colonne sombre continue */
  .es-vs { grid-template-columns: 1fr 1fr 1.12fr; padding: 4px 6px 10px; --pad: 8px; }
  .es-vs-hl { grid-column: 3; grid-row: 1 / 12; margin: -10px 0; border-radius: 18px; }
  .es-vs-r > :nth-child(2) { grid-column: 1; } .es-vs-r > :nth-child(3) { grid-column: 2; } .es-vs-r > :nth-child(4) { grid-column: 3; }
  .es-vs-r > .es-vs-lab { grid-column: 1 / 3; }
  .es-vs-head .es-vs-lab { display: none; }
  .es-vs-r:nth-child(3) > .es-vs-lab { grid-row: 2; } .es-vs-r:nth-child(3) > .es-vs-c { grid-row: 3; }
  .es-vs-r:nth-child(4) > .es-vs-lab { grid-row: 4; } .es-vs-r:nth-child(4) > .es-vs-c { grid-row: 5; }
  .es-vs-r:nth-child(5) > .es-vs-lab { grid-row: 6; } .es-vs-r:nth-child(5) > .es-vs-c { grid-row: 7; }
  .es-vs-r:nth-child(6) > .es-vs-lab { grid-row: 8; } .es-vs-r:nth-child(6) > .es-vs-c { grid-row: 9; }
  .es-vs-r:nth-child(7) > .es-vs-lab { grid-row: 10; } .es-vs-r:nth-child(7) > .es-vs-c { grid-row: 11; }
  .es-vs-o { align-items: center; gap: 0; padding: 18px 4px 12px; text-align: center; }
  .es-vs-o b { margin-top: 8px; font-size: 13.5px; letter-spacing: -.025em; }
  .es-vs-o small { display: none; }
  .es-vs-ic { width: 34px; height: 34px; border-radius: 11px; }
  .es-vs-ic svg { width: 18px; height: 18px; }
  .es-vs-logo svg { width: 18px; }
  .es-vs-lab { padding: 16px 8px 2px; font-size: 10.5px; letter-spacing: .12em; color: rgba(11, 11, 15, .5); }
  .es-vs-c { display: flex; flex-direction: column; align-items: center; justify-content: flex-start; gap: 6px; padding: 8px 6px 14px; border-top: 0; font-size: 13px; line-height: 1.25; letter-spacing: -.01em; text-align: center; text-wrap: balance; }
  .es-vs-c.is-no::before, .es-vs-c.is-ok::before { flex: none; width: 20px; height: 20px; background-size: 11px; }
  .es-vs-t { display: none; }
  .es-vs-m { display: block; }
  .es-vs-big { font-size: 14px; letter-spacing: -.03em; line-height: 1.15; }
  .es-vs-c.es-vs-us .es-vs-big { font-size: 24px; }
  .es-vs-big small { display: block; width: max-content; margin: 6px auto 0; padding: 4px 7px; font-size: 9px; transform: none; }
  .es-vs-bar { align-self: stretch; height: 5px; margin-top: 2px; }
  .es-vs-foot { flex-direction: column; align-items: flex-start; }
  .es-bento { grid-template-columns: 1fr; gap: 12px; }
  .es-bento > .es-bt-design, .es-bento > .es-bt-mobile { grid-column: auto; grid-row: auto; }
  .es-bt-design .es-bt-ill { min-height: 300px; }
  .es-dz-zone { min-height: 230px; }
  .es-dz { width: 44%; }
  .es-dz { --x2: calc(var(--x) * .78); translate: calc(-50% + var(--x2)) -50%; }
  .es-bt-txt { padding: 0 20px 22px; }
  .es-steps { grid-template-columns: 1fr; row-gap: 28px; padding-left: 64px; }
  .es-steps li { position: relative; }
  .es-step-j { position: absolute; left: -64px; top: -4px; margin: 0; }
  .es-frise-l { display: block; left: 23px; right: auto; top: 0; bottom: 0; width: 2px; height: auto; background: repeating-linear-gradient(180deg, rgba(var(--nuit-rgb), .2) 0 6px, transparent 6px 12px); }
  .es-frise-l i { transform-origin: top; transform: scaleY(var(--p, 0)); }
  .es-echelle { margin-top: -8px; }
  .es-echelle svg { display: none; }
  .es-offre { border-radius: var(--r-l); }
  .es-offre-l { grid-template-columns: 1fr; }
  .es-offre .es-btn { align-self: stretch; justify-content: space-between; }
  .es-prix-side { grid-template-columns: 1fr; }
  .es-gar { grid-template-columns: 1fr; justify-items: center; text-align: left; }
  .es-gar-txt { justify-self: stretch; }
  .es-humains ul { grid-template-columns: 1fr; }
  .es-murs { columns: 1; }
  .es-murs > .es-t:nth-child(n+6) { display: none; }
  .es-faq-l summary { font-size: 16px; }
  .es-faq-l details p { padding-right: 0; }
  .es-final-c { border-radius: var(--r-l); text-align: left; }
  .es-final-in { align-items: flex-start; }
  .es-ctas-c { flex-direction: column; align-items: stretch; width: 100%; }
  .es-ctas-c .es-btn { justify-content: space-between; }
  .es-final-logo { width: 70vw; right: -24%; bottom: -10%; opacity: .35; }
  .es-foot-nav { grid-template-columns: 1fr 1fr; }
  .es-foot-villes ul { gap: 6px 16px; }
  .es-foot-villes li { font-size: 14px; }
  .es-foot-word { font-size: 17vw; }
  .es-foot { padding-bottom: calc(100px + env(safe-area-inset-bottom)); }

  .es-barre { position: fixed; z-index: 60; left: 10px; right: 10px; bottom: calc(10px + env(safe-area-inset-bottom)); display: flex; align-items: center; justify-content: space-between; gap: 10px;
    padding: 8px 8px 8px 16px; border-radius: var(--r-pill); background: rgba(var(--papier-rgb), .86); backdrop-filter: blur(14px) saturate(1.3); -webkit-backdrop-filter: blur(14px) saturate(1.3);
    box-shadow: var(--pk-sh-card), 0 0 0 1px rgba(var(--nuit-rgb), .06); transform: translateY(140%); opacity: 0; filter: blur(6px);
    transition: transform .6s var(--pk-ease), opacity .45s var(--pk-ease), filter .45s var(--pk-ease); }
  .es-barre.is-on { transform: none; opacity: 1; filter: none; }
  .es-barre-t { font-size: 13px; line-height: 1.25; color: rgba(11, 11, 15, .66); }
  .es-barre-t b { display: block; font-size: 17px; color: var(--encre); letter-spacing: -.03em; }
  .es-barre .es-btn { flex: none; min-height: 48px; }
}

/* ═════════ Mouvement réduit ═════════ */
@media (prefers-reduced-motion: reduce) {
  .es-logos-track, .es-places i, .es-caret, .es-gar-sceau svg, .es-echelle span.is-on i::before { animation: none !important; }
  .es-logos-rail { overflow-x: auto; }
  .es-frise-l i { transform: none; }
  .es-cms-ok { opacity: 1; filter: none; transform: none; }
  .es-bt-ill *, .es-bt-ill *::before { animation: none !important; }
  .es-dz-k0 .es-dz-in, .es-dz-a .es-dz-in { transform: translateY(-18px) scale(1.06); filter: none; }
  .es-dz-a { z-index: 3; }
  .es-dz-a .es-dz-ok { opacity: 1; filter: none; scale: 1; }
  .es-tx-ok, .es-web-res, .es-rt-done { opacity: 1; filter: none; transform: none; }
  .es-rt-pin, .es-rt-pin em { opacity: 0; }
  .es-barre { transition: none; }
  .es-faq-l details[open] p { animation: none; }
  .es-faq-wa-av i::after { animation: none; }
}

/* ═════════ WhatsApp flottant ═════════ */
.es-wa { position: fixed; z-index: 70; right: 22px; bottom: 22px; display: flex; flex-direction: column; align-items: flex-end; gap: 14px; pointer-events: none; transition: bottom .6s var(--pk-ease); }
.es-wa > * { pointer-events: auto; }
.es-wa-fab { position: relative; display: grid; place-items: center; width: 60px; height: 60px; padding: 0; border: 0; border-radius: 50%; cursor: pointer; color: #fff;
  background: radial-gradient(120% 120% at 30% 20%, #3BE07A 0%, #25D366 45%, #1DA851 100%);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, .25) inset, 0 14px 30px -10px rgba(29, 168, 81, .75), 0 4px 10px -4px rgba(11, 11, 15, .25);
  transition: transform .45s var(--pk-ease), opacity .45s var(--pk-ease), filter .45s var(--pk-ease); }
.es-wa-fab:hover { transform: scale(1.06); }
.es-wa-fab:active { transform: scale(.96); }
.es-wa-fab > svg { width: 28px; height: 28px; }
.es-wa-ring { position: absolute; inset: -5px; border-radius: 50%; padding: 2px; pointer-events: none;
  background: conic-gradient(from var(--pk-a, 0deg), transparent 0 55%, rgba(37, 211, 102, .9) 80%, #fff 92%, transparent 100%);
  -webkit-mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0); mask: linear-gradient(#000 0 0) content-box exclude, linear-gradient(#000 0 0);
  animation: pk-ring 3.2s linear infinite; }
.es-wa-badge { position: absolute; top: -3px; right: -3px; display: grid; place-items: center; min-width: 20px; height: 20px; padding: 0 5px; border-radius: 10px;
  font: 600 11px/1 var(--f-mono, monospace); color: #fff; background: #FF3B30; box-shadow: 0 0 0 2px var(--papier);
  transform: scale(0); transition: transform .45s cubic-bezier(.34, 1.35, .64, 1); }
.es-wa.is-notif .es-wa-badge { transform: scale(1); }

.es-wa-pop { width: min(330px, calc(100vw - 32px)); border-radius: 22px; overflow: hidden; background: var(--carte);
  box-shadow: var(--pk-sh-card), 0 30px 60px -24px rgba(var(--nuit-rgb), .45), 0 0 0 1px rgba(var(--nuit-rgb), .06);
  transform-origin: 100% 100%; opacity: 0; transform: translateY(14px) scale(.96); filter: blur(8px); visibility: hidden;
  transition: opacity .45s var(--pk-ease), transform .6s var(--pk-ease), filter .45s var(--pk-ease), visibility 0s linear .6s; }
.es-wa.is-open .es-wa-pop { opacity: 1; transform: none; filter: none; visibility: visible; transition-delay: 0s; }
.es-wa-head { display: flex; align-items: center; gap: 12px; padding: 14px 14px 14px 16px; color: #fff; background: linear-gradient(135deg, var(--nuit) 0%, var(--nuit-2) 100%); }
.es-wa-head > span:nth-child(2) { flex: 1; display: grid; gap: 2px; min-width: 0; }
.es-wa-head b { font-size: 15px; letter-spacing: -.01em; }
.es-wa-head small { font-size: 12px; color: var(--ciel); }
.es-wa-av { position: relative; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; font-weight: 600; color: var(--nuit);
  background: linear-gradient(220deg, #fff 0%, var(--glace) 100%); flex: none; }
.es-wa-av img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; }
.es-wa-av i { position: absolute; right: 0; bottom: 0; width: 11px; height: 11px; border-radius: 50%; background: #25D366; box-shadow: 0 0 0 2px var(--nuit); }
.es-wa-x { display: grid; place-items: center; width: 30px; height: 30px; padding: 0; border: 0; border-radius: 50%; cursor: pointer; color: #fff; background: rgba(255, 255, 255, .1); transition: background var(--pk-anim); }
.es-wa-x:hover { background: rgba(255, 255, 255, .2); }
.es-wa-x svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
.es-wa-body { padding: 18px 16px 6px; background: radial-gradient(circle at 1px 1px, rgba(var(--nuit-rgb), .07) 1px, transparent 1.5px) 0 0 / 14px 14px, var(--papier); }
.es-wa-msg { position: relative; margin: 0; max-width: 92%; padding: 11px 14px; border-radius: 4px 16px 16px 16px; font-size: 14px; line-height: 1.45; color: var(--encre);
  background: #fff; box-shadow: 0 1px 2px rgba(11, 11, 15, .08); }
.es-wa.is-open .es-wa-msg { animation: es-wa-in .6s var(--pk-ease) .2s both; }
@keyframes es-wa-in { from { opacity: 0; transform: translateY(8px); filter: blur(6px); } }
.es-wa-go { display: flex; align-items: center; justify-content: center; gap: 10px; margin: 12px 14px 14px; min-height: 48px; border-radius: var(--r-pill, 999px);
  font-weight: 600; font-size: 15px; color: #fff; text-decoration: none; background: #25D366; box-shadow: 0 10px 22px -10px rgba(29, 168, 81, .8); transition: transform var(--pk-anim), background var(--pk-anim); }
.es-wa-go:hover { background: #1FBF5B; transform: translateY(-1px); }
.es-wa-go svg { width: 20px; height: 20px; }

@media (max-width: 700px) {
  .es-wa { right: 14px; bottom: calc(14px + env(safe-area-inset-bottom)); }
  .barre-on .es-wa { bottom: calc(84px + env(safe-area-inset-bottom)); }
  .es-wa-fab { width: 54px; height: 54px; }
  .es-wa-fab > svg { width: 25px; height: 25px; }
}
@media (prefers-reduced-motion: reduce) {
  .es-wa-ring { animation: none; }
  .es-wa, .es-wa-pop, .es-wa-fab { transition: none; }
  .es-wa.is-open .es-wa-msg { animation: none; }
}

/* ── Agenda iClosed en popup ── */
body.no-scroll { overflow: hidden; }
.iclosed-popup-overlay { background-color: rgba(10, 16, 51, .72) !important; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.iclosed-popup-container { border-radius: 20px; }
@media (max-width: 700px) {
  .iclosed-popup-container { width: 100%; height: 100%; border-radius: 0; }
}