/* 🧊 Plugin Galerie */
.kg-intro { max-width: 70ch; margin-bottom: 1.2rem; }
.kg-liste { --gap: clamp(6px, 1.2vw, 14px); }
.kg-item { margin: 0; }
.kg-item figcaption { font-size: .9em; opacity: .8; margin-top: .35em; }
.kg-img { display: block; width: 100%; height: auto; border-radius: var(--k-arrondi, 8px); background: color-mix(in srgb, currentColor 8%, transparent); }
.kg-lien { display: block; cursor: zoom-in; }
.kg-lien:focus-visible { outline: 3px solid var(--k-accent, #c4553d); outline-offset: 3px; }
/* Grille */
.kg-grille { display: grid; grid-template-columns: repeat(var(--kg-cols), 1fr); gap: var(--gap); }
.kg-grille .kg-img { aspect-ratio: 3 / 2; object-fit: cover; }
.kg-grille.kg-carre .kg-img { aspect-ratio: 1; }
.kg-grille.kg-portrait .kg-img { aspect-ratio: 4 / 5; }
/* Mosaïque */
.kg-mosaique { columns: var(--kg-cols); column-gap: var(--gap); }
.kg-mosaique .kg-item { break-inside: avoid; margin-bottom: var(--gap); }
/* Défilement */
.kg-defile { display: flex; gap: var(--gap); overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 8px; }
.kg-defile .kg-item { flex: 0 0 min(80vw, 480px); scroll-snap-align: start; }
.kg-defile .kg-img { aspect-ratio: 3 / 2; object-fit: cover; }
@media (max-width: 700px) {
  .kg-grille { grid-template-columns: repeat(min(var(--kg-cols), 2), 1fr); }
  .kg-mosaique { columns: 2; }
}
/* Albums */
.kg-albums { display: grid; grid-template-columns: repeat(var(--kg-cols), 1fr); gap: clamp(12px, 2vw, 24px); }
@media (max-width: 700px) { .kg-albums { grid-template-columns: 1fr; } }
.kg-album { display: block; color: inherit; text-decoration: none; }
.kg-couv { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--k-arrondi, 8px); transition: transform .3s; }
a.kg-album:hover .kg-couv { transform: scale(1.02); }
.kg-album h3 { margin: .6em 0 .2em; }
.kg-album p { margin: 0; opacity: .8; }
/* Visionneuse */
.kg-v { position: fixed; inset: 0; z-index: 1000; background: rgba(12, 10, 9, .94); display: grid; grid-template-rows: 1fr auto; color: #fff; }
.kg-v img { max-width: 100%; max-height: 100%; object-fit: contain; place-self: center; user-select: none; }
.kg-v-scene { display: grid; min-height: 0; padding: 48px 56px 8px; }
.kg-v-bas { text-align: center; padding: 8px 16px 18px; font-size: .95rem; opacity: .9; min-height: 1.5em; }
.kg-v button { position: absolute; background: rgba(255,255,255,.12); color: #fff; border: 0; border-radius: 99px; width: 44px; height: 44px; font-size: 22px; cursor: pointer; }
.kg-v button:hover, .kg-v button:focus-visible { background: rgba(255,255,255,.28); outline: none; }
.kg-v-fermer { top: 10px; right: 10px; }
.kg-v-prec { left: 8px; top: 50%; translate: 0 -50%; }
.kg-v-suiv { right: 8px; top: 50%; translate: 0 -50%; }
@media (max-width: 700px) { .kg-v-scene { padding: 56px 4px 4px; } .kg-v-prec, .kg-v-suiv { top: auto; bottom: 8px; translate: none; } }