/* Le Mur vivant v7 — questions, révélation illustrée, et tirage au hasard. */
.volunteer-mural{position:relative;isolation:isolate;overflow:hidden;margin:1.5rem 0 4.5rem;padding:clamp(3.5rem,7vw,6rem) 0;color:#fff;background:radial-gradient(ellipse at 16% 28%,#8272b22c,transparent 36%),radial-gradient(ellipse at 86% 73%,#ee9b5b20,transparent 36%),linear-gradient(135deg,#302953 0%,#3a3067 54%,#342950 100%)}
.volunteer-mural:before,.volunteer-mural:after{content:"";position:absolute;z-index:-1;pointer-events:none;border:1px solid #ffffff13;border-radius:50%}.volunteer-mural:before{width:470px;height:470px;right:-215px;top:-250px;box-shadow:0 0 0 28px #ffffff06,0 0 0 58px #ffffff04}.volunteer-mural:after{width:320px;height:320px;left:-190px;bottom:14%;box-shadow:0 0 0 22px #ffffff06,0 0 0 48px #ffffff04}
.volunteer-mural-inner{max-width:1060px}.mural-heading{display:grid;grid-template-columns:1fr minmax(250px,.55fr);align-items:end;gap:42px;max-width:940px;margin:0 auto 1.35rem}.mural-heading .eyebrow{color:#c2b9df;margin-bottom:15px}.mural-heading h2{font-size:clamp(2.6rem,5.2vw,4.5rem);line-height:.99;letter-spacing:-.065em;margin:0;color:#fff}.mural-heading h2 em{color:#f2b985}.mural-intro{font-size:clamp(1.05rem,1.7vw,1.3rem);line-height:1.65;color:#f0edf7;margin:0 0 5px;max-width:390px}
.mural-hint{display:flex;align-items:center;justify-content:center;gap:10px;max-width:100%;margin:0 auto 14px;color:#e0dbea;font-size:.88rem;letter-spacing:.01em;text-align:center}.mural-hint-dot{width:8px;height:8px;flex:0 0 8px;border-radius:50%;background:#f0b47e;box-shadow:0 0 0 5px #f0b47e24}.mural-draw{display:flex;align-items:center;justify-content:center;gap:9px;min-height:43px;margin:0 auto 23px;padding:9px 18px;border:1px solid #f2b9858c;border-radius:999px;background:#fff;color:#423476;font:700 .88rem/1.2 'Manrope',sans-serif;box-shadow:0 7px 22px #17142e26;cursor:pointer;transition:transform .2s,box-shadow .2s,background .2s}.mural-draw svg{width:18px;height:18px;color:#d58751}.mural-draw:hover{transform:translateY(-2px);background:#fffaf4;box-shadow:0 10px 26px #17142e40}.mural-draw:focus-visible{outline:3px solid #f2b985;outline-offset:3px}
.volunteer-mosaic{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));grid-template-rows:repeat(5,minmax(142px,auto));gap:11px;width:min(100%,930px);margin:0 auto 24px}.volunteer-tile{position:relative;grid-row:var(--tile-row);grid-column:var(--tile-col);min-width:0;min-height:184px;border:1px solid #ffffffad;border-radius:17px;background:#fcfbf8;color:#302953;box-shadow:0 8px 24px #17142e20;perspective:900px;transform-style:preserve-3d;transition:box-shadow .2s,border-color .2s;animation:mural-arrive .48s both;animation-delay:var(--tile-delay)}.volunteer-tile:nth-of-type(5n+1){background:#fcfbf8}.volunteer-tile:nth-of-type(5n+2){background:#f7f0e7}.volunteer-tile:nth-of-type(5n+3){background:#f0edf6}.volunteer-tile:nth-of-type(5n+4){background:#eaf2f0}.volunteer-tile:nth-of-type(5n){background:#f8e9e2}.volunteer-tile:hover,.volunteer-tile[open]{z-index:2;box-shadow:0 14px 30px #17142e35;border-color:#f2b985}.volunteer-tile[open]{z-index:3}
.volunteer-tile summary{position:absolute;inset:0;display:grid;place-items:center;padding:15px 16px;border-radius:inherit;backface-visibility:hidden;transform-style:preserve-3d;transform:rotateY(0);transition:transform .58s cubic-bezier(.2,.72,.16,1);z-index:2;list-style:none;cursor:pointer}.volunteer-tile summary::-webkit-details-marker{display:none}.volunteer-tile summary::marker{content:""}.volunteer-tile[open] summary{transform:rotateY(180deg);z-index:1}.volunteer-tile summary:focus-visible{outline:3px solid #f2b985;outline-offset:-5px;border-radius:inherit}.question-mark{display:grid;place-items:center;width:54px;height:54px;border:1px solid #49378e3d;border-radius:50%;background:#fff8;color:#49378e;font:500 1.8rem/1 'DM Sans',sans-serif;box-shadow:0 3px 12px #30295312;transition:transform .3s,background .3s}.volunteer-tile:hover .question-mark{transform:scale(1.08);background:#fff}.volunteer-tile:focus-within{outline:2px solid #f2b985;outline-offset:3px}
.tile-back{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:11px 12px 9px;border-radius:inherit;text-align:center;backface-visibility:hidden;transform:rotateY(180deg);transition:transform .58s cubic-bezier(.2,.72,.16,1);z-index:1}.volunteer-tile[open] .tile-back{transform:rotateY(0);z-index:2}.tile-back>img{display:block;width:76px;height:76px;flex:0 0 76px;object-fit:contain}.tile-message{margin:0;color:#302953;font-family:'Manrope',sans-serif;font-size:clamp(.79rem,.95vw,.91rem);font-weight:700;line-height:1.3;letter-spacing:-.018em}.tile-back-actions{display:flex;align-items:center;justify-content:center;gap:5px;width:100%;margin-top:4px}.tile-interest{display:inline-flex;align-items:center;justify-content:center;min-height:28px;padding:5px 10px;border:1px solid #d9d2e4;border-radius:999px;background:#fff9;color:#49378e;font:650 .66rem/1.15 'DM Sans',sans-serif;cursor:pointer}.tile-interest:hover{background:#fff;border-color:#a99ac4}.tile-interest:focus-visible{outline:2px solid #8f7cb2;outline-offset:2px}
.mosaic-heart{grid-row:1;grid-column:3;align-self:center;justify-self:center;display:grid;place-items:center;width:50px;height:50px;border:1px solid #f2b98555;border-radius:50%;color:#f2b985;background:#f2b98512;pointer-events:none}.mosaic-heart svg{width:24px;height:24px}
.volunteer-dialog{position:fixed;inset:0;margin:auto;width:min(450px,calc(100vw - 32px));max-height:min(90vh,640px);overflow:auto;padding:38px;border:1px solid #e2dce9;border-radius:23px;background:#fcfbf8;color:#302953;box-shadow:0 28px 90px #17142e45}.volunteer-dialog::backdrop{background:#242039a6;backdrop-filter:blur(4px)}.volunteer-dialog-close{position:absolute;top:14px;right:15px;display:grid;place-items:center;width:36px;height:36px;border:1px solid #e5e0ea;border-radius:50%;background:#fff;color:#47378d;font-size:23px;line-height:1}.volunteer-dialog>.eyebrow{color:#087b86;margin:0 0 10px}.volunteer-dialog h3{font-size:clamp(1.8rem,6vw,2.3rem);margin:0 0 12px;letter-spacing:-.05em}.volunteer-dialog>p{font-size:.96rem;line-height:1.7;color:#666575;margin:0 0 15px}.volunteer-dialog .volunteer-dialog-gesture{color:#302953}.volunteer-dialog-gesture strong{color:#47378d}.volunteer-dialog .mural-button{margin:5px 0 12px;max-width:none}.volunteer-dialog-phone{display:block;width:max-content;max-width:100%;margin:0 0 6px;color:#47378d;font-weight:700;text-decoration:underline;text-underline-offset:3px}.volunteer-dialog>small{display:block;color:#777282;font-size:.76rem}.volunteer-dialog-close:focus-visible,.volunteer-dialog a:focus-visible{outline:3px solid #ab99c9;outline-offset:3px}
.mural-reassurance{display:flex;align-items:center;justify-content:center;gap:14px;margin:28px auto 37px;color:#efebf5;text-align:left}.reassurance-mark{display:grid;place-items:center;width:38px;height:38px;flex:0 0 38px;border:1px solid #f1b7806b;border-radius:50%;color:#f2b985;font-size:22px}.mural-reassurance p{margin:0;font-size:.93rem;line-height:1.7}.mural-reassurance strong{color:#fff;font-weight:700}.mural-cta{display:grid;grid-template-columns:1.05fr .8fr;align-items:center;gap:38px;max-width:940px;margin:0 auto;padding:clamp(24px,4vw,42px);border:1px solid #ffffffb3;border-radius:22px;background:#fcfbf8;color:#302953;box-shadow:0 20px 55px #19152e30}.mural-cta .eyebrow{color:#087b86;margin-bottom:11px}.mural-cta h3{margin:0 0 10px;font-size:clamp(1.45rem,2.5vw,2rem);letter-spacing:-.045em}.mural-cta p{max-width:500px;margin:0;color:#666575;font-size:.96rem;line-height:1.75}.mural-actions{display:flex;flex-direction:column;align-items:flex-start;gap:12px}.mural-button,.mural-button:hover,.mural-button:focus-visible{display:inline-flex;align-items:center;justify-content:center;gap:14px;width:100%;max-width:330px;min-height:54px;padding:14px 19px;border:0;border-radius:11px;background:#47378d;color:#fff;text-align:center;text-decoration:none;font-size:.96rem;font-weight:650;transition:transform .18s,background .18s,box-shadow .18s}.mural-button:hover{background:#38296f;color:#fff;transform:translateY(-2px);box-shadow:0 8px 20px #47378d30}.mural-phone{font-size:.88rem;color:#5f5a6c}.mural-phone strong{color:#47378d;text-decoration:underline;text-underline-offset:3px}.mural-actions small{font-size:.72rem;line-height:1.55;color:#777282}
@keyframes mural-arrive{from{opacity:0}to{opacity:1}}
@media(max-width:760px){.volunteer-mural{margin:1.2rem 0 3.2rem;padding:3rem 0}.volunteer-mural-inner{width:calc(100% - 34px)}.mural-heading{grid-template-columns:1fr;gap:13px;margin-bottom:1.25rem}.mural-heading h2{font-size:clamp(2.55rem,11vw,3.7rem)}.mural-intro{max-width:530px;margin:0;font-size:1.05rem}.mural-hint{font-size:.82rem;margin-bottom:12px}.mural-draw{margin-bottom:18px}.volunteer-mosaic{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:none;grid-auto-rows:minmax(140px,auto);gap:9px;margin-bottom:20px}.volunteer-tile{grid-row:auto;grid-column:auto!important;min-height:190px;border-radius:14px}.volunteer-tile summary{font-size:.91rem}.tile-back{padding:10px 8px}.tile-back>img{width:66px;height:66px;flex-basis:66px}.tile-message{font-size:.82rem}.tile-interest,.tile-next{font-size:.58rem;padding:5px 7px}.mosaic-heart{display:none}.mural-reassurance{justify-content:flex-start;align-items:flex-start;margin:23px 2px 28px}.mural-reassurance p{font-size:.86rem}.mural-cta{grid-template-columns:1fr;gap:22px;padding:25px 21px;border-radius:18px}.mural-actions{gap:11px}.mural-button{max-width:none}.mural-actions small{font-size:.74rem}}
@media(max-width:430px){.volunteer-mosaic{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:minmax(136px,auto)}.volunteer-tile{min-height:196px}.volunteer-tile summary{padding:14px}.tile-back{padding:10px 7px}.tile-back>img{width:62px;height:62px;flex-basis:62px}.tile-message{font-size:.79rem}.tile-interest,.tile-next{font-size:.56rem;padding:5px 6px}.volunteer-dialog{padding:32px 25px}.mural-reassurance{gap:10px}.reassurance-mark{width:33px;height:33px;flex-basis:33px;font-size:19px}}
@media(prefers-reduced-motion:reduce){.volunteer-tile{animation:none;transition:none}.volunteer-tile summary,.tile-back,.mural-draw,.mural-button{transition:none}.mural-draw:hover,.mural-button:hover{transform:none}}

/* Keep the question-mark face hidden on browsers with weaker 3D back-face support. */
.volunteer-tile summary,.tile-back{-webkit-backface-visibility:hidden;backface-visibility:hidden}
.volunteer-tile summary{transition:transform .58s cubic-bezier(.2,.72,.16,1),visibility 0s linear 0s}
.volunteer-tile[open] summary{visibility:hidden;pointer-events:none;transition:transform .58s cubic-bezier(.2,.72,.16,1),visibility 0s linear .58s}
.volunteer-tile[open] .question-mark{visibility:hidden;opacity:0;transition:opacity .12s linear .24s,visibility 0s linear .36s}
@media(prefers-reduced-motion:reduce){.volunteer-tile summary,.tile-back{transition:none!important}}

/* Both complete faces rotate as one solid card. */
.volunteer-tile{background:transparent!important;border:0;box-shadow:none;animation:none;perspective:1100px;--tile-bg:#fcfbf8}
.volunteer-tile:nth-of-type(5n+2){--tile-bg:#f7f0e7}.volunteer-tile:nth-of-type(5n+3){--tile-bg:#f0edf6}.volunteer-tile:nth-of-type(5n+4){--tile-bg:#eaf2f0}.volunteer-tile:nth-of-type(5n){--tile-bg:#f8e9e2}
.tile-rotator{position:absolute;inset:0;border-radius:inherit;transform-style:preserve-3d;transition:transform .72s cubic-bezier(.22,.68,.18,1);transform:rotateY(0)}
.volunteer-tile.is-flipped .tile-rotator{transform:rotateY(180deg)}
.volunteer-tile .tile-front,.volunteer-tile .tile-back{position:absolute;inset:0;box-sizing:border-box;width:100%;height:100%;margin:0;border:1px solid #ffffffad;border-radius:inherit;background:var(--tile-bg);box-shadow:0 8px 24px #17142e20;-webkit-backface-visibility:hidden;backface-visibility:hidden;transition:none}
.volunteer-tile .tile-front{display:grid;place-items:center;cursor:pointer;transform:rotateY(0);padding:16px;z-index:1}
.volunteer-tile .tile-back{display:flex;transform:rotateY(180deg);z-index:1}
.volunteer-tile.is-flipped{z-index:3}.volunteer-tile .question-mark{transform:none;opacity:1;visibility:visible}
.volunteer-tile .tile-front:focus-visible{outline:3px solid #f2b985;outline-offset:3px}
@media(prefers-reduced-motion:reduce){.tile-rotator{transition:none}}