/* Mur d'enquête 3D : les dix dossiers épinglés, rouverts au fil des résolutions. */
.mur{position:relative;margin:56px 0 34px;max-width:1100px;perspective:1300px;perspective-origin:50% 20%}
.mur-titre{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.mur-titre .label{margin:0}
.mur-compte{font:900 22px 'Big Shoulders Display',sans-serif;color:var(--red)}
.mur-plan{position:relative;padding:34px 28px 38px;transform-style:preserve-3d;transform:rotateX(9deg) rotateY(var(--ry,0deg));
  transition:transform .35s ease-out;border-radius:4px;
  background:#b98f5c radial-gradient(circle at 30% 20%,rgba(255,235,200,.35),transparent 60%);
  background-image:radial-gradient(circle at 30% 20%,rgba(255,235,200,.35),transparent 60%),
    radial-gradient(rgba(90,55,20,.35) 1px,transparent 1.2px),radial-gradient(rgba(255,230,190,.25) 1px,transparent 1.3px);
  background-size:auto,7px 7px,11px 11px;background-position:0 0,0 0,3px 4px;
  box-shadow:inset 0 0 0 10px #6b4a2b,inset 0 0 0 12px #3f2a17,0 30px 50px rgba(40,25,10,.35)}
.mur-grille{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:26px 22px;transform-style:preserve-3d}
.mur-fils{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;transform:translateZ(12px)}
.mur-fils path{fill:none;stroke:#C8102E;stroke-width:2.2;stroke-linecap:round;filter:drop-shadow(0 2px 1px rgba(0,0,0,.35));
  stroke-dasharray:var(--l);stroke-dashoffset:var(--l);animation:mur-fil .9s .5s ease-out forwards}
.mur-fils path.deja{animation:none;stroke-dashoffset:0}
@keyframes mur-fil{to{stroke-dashoffset:0}}

.dos3d{position:relative;aspect-ratio:4/4.3;cursor:pointer;transform-style:preserve-3d;transform:rotate(var(--rot)) translateZ(6px);
  transition:transform .25s;border:0;padding:0;background:none;font:inherit;color:inherit;text-align:left}
.dos3d:hover{transform:rotate(0deg) translateZ(26px) scale(1.04)}
.dos3d:focus-visible{outline:3px solid var(--red);outline-offset:4px}
.dos3d .faces{position:absolute;inset:0;transform-style:preserve-3d;transition:transform .9s cubic-bezier(.3,1.3,.5,1)}
.dos3d.ouvert .faces{transform:rotateY(180deg)}
.dos3d .face{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;padding:10px 10px 12px;
  display:flex;flex-direction:column;box-shadow:0 10px 18px rgba(30,18,6,.4)}
.dos3d .avant{background:#d9cdb3 linear-gradient(160deg,rgba(255,255,255,.35),transparent 50%);color:#5f584f}
.dos3d .arriere{background:#fbf7ec linear-gradient(160deg,rgba(255,255,255,.5),transparent 50%);transform:rotateY(180deg)}
.dos3d .onglet{position:absolute;top:-9px;left:12px;width:44%;height:12px;border-radius:5px 5px 0 0;background:inherit;filter:brightness(.97)}
.dos3d .num{font:900 30px/1 'Big Shoulders Display',sans-serif;color:#8a8278}
.dos3d .arriere .num{color:var(--red)}
.dos3d .titre{font:500 10px/1.35 'Roboto Mono',monospace;letter-spacing:.06em;text-transform:uppercase;margin-top:6px}
.dos3d .tamp{margin-top:auto;align-self:flex-start;font:500 9px 'Roboto Mono',monospace;letter-spacing:.1em;text-transform:uppercase;
  border:1.5px solid #9d968a;padding:3px 6px;transform:rotate(-4deg);color:#6f685e}
.dos3d .arriere .tamp{font:900 17px 'Big Shoulders Display',sans-serif;letter-spacing:.04em;border:2.5px solid var(--red);color:var(--red);padding:2px 8px}
.dos3d .coup{font:900 15px/1.05 'Big Shoulders Display',sans-serif;text-transform:uppercase;color:#16130F;margin-top:8px}
.dos3d .coup small{display:block;font:500 8px 'Roboto Mono',monospace;letter-spacing:.14em;color:#8A7A55;margin-bottom:3px}
.dos3d .epingle{position:absolute;top:-6px;left:50%;width:14px;height:14px;margin-left:-7px;border-radius:50%;z-index:2;
  background:radial-gradient(circle at 35% 35%,#ff6b7d,#C8102E 55%,#6d0714);box-shadow:0 3px 3px rgba(0,0,0,.45);transform:translateZ(18px)}
.dos3d.ouvert.nouveau .faces{animation:mur-retourne 1.1s cubic-bezier(.3,1.2,.5,1) both}
@keyframes mur-retourne{0%{transform:rotateY(0) translateZ(0)}45%{transform:rotateY(100deg) translateZ(60px)}100%{transform:rotateY(180deg) translateZ(0)}}

.mur-final{position:absolute;left:50%;top:50%;width:min(360px,80%);transform:translate(-50%,-50%) translateZ(60px) rotate(-2deg);
  background:#16130F;color:var(--paper);padding:22px 24px;text-align:center;box-shadow:0 24px 40px rgba(0,0,0,.5);
  opacity:0;animation:mur-final .6s 1.2s ease-out forwards;z-index:3}
.mur-final b{display:block;font:900 30px/1 'Big Shoulders Display',sans-serif;text-transform:uppercase;color:var(--paper);margin-bottom:8px}
.mur-final b em{color:#ff4d63}
.mur-final p{margin:0;font-size:15px;line-height:1.45}
@keyframes mur-final{from{opacity:0;transform:translate(-50%,-40%) translateZ(60px) rotate(-6deg)}to{opacity:1}}

@media (max-width:700px){
  .mur-plan{padding:24px 14px 26px;transform:rotateX(6deg)}
  .mur-grille{grid-template-columns:repeat(3,1fr);gap:20px 12px}
  .dos3d .num{font-size:24px}.dos3d .titre{font-size:8.5px}.dos3d .coup{font-size:13px}
  .dos3d .arriere .tamp{font-size:13px}
}
@media (max-width:420px){.mur-grille{grid-template-columns:repeat(2,1fr);gap:16px 10px}.dos3d{aspect-ratio:5/3.7}.dos3d .titre{margin-top:3px}.dos3d .coup{margin-top:4px}}
@media (prefers-reduced-motion:reduce){
  .mur-plan{transform:none}.dos3d .faces,.dos3d.ouvert.nouveau .faces{transition:none;animation:none}
  .mur-fils path{animation:none;stroke-dashoffset:0}.mur-final{animation:none;opacity:1}
}