/* ===== Galeries immersives + lightbox (partagé) ===== */
.gallery-block {
  margin-top: var(--space-9);
  border-top: 1px solid var(--border-on-dark);
  padding-top: var(--space-9);
}
.gallery-block__head {
  display: flex; align-items: flex-end; justify-content: space-between;
  gap: var(--space-5); margin-bottom: var(--space-7); flex-wrap: wrap;
}
.gallery-block__head h3 {
  font-family: var(--font-serif); font-weight: 300;
  font-size: var(--fs-h2); color: var(--fg-on-dark);
  line-height: var(--lh-snug); margin-top: var(--space-2);
}
.gallery-block__head h3 em { color: var(--accent); font-style: italic; }
.gallery-block__hint {
  font-size: var(--fs-eyebrow); font-weight: 500; text-transform: uppercase;
  letter-spacing: var(--tracking-eyebrow); color: var(--fg-on-dark-muted);
  display: inline-flex; align-items: center; gap: var(--space-2);
}
.gallery-trio__grid {
  display: grid;
  grid-template-columns: 2fr 1fr;
  grid-template-rows: repeat(2, 1fr);
  gap: var(--space-3);
  min-height: 520px;
}
.gallery-trio__grid .gallery-tile:nth-child(1) { grid-row: span 2; }
.gallery-quad__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-3);
}
.gallery-quad__grid .gallery-tile { aspect-ratio: 16/11; }
.gallery-tile {
  position: relative; overflow: hidden; cursor: pointer;
  border: 1px solid var(--border-on-dark);
  background: var(--bg-elevated);
}
.gallery-tile img {
  width: 100%; height: 100%; object-fit: cover;
  transition: transform var(--dur-slow) var(--ease-out), filter var(--dur-base) var(--ease-out);
}
.gallery-tile:hover img { transform: scale(1.04); filter: brightness(1.05); }
.gallery-tile__overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, var(--dsp-navy-80) 0%, transparent 50%);
  display: flex; flex-direction: column; justify-content: flex-end;
  padding: var(--space-5);
  opacity: 0; transition: opacity var(--dur-base) var(--ease-out);
}
.gallery-tile:hover .gallery-tile__overlay { opacity: 1; }
.gallery-tile__cap {
  font-family: var(--font-serif); font-size: var(--fs-h4);
  color: var(--fg-on-dark); font-style: italic;
}
.gallery-tile__zoom {
  position: absolute; top: var(--space-4); right: var(--space-4);
  width: 38px; height: 38px;
  border: 1px solid var(--dsp-gold-line);
  background: var(--dsp-navy-60);
  display: grid; place-items: center;
  color: var(--accent);
  opacity: 0; transform: translateY(-6px);
  transition: opacity var(--dur-base) var(--ease-out), transform var(--dur-base) var(--ease-out);
}
.gallery-tile:hover .gallery-tile__zoom { opacity: 1; transform: translateY(0); }
.gallery-tile::before, .gallery-tile::after {
  content: ''; position: absolute; width: 16px; height: 16px;
  border-color: var(--accent); border-style: solid; z-index: 2;
  opacity: 0; transition: opacity var(--dur-base) var(--ease-out);
}
.gallery-tile::before { top: 6px; left: 6px; border-width: 1px 0 0 1px; }
.gallery-tile::after  { bottom: 6px; right: 6px; border-width: 0 1px 1px 0; }
.gallery-tile:hover::before, .gallery-tile:hover::after { opacity: 1; }
@media (max-width: 768px) {
  .gallery-trio__grid { grid-template-columns: 1fr; grid-template-rows: none; min-height: 0; }
  .gallery-trio__grid .gallery-tile { aspect-ratio: 4/3; }
  .gallery-trio__grid .gallery-tile:nth-child(1) { grid-row: auto; aspect-ratio: 16/10; }
  .gallery-quad__grid { grid-template-columns: 1fr; }
  .gallery-quad__grid .gallery-tile { aspect-ratio: 4/3; }
}

/* ===== Lightbox ===== */
.lightbox {
  position: fixed; inset: 0; z-index: 2000;
  background: rgba(7, 14, 31, 0.94);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  display: flex; align-items: center; justify-content: center;
  opacity: 0; pointer-events: none;
  transition: opacity var(--dur-base) var(--ease-out);
}
.lightbox.open { opacity: 1; pointer-events: auto; }
.lightbox__stage {
  position: relative;
  max-width: min(1100px, 92vw); max-height: 82vh; max-height: 82dvh;
  display: flex; flex-direction: column; align-items: center;
}
.lightbox__frame {
  position: relative; padding: 14px;
  border: 1px solid var(--dsp-gold-line);
  background: rgba(11,22,48,0.4);
}
.lightbox__frame img {
  max-width: 100%; max-height: 70vh; max-height: 70dvh; object-fit: contain; display: block;
}
.lightbox__frame .corner {
  position: absolute; width: 24px; height: 24px; border: 1px solid var(--dsp-gold);
}
.lightbox__frame .corner.tl { top: -1px; left: -1px; border-right: none; border-bottom: none; }
.lightbox__frame .corner.tr { top: -1px; right: -1px; border-left: none; border-bottom: none; }
.lightbox__frame .corner.bl { bottom: -1px; left: -1px; border-right: none; border-top: none; }
.lightbox__frame .corner.br { bottom: -1px; right: -1px; border-left: none; border-top: none; }
.lightbox__cap {
  margin-top: var(--space-5); text-align: center;
  display: flex; flex-direction: column; gap: var(--space-2);
}
.lightbox__cap .t {
  font-family: var(--font-serif); font-style: italic;
  font-size: var(--fs-h4); color: var(--fg-on-dark);
}
.lightbox__cap .n {
  font-size: var(--fs-eyebrow); text-transform: uppercase;
  letter-spacing: var(--tracking-eyebrow); color: var(--accent);
}
.lightbox__close {
  position: absolute; top: -52px; right: 0;
  width: 44px; height: 44px;
  border: 1px solid var(--dsp-gold-line); background: transparent;
  color: var(--fg-on-dark); cursor: pointer;
  display: grid; place-items: center;
  transition: border-color var(--dur-fast) var(--ease-out), color var(--dur-fast) var(--ease-out);
}
.lightbox__close:hover { border-color: var(--dsp-gold); color: var(--dsp-gold); }
.lightbox__nav {
  position: absolute; top: 50%; transform: translateY(-50%);
  width: 52px; height: 52px;
  border: 1px solid var(--dsp-gold-line); background: rgba(11,22,48,0.6);
  color: var(--accent); cursor: pointer;
  display: grid; place-items: center;
  transition: background var(--dur-fast) var(--ease-out), border-color var(--dur-fast) var(--ease-out);
  z-index: 3;
}
.lightbox__nav:hover { background: var(--dsp-gold-12); border-color: var(--dsp-gold); }
.lightbox__nav.prev { left: clamp(12px, 4vw, 56px); }
.lightbox__nav.next { right: clamp(12px, 4vw, 56px); }
@media (max-width: 900px) {
  .lightbox__close { top: 8px; right: 8px; background: rgba(11,22,48,0.6); }
}

/* === Relief au survol — tuiles galerie === */
.gallery-tile { transition: transform var(--dur-base) var(--ease-out), box-shadow var(--dur-base) var(--ease-out), border-color var(--dur-base) var(--ease-out); }
.gallery-tile:hover { transform: translateY(-5px); box-shadow: 0 14px 32px rgba(0,0,0,0.42); }

/* === Angles arrondis === */
.gallery-tile, .lightbox__frame, .lightbox__stage img { border-radius: 14px; }
