/* Boutons */
.gallery-btn, .more-btn {
  display:inline-flex; align-items:center; justify-content:center; gap:.5rem;
  padding:.75rem 1.5rem; min-height:44px; border-radius:9999px;
  font-family:'Lexend',sans-serif; font-weight:800; font-size:.95rem;
  cursor:pointer; transition:transform .25s cubic-bezier(.16,1,.3,1), box-shadow .25s, background-color .2s;
}
.gallery-btn { background:#FF7A00; color:#fff; border:2px solid #FF7A00; box-shadow:0 6px 16px -4px rgba(255,122,0,.45); }
.gallery-btn:hover { background:#E05D00; border-color:#E05D00; transform:translateY(-2px); box-shadow:0 12px 24px -8px rgba(255,122,0,.55); }
.gallery-btn i { transition:transform .3s; }
.gallery-btn:hover i { transform:rotate(-10deg) scale(1.15); }
.more-btn { background:#FFDE00; color:#0f172a; border:2px solid #0f172a; }
.more-btn:hover { background:#E6C800; transform:translateY(-2px); box-shadow:0 10px 20px -8px rgba(15,23,42,.35); }
.gallery-btn:focus-visible, .more-btn:focus-visible, .gm button:focus-visible { outline:3px solid #7C3AED; outline-offset:3px; }

/* Popup */
.gm { position:fixed; inset:0; z-index:100; display:flex; align-items:center; justify-content:center; padding:1rem;
  visibility:hidden; pointer-events:none; }
.gm.is-open { visibility:visible; pointer-events:auto; }
.gm-backdrop { position:absolute; inset:0; background:rgba(15,23,42,.8); backdrop-filter:blur(6px); opacity:0; transition:opacity .35s ease; }
.gm.is-open .gm-backdrop { opacity:1; }
.gm-panel { position:relative; width:100%; max-width:860px; background:#FFFDF5; border:4px solid #FFDE00; border-radius:1.75rem;
  padding:1.25rem; box-shadow:0 30px 60px -15px rgba(0,0,0,.5);
  opacity:0; transform:translateY(30px) scale(.96); transition:opacity .4s cubic-bezier(.16,1,.3,1), transform .4s cubic-bezier(.16,1,.3,1); }
.gm.is-open .gm-panel { opacity:1; transform:none; }
.gm-head { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:1rem; }
.gm-title { font-family:'Lexend',sans-serif; font-weight:800; font-size:1.35rem; color:#0f172a; line-height:1.2; }
.gm-close { flex-shrink:0; width:44px; height:44px; border-radius:9999px; background:#0f172a; color:#fff; font-size:1.2rem;
  display:flex; align-items:center; justify-content:center; transition:transform .25s, background-color .2s; }
.gm-close:hover { background:#FF7A00; transform:rotate(90deg); }
.gm-viewport { position:relative; overflow:hidden; border-radius:1.25rem; touch-action:pan-y; }
.gm-track { display:flex; transition:transform .55s cubic-bezier(.16,1,.3,1); will-change:transform; }
.gm-track.is-dragging { transition:none; }
.gm-slide { flex:0 0 100%; aspect-ratio:4/3; padding:0; }
.gm-slide img { width:100%; height:100%; object-fit:cover; border-radius:1.25rem; display:block; user-select:none; -webkit-user-drag:none;
  transform:scale(.97); opacity:.6; transition:transform .6s cubic-bezier(.16,1,.3,1), opacity .6s; }
.gm-slide.is-active img { transform:scale(1); opacity:1; }
.gm-nav { position:absolute; top:50%; transform:translateY(-50%); width:48px; height:48px; border-radius:9999px;
  background:rgba(255,255,255,.95); color:#0f172a; border:2px solid #FFDE00; font-size:1.1rem;
  display:flex; align-items:center; justify-content:center; box-shadow:0 6px 16px -4px rgba(0,0,0,.3); transition:transform .2s, background-color .2s; }
.gm-nav:hover { background:#FFDE00; transform:translateY(-50%) scale(1.08); }
.gm-prev { left:.75rem; } .gm-next { right:.75rem; }
.gm-foot { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-top:1rem; }
.gm-dots { display:flex; flex-wrap:wrap; gap:.5rem; }
.gm-dot { width:12px; height:12px; border-radius:9999px; background:#cbd5e1; transition:width .3s, background-color .3s; padding:0; }
.gm-dot.is-active { width:32px; background:#FF7A00; }
.gm-count { font-family:'Lexend',sans-serif; font-weight:700; font-size:.9rem; color:#334155; }
body.gm-lock { overflow:hidden; }

@media (max-width:640px) {
  .gm { padding:.5rem; }
  .gm-panel { padding:.85rem; border-radius:1.25rem; }
  .gm-title { font-size:1.05rem; }
  .gm-nav { width:44px; height:44px; }
  .gm-prev { left:.4rem; } .gm-next { right:.4rem; }
}
@media (prefers-reduced-motion:reduce) {
  .gm-track, .gm-panel, .gm-backdrop, .gm-slide img { transition:none; }
}