/* Gallery page  -  white / maroon / yellow / black */
#galleryContainer.gallary{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:34px 28px;max-width:1360px;margin:30px auto 0;padding:0 40px}
#galleryContainer .loading,#galleryContainer>p{grid-column:1/-1}

/* album page (hidden until opened) */
.album-view{display:none;position:fixed;inset:0;z-index:2500;background:#fff;overflow-y:auto;padding-bottom:60px}
.album-view-close,.lightbox-close{position:fixed;top:18px;right:24px;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;font-size:26px;line-height:1;cursor:pointer;z-index:3;transition:background .2s,color .2s}
.album-view-close{background:#140c0c;color:#fff}.album-view-close:hover{background:#7a1020}
.album-view-header{max-width:960px;margin:0 auto;padding:78px 24px 28px}
.album-view-title{font-size:clamp(1.8rem,4vw,2.8rem);font-weight:800;color:#140c0c;letter-spacing:-.02em;line-height:1.15}
.album-view-title::after{content:"";display:block;width:56px;height:4px;margin-top:14px;border-radius:4px;background:linear-gradient(90deg,#f5b800 60%,#7a1020 60%)}
.album-view-meta{display:flex;gap:22px;flex-wrap:wrap;margin-top:18px;color:#6b5f5f;font-size:.95rem}
.album-view-meta i{color:#7a1020;margin-right:6px}
.album-view-description{margin-top:16px;color:#3a3030;line-height:1.8;max-width:760px}
.album-view-grid{max-width:1360px;margin:0 auto;padding:0 24px;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.album-view-image{aspect-ratio:4/3;overflow:hidden;border-radius:14px;cursor:zoom-in;background:#f2ecea}
.album-view-image img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s}
.album-view-image:hover img{transform:scale(1.06)}

/* lightbox (hidden until opened) */
.lightbox{display:none;position:fixed;inset:0;z-index:3000;background:#0d0909;color:#fff}
.lightbox-close{background:rgba(255,255,255,.12);color:#fff}.lightbox-close:hover{background:#f5b800;color:#140c0c}
.lightbox-content{position:absolute;inset:0 100px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:60px 0 18px}
.lightbox-content img#lightboxImage{max-width:100%;max-height:calc(100vh - 250px);object-fit:contain;border-radius:8px}
.lightbox-caption{text-align:center}.lightbox-caption h3{font-size:1.15rem}.lightbox-caption p{color:#b9aaaa;font-size:.9rem;margin-top:2px}
.lightbox-thumbnails{display:flex;gap:8px;overflow-x:auto;max-width:100%;padding:4px}
.lightbox-thumbnail{height:58px;width:84px;flex:none;object-fit:cover;border-radius:6px;opacity:.5;cursor:pointer;border:2px solid transparent;transition:.2s}
.lightbox-thumbnail:hover{opacity:.85}.lightbox-thumbnail.active{opacity:1;border-color:#f5b800}
.lightbox-prev,.lightbox-next{position:absolute;top:50%;transform:translateY(-50%);width:52px;height:52px;border-radius:50%;border:0;background:rgba(255,255,255,.12);color:#fff;font-size:18px;cursor:pointer;z-index:2;transition:.2s}
.lightbox-prev{left:24px}.lightbox-next{right:24px}
.lightbox-prev:hover,.lightbox-next:hover{background:#f5b800;color:#140c0c}
@media(max-width:700px){
 #galleryContainer.gallary{padding:0 18px;gap:24px 16px}
 .lightbox-content{inset:0 8px}.lightbox-prev,.lightbox-next{top:auto;bottom:18px;transform:none;width:44px;height:44px}.lightbox-prev{left:14px}.lightbox-next{right:14px}
}


/* ===== Album cards: square, sharp corners ===== */
.album{text-align:left}
.album-thumb{position:relative;overflow:hidden;aspect-ratio:1/1;background:#f2ecea;border-radius:0}
.album .album-thumb img{width:100%;height:100%!important;object-fit:cover;border-radius:0!important;display:block;transition:transform .6s}
.album:hover .album-thumb img{transform:scale(1.07)}
.album-count{position:absolute;left:0;bottom:0;background:rgba(20,12,12,.8);color:#fff;font-size:.8rem;font-weight:600;padding:7px 13px}
.album-count i{margin-right:6px;color:#f5b800}
.album h4{margin-top:12px;font-size:1rem;font-weight:700;color:#140c0c;transition:color .2s}
.album:hover h4{color:#7a1020}
.album small{display:block;margin-top:2px;color:#7a6e6e;font-size:.82rem}

/* ===== Facebook-style album page: tight square grid, no rounding ===== */
.album-view-header{max-width:1180px;padding:80px 28px 22px}
.album-view-grid{max-width:1180px;padding:0 28px;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:4px}
.album-view-image{position:relative;aspect-ratio:1/1;border-radius:0;background:#ece6e3}
.album-view-image img{border-radius:0}
.album-view-image:hover img{transform:none}
.album-view-image::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,0);transition:background .2s}
.album-view-image:hover::after{background:rgba(0,0,0,.2)}
.lightbox-content img#lightboxImage{border-radius:0}
.lightbox-thumbnail{border-radius:0}
.lightbox-counter{position:absolute;top:28px;left:30px;z-index:3;font-size:.95rem;font-weight:600;color:#e9dede;letter-spacing:.04em}
@media(max-width:700px){.album-view-header{padding:72px 16px 18px}.album-view-grid{padding:0;gap:2px;grid-template-columns:repeat(3,1fr)}}

/* ===== Album page: equal-width columns, every photo at its full natural height (no cropping) ===== */
.album-view-grid{display:block!important;column-count:4;column-gap:4px;max-width:1180px;padding:0 28px}
.album-view-image{display:block;aspect-ratio:auto!important;margin:0 0 4px;break-inside:avoid;-webkit-column-break-inside:avoid;overflow:hidden;background:#ece6e3;border-radius:0}
.album-view-image img{display:block;width:100%;height:auto!important;object-fit:initial;border-radius:0}
@media(max-width:1000px){.album-view-grid{column-count:3}}
@media(max-width:700px){.album-view-grid{column-count:2;column-gap:3px;padding:0}.album-view-image{margin-bottom:3px}}

/* ===== Photo viewer: the image only, full screen ===== */
.lightbox{background:#000}
.lightbox-content{inset:0;padding:0;gap:0}
.lightbox-content img#lightboxImage{width:100vw;height:100vh;max-width:100vw;max-height:100vh;object-fit:contain;border-radius:0}
.lightbox-caption,.lightbox-thumbnails,.lightbox-counter{display:none!important}
.lightbox-close,.lightbox-prev,.lightbox-next{background:rgba(0,0,0,.45)}
.lightbox-close:hover,.lightbox-prev:hover,.lightbox-next:hover{background:#f5b800;color:#140c0c}
