/* ===== Penyesuaian template Poseify untuk wiraEU.com ===== */
html { scroll-behavior: smooth; }
section[id], div[id].anchor { scroll-margin-top: 80px; }
.navbar-brand h2 { font-size: 1.6rem; letter-spacing: 1px; }
.navbar-brand h2 small { font-size: .55em; color: var(--bs-white); letter-spacing: 3px; display: block; font-weight: 300; }
#header-carousel .carousel-item img { height: 100vh; min-height: 560px; object-fit: cover; }
.carousel-caption .display-1 { font-size: clamp(2.4rem, 6vw, 5.5rem); }

/* About */
.about-img { position: relative; }
.about-img img { width: 100%; max-height: 560px; object-fit: cover; filter: grayscale(15%); }
.about-img::before { content: ""; position: absolute; inset: 24px -24px -24px 24px; border: 2px solid var(--bs-primary); z-index: 0; }
.about-img img { position: relative; z-index: 1; }

/* Gallery */
.gallery-filter .btn { margin: 4px; }
.gallery-filter .btn.active { background: var(--bs-primary); color: #fff; }
.gallery-item { position: relative; overflow: hidden; display: block; aspect-ratio: 4/3; background: #111; }
.gallery-item img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease, opacity .4s; }
.gallery-item .gallery-overlay { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; padding: 18px;
  background: linear-gradient(to top, rgba(0,0,0,.85), rgba(0,0,0,0) 60%); opacity: 0; transition: opacity .4s; }
.gallery-item:hover img { transform: scale(1.08); opacity: .8; }
.gallery-item:hover .gallery-overlay { opacity: 1; }
.gallery-overlay h6 { color: #fff; margin: 0; text-transform: uppercase; font-size: .95rem; }
.gallery-overlay span { color: var(--bs-primary); font-size: .8rem; letter-spacing: 1px; text-transform: uppercase; }
.gallery-col.hide { display: none; }

/* Video */
.video-tags .btn { margin: 4px; }
.video-card { background: var(--bs-dark); border: 1px solid #262626; height: 100%; }
.video-card .ratio { background: #000; }
.video-card .video-thumb { position: relative; display: block; }
.video-card .video-thumb img { width: 100%; aspect-ratio: 16/9; object-fit: cover; }
.video-card .video-thumb i { position: absolute; inset: 0; margin: auto; width: 64px; height: 64px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  background: var(--bs-primary); color: #fff; font-size: 1.4rem; box-shadow: 0 0 0 10px rgba(228,126,23,.25); }
.video-empty { border: 1px dashed #444; padding: 40px; }

/* Stories */
.story-item { background: var(--bs-dark); height: 100%; display: flex; flex-direction: column; transition: transform .3s; }
.story-item:hover { transform: translateY(-6px); }
.story-item .story-img { position: relative; overflow: hidden; aspect-ratio: 4/3; }
.story-item .story-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s; }
.story-item:hover .story-img img { transform: scale(1.08); }
.story-item .story-date { position: absolute; left: 0; bottom: 0; background: var(--bs-primary); color: #fff; padding: 6px 14px; font-size: .85rem; letter-spacing: 1px; }
.story-item .story-body { padding: 24px; flex: 1; display: flex; flex-direction: column; }
.story-item h3 { text-transform: uppercase; font-size: 1.5rem; }
.story-item p { flex: 1; }

/* Articles (service-item) */
.service-item .service-img img { aspect-ratio: 1/1; object-fit: cover; background: #222; }

/* Downloads */
.download-item { display: flex; align-items: center; gap: 16px; padding: 18px 22px; background: var(--bs-dark); border: 1px solid #262626; color: var(--bs-body-color); transition: all .3s; height: 100%; }
.download-item:hover { border-color: var(--bs-primary); color: #fff; transform: translateY(-3px); }
.download-item i.fa-file-powerpoint { font-size: 2rem; color: var(--bs-primary); }
.download-item h6 { margin: 0; text-transform: uppercase; }
.download-item small { color: #999; }

/* Detail konten */
.content-body { font-size: 1.08rem; line-height: 1.9; color: #cfcfcf; }
.content-body p { margin-bottom: 1.2rem; }
.content-body img { max-width: 100%; height: auto; margin: 1rem 0; }
.content-body h2, .content-body h3, .content-body h4 { margin-top: 2rem; color: #fff; }
.content-body a { color: var(--bs-primary); text-decoration: underline; }
.content-body blockquote { border-left: 4px solid var(--bs-primary); padding: .5rem 1.2rem; background: var(--bs-secondary); font-style: italic; }
.content-body table { width: 100%; margin-bottom: 1rem; border-collapse: collapse; }
.content-body td, .content-body th { border: 1px solid #333; padding: 8px; }
.content-body iframe { max-width: 100%; }
.detail-cover { width: 100%; max-height: 520px; object-fit: cover; }
.sidebar-box { background: var(--bs-secondary); padding: 28px; }
.sidebar-box .side-item { display: flex; gap: 12px; align-items: center; padding: 10px 0; border-bottom: 1px solid #2a2a2a; color: var(--bs-body-color); }
.sidebar-box .side-item:last-child { border-bottom: 0; }
.sidebar-box .side-item img { width: 70px; height: 56px; object-fit: cover; }
.sidebar-box .side-item:hover h6 { color: var(--bs-primary); }
.page-header.has-bg { background-size: cover; background-position: center; }
.pagination .page-link { background: var(--bs-dark); border-color: #333; color: #ddd; }
.pagination .page-item.active .page-link { background: var(--bs-primary); border-color: var(--bs-primary); }
.pagination .page-item.disabled .page-link { background: var(--bs-dark); color: #555; border-color: #333; }

/* Footer: ganti siluet model bawaan template dengan nuansa peta/garis lintang */
.footer { background: radial-gradient(900px 300px at 50% 0%, rgba(228,126,23,.12), transparent 70%), repeating-linear-gradient(0deg, rgba(255,255,255,.025) 0 1px, transparent 1px 48px), repeating-linear-gradient(90deg, rgba(255,255,255,.025) 0 1px, transparent 1px 48px), var(--bs-dark) !important; }

@media (max-width: 576px) {
    .navbar-brand h2 { font-size: 1.05rem; }
    .navbar-brand { margin-left: 1rem !important; }
    .navbar-toggler { margin-right: 1rem !important; }
    .carousel-caption .title { margin-left: 0 !important; margin-right: 0 !important; padding-left: 1rem !important; padding-right: 1rem !important; }
}

/* Header halaman dalam tanpa gambar: latar gelap polos + aksen warna utama (menggantikan foto model bawaan template) */
.page-header.no-bg {
    background: radial-gradient(900px 320px at 50% 100%, rgba(228,126,23,.18), transparent 70%),
                repeating-linear-gradient(0deg, rgba(255,255,255,.03) 0 1px, transparent 1px 48px),
                repeating-linear-gradient(90deg, rgba(255,255,255,.03) 0 1px, transparent 1px 48px),
                var(--bs-dark) !important;
    border-bottom: 1px solid rgba(255,255,255,.06);
}