:root{--dark:#12263A;--light:#F6F7F2;--blue:#1B63C4;--orange:#F5A524}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--dark);color:var(--light);font-family:'Nunito Sans',Arial,sans-serif}
/* accueil */
.home{max-width:1100px;margin:0 auto;padding:48px 24px}
.home h1{font-family:'Fredoka',Arial,sans-serif;font-size:48px;margin:0 0 6px}
.home p.sub{color:#D5E1EC;margin:0 0 36px;font-size:20px}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px}
.card{display:block;background:#1D3752;border-radius:20px;padding:26px;color:inherit;text-decoration:none;border:2px solid transparent;transition:.15s}
.card:hover,.card:focus{border-color:var(--orange);transform:translateY(-2px);outline:none}
.card .tag{font-size:13px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--orange)}
.card h2{font-family:'Fredoka',Arial,sans-serif;font-size:28px;margin:8px 0}
.card p{margin:0;color:#D5E1EC;line-height:1.4}
.card .meta{margin-top:14px;font-size:14px;color:#9fb3c8}
.foot{margin-top:40px;font-size:14px;color:#9fb3c8}
/* visionneuse */
#wrap{position:fixed;inset:0;overflow:hidden;background:#000}
#stage{position:absolute;left:0;top:0;width:1920px;height:1080px;transform-origin:0 0;overflow:hidden}
#stage section{position:absolute;inset:0;width:1920px;height:1080px;overflow:hidden;opacity:0;pointer-events:none;transition:opacity .25s}
#stage section.on{opacity:1;pointer-events:auto}
#stage section *{margin:0}
#stage section ul,#stage section ol{padding-left:1.2em}
#stage aside{display:none}
#bar{position:fixed;left:0;right:0;bottom:0;height:5px;background:rgba(255,255,255,.15);z-index:5}
#bar i{display:block;height:100%;width:0;background:var(--orange)}
#hud{position:fixed;right:12px;top:10px;z-index:6;display:flex;gap:8px;opacity:0;transition:.3s}
body.hud #hud{opacity:1}
#hud button,#hud a{background:rgba(18,38,58,.85);color:#fff;border:1px solid rgba(255,255,255,.3);border-radius:8px;padding:7px 11px;font:600 14px 'Nunito Sans',Arial;cursor:pointer;text-decoration:none}
#notes{position:fixed;left:0;right:0;bottom:0;max-height:42vh;overflow:auto;background:rgba(10,20,32,.96);color:#fff;padding:16px 24px 22px;font-size:18px;line-height:1.5;white-space:pre-wrap;z-index:7;display:none;border-top:3px solid var(--orange)}
body.notes #notes{display:block}
#ov{position:fixed;inset:0;background:rgba(10,20,32,.97);z-index:8;display:none;overflow:auto;padding:24px}
body.ov #ov{display:block}
#ov .g{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
#ov button{background:#1D3752;color:#fff;border:2px solid transparent;border-radius:10px;padding:12px;text-align:left;font:600 15px 'Nunito Sans',Arial;cursor:pointer}
#ov button.cur{border-color:var(--orange)}
#ov small{display:block;color:#9fb3c8;font-weight:400;margin-bottom:4px}
/* agrandissement des photos */
#stage section img{cursor:zoom-in}
#zoom{position:fixed;inset:0;background:rgba(5,10,16,.92);z-index:9;display:none;align-items:center;justify-content:center;cursor:zoom-out}
#zoom.on{display:flex}
#zoom img{max-width:96vw;max-height:96vh;object-fit:contain;border-radius:12px;background:#fff}