
/* ===== assemblage CAI 2026-09-16 : desktop + mobile, maquettes GPT telles quelles ===== */
html,body{margin:0;background:#020817;font-family:Arial,Helvetica,sans-serif;color:#fff}
.stage-wrap{position:relative;margin:0 auto;overflow:hidden}
.stage{position:absolute;inset:0;background-size:100% 100%;background-repeat:no-repeat;overflow:hidden}
.desk{width:min(100vw,1600px);aspect-ratio:var(--rd)}
.desk .stage{background-image:url("assets/maquette-desktop-202609161709.jpg")}
.mob{display:none;width:100vw;aspect-ratio:var(--rm)}
.mob .stage{background-image:url("assets/maquette-mobile-202609161709.jpg")}
@media (max-width:759px){.desk{display:none}.mob{display:block}}
.editable{position:absolute;display:flex;align-items:center;justify-content:flex-start;padding:.25em .45em;line-height:1.12;overflow:hidden;white-space:pre-wrap;cursor:text;color:transparent;background:transparent}
.editable.changed{color:#f6fbff;text-shadow:0 1px 2px #000;background:rgba(4,18,42,.94);border:1px solid rgba(92,184,255,.7);box-shadow:0 0 12px rgba(0,133,255,.35)}
.editable[data-align="center"]{justify-content:center;text-align:center}
.editable[data-align="right"]{justify-content:flex-end;text-align:right}
body.edit-mode .editable:not(.changed){color:#f6fbff;text-shadow:0 1px 2px #000;background:rgba(4,18,42,.75);border:1px dashed rgba(92,184,255,.85)}
.zone{position:absolute;display:block;text-indent:-9999px;overflow:hidden;border-radius:6px;outline:0;z-index:5}
.zone:hover,.zone:focus-visible{box-shadow:0 0 0 2px rgba(255,220,120,.85),0 0 22px rgba(245,196,81,.7)}
body.edit-mode .zone{pointer-events:none}

/* menu ☰ mobile : s ouvre en touchant le bouton dessine dans la maquette */
.zone-menu{position:absolute;left:72%;top:1%;width:21%;height:7.5%;z-index:6;background:transparent;border:0;cursor:pointer;border-radius:12px}
.zone-menu:focus-visible{box-shadow:0 0 0 2px rgba(255,220,120,.85)}
.menu{position:fixed;inset:0;z-index:10000;background:rgba(2,8,23,.92);backdrop-filter:blur(6px);display:flex;align-items:flex-start;justify-content:center;padding:18px 14px;overflow:auto}
.menu[hidden]{display:none}
.menu-int{width:100%;max-width:520px;border:1px solid rgba(245,196,81,.6);border-radius:16px;background:linear-gradient(180deg,#0b1a3f,#050c22);box-shadow:0 0 40px rgba(245,196,81,.25);padding:18px 16px 20px;position:relative}
.menu-x{position:absolute;right:10px;top:8px;background:transparent;border:1px solid rgba(245,196,81,.5);color:#ffd86a;border-radius:8px;width:36px;height:36px;font-size:18px}
.menu-t{color:#7fcbff;letter-spacing:.18em;text-transform:uppercase;font-size:12px;margin:6px 0 12px}
.menu-div a,.menu-sites a{display:flex;flex-direction:column;text-decoration:none;color:#fff;border:1px solid rgba(120,175,255,.35);border-radius:12px;padding:12px 14px;margin:8px 0;background:rgba(14,34,84,.55)}
.menu-div a b{font-size:20px;color:#ffd86a}.menu-div a span{font-size:13px;color:#a9b9dd;margin-top:2px}
.menu-div a.actif{border-color:#ffd86a;background:rgba(245,196,81,.12)}
.menu-sites{display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-top:10px}
.menu-sites a{margin:0;padding:10px 8px;text-align:center}.menu-sites a b{font-size:13px;color:#fff;font-weight:600}
.menu-b{margin-top:14px;text-align:center;font-size:13px;color:#a9b9dd}.menu-b a{color:#ffd86a;text-decoration:none}
.toolbar,.hint{display:none}
body.edit-ui .toolbar{display:flex;position:fixed;z-index:9999;left:12px;bottom:12px;flex-wrap:wrap;gap:8px;padding:10px;border-radius:12px;background:rgba(1,10,26,.92);border:1px solid rgba(93,189,255,.5)}

.toolbar button{border:1px solid rgba(255,203,79,.65);background:#0b2146;color:#fff;padding:8px 11px;border-radius:8px;font-weight:700;cursor:pointer}
