/* galerie — repris du <style> de gallery.html.
   Genere par _tools/build-pagecss.py : ne pas modifier a la main. */
.gal-head{max-width:1320px;margin:0 auto;padding:var(--s5) clamp(20px,4vw,52px) var(--s3);text-align:center}
.gal-head h1{font-family:var(--serif);font-weight:300;font-size:var(--step-3);color:var(--pine);line-height:1.02;margin:14px 0 16px}
.gal-head p{max-width:52ch;margin:0 auto}
.filters{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;padding:var(--s3) clamp(20px,4vw,52px) var(--s4)}
.filters button{background:none;border:1px solid var(--line);border-radius:var(--r);padding:11px 20px;font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--green);transition:background .3s,color .3s,border-color .3s}
.filters button:hover{border-color:var(--gold)}
.filters button[aria-pressed="true"]{background:var(--pine);border-color:var(--pine);color:var(--ivory)}
.masonry{max-width:1520px;margin:0 auto;padding:0 clamp(12px,2vw,28px) var(--s6)}
.masonry:not(.laid){display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.masonry:not(.laid) .gi{aspect-ratio:3/2}
@media (max-width:1200px){.masonry:not(.laid){grid-template-columns:repeat(3,1fr)}}
@media (max-width:820px){.masonry:not(.laid){grid-template-columns:repeat(2,1fr)}}
@media (max-width:480px){.masonry:not(.laid){grid-template-columns:1fr}}
.masonry.laid{display:flex;flex-wrap:wrap;gap:12px;align-content:flex-start}
.masonry.laid .gi{flex:0 0 auto}
.gi{display:block;padding:0;border:0;background:var(--cream);border-radius:8px;overflow:hidden;cursor:zoom-in;position:relative}
.gi img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.gi:hover img{transform:scale(1.05)}
.gi::after{content:"";position:absolute;inset:0;background:rgba(7,23,16,0);transition:background .4s;pointer-events:none}
.gi:hover::after{background:rgba(7,23,16,.14)}
.gi[hidden]{display:none}
.count{text-align:center;font-family:var(--mono);font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--gold);padding-bottom:var(--s4)}
.lb{position:fixed;inset:0;z-index:300;background:rgba(7,23,16,.96);display:none;align-items:center;justify-content:center;padding:clamp(16px,4vw,56px)}
.lb.on{display:flex}
.lb img{max-width:100%;max-height:86vh;border-radius:6px;object-fit:contain}
.lb .cap{position:absolute;left:0;right:0;bottom:20px;text-align:center;color:var(--cream);font-size:.9rem;opacity:.82;padding:0 24px}
.lb button{position:absolute;background:none;border:1px solid var(--line-dark);color:var(--cream);width:46px;height:46px;border-radius:50%;display:grid;place-items:center;transition:border-color .3s,background .3s}
.lb button:hover{border-color:var(--gold);background:rgba(176,139,62,.14)}
.lb .x{top:22px;right:22px}
.lb .pv{left:20px;top:50%;transform:translateY(-50%)}
.lb .nx{right:20px;top:50%;transform:translateY(-50%)}
@media (max-width:640px){.lb .pv{left:10px}.lb .nx{right:10px}}
