/* Page Web-ADNS (/web-adns-cms-editeur-de-site-web), mise en scène « mousse » refaite le 27/10/2026 selon MISE-EN-SCENE.md
   (règles du 27/10 : composition du haut de page, aucune surcharge d'un composant commun). Remplace ad-web-adns-v2.css et
   ad-web-adns-v3.css, qui ne sont plus chargées. Objets : captures RÉELLES du site de démonstration Cap Locaux ; aucune
   prévisualisation de site dessinée (décision d'Antoine du 25/10). Se charge après ad-gipco-v3.css, limitée à main.wa4. */

main.wa4 { --gp-encre:#14201a; --gp-nuit:#1c2b23; --gp-neige:#f5f6f2; --gp-sable:#e8ebe3; --gp-filet:#d5dad0;
           --gp-doux:#4b5850;       /* 6,2:1 au moins sur les fonds clairs */
           --gp-discret:#5a6660;    /* 4,9:1 au moins sur neige, sable et le papier des scènes */
           --wa-mousse:#2f6a47;     /* accent sur fond clair, 5,3:1 au moins */
           --wa-mousse-n:#a6d0b2;   /* accent sur vert profond, 9,8:1 */
           --wa-clair:#e2ebe3; --wa-ombre:20,32,26; }

/* ---------- en-tête posé sur la photo, menu ouvert ---------- */
body:has(main.wa4) .ad-entete { --ad-fond:#14201a; --ad-lien:#fff; }
body:has(main.wa4) .ad-entete:has(.ad-menu[open]) { background:#14201a; }

/* ---------- photos et voiles teintés du vert profond ---------- */
main.wa4 .gp-photo { background-image:url(/images/web-adns-v2/heros-1920.webp); background-position:50% 42%; }
main.wa4 .gp-photo--fin { background-image:url(/images/web-adns-v2/fin-1600.webp); background-position:30% 50%; transform:none; filter:none; }
main.wa4 .gp-voile { background:linear-gradient(90deg,rgba(var(--wa-ombre),.6),rgba(var(--wa-ombre),.28) 40%,rgba(var(--wa-ombre),0) 56%),
                                linear-gradient(180deg,rgba(var(--wa-ombre),.45),rgba(var(--wa-ombre),0) 16%,rgba(var(--wa-ombre),0) 66%,rgba(var(--wa-ombre),.9) 100%); }
main.wa4 .gp-voile--fin { background:linear-gradient(90deg,rgba(var(--wa-ombre),0),rgba(var(--wa-ombre),.2) 30%,rgba(var(--wa-ombre),.66) 48%,rgba(var(--wa-ombre),.86) 100%); }

/* ---------- haut de page : bande de preuve et objet (une capture réelle dans un navigateur) ---------- */
main.wa4 .wa-refs { display:block; }
main.wa4 .wa-preuve { position:relative; padding-left:24px; font-size:14.5px; font-weight:600; color:rgba(255,255,255,.88); }
main.wa4 .wa-preuve::before { content:""; position:absolute; left:0; top:.35em; width:10px; height:10px; border-radius:50%; background:var(--gp-soleil); box-shadow:inset 0 0 0 1px rgba(17,17,18,.2); }
main.wa4 .wa-h { height:auto; }
main.wa4 .wa-reel { position:relative; width:100%; border-radius:12px; overflow:hidden; background:#fff; box-shadow:0 0 0 1px rgba(0,0,0,.08),-14px 28px 56px -14px rgba(0,0,0,.55),-40px 70px 130px -40px rgba(0,0,0,.6); }
main.wa4 .wa-reel__barre { display:flex; align-items:center; gap:6px; height:30px; padding:0 12px; background:#eef0ea; border-bottom:1px solid #dde1d8; }
main.wa4 .wa-reel__barre i { width:8px; height:8px; border-radius:50%; background:#cdd3c9; }
main.wa4 .wa-reel__barre span { margin-left:10px; padding:3px 10px; border-radius:6px; background:#fff; font-size:10.5px; color:var(--gp-discret); }
main.wa4 .wa-reel img { display:block; width:100%; height:auto; }
/* DÉCISION À PRENDRE (27/10) : le titre est long (57 signes) ; à la taille standard (74 px) il fait 4 lignes et le haut de page ne tient pas.
   Provisoire : taille de Lead-ADNS (ad-lead-v2.css), hauteur 960 px. Le guide interdit de redéfinir la taille du h1 : à retirer si Antoine choisit la taille standard. */
main.wa4 .gp-hero { height:1000px; }
main.wa4 .gp-hero h1 { font-size:clamp(38px,3.6vw,52px); line-height:1; }
main.wa4 .gp-hero__t { width:min(600px,46%); }
main.wa4 .gp-sur > span { display:block; }
/* Objet du haut de page (30/10) : posé sur la table, sous l'ordinateur, entre le bouton et la personne. Zone libre mesurée
   à 1 440 px : x 380-790, y 700-915 (prolongée à gauche sous le bouton) ; conteneur de 1 264 px, donc left relatif au
   conteneur, stable de 1 200 à 1 920 px (la personne commence à x ≥ 680 dans le conteneur). */
@media (min-width: 1200px) { main.wa4 .gp-hero__scene { top:735px; right:auto; left:192px; width:470px; transform:none; } }
@media (min-width: 1700px) { main.wa4 .gp-photo { background-position:50% 60%; } }
@media (min-width: 1024px) and (max-width: 1199px) { main.wa4 .gp-hero { height:auto; padding-bottom:150px; } main.wa4 .gp-hero__scene { position:relative; top:auto; left:auto; right:auto; width:470px; margin-top:44px; transform:none; } main.wa4 .gp-refs { position:absolute; } }
@media (prefers-reduced-motion: no-preference) {
  main.wa4 .wa-reel { animation:wa-pose .7s cubic-bezier(.16,1,.3,1) .25s backwards; }
  @keyframes wa-pose { from { opacity:0; transform:translateY(14px); } to { opacity:1; transform:none; } }
}

/* ---------- gabarit A : deux captures réelles sur papier clair (prospects) ---------- */
main.wa4 .pan.wa-clair { background:radial-gradient(ellipse 70% 80% at 92% 0%,rgba(255,255,255,.95),rgba(255,255,255,0) 60%),var(--wa-clair);
                         box-shadow:inset 0 0 0 1px rgba(var(--wa-ombre),.08); border-radius:12px; }
main.wa4 .gp-sable .pan.wa-clair { background:radial-gradient(ellipse 70% 80% at 92% 0%,rgba(255,255,255,.9),rgba(255,255,255,0) 60%),#f2f5f0; }
main.wa4 .pan.wa-clair .wa-reel { position:absolute; box-shadow:0 0 0 1px rgba(var(--wa-ombre),.08),-8px 16px 30px -12px rgba(var(--wa-ombre),.32),-22px 38px 70px -26px rgba(var(--wa-ombre),.35); animation:none; }

/* ---------- sections sans illustration : titre à gauche, texte à droite ---------- */
main.wa4 .wa-sans { grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:start; row-gap:36px; }
main.wa4 .wa-sans > div:first-child h2 { font-size:clamp(28px,3.3vw,46px); text-wrap:balance; }
main.wa4 .wa-sans__t p { font-size:16.5px; line-height:1.65; color:var(--gp-doux); }
main.wa4 .wa-sans__t p + p { margin-top:14px; }
main.wa4 .wa-sans__t .wa-citation + p { margin-top:0; }
main.wa4 .wa-grille { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:34px 48px; margin:56px 0 0; padding:0; list-style:none; }
main.wa4 .wa-grille li { padding-top:20px; border-top:1px solid #c9d0c4; }
main.wa4 .wa-grille h3 { font-size:21px; }
main.wa4 .wa-grille p { margin-top:10px; font-size:15.5px; line-height:1.62; color:var(--gp-doux); }
main.wa4 .wa-grille a, main.wa4 .gp-cas__t a:not(.wa-bouton):not(.gp-btn) { color:var(--wa-mousse); text-decoration:underline; text-underline-offset:3px; }

/* ---------- textes ---------- */
main.wa4 .wa-sous { font-size:18px; line-height:1.5; font-weight:500; color:var(--gp-texte) !important; margin-top:20px !important; }
main.wa4 .wa-sous--n { color:rgba(255,255,255,.86) !important; }
main.wa4 .wa-h3 { margin:34px 0 0; font:600 22px/1.25 var(--gp-titre); letter-spacing:-.015em; }
main.wa4 .wa-h3 + p { margin-top:12px !important; }
main.wa4 .wa-h3--n { margin:0; color:#fff; }
main.wa4 .gp-cas__t p + p { margin-top:14px; }
main.wa4 .wa-cas .gp-cas__t h2 { font-size:clamp(27px,2.6vw,38px); text-wrap:balance; }
main.wa4 #realisation .gp-cas__t h2 { font-size:clamp(26px,2.3vw,33px); }
main.wa4 .wa-citation { margin:22px 0; padding:20px 24px; border-radius:12px; background:var(--wa-clair); box-shadow:inset 0 0 0 1px rgba(var(--wa-ombre),.08); font:500 17px/1.55 var(--gp-corps); color:var(--gp-texte); }
main.wa4 .wa-encart { margin-top:28px !important; padding:4px 0 4px 18px; position:relative; font-weight:500; color:var(--gp-texte) !important; }
main.wa4 .wa-encart::before { content:""; position:absolute; left:0; top:11px; width:10px; height:10px; border-radius:50%; background:var(--gp-soleil); box-shadow:inset 0 0 0 1px rgba(17,17,18,.2); }
main.wa4 .wa-lien { display:inline-flex; align-items:center; gap:8px; min-height:44px; font-weight:600; font-size:15.5px; color:var(--wa-mousse); text-decoration:underline; text-underline-offset:5px; text-decoration-thickness:1.5px; }
main.wa4 .wa-lien .ad-insec, main.wa4 .wa-fin-liens .ad-insec { display:inline; }
main.wa4 .wa-lien--n { color:var(--wa-mousse-n); }
main.wa4 .wa-lien:focus-visible, main.wa4 .wa-bouton:focus-visible { outline:3px solid var(--wa-mousse); outline-offset:3px; border-radius:4px; }
main.wa4 .wa-lien--n:focus-visible { outline-color:#fff; }
main.wa4 .wa-bouton { display:inline-flex; align-items:center; min-height:52px; margin-top:26px; padding:0 24px; border-radius:10px; background:var(--gp-encre); color:#fff; font-weight:600; font-size:15.5px; text-decoration:none; }

/* ---------- réalisation : gabarit B (photo de détail + carte) ---------- */
main.wa4 .hd b i { background:var(--wa-mousse); }
main.wa4 .chk .r { color:var(--gp-discret); }
main.wa4 .chk .bx { background:var(--wa-mousse); }
main.wa4 .chk .bx.off { background:#fff; }
main.wa4 .pill.j { background:#fff3c4; color:#5c4400; }
main.wa4 .pan.wa-photo { aspect-ratio:612 / 600; background:var(--gp-encre); border-radius:12px; }
main.wa4 .wa-photo .wa-ph { position:absolute; inset:0; }
main.wa4 .wa-photo .wa-ph > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:40% 50%; }
main.wa4 .wa-photo .wa-ph::after { content:""; position:absolute; inset:0; background:linear-gradient(200deg,rgba(var(--wa-ombre),0) 40%,rgba(var(--wa-ombre),.4) 100%); }
main.wa4 .wa-photo .wa-acc { right:6%; bottom:7%; width:min(320px,56%); }
main.wa4 .wa-photo .card { box-shadow:0 0 0 1px rgba(0,0,0,.06),-10px 22px 44px -14px rgba(0,0,0,.55),-30px 50px 100px -30px rgba(0,0,0,.5); }

/* ---------- durée : captures réelles d'algodata.fr ---------- */
main.wa4 .wa-tete-r { grid-template-columns:minmax(0,690fr) minmax(0,408fr); align-items:start; row-gap:36px; }
main.wa4 .wa-r-t { display:grid; gap:14px; justify-items:start; }
main.wa4 .wa-r-t .gp-ch, main.wa4 .wa-realisations .gp-ch { color:rgba(255,255,255,.78); font-size:17px; }
main.wa4 .wa-realisations { display:grid; gap:12px; justify-items:start; max-width:560px; margin-top:56px; }
main.wa4 .wa-captures { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; margin-top:40px; }
main.wa4 .wa-nav-cadre { margin:0; border-radius:12px; overflow:hidden; background:#fff; box-shadow:0 0 0 1px rgba(255,255,255,.1),0 30px 60px -24px rgba(0,0,0,.6); }
main.wa4 .wa-nav-cadre__barre { display:flex; gap:6px; padding:0 14px; height:30px; align-items:center; background:#eef0ea; border-bottom:1px solid #dde1d8; }
main.wa4 .wa-nav-cadre__barre i { width:8px; height:8px; border-radius:50%; background:#cdd3c9; }
main.wa4 .wa-nav-cadre img { display:block; width:100%; height:auto; }
@media (min-width: 1024px) { main.wa4 .wa-tete-r > .wa-r-t { grid-column:2; grid-row:1 / span 2; } main.wa4 .wa-tete-r > .wa-realisations { grid-column:1; grid-row:2; align-self:start; } main.wa4 .wa-tete-r > div:first-child { grid-column:1; grid-row:1; } }

/* ---------- accompagnement et technique ---------- */
main.wa4 .wa-etapes { display:grid; margin:28px 0 0; padding:0; list-style:none; border-top:1px solid var(--gp-filet); counter-reset:wa; }
main.wa4 .wa-etapes li { display:grid; grid-template-columns:36px 1fr; gap:12px; align-items:start; padding:14px 0; border-bottom:1px solid var(--gp-filet); font-size:15.5px; line-height:1.5; }
main.wa4 .wa-etapes li::before { counter-increment:wa; content:counter(wa); font:600 13px/1.7 var(--gp-titre); color:var(--wa-mousse); font-variant-numeric:tabular-nums; }
main.wa4 .wa-suite { margin-top:26px !important; color:var(--gp-texte) !important; font-weight:500; }
main.wa4 .wa-h2-large { max-width:14em; }
main.wa4 .wa-cols p { font-size:15.5px; line-height:1.62; color:#3f4a43; margin-top:12px; }
main.wa4 .wa-cols > div { border-top-color:#c9d0c4; }
main.wa4 .wa-etat { margin:10px 0 0; }
main.wa4 .wa-liens-bas { display:flex; flex-wrap:wrap; gap:6px 30px; margin-top:44px; }

/* ---------- appel final ---------- */
main.wa4 .gp-fin { background:var(--gp-encre); }
main.wa4 .gp-fin p + p { margin-top:14px; }
main.wa4 .wa-fin-liens { display:flex; flex-wrap:wrap; gap:6px 26px; margin-top:26px !important; font-size:15px !important; }
main.wa4 .wa-fin-liens a { display:inline-flex; align-items:center; min-height:44px; color:#fff; text-decoration:underline; text-decoration-color:rgba(166,208,178,.8); text-underline-offset:4px; }
main.wa4 .wa-fin-liens a:focus-visible { outline:3px solid #fff; outline-offset:3px; border-radius:4px; }

/* ---------- 30/10 : objets tirés de la démonstration réelle (maquettes/web-adns-reel/demo-agent-2026-10-30/ECHANGE.md) ---------- */
/* Haut de page : la demande (verre) devient la page obtenue, arrêtée sur « Prête à valider ». */
main.wa4 .wa-dm { height:auto; }
main.wa4 .wa-dm__verre { display:grid; grid-template-columns:186px minmax(0,1fr); gap:12px; align-items:center; padding:12px; border-radius:16px;
  background:rgba(var(--wa-ombre),.42); -webkit-backdrop-filter:blur(14px) saturate(1.15); backdrop-filter:blur(14px) saturate(1.15);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.2),-14px 28px 56px -18px rgba(0,0,0,.55); }
main.wa4 .wa-dm__demande { grid-column:1; grid-row:1; margin:0; padding:10px 12px; border-radius:12px 12px 12px 4px; background:rgba(255,255,255,.14); font-size:13px; line-height:1.45; color:#fff; }
main.wa4 .wa-dm__page { position:relative; grid-row:1; grid-column:2; border-radius:8px; overflow:hidden; background:#fff; box-shadow:0 0 0 1px rgba(0,0,0,.1); }
main.wa4 .wa-dm__page img { display:block; width:100%; height:auto; }
main.wa4 .wa-dm__etat { grid-column:2; grid-row:1; align-self:end; justify-self:end; z-index:1; margin:0 8px 8px 0; display:flex; gap:6px; align-items:center; padding:5px; border-radius:11px; background:rgba(var(--wa-ombre),.78); box-shadow:0 6px 16px -8px rgba(0,0,0,.6); }
main.wa4 .wa-dm__pastille { display:inline-flex; align-items:center; gap:6px; padding:4px 10px; border-radius:999px; background:#fff3c4; color:#5c4400; font-size:12px; font-weight:600; }
main.wa4 .wa-dm__pastille::before { content:""; width:7px; height:7px; border-radius:50%; background:#b88a00; }
main.wa4 .wa-dm__valider { display:inline-flex; align-items:center; padding:5px 12px; border-radius:8px; background:#fff; color:var(--gp-encre); font-size:12px; font-weight:600; cursor:default; }

/* Dialogue : gabarit A, l'échange réel en cinq temps (demande, travail de l'agent, aperçu v1, ajustement, v2 prête à valider). */
main.wa4 .wa-dl-cadre { min-width:0; }
main.wa4 .wa-dl .gp-scene > * { position:absolute; margin:0; }
main.wa4 .wa-dl__b { padding:12px 14px; border-radius:14px 14px 4px 14px; background:var(--wa-mousse); color:#fff; font-size:14px; line-height:1.45;
  box-shadow:0 10px 24px -14px rgba(var(--wa-ombre),.6); }
main.wa4 .wa-dl__b1 { left:24px; top:28px; width:330px; }
main.wa4 .wa-dl__b2 { left:16px; top:318px; width:172px; font-size:13.5px; }
main.wa4 .wa-dl__agent { left:24px; top:122px; width:350px; display:grid; grid-template-columns:32px minmax(0,1fr); gap:10px; align-items:start; }
main.wa4 .wa-dl__ia { display:grid; place-items:center; width:32px; height:32px; border-radius:50%; background:#fff; color:var(--wa-mousse); font-size:15px; box-shadow:0 0 0 1px rgba(var(--wa-ombre),.12); }
main.wa4 .wa-dl__faits { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin:0; padding:0; list-style:none; }
main.wa4 .wa-dl__faits li { display:flex; align-items:center; gap:7px; padding:7px 10px; border-radius:9px; background:#fff; font-size:13px; font-weight:500; color:var(--gp-encre);
  box-shadow:0 0 0 1px rgba(var(--wa-ombre),.1),0 4px 10px -6px rgba(var(--wa-ombre),.3); }
main.wa4 .wa-dl__faits i { color:var(--wa-mousse); font-size:14px; }
main.wa4 .wa-dl__apercu { left:200px; top:214px; width:392px; }
main.wa4 .wa-dl__ecran { position:relative; aspect-ratio:1000 / 700; }
main.wa4 .wa-dl__ecran img { position:absolute; inset:0; width:100%; height:100%; }
main.wa4 .wa-dl__etat { left:200px; top:534px; width:392px; display:flex; justify-content:flex-end; gap:8px; align-items:center; }
main.wa4 .wa-dl__etat .wa-dm__valider { background:var(--gp-encre); color:#fff; }

/* Graphisme : trois sites réels aux identités opposées, en éventail. */
main.wa4 .wa-gr-cadre { min-width:0; }

/* Durée : gabarit C, l'année agrandie dans la phrase (aucun mot ajouté, technique de Lead-ADNS). */
main.wa4 .wa-c b { display:block; margin:8px 0 10px; font:600 clamp(64px,7.2vw,104px)/.9 var(--gp-titre); letter-spacing:-.05em; color:#fff; }

/* Bouton intermédiaire (réalisation) : le bouton commun, seul l'espacement change. */
main.wa4 .wa-btn-sec { margin-top:26px; }
main.wa4 .wa-btn-sec:focus-visible { outline:3px solid var(--gp-encre); outline-offset:3px; }   /* contour visible sur le fond sable */

/* Landing pages (30/10, choix d'Antoine « trois landings en éventail ») : gabarit A, trois landings de POC réelles superposées,
   chacune est un lien sur toute sa surface (.carte-lien du socle) dont le libellé est l'adresse affichée dans sa barre.
   L'hôtel, le plus récent, est devant (en bas à droite) ; les barres des deux autres restent visibles. */
main.wa4 .wa-lpf .gp-scene > .wa-lpf__s { position:absolute; width:400px; cursor:pointer;
  transition:transform .2s cubic-bezier(.23,1,.32,1),box-shadow .2s cubic-bezier(.23,1,.32,1); }
main.wa4 .wa-lpf .wa-lpf__s1 { left:192px; top:296px; z-index:3; }
main.wa4 .wa-lpf .wa-lpf__s2 { left:108px; top:160px; z-index:2; }
main.wa4 .wa-lpf .wa-lpf__s3 { left:24px; top:24px; z-index:1; }
main.wa4 .wa-lpf__img { margin:0; }
main.wa4 .wa-lpf__img img { display:block; width:100%; height:auto; aspect-ratio:1440 / 900; }
main.wa4 .wa-lpf__lien { display:inline-flex; align-items:center; gap:6px; min-width:0; margin-left:10px; padding:3px 10px; border-radius:6px; background:#fff;
  font-size:11.5px; font-weight:500; color:var(--gp-encre); text-decoration:none; white-space:nowrap; }
main.wa4 .wa-lpf__lien i { font-size:10.5px; color:var(--wa-mousse); }
@media (hover:hover) {
  main.wa4 .wa-lpf .gp-scene > .wa-lpf__s:hover { transform:translateY(-4px); box-shadow:0 0 0 1px rgba(var(--wa-ombre),.16),-10px 26px 50px -18px rgba(var(--wa-ombre),.5); }
  main.wa4 .wa-lpf__s:hover .wa-lpf__lien { text-decoration:underline; text-underline-offset:3px; }
}
main.wa4 .wa-lpf__s:has(.lien-etendu:focus-visible) { outline:3px solid var(--gp-encre); outline-offset:3px; }

/* Réalisation : historique des versions sur la photo du carnet. */
main.wa4 .wa-photo .wa-vr { right:6%; bottom:7%; width:min(340px,60%); }
main.wa4 .wa-vr__l { display:grid; grid-template-columns:30px minmax(0,1fr) auto; gap:10px; align-items:center; padding:9px 14px; border-top:1px solid #edf0ea; font-size:13px; }
main.wa4 .wa-vr__l b { display:block; font-weight:600; color:var(--gp-encre); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
main.wa4 .wa-vr__l small { display:block; font-size:12px; color:var(--gp-discret); }
main.wa4 .wa-vr__l .r { font-size:12px; color:var(--gp-discret); }
main.wa4 .wa-vr__qui { display:grid; place-items:center; width:30px; height:30px; border-radius:50%; background:#e2ebe3; color:var(--gp-encre); font-size:11px; font-weight:700; }
main.wa4 .wa-vr__qui--ad { background:var(--gp-encre); color:#fff; }
main.wa4 .wa-vr__qui--ia { background:var(--wa-mousse); color:#fff; font-size:13px; }

/* Mouvement : préparé par le script (rf-pret), joué à l'entrée dans l'écran (rf-joue) ; sans script ni mouvement, état final. */
@keyframes wa-entre { from { opacity:0; transform:translateY(10px); } to { opacity:1; transform:none; } }
@keyframes wa-pop { from { opacity:0; transform:scale(.92); } to { opacity:1; transform:none; } }
@keyframes wa-fondu { from { opacity:0; } to { opacity:1; } }
@media (prefers-reduced-motion: no-preference) {
  main.wa4 .rf-pret:not(.rf-joue) :is(.wa-dm__demande,.wa-dm__page,.wa-dm__etat,.wa-dl__b,.wa-dl__ia,.wa-dl__faits li,.wa-dl__apercu,.wa-dl__v2,.wa-dl__etat,.wa-gr__s,.wa-lpf__s) { opacity:0; }
  main.wa4 .rf-joue .wa-dm__demande { animation:wa-entre .5s cubic-bezier(.23,1,.32,1) .2s both; }
  main.wa4 .rf-joue .wa-dm__page { animation:wa-entre .6s cubic-bezier(.23,1,.32,1) .8s both; }
  main.wa4 .rf-joue .wa-dm__etat { animation:wa-pop .35s cubic-bezier(.23,1,.32,1) 1.6s both; }
  main.wa4 .rf-joue .wa-dl__b1 { animation:wa-entre .5s cubic-bezier(.23,1,.32,1) .1s both; }
  main.wa4 .rf-joue .wa-dl__ia { animation:wa-pop .3s cubic-bezier(.23,1,.32,1) .6s both; }
  main.wa4 .rf-joue .wa-dl__faits li { animation:wa-entre .4s cubic-bezier(.23,1,.32,1) both; }
  main.wa4 .rf-joue .wa-dl__faits li:nth-child(1) { animation-delay:.9s; }
  main.wa4 .rf-joue .wa-dl__faits li:nth-child(2) { animation-delay:1.2s; }
  main.wa4 .rf-joue .wa-dl__faits li:nth-child(3) { animation-delay:1.5s; }
  main.wa4 .rf-joue .wa-dl__faits li:nth-child(4) { animation-delay:1.8s; }
  main.wa4 .wa-dl-cadre.rf-joue .wa-dl__apercu { animation:wa-entre .6s cubic-bezier(.23,1,.32,1) 2.1s both; }
  main.wa4 .rf-joue .wa-dl__b2 { animation:wa-entre .5s cubic-bezier(.23,1,.32,1) 3.3s both; }
  main.wa4 .rf-joue .wa-dl__v2 { animation:wa-fondu .6s cubic-bezier(.77,0,.175,1) 4.1s both; }
  main.wa4 .rf-joue .wa-dl__etat { animation:wa-pop .35s cubic-bezier(.23,1,.32,1) 4.9s both; }
  main.wa4 .rf-joue .wa-gr__s { animation:wa-entre .6s cubic-bezier(.23,1,.32,1) both; }
  main.wa4 .rf-joue .wa-gr__s2 { animation-delay:.08s; }
  main.wa4 .rf-joue .wa-gr__s3 { animation-delay:.16s; }
  main.wa4 .rf-joue .wa-lpf__s { animation:wa-entre .6s cubic-bezier(.23,1,.32,1) backwards; }   /* backwards : le survol reprend la main après l entrée */
  main.wa4 .rf-joue .wa-lpf__s2 { animation-delay:.08s; }
  main.wa4 .rf-joue .wa-lpf__s1 { animation-delay:.16s; }
}

/* ---------- tablette et téléphone ---------- */
@media (max-width: 1023px) {
  main.wa4 .gp-hero { height:auto; }
  main.wa4 .gp-hero__t { width:auto; }
  main.wa4 .gp-hero__scene { max-width:420px; }
  main.wa4 .wa-sans, main.wa4 .wa-tete-r { grid-template-columns:minmax(0,1fr); }
  main.wa4 .wa-grille { grid-template-columns:minmax(0,1fr); margin-top:36px; }
  main.wa4 .wa-captures { grid-template-columns:minmax(0,1fr); gap:20px; max-width:640px; }
  main.wa4 .pan.wa-photo, main.wa4 .pan.wa-clair { width:100%; max-width:612px; }
}
@media (max-width: 760px) {
  main.wa4 .gp-voile { background:linear-gradient(180deg,rgba(var(--wa-ombre),.5) 0%,rgba(var(--wa-ombre),.12) 28%,rgba(var(--wa-ombre),.72) 56%,rgba(var(--wa-ombre),1) 100%); }
  main.wa4 .gp-voile--fin { background:linear-gradient(180deg,rgba(var(--wa-ombre),.2),rgba(var(--wa-ombre),.92) 50%); }
}
@media (max-width: 660px) { main.wa4 .gp-scene { --k:0.979; } }
@media (max-width: 650px) { main.wa4 .gp-scene { --k:0.963; } }
@media (max-width: 640px) {
  main.wa4 .gp-hero h1 { font-size:34px; }
  main.wa4 .gp-photo { background-image:url(/images/web-adns-v2/heros-900.webp); background-position:60% 40%; }
  main.wa4 .gp-photo--fin { background-image:url(/images/web-adns-v2/fin-900.webp); background-position:30% 50%; }
  main.wa4 .wa-bouton { width:100%; justify-content:center; }
  main.wa4 .wa-realisations { margin-top:44px; }
  main.wa4 .pan.wa-photo { aspect-ratio:auto; display:flex; flex-direction:column; }
  main.wa4 .wa-photo .wa-ph { position:relative; inset:auto; width:100%; aspect-ratio:4 / 3; min-height:240px; flex:none; }
  main.wa4 .wa-photo .wa-acc { position:relative; right:auto; bottom:auto; width:auto; margin:-56px 16px 18px; }
  main.wa4 .pan.wa-clair { aspect-ratio:auto; }
  main.wa4 .pan.wa-clair .gp-scene { position:static; width:auto; height:auto; transform:none; display:flex; flex-direction:column; gap:14px; padding:16px; }
  main.wa4 .pan.wa-clair .wa-reel { position:relative; left:auto !important; top:auto !important; width:100% !important; }
  main.wa4 .wa-dl .gp-scene > * { position:relative; left:auto; top:auto; width:auto; }
  main.wa4 .wa-dl__b2 { align-self:flex-start; max-width:80%; }
  main.wa4 .wa-dm__verre { grid-template-columns:minmax(0,1fr); }
  main.wa4 .wa-dm__page, main.wa4 .wa-dm__demande { grid-row:auto; grid-column:1; }
  main.wa4 .wa-dm__etat { grid-row:3; grid-column:1; justify-self:start; margin:0; }
  main.wa4 .wa-photo .wa-vr { position:relative; right:auto; bottom:auto; width:auto; margin:-56px 16px 18px; }
  main.wa4 h2, main.wa4 .wa-cas .gp-cas__t h2, main.wa4 .wa-sans > div:first-child h2 { font-size:clamp(25px,7.2vw,34px); }
  main.wa4 #realisation .gp-cas__t h2 { font-size:23px; }
}
@media (max-width: 420px) { main.wa4 .wa-dl__faits { grid-template-columns:minmax(0,1fr); } }
@media (max-width: 359px) {
  main.wa4 .gp-hero h1 { font-size:27px; }
  main.wa4 .gp-fin h2 { font-size:25px; }
  main.wa4 .wa-cas .gp-cas__t h2, main.wa4 .wa-sans > div:first-child h2 { font-size:22px; }
  main.wa4 #realisation .gp-cas__t h2 { font-size:20px; }
  main.wa4 .wa-h3 { font-size:19px; }
}

@media (prefers-reduced-motion: reduce) { main.wa4 .wa-lpf .gp-scene > .wa-lpf__s { transition:none; } main.wa4 .wa-lpf .gp-scene > .wa-lpf__s:hover { transform:none; } }