/* Beranda: galeri foto (slideshow). */
.gs{position:relative;aspect-ratio:16/7;min-height:260px;background:var(--deep);border-radius:6px;overflow:hidden;box-shadow:0 20px 50px rgba(8,17,31,.25)}
.gs-stage,.gs-slide{position:absolute;inset:0;margin:0}
.gs-slide{opacity:0;transition:opacity 1s ease;z-index:0}
.gs-slide.on{opacity:1;z-index:1}
.gs-slide img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.12);transition:transform 7s ease-out}
.gs-slide.on img{transform:scale(1)}
.gs-slide::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(8,17,31,.78),transparent 45%)}
.gs-slide figcaption{position:absolute;left:28px;right:100px;bottom:36px;z-index:2;color:#fff;font:700 clamp(1rem,2.2vw,1.5rem)/1.3 var(--font-judul);opacity:0;transform:translateY(16px);transition:opacity .8s .5s,transform .8s .5s}
.gs-slide.on figcaption{opacity:1;transform:none}
.gs-ar{position:absolute;top:50%;z-index:3;transform:translateY(-50%);width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.55);background:rgba(8,17,31,.45);color:#fff;font-size:1.5rem;line-height:1;cursor:pointer;transition:background .2s,color .2s}
.gs-ar:hover{background:rgba(201,164,92,.9);color:#0b1e3f}
.gs-prev{left:16px}
.gs-next{right:16px}
.gs-count{position:absolute;right:20px;bottom:20px;z-index:3;color:#fff;font-size:.9rem;background:rgba(8,17,31,.55);padding:3px 12px;border-radius:999px}
.gs-bar{position:absolute;left:0;right:0;bottom:0;height:4px;z-index:3;background:rgba(255,255,255,.2)}
.gs-bar i{display:block;height:100%;width:0;background:#c9a45c}
.gs-bar i.run{animation:gsbar 5.5s linear forwards}
@keyframes gsbar{to{width:100%}}
.gs.one .gs-ar,.gs.one .gs-bar{display:none}
.gs-th{display:flex;gap:10px;margin-top:14px;overflow-x:auto;padding:6px 2px}
.gs-th button{flex:0 0 96px;height:64px;padding:0;border:2px solid transparent;border-radius:4px;overflow:hidden;cursor:pointer;opacity:.6;background:var(--deep);transition:opacity .3s,border-color .3s,transform .3s}
.gs-th button img{width:100%;height:100%;object-fit:cover;display:block}
.gs-th button:hover{opacity:1}
.gs-th button.on{opacity:1;border-color:var(--brass);transform:translateY(-3px)}
.gs-empty{border:2px dashed var(--line);padding:48px 20px;text-align:center;color:var(--muted)}
@media (max-width:640px){.gs{aspect-ratio:4/3}.gs-slide figcaption{left:16px;right:16px;bottom:48px}.gs-ar{width:38px;height:38px}.gs-th button{flex-basis:72px;height:50px}}
.gal{margin-top:72px}
@media (max-width:640px){.gal{margin-top:56px}}