/* HOT Gallery — masonry grid (CSS grid + row spans set by gallery.js). */
.hotgal { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 20px; grid-auto-rows: 4px; grid-auto-flow: dense; }
.hotgal-item { margin: 0; position: relative; overflow: hidden; background: #e9e5dc; border-radius: 10px; transition: box-shadow .3s ease, transform .3s ease; }
.hotgal-item:hover { box-shadow: 0 10px 26px rgba(0,0,0,.18); transform: translateY(-2px); }
.hotgal-item.is-open:hover { transform: none; }
.hotgal .hotgal-item img { display: block; width: 100% !important; height: 100% !important; max-width: none; object-fit: cover; transition: transform .35s ease; }
.hotgal-link, .hotgal-play-btn { display: block; width: 100%; height: 100%; position: relative; padding: 0; margin: 0; border: 0; background: none; cursor: pointer; }
.hotgal-overlay { position: absolute; inset: 0; background: rgba(0,0,0,0); transition: background .25s linear; pointer-events: none; }
.hotgal-item:hover .hotgal-overlay { background: rgba(0,0,0,.28); }
.hotgal-item:hover img { transform: scale(1.03); }
.hotgal-play { position: absolute; left: 50%; top: 50%; width: 74px; height: 74px; margin: -37px 0 0 -37px; border-radius: 50%;
	background: rgba(0,0,0,.55) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='white' d='M8 5v14l11-7z'/%3E%3C/svg%3E") 56% 50% / 40px no-repeat;
	box-shadow: 0 2px 14px rgba(0,0,0,.35); border: 3px solid rgba(255,255,255,.9); transition: transform .2s, background-color .2s; pointer-events: none; }
.hotgal-item:hover .hotgal-play { transform: scale(1.1); background-color: rgba(0,0,0,.75); }
.hotgal-play-btn:focus-visible { outline: 3px solid #fff; outline-offset: -6px; }
.hotgal-noposter { display: block; width: 100%; height: 100%; min-height: 200px; background: linear-gradient(135deg, #3d4a3a, #1f261d); }
/* Expanded video: full row width */
.hotgal-item.is-open { grid-column: 1 / -1; background: #000; }
.hotgal-item.is-open video { display: block; width: 100%; height: 100%; background: #000; object-fit: contain; }
.hotgal-close { position: absolute; top: 12px; right: 12px; z-index: 2; width: 42px; height: 42px; border-radius: 50%; border: 0;
	background: rgba(0,0,0,.65); color: #fff; font-size: 26px; line-height: 42px; text-align: center; cursor: pointer; padding: 0; }
.hotgal-close:hover { background: rgba(0,0,0,.9); }
@media (max-width: 1024px) { .hotgal { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; } }
@media (max-width: 680px)  { .hotgal { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } .hotgal-play { width: 56px; height: 56px; margin: -28px 0 0 -28px; background-size: 30px; } }

/* ---------- Lightbox (1.1.0) ---------- */
html.hglb-lock, html.hglb-lock body { overflow: hidden; }
.hglb { position: fixed; inset: 0; z-index: 999999; background: rgba(10,12,10,.94); display: none; align-items: center; justify-content: center; }
.hglb.open { display: flex; }
.hglb-stage { position: absolute; inset: 64px 96px; display: flex; align-items: center; justify-content: center; }
.hglb-media { max-width: 100%; max-height: 100%; width: auto; height: auto; display: block; border-radius: 6px; box-shadow: 0 10px 50px rgba(0,0,0,.6); background: #000; }
video.hglb-media { width: 100%; height: 100%; object-fit: contain; }
.hglb-close { position: absolute; top: 16px; right: 18px; width: 54px; height: 54px; border-radius: 50%; border: 3px solid #fff;
	background: rgba(0,0,0,.55); color: #fff; font-size: 38px; line-height: 44px; text-align: center; padding: 0; cursor: pointer; z-index: 3;
	box-shadow: 0 2px 12px rgba(0,0,0,.5); transition: background .15s, transform .15s; }
.hglb-close:hover, .hglb-close:focus-visible { background: #b32d2e; transform: scale(1.08); outline: none; }
.hglb-nav { position: absolute; top: 50%; transform: translateY(-50%); width: 64px; height: 64px; border-radius: 50%; border: 3px solid #fff;
	background: rgba(0,0,0,.55); color: #fff; font-size: 52px; line-height: 50px; text-align: center; padding: 0 0 6px; cursor: pointer; z-index: 3;
	box-shadow: 0 2px 12px rgba(0,0,0,.5); transition: background .15s, transform .15s; }
.hglb-nav:hover, .hglb-nav:focus-visible { background: rgba(255,255,255,.25); transform: translateY(-50%) scale(1.08); outline: none; }
.hglb-prev { left: 18px; } .hglb-next { right: 18px; }
.hglb.single .hglb-nav { display: none; }
.hglb-count { position: absolute; top: 26px; left: 24px; color: #fff; font: 600 16px/1 system-ui, sans-serif; background: rgba(0,0,0,.45); padding: 8px 12px; border-radius: 20px; }
.hglb-caption { position: absolute; bottom: 18px; left: 50%; transform: translateX(-50%); max-width: 80%; color: #fff; text-align: center;
	font: 15px/1.4 system-ui, sans-serif; background: rgba(0,0,0,.5); padding: 8px 14px; border-radius: 8px; }
@media (max-width: 680px) {
	.hglb-stage { inset: 70px 8px 70px 8px; }
	.hglb-nav { top: auto; bottom: 14px; transform: none; width: 54px; height: 54px; font-size: 42px; line-height: 40px; }
	.hglb-nav:hover, .hglb-nav:focus-visible { transform: scale(1.05); }
	.hglb-prev { left: 16px; } .hglb-next { right: 16px; }
	.hglb-caption { bottom: 80px; }
}
