/* =========================================================
   BASE
   ========================================================= */
html{ scroll-behavior:smooth; }
body{
  font-family:'Poppins',system-ui,-apple-system,Segoe UI,Roboto,'Helvetica Neue',Arial,'Noto Sans','Apple Color Emoji','Segoe UI Emoji','Segoe UI Symbol';
  scroll-padding-top:80px;
  padding-top:72px; /* ruang untuk navbar sticky/fixed */
}
html,body{ overflow-x:hidden; } /* guard global overflow kanan */

/* =========================================================
   NAVBAR & HEADER (umum)
   ========================================================= */
header{ overflow:visible; }              /* jangan putus sticky */
.navbar{ min-height:64px; }
.navbar.sticky-top{ position:sticky; top:0; z-index:1030; }
.navbar.fixed-top{ position:fixed; top:0; left:0; right:0; z-index:1040; }

.navbar-brand img{ max-height:44px; height:auto; width:auto; object-fit:contain; }

.navbar-expand-lg .navbar-nav .nav-link{
  padding:.5rem 1.2rem;
  font-size:.95rem;
  font-weight:600;
  transition:color .15s ease-in-out;
  white-space:nowrap;
}
.navbar-nav .nav-link:not(.active):hover{ color:#0d6efd; }

/* Aktif: underline hanya non-dropdown supaya caret tak ketimpa */
.navbar .nav-link.active{
  color:#0d6efd !important;
  font-weight:600;
  position:relative;
}
.navbar .nav-link.active:not(.dropdown-toggle)::before{
  content:"";
  position:absolute; bottom:-2px; left:1.2rem; right:1.2rem;
  height:2px; background:#0d6efd; border-radius:2px;
}

/* Caret dropdown */
.navbar .nav-link.dropdown-toggle::after{
  display:inline-block; margin-left:.255em; vertical-align:.255em; content:"";
  border-top:.3em solid; border-right:.3em solid transparent; border-bottom:0; border-left:.3em solid transparent;
}
.navbar .nav-link.dropdown-toggle[aria-expanded="true"]::after{ transform:rotate(180deg); }

/* Dropdown menu (desktop by Popper, mobile statis di offcanvas) */
.dropdown-menu{
  border-radius:.5rem; border:none;
  box-shadow:0 .5rem 1rem rgba(0,0,0,.12);
  margin-top:12px; z-index:1070;
}
.dropdown-menu::before{
  content:""; position:absolute; top:-7px; left:20px; width:0; height:0;
  border-left:7px solid transparent; border-right:7px solid transparent; border-bottom:7px solid #fff;
  filter:drop-shadow(0 -2px 2px rgba(0,0,0,.03));
}
.dropdown-item{ font-size:.92rem; font-weight:500; padding:.6rem 1.1rem; }
.dropdown-item:active{ background-color:#0d6efd; color:#fff; }

/* Desktop: biarkan Popper pakai position absolute */
@media (min-width:992px){
  .navbar .dropdown-menu{ position:absolute; }
}

/* Toggler */
.navbar-toggler{ border:none; }
.navbar-toggler:focus{ box-shadow:none; }
.navbar-toggler.navbar-toggler-custom{
  width:44px;height:44px;border-radius:9999px;border:1px solid #cbd5e1;
  background:#f1f5f9;color:#0f172a;display:flex;align-items:center;justify-content:center;
  font-size:1.2rem;padding:0;box-sizing:border-box;transition:background-color .2s,border-color .2s;
}
.navbar-toggler.navbar-toggler-custom:hover{ background:#e2e8f0;border-color:#94a3b8; }

/* Container header tidak melebar */
header .navbar > .container{
  max-width:1140px; margin-inline:auto; position:relative;
}
@media (max-width:575.98px){
  header .navbar > .container{ padding-inline:1rem; }
}

/* Judul tengah khusus mobile */
.navbar .navbar-mobile-title{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  max-width:60vw; text-align:center; font-weight:700; letter-spacing:.2px;
  color:#0f172a; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; pointer-events:none;
}
@media (min-width:992px){ .navbar .navbar-mobile-title{ display:none !important; } }

/* =========================================================
   OFFCANVAS (mobile) — FIX overflow kanan (hapus 100vw)
   ========================================================= */
.offcanvas{ width:auto !important; max-width:100% !important; }
@media (max-width:991.98px){
  .offcanvas{ width:100% !important; max-width:100% !important; }
  .offcanvas .dropdown-menu{
    position:static; transform:none !important; float:none; width:100%;
    margin:.25rem 0 .5rem; display:none;
  }
  .offcanvas .dropdown-menu.show{ display:block; }
}
.offcanvas-header .navbar-brand img{ max-height:40px; }
.offcanvas-body{ overflow-y:auto; }
.offcanvas-body .navbar-nav .nav-link{ padding:.8rem 1rem; }
.offcanvas-body .btn-primary{ width:100%; margin-top:1rem; }

/* Hindari sisa padding-right dari modal/offcanvas */
body[style*="padding-right"]{ padding-right:0 !important; }

/* =========================================================
   PAGE HEADER (hero setiap halaman) — kembali ke SEMULA
   ========================================================= */
.page-header-ui{
  position:relative;
  background:url('https://images.unsplash.com/photo-1593349122359-24b534a75931?q=80&w=1932&auto=format&fit=crop')
            no-repeat center center/cover;
  z-index:1;
  padding-top:86px; padding-bottom:36px;
}
.page-header-ui::before{
  content:""; position:absolute; inset:0; background-color:rgba(10,20,30,.7); z-index:-1;
}
.page-header-ui .logo-header{
  max-width:88px; max-height:88px; width:auto; height:auto; object-fit:contain; display:inline-block;
}
@media (max-width:575.98px){
  .page-header-ui{ padding-top:76px; padding-bottom:28px; }
  .page-header-ui .logo-header{ max-width:72px; max-height:72px; }
}
.page-header-ui .breadcrumb{ justify-content:center; font-size:.9rem; }
.page-header-ui .breadcrumb-item a{ color:rgba(255,255,255,.7); text-decoration:none; }
.page-header-ui .breadcrumb-item a:hover{ color:#fff; }
.page-header-ui .breadcrumb-item.active{ color:#fff; }
.page-header-ui .breadcrumb-item + .breadcrumb-item::before{ color:rgba(255,255,255,.5); }

/* =========================================================
   KOMPONEN UMUM (tidak diubah selain perapihan)
   ========================================================= */
.text-justify{ text-align:justify; }

/* Vision & Mission card */
.card-vision-mission{ position:relative; z-index:1; overflow:hidden; border:none !important; }
.card-vision-mission::before{
  content:""; position:absolute; inset:0;
  background:url('https://images.unsplash.com/photo-1593349122359-24b534a75931?q=80&w=1932&auto=format&fit=crop') no-repeat center/cover;
  z-index:-2; filter:blur(2px);
}
.card-vision-mission::after{ content:""; position:absolute; inset:0; background-color:rgba(20,30,40,.8); z-index:-1; }
.card-vision-mission ol{ list-style:none; padding-left:0; counter-reset:mission-counter; }
.card-vision-mission ol li{
  counter-increment:mission-counter; margin-bottom:1.5rem; padding-left:3rem; position:relative; line-height:1.7;
}
.card-vision-mission ol li::before{
  content:counter(mission-counter) ".";
  position:absolute; left:0; top:0; font-weight:700; font-size:1.5rem; color:#0dcaf0; width:2.5rem; text-align:left;
}

/* Fasilitas */
.card-fasilitas{ transition:transform .3s ease, box-shadow .3s ease; }
.card-fasilitas:hover{ transform:translateY(-5px); box-shadow:0 .5rem 1rem rgba(0,0,0,.15) !important; }
.card-fasilitas-img{ height:200px; object-fit:cover; }
.link-detail{ font-size:.9rem; font-weight:500; color:#0d6efd; text-decoration:none; transition:all .3s ease; }
.card-fasilitas:hover .link-detail{ letter-spacing:.5px; }

/* Berita */
.card-berita{ transition:transform .3s ease, box-shadow .3s ease; }
.card-berita:hover{ transform:translateY(-5px); box-shadow:0 .5rem 1rem rgba(0,0,0,.15) !important; }
.card-berita-img{ height:200px; object-fit:cover; }
.card-berita .card-title a{ color:#212529; text-decoration:none; transition:color .3s ease; }
.card-berita:hover .card-title a{ color:#0d6efd; }

/* Sidebar detail */
.sidebar-widget .widget-title{
  font-size:1.3rem; font-weight:600; margin-bottom:1.5rem; position:relative; padding-bottom:.75rem;
}
.sidebar-widget .widget-title::after{ content:""; position:absolute; bottom:0; left:0; width:50px; height:3px; background-color:#0d6efd; }
.sidebar-list-item{ display:flex; align-items:center; margin-bottom:1.25rem; text-decoration:none; }
.sidebar-list-title{ font-weight:500; font-size:.95rem; line-height:1.4; color:#212529; transition:color .3s ease; }
.sidebar-list-item:hover .sidebar-list-title{ color:#0d6efd; }

/* Galeri */
.card-album{ position:relative; border-radius:.5rem; overflow:hidden; display:block; text-decoration:none; box-shadow:0 .25rem .5rem rgba(0,0,0,.075); transition:transform .3s ease, box-shadow .3s ease; }
.card-album:hover{ transform:translateY(-5px); box-shadow:0 .5rem 1.5rem rgba(0,0,0,.15); }
.card-album-img{ width:100%; height:100%; object-fit:cover; transition:transform .3s ease; }
.card-album:hover .card-album-img{ transform:scale(1.05); }
.card-album-overlay{
  position:absolute; inset:0; background:linear-gradient(to top, rgba(0,0,0,.8) 0%, rgba(0,0,0,0) 50%);
  display:flex; flex-direction:column; justify-content:flex-end; padding:1rem; color:#fff;
}
.card-album-title{ font-weight:600; font-size:1.2rem; margin-bottom:.25rem; }
.card-album-count{ font-size:.8rem; opacity:.8; }

/* Accordion */
.accordion-item{ border:1px solid #dee2e6; margin-bottom:1rem; border-radius:.375rem !important; }
.accordion-item:first-of-type, .accordion-item:last-of-type{ border-radius:.375rem !important; }
.accordion-title{ font-size:1rem; }
@media (min-width:768px){ .accordion-title{ font-size:1.25rem; } }
.accordion-program .accordion-item{ background:#fff; border:none; border-radius:.5rem; margin-bottom:1rem; box-shadow:0 .25rem 1rem rgba(0,0,0,.07); overflow:hidden; }
.accordion-program .accordion-button{ font-weight:600; font-size:1.1rem; color:#212529; background:#f8f9fa; padding:1.25rem; }
.accordion-program .accordion-button:not(.collapsed){ color:#fff; background:#0d6efd; box-shadow:none; }
.accordion-program .accordion-button:focus{ box-shadow:none; }
.accordion-program .accordion-button::after{
  background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}
.accordion-program .accordion-button:not(.collapsed)::after{
  background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
}

/* Timeline & Info */
.timeline-step{ position:relative; padding-left:2.5rem; padding-bottom:2rem; border-left:2px solid #dee2e6; }
.timeline-step:last-child{ border-left-color:transparent; padding-bottom:0; }
.timeline-step::before{ content:""; position:absolute; left:-9px; top:5px; width:16px; height:16px; border-radius:50%; background:#0d6efd; border:2px solid #fff; }
.timeline-step h6{ font-weight:600; }
.card-info{ border:1px solid #e9ecef; transition:all .3s ease; }
.card-info:hover{ transform:translateY(-5px); border-color:#0d6efd; box-shadow:0 .5rem 1.5rem rgba(0,0,0,.1); }

/* Tabs pendaftaran */
.nav-pills-pendaftaran .nav-link{
  background:none; border:none; text-align:left; padding:1rem; font-weight:600; color:#495057; border-left:4px solid transparent; border-radius:0; transition:all .2s;
}
.nav-pills-pendaftaran .nav-link.active,
.nav-pills-pendaftaran .nav-link:hover{
  color:#0d6efd; background-color:#e7f1ff; border-left-color:#0d6efd;
}
.nav-pills-pendaftaran .nav-link i{ width:25px; text-align:center; }
@media (max-width:991.98px){
  .nav-pills-pendaftaran{ flex-direction:row !important; justify-content:center; border-bottom:1px solid #dee2e6; margin-bottom:1.5rem; }
  .nav-pills-pendaftaran .nav-link{ border-left:none; border-bottom:4px solid transparent; text-align:center; }
}

/* Jadwal Penting */
.card-schedule{ position:relative; overflow:visible; border:1px solid rgba(37,99,235,.25); box-shadow:0 10px 26px rgba(37,99,235,.18), 0 2px 8px rgba(2,6,23,.08); }
.card-schedule .card-header{ background:linear-gradient(90deg,#3b82f6,#2563eb); color:#fff; }
.card-schedule::before{ content:""; position:absolute; inset:-2px; border-radius:16px; background:linear-gradient(135deg,rgba(59,130,246,.9),rgba(99,102,241,.9),rgba(45,212,191,.8)); z-index:-1; filter:blur(10px); opacity:.55; }
.card-schedule::after{ content:""; position:absolute; left:-8px; top:18px; bottom:18px; width:6px; border-radius:6px; background:linear-gradient(180deg,#60a5fa,#22d3ee); box-shadow:0 0 18px rgba(34,211,238,.45); animation:glowPulse 2.8s ease-in-out infinite; }
@keyframes glowPulse{ 0%,100%{opacity:.85; box-shadow:0 0 14px rgba(34,211,238,.35);} 50%{opacity:1; box-shadow:0 0 24px rgba(34,211,238,.6);} }
@media (max-width:575.98px){ .card-schedule{ margin-top:18px; } }

/* Kontak Panitia */
.card-contact .card-header{ background:#f8fafc; border-bottom:1px solid #e5e7eb; }
.card-contact .list-contact{ display:grid; grid-template-columns:1fr; gap:14px; }
.card-contact .item{ display:flex; align-items:flex-start; gap:12px; padding:10px 12px; border:1px solid #e5e7eb; border-radius:12px; background:#fff; transition:transform .15s, box-shadow .15s, border-color .15s; }
.card-contact .item:hover{ transform:translateY(-1px); box-shadow:0 8px 18px rgba(15,23,42,.06); border-color:#dbeafe; }
.card-contact .item i{ color:#22c55e; font-size:1.05rem; margin-top:2px; width:18px; text-align:center; }
.card-contact .item .label{ font-weight:600; color:#0f172a; display:block; margin-bottom:2px; font-size:.92rem; }
.card-contact .item .val{ color:#475569; word-break:break-word; font-size:.92rem; }

/* Footer */
footer .footer-brand img, footer .footer-logo{ max-width:72px; max-height:72px; height:auto; width:auto; object-fit:contain; }
.footer-list-links li, .footer-list-contact li{ margin-bottom:.5rem; }
.footer-list-links li:last-child, .footer-list-contact li:last-child{ margin-bottom:0; }
@media (max-width:575.98px){
  footer h6.text-uppercase{ margin-bottom:.5rem !important; font-size:1rem; }
  .footer-list-links li, .footer-list-contact li{ margin-bottom:.35rem; }
  footer .btn.btn-outline-light.btn-sm{ padding:.25rem .5rem; }
  footer .footer-brand img, footer .footer-logo{ max-width:60px; max-height:60px; }
}

/* =========================================================
   HALAMAN BERANDA (original, tak diubah kecuali perapihan)
   ========================================================= */
.section-padding{ padding-top:5rem; padding-bottom:5rem; }
.section-title{ margin-bottom:3rem; }
.section-title h2{ font-weight:700; font-size:2.2rem; position:relative; padding-bottom:1rem; display:inline-block; }
.section-title h2::after{
  content:''; position:absolute; bottom:0; left:50%; transform:translateX(-50%);
  width:60px; height:3px; background-color:#0d6efd; border-radius:2px;
}
.title-xl{ font-size:2.5rem; }
@media (max-width:575.98px){
  .section-title h2{ font-size:1.6rem; }
  .title-xl{ font-size:1.9rem; }
}

/* Hero beranda (tetap) */
.hero-section{
  position:relative; height:90vh; min-height:600px;
  background-size:cover; background-position:center; color:#fff; display:flex; align-items:center; text-align:center;
}
.hero-section::before{ content:''; position:absolute; inset:0; background:rgba(0,0,0,.5); }
.hero-content{ position:relative; z-index:2; }
.hero-section .display-4{ font-weight:700; text-shadow:2px 2px 8px rgba(0,0,0,.5); font-size:2.5rem; }
@media (min-width:768px){ .hero-section .display-4{ font-size:3.5rem; } }
.hero-section .lead{ font-size:1.1rem; max-width:600px; margin-inline:auto; text-shadow:1px 1px 4px rgba(0,0,0,.5); }

/* Sambutan */
.sambutan-img{ width:100%; max-width:350px; height:auto; border-radius:.5rem; box-shadow:0 1rem 3rem rgba(0,0,0,.175); }
.sambutan-content{ font-size:.95rem; }
.link-selengkapnya{ font-weight:600; text-decoration:none; cursor:pointer; display:inline-flex; align-items:center; gap:.5rem; }
.link-selengkapnya .fa-chevron-down{ transition:transform .3s ease; }
.link-selengkapnya[aria-expanded="true"] .fa-chevron-down{ transform:rotate(180deg); }

/* Visi */
.visi-text{ font-size:1.1rem; font-weight:500; font-style:italic; position:relative; padding:1.5rem; border-left:4px solid #0d6efd; background-color:#fff; box-shadow:0 .5rem 1rem rgba(0,0,0,.05); }
@media (max-width:767.98px){ .visi-text{ font-size:1rem; } }
.visi-text::before{ content:'“'; position:absolute; left:15px; top:0; font-size:6rem; color:#0d6efd; opacity:.1; line-height:1; }

/* Misi */
.misi-list{ margin:0; padding:0; list-style:none; }
.misi-list-item{ display:flex; align-items:flex-start; margin-bottom:1rem; font-size:1.075rem; line-height:1.6; }
@media (min-width:992px){ .misi-list-item{ font-size:1.125rem; } }
.misi-list-item i{ font-size:1.25rem; color:#198754; margin-top:4px; }

/* Kartu hover umum */
.card-hover{ transition:transform .3s ease, box-shadow .3s ease; }
.card-hover:hover{ transform:translateY(-5px); box-shadow:0 .5rem 1.5rem rgba(0,0,0,.1) !important; }

/* Gambar card per-section */
.card-img-top-fixed{ width:100%; height:auto; object-fit:cover; }
@media (min-width:992px){ .program-img{ height:240px; } }
.fasilitas-img{ height:auto; object-fit:cover; }
@media (min-width:992px){ .fasilitas-img{ height:280px; } }
.berita-img{ height:auto; object-fit:cover; }
@media (min-width:992px){ .berita-img{ height:220px; } }

/* Galeri mini */
.galeri-mini a{ overflow:hidden; display:block; position:relative; }
.galeri-mini img{ transition:transform .4s ease, filter .4s ease; aspect-ratio:4/3; object-fit:cover; }
.galeri-mini a:hover img{ transform:scale(1.1); filter:brightness(.4); }

/* Testimoni slider */
.testi-slider{ position:relative; }
.testi-viewport{ overflow:hidden; }
.testi-track{ display:flex; gap:1rem; will-change:transform; transition:transform .35s ease; }
.testi-card{ flex:0 0 100%; }
@media (min-width:992px){ .testi-card{ flex:0 0 calc((100% - 2rem)/3); } }
.testi-avatar{
  width:80px; height:80px; object-fit:cover; border-radius:50%;
  margin-bottom:1rem; border:3px solid #fff; box-shadow:0 .5rem 1rem rgba(0,0,0,.15);
  display:block; margin-left:auto; margin-right:auto;
}
.testi-quote{ font-size:.95rem; }
.testi-name{ font-size:1rem; }
.testi-role{ font-size:.875rem; color:#6c757d; }
.testi-nav{ display:flex; justify-content:center; gap:.5rem; margin-top:1rem; }
.testi-btn{ width:34px; height:34px; border:1px solid rgba(0,0,0,.2); border-radius:50%; background:#fff; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; }
.testi-btn:disabled{ opacity:.5; cursor:not-allowed; }

/* CTA */
.cta-section{ position:relative; background-color:#e7f1ff; overflow:hidden; }
.cta-blob{ position:absolute; top:50%; left:50%; width:100%; min-width:800px; height:100%; transform:translate(-50%,-50%); z-index:0; opacity:.15; color:#0d6efd; }
.cta-content{ position:relative; z-index:1; }

/* =========================================================
   AGENDA (tetap)
   ========================================================= */
.agenda-controls{ margin-left:auto; }
.agenda-controls .btn{ width:35px; height:35px; border-radius:50%; background-color:#e9ecef; color:#495057; border:none; }
.agenda-controls .btn:hover{ background-color:#0d6efd; color:#fff; }

#agendaCarousel .carousel-inner{ display:flex; scroll-behavior:smooth; -ms-overflow-style:none; scrollbar-width:none; }
#agendaCarousel .carousel-inner::-webkit-scrollbar{ display:none; }
#agendaCarousel .carousel-item{ display:block; margin-right:0; flex:0 0 100%; padding:0 .5rem; }
@media (min-width:768px){ #agendaCarousel .carousel-item{ flex:0 0 50%; } }
@media (min-width:992px){ #agendaCarousel .carousel-item{ flex:0 0 33.3333%; } }

.card-agenda-minimalis{
  border:1px solid #e0e0e0; border-radius:.5rem; box-shadow:none; transition:all .3s ease;
  height:100%; background-color:#fff;
}
.card-agenda-minimalis:hover{ box-shadow:0 .5rem 1rem rgba(0,0,0,.1); border-color:#0d6efd; }
.agenda-date-top{ background-color:#0d6efd; color:#fff; text-align:center; padding:.5rem; font-weight:600; border-top-left-radius:.5rem; border-top-right-radius:.5rem; font-size:.9rem; }
.card-agenda-minimalis .card-title{ font-size:1.1rem; font-weight:600; }
.card-agenda-minimalis .card-text{ font-size:.85rem; }
.card-agenda-lampau{ border:1px solid #dee2e6; transition:all .3s ease; height:100%; }
.card-agenda-lampau:hover{ border-color:#0d6efd; transform:translateY(-3px); box-shadow:0 .25rem .75rem rgba(0,0,0,.07); }

/* =========================================================
   TESTIMONI (tetap)
   ========================================================= */
.card-testimoni{
  border:1px solid #e9ecef; border-left:4px solid #0d6efd; transition:all .3s ease;
}
.card-testimoni:hover{
  border-color:#0d6efd; transform:translateY(-5px);
  box-shadow:0 .5rem 1.5rem rgba(0,0,0,.1) !important;
}
.testimoni-avatar{ width:60px; height:60px; object-fit:cover; border-radius:50%; }

/* =========================================================
   KONTEN UMUM GUARD
   ========================================================= */
.page-header-ui img, .page-content img{ max-width:100%; height:auto; }
.page-content{ overflow-wrap:anywhere; word-break:break-word; }
.table-responsive{ overflow-x:auto; }


/* OFFCANVAS: jadikan dropdown bagian dari aliran dokumen (tidak mengambang) */
@media (max-width: 991.98px){
  .offcanvas .nav-item.dropdown > .nav-link.dropdown-toggle{
    position: relative;
    display: inline-block;           /* supaya underline hanya selebar teks */
    padding-bottom: .35rem;          /* ruang kecil untuk segitiga */
  }

  .offcanvas .dropdown-menu{
    position: static !important;     /* kunci statis, dorong konten di bawah */
    transform: none !important;
    float: none;
    width: 100%;
    margin: .35rem 0 .6rem;
    border: none;
    border-radius: .5rem;
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.12);
    display: none;                   /* default tertutup */
  }
  .offcanvas .dropdown-menu.show{ display:block; }

  /* Matikan panah default menu (kalau ada style global) */
  .offcanvas .dropdown-menu::before{ display:none !important; }

  /* Panah kecil MENEMPEL di toggle yang sedang expanded */
  .offcanvas .nav-item.dropdown > .nav-link.dropdown-toggle[aria-expanded="true"]::after{
    transform: rotate(180deg);       /* caret tetap berputar */
  }
  .offcanvas .nav-item.dropdown > .nav-link.dropdown-toggle[aria-expanded="true"]::before{
    content:"";
    position: absolute;
    left: 0.2rem;                    /* tepat di bawah teks kiri */
    bottom: -7px;                    /* menempel bawah toggle */
    width: 0; height: 0;
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-top: 7px solid #fff;
    filter: drop-shadow(0 -2px 2px rgba(0,0,0,.04));
  }

  /* Halaman aktif (link biasa) — underline selebar teks */
  .offcanvas-body .nav-link.active{
    text-decoration: underline;
    text-underline-offset: 4px;
    text-decoration-thickness: 2px;
    text-decoration-color: #0d6efd;
    color: #0b0f1a; /* tetap hitam pekat */
  }
  .offcanvas-body .nav-link.active::before{ display:none !important; }
}

/* ======================================= */
/* (DIUBAH) Style Halaman Struktur       */
/* ======================================= */
.bagan-utama-container {
    cursor: pointer; /* Menandakan gambar bisa di-klik */
}
.card-pengurus {
    border: 1px solid #e9ecef;
    transition: all 0.3s ease;
    background-color: #fff;
    height: 100%;
}
.card-pengurus:hover {
    transform: translateY(-5px);
    box-shadow: 0 0.5rem 1.5rem rgba(0,0,0,0.1);
}
.card-pengurus-img-container {
    height: 220px; 
    overflow: hidden;
}
.card-pengurus-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: top;
}

/* =================================== */
/* STYLE KARTU KAJIAN (FINAL) */
/* =================================== */
.card-kajian-clean {
    border: 1px solid #e9ecef;
    box-shadow: 0 0.125rem 0.25rem rgba(0,0,0,0.05);
    transition: all 0.3s ease;
    text-decoration: none;
    display: block;
    color: inherit;
    height: 100%;
}
.card-kajian-clean:hover {
    transform: translateY(-5px);
    box-shadow: 0 0.5rem 1.5rem rgba(0,0,0,0.1);
    border-color: #0d6efd;
}
.card-kajian-clean .card-img-top {
    height: 200px; /* <-- TINGGI GAMBAR DIBUAT SERAGAM DI SINI */
    object-fit: cover; /* <-- GAMBAR TIDAK AKAN GEPENG */
}
.card-kajian-clean .card-title {
    font-weight: 600;
    font-size: 1rem;
    line-height: 1.4;
}
.card-kajian-clean .card-meta {
    font-size: 0.8rem;
}


/* ======================================= */
/* (DIUBAH) Style Final Halaman Alumni   */
/* ======================================= */

/* Style untuk Tab */
.nav-pills-alumni {
    gap: 0.5rem; /* Memberi jarak antar tombol tab */
}
.nav-pills-alumni .nav-link {
    border-radius: 0.375rem;
    background-color: #e9ecef;
    color: #495057;
    font-weight: 600;
}
.nav-pills-alumni .nav-link.active,
.nav-pills-alumni .show > .nav-link {
    color: #fff;
    background-color: #0d6efd;
    box-shadow: 0 0.25rem 0.75rem rgba(13, 110, 253, 0.3);
}

/* Style untuk kartu pengurus */
.card-pengurus-alumni {
    border: 1px solid #e9ecef;
    box-shadow: 0 0.125rem 0.25rem rgba(0,0,0,0.05);
    transition: all 0.3s ease;
}
.card-pengurus-alumni:hover {
    transform: translateY(-5px);
    box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.1);
    border-color: #0d6efd;
}

/* Style untuk tabel pengurus */
.table-alumni th {
    font-weight: 600;
}
.table-alumni td, .table-alumni th {
    font-size: 0.9rem; /* Ukuran font di dalam tabel */
    white-space: nowrap; /* Mencegah teks turun baris */
}

/* ======================================= */
/* (TAMBAHAN) Revisi Halaman Detail Kajian */
/* ======================================= */

.kajian-detail-header .meta-info {
    font-size: 0.8rem; /* Ukuran font ustadz & tanggal */
}

/* Aturan khusus untuk mobile */
@media (max-width: 991.98px) {
    .kajian-detail-header .h3 {
        font-size: 1.65rem; /* Perkecil judul di mobile */
    }
    .sidebar-kajian {
        margin-top: 3rem !important; /* Jarak 3rem (48px) di mobile */
    }
}

/* Aturan tambahan khusus untuk mobile */
@media (max-width: 767.98px) {
    .page-content {
        font-size: 0.9rem; /* Ganti angka ini untuk memperkecil/memperbesar di mobile */
    }
}

/* ======================================= */
/* (TAMBAHAN) Style Halaman Kurikulum      */
/* ======================================= */
.card-kurikulum {
    border: 1px solid #dee2e6; /* Border abu-abu yang jelas */
    transition: all 0.3s ease;
}
.card-kurikulum:hover {
    border-color: #0d6efd;
    box-shadow: 0 0.5rem 1rem rgba(0,0,0,0.1) !important;
    transform: translateY(-3px);
}

/* Style baru untuk judul kartu kurikulum */
.card-kurikulum .h4.fw-bold {
    padding: 0.3rem 0.7rem; /* Padding di sekitar teks */
    border-radius: 0.3rem; /* Sedikit lengkungan */
    display: inline-block; /* Agar background hanya selebar teks */
}