/* Home Gallery v1 – all selectors prefixed .hg- to avoid clashing with site CSS */
.hg-section{--hg-navy:#14254a;--hg-gold:#a8915f;padding:60px 15px 70px;background:linear-gradient(#fbf9f4,#fff);clear:both}
.hg-section *,.hg-gal *{box-sizing:border-box}
.hg-head{text-align:center;margin-bottom:28px}
.hg-head h2{color:var(--hg-navy);font-size:34px;margin:0;font-weight:600;line-height:1.3}
.hg-sub{color:var(--hg-navy);margin:4px 0 14px;font-size:18px}
.hg-rule{width:140px;height:2px;background:var(--hg-gold);margin:0 auto}
.hg-more{text-align:center;margin-top:30px}
.hg-more a{display:inline-block;background:var(--hg-gold,#a8915f);color:#fff!important;padding:10px 40px;text-decoration:none!important}
.hg-more a:hover{opacity:.9}
.hg-empty{text-align:center;color:#8a90a0;padding:30px}

.hg-gal{--c:4;--cols:var(--c);--gap:14px;--r:12px;max-width:1100px;margin:0 auto;position:relative}
.hg-tile{position:relative;display:block;aspect-ratio:1/1;border-radius:var(--r);overflow:hidden;background:#e6e6e6;cursor:zoom-in}
.hg-tile img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .4s;display:block;max-width:none}
.hg-tile:hover img{transform:scale(1.07)}
.hg-cap{position:absolute;left:0;right:0;bottom:0;padding:26px 12px 10px;color:#fff;font-size:14px;line-height:1.4;text-align:left;background:linear-gradient(transparent,rgba(10,20,45,.75));opacity:0;transition:opacity .3s;pointer-events:none}
.hg-tile:hover .hg-cap,.hg-tile:focus .hg-cap{opacity:1}
.hg-cap-always .hg-cap{opacity:1}
.hg-cap-none .hg-cap{display:none}

.hg-L-grid .hg-wrap,.hg-L-mosaic .hg-wrap{display:grid;grid-template-columns:repeat(var(--cols),1fr);gap:var(--gap)}
.hg-L-mosaic .hg-wrap{grid-auto-flow:dense}
.hg-L-mosaic .hg-big{grid-column:span 2;grid-row:span 2;aspect-ratio:auto}
/* 2 columns: big tile spans the full row, so give it its own height */
.hg-L-mosaic.hg-narrow .hg-big{grid-row:span 1;aspect-ratio:4/3}
.hg-L-masonry .hg-wrap{columns:var(--cols);column-gap:var(--gap)}
.hg-L-masonry .hg-tile{break-inside:avoid;margin-bottom:var(--gap);width:100%}
.hg-L-carousel .hg-wrap{display:flex;gap:var(--gap);overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none}
.hg-L-carousel .hg-wrap::-webkit-scrollbar{display:none}
.hg-L-carousel .hg-tile{flex:0 0 calc((100% - (var(--cols) - 1) * var(--gap)) / var(--cols));scroll-snap-align:start}
.hg-arrow{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;border:0;background:#fff;box-shadow:0 3px 12px rgba(0,0,0,.18);cursor:pointer;font-size:24px;line-height:38px;padding:0;color:#14254a;z-index:2;text-align:center}
.hg-arrow.hg-l{left:-14px}.hg-arrow.hg-r{right:-14px}

.hg-L-slideshow{max-width:900px}
.hg-stage{position:relative;display:block;aspect-ratio:16/9;border-radius:var(--r);overflow:hidden;background:#1a1a1a;cursor:zoom-in}
.hg-stage img{width:100%;height:100%;object-fit:cover;display:block;max-width:none}
.hg-stage .hg-cap{opacity:1;font-size:16px;padding:40px 18px 14px}
.hg-cap-none .hg-stage .hg-cap{display:none}
.hg-stage .hg-arrow.hg-l{left:12px}.hg-stage .hg-arrow.hg-r{right:12px}
.hg-thumbs{display:flex;gap:var(--gap);margin-top:var(--gap);overflow-x:auto;padding-bottom:4px}
.hg-th{flex:0 0 84px;height:84px;padding:0;border-radius:calc(var(--r) / 2);overflow:hidden;cursor:pointer;opacity:.5;border:2px solid transparent;background:#ddd;transition:.2s}
.hg-th img{width:100%;height:100%;object-fit:cover;display:block}
.hg-th.on{opacity:1;border-color:#a8915f}

/* lightbox */
.hg-lb{position:fixed;inset:0;background:rgba(8,14,30,.93);display:none;align-items:center;justify-content:center;flex-direction:column;z-index:99999}
.hg-lb.on{display:flex}
.hg-lb img{max-width:90vw;max-height:80vh;object-fit:contain}
.hg-lb p{color:#fff;margin:14px 16px 0;text-align:center}
.hg-lb button{position:absolute;background:none;border:0;color:#fff;font-size:44px;cursor:pointer;padding:10px 18px;line-height:1}
.hg-lb .hg-x{top:6px;right:6px}.hg-lb .hg-p{left:6px;top:50%;transform:translateY(-50%)}.hg-lb .hg-n{right:6px;top:50%;transform:translateY(-50%)}

@media (max-width:767px){
  .hg-gal{--cols:min(var(--c),2)}
  .hg-L-mosaic .hg-big{grid-row:span 1;aspect-ratio:4/3}
  .hg-head h2{font-size:28px}
  .hg-arrow.hg-l{left:4px}.hg-arrow.hg-r{right:4px}
  .hg-th{flex-basis:64px;height:64px}
}