/* Galerie photo « Notre structure » — SARVIS
   Charte : marine #0E2A47 · cyan #2EA8DC · fond bleuté #EAF5FB · texte #26333F
   Aucune dépendance : CSS et JS autonomes, à coller une seule fois. */
.sv-gal{
  --sv-marine:#0E2A47;
  --sv-cyan:#2EA8DC;
  --sv-bleute:#EAF5FB;
  --sv-texte:#26333F;
  --sv-trait:#D7E6F2;
  margin:0;
  display:flex;
  flex-direction:column;
  gap:.75rem;
}
.sv-gal__stage{
  position:relative;
  aspect-ratio:16/9;
  max-width:100%;
  background:var(--sv-marine);
  border-radius:12px;
  overflow:hidden;
  display:grid;
  place-items:center;
}
.sv-gal__img{
  width:100%;
  height:100%;
  max-width:100%;
  object-fit:contain;
  display:block;
  transition:opacity .18s ease;
}
.sv-gal__stage.is-loading .sv-gal__img{opacity:.35}

.sv-gal__nav,
.sv-gal__zoom{
  position:absolute;
  display:grid;
  place-items:center;
  border:0;
  cursor:pointer;
  color:var(--sv-marine);
  background:rgba(255,255,255,.92);
  box-shadow:0 1px 4px rgba(14,42,71,.28);
  padding:0;
}
.sv-gal__nav{
  top:50%;
  transform:translateY(-50%);
  width:38px;height:38px;
  border-radius:50%;
}
.sv-gal__nav--prev{left:10px}
.sv-gal__nav--next{right:10px}
.sv-gal__zoom{
  right:10px;bottom:10px;
  width:34px;height:34px;
  border-radius:8px;
}
.sv-gal__nav:hover,
.sv-gal__zoom:hover{background:#fff;color:var(--sv-cyan)}
.sv-gal__nav svg,
.sv-gal__zoom svg{
  width:20px;height:20px;
  fill:none;stroke:currentColor;stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round;
}
.sv-gal__count{
  position:absolute;
  left:10px;bottom:10px;
  margin:0;
  padding:.2rem .5rem;
  border-radius:6px;
  background:rgba(14,42,71,.78);
  color:#fff;
  font-size:.75rem;
  font-variant-numeric:tabular-nums;
  letter-spacing:.02em;
}
.sv-gal__cap{
  margin:0;
  min-height:2.6em;
  color:var(--sv-texte);
  opacity:.78;
  font-size:.8125rem;
  line-height:1.4;
}
.sv-gal__thumbs{
  list-style:none;
  margin:0;padding:0 0 .25rem;
  display:flex;
  gap:.4rem;
  overflow-x:auto;
  scrollbar-width:thin;
  scroll-behavior:smooth;
  -webkit-overflow-scrolling:touch;
}
.sv-gal__thumbs::-webkit-scrollbar{height:6px}
.sv-gal__thumbs::-webkit-scrollbar-thumb{background:var(--sv-trait);border-radius:3px}
.sv-gal__thumb{
  flex:0 0 auto;
  width:84px;height:56px;
  padding:0;
  border:0;
  border-radius:6px;
  overflow:hidden;
  cursor:pointer;
  background:var(--sv-bleute);
  opacity:.62;
  transition:opacity .15s ease,box-shadow .15s ease;
}
.sv-gal__thumb img{width:100%;height:100%;object-fit:cover;display:block}
.sv-gal__thumb:hover{opacity:1}
.sv-gal__thumb.is-active{opacity:1;box-shadow:0 0 0 2px var(--sv-cyan)}
.sv-gal :focus-visible{outline:2px solid var(--sv-cyan);outline-offset:2px}

/* Visionneuse plein écran */
.sv-lb{
  position:fixed;inset:0;z-index:9999;
  display:none;
  place-items:center;
  background:rgba(14,42,71,.94);
  padding:24px 16px;
}
.sv-lb[open],
.sv-lb.is-open{display:grid}
.sv-lb__img{
  max-width:100%;
  max-height:calc(100vh - 120px);
  object-fit:contain;
  border-radius:8px;
  display:block;
}
.sv-lb__cap{
  position:absolute;left:16px;right:16px;bottom:18px;
  margin:0;text-align:center;
  color:#EAF5FB;font-size:.8125rem;line-height:1.4;
}
.sv-lb__btn{
  position:absolute;
  display:grid;place-items:center;
  width:44px;height:44px;
  border:0;border-radius:50%;
  background:rgba(255,255,255,.14);
  color:#fff;cursor:pointer;
}
.sv-lb__btn:hover{background:rgba(255,255,255,.26)}
.sv-lb__btn svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.sv-lb__close{top:16px;right:16px}
.sv-lb__prev{left:16px;top:50%;transform:translateY(-50%)}
.sv-lb__next{right:16px;top:50%;transform:translateY(-50%)}

@media (max-width:560px){
  .sv-gal__thumb{width:68px;height:46px}
  .sv-gal__nav{width:34px;height:34px}
}
@media (prefers-reduced-motion:reduce){
  .sv-gal__img{transition:none}
  .sv-gal__thumbs{scroll-behavior:auto}
}

/* --- Insertion dans la carte « Notre structure » de sarvis.fr --- */
.site{min-width:0}
.marque-wrap.sv-galwrap{height:auto;min-height:0;min-width:0;max-width:100%;display:block;padding:16px;overflow:hidden}
.marque-wrap.sv-galwrap .sv-gal{min-width:0;max-width:100%}
.marque-wrap.sv-galwrap .sv-gal__stage{min-width:0;max-width:100%}
.marque-wrap.sv-galwrap .sv-gal__thumbs{min-width:0;max-width:100%}
.marque-wrap.sv-galwrap .sv-gal__cap{min-height:0;margin-top:2px;text-align:left}
.marque-wrap.sv-galwrap .sv-gal__img{width:100%;height:100%;max-width:100%;object-fit:contain;border-radius:0;margin:0}
.marque-wrap.sv-galwrap .sv-gal__thumb img{width:100%;height:100%;object-fit:cover;border-radius:0;margin:0}