/* ==========================================================
   Rumah Jurnal UNISBANK — HTML5 + Bootstrap 5 + jQuery
   Palet: Unisbank Maroon & Academic Gold
   ========================================================== */
:root{
  --maroon:#800d2f;
  --maroon-deep:#52061d;
  --maroon-dark:#380312;
  --maroon-surface:#9b143c;
  --maroon-light:#fcf4f6;
  --gold:#c98a2c;
  --gold-hover:#b57923;
  --gold-light:#fdf6ea;
  --ink:#334155;
}
html{scroll-behavior:smooth}
body{
  font-family:"Plus Jakarta Sans",-apple-system,"Segoe UI",Roboto,sans-serif;
  color:var(--ink);
  background:#fbfbfb;
}
.font-academic{font-family:"Playfair Display",Georgia,serif;letter-spacing:-.015em}
.text-maroon{color:var(--maroon)!important}
.text-gold{color:var(--gold)!important}
.bg-maroon{background-color:var(--maroon)!important}
.bg-maroon-deep{background-color:var(--maroon-deep)!important}
.bg-maroon-dark{background-color:var(--maroon-dark)!important}
.bg-maroon-light{background-color:var(--maroon-light)!important}
.bg-gold{background-color:var(--gold)!important}
.btn-maroon{background-color:var(--maroon);border-color:var(--maroon);color:#fff}
.btn-maroon:hover{background-color:var(--maroon-surface);border-color:var(--maroon-surface);color:#fff}
.btn-gold{background-color:var(--gold);border-color:var(--gold);color:#fff}
.btn-gold:hover{background-color:var(--gold-hover);border-color:var(--gold-hover);color:#fff}
.btn-outline-maroon{border:1px solid var(--maroon);color:var(--maroon)}
.btn-outline-maroon:hover{background:var(--maroon);color:#fff}

/* Header */
.topbar{background:var(--maroon-dark);color:#e2e8f0;font-size:.72rem}
.navbar-unisbank{background:#fff;border-bottom:1px solid #f1f5f9}
.navbar-unisbank .nav-link{font-size:.8rem;font-weight:600;letter-spacing:.02em;color:#475569}
.navbar-unisbank .nav-link:hover,.navbar-unisbank .nav-link.active{color:var(--maroon)}
.brand-logo{height:44px;width:auto}

/* Hero */
.hero-wrap{background:linear-gradient(180deg,#f8fafc 0%,#fff 60%,#f8fafc 100%);border-bottom:1px solid #f1f5f9}
.hero-badge{background:var(--maroon-light);border:1px solid rgba(128,13,47,.18);color:var(--maroon);
  font-size:.68rem;font-weight:700;letter-spacing:.08em}
.hero-banner{border:1px solid rgba(128,13,47,.18);box-shadow:0 25px 50px -12px rgba(56,3,18,.35)}
.hero-banner img{width:100%;height:auto;display:block}
.dot-live{width:8px;height:8px;border-radius:50%;background:#10b981;display:inline-block;animation:pulse 1.6s infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}
.action-bar{background:#fff;border:1px solid #e2e8f0;box-shadow:0 10px 30px -12px rgba(15,23,42,.18)}

/* Pillar */
.pillar-card{background:#fff;border:1px solid #f1f5f9;box-shadow:0 10px 30px -12px rgba(15,23,42,.12);transition:.2s}
.pillar-card:hover{transform:translateY(-3px);box-shadow:0 18px 40px -12px rgba(128,13,47,.18)}
.pillar-icon{width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.pillar-icon.maroon{background:var(--maroon);color:#fff}
.pillar-icon.gold{background:var(--gold);color:#fff}

/* Journal cards */
.filter-pill{border:1px solid #e2e8f0;background:#fff;color:#64748b;font-size:.75rem;font-weight:600}
.filter-pill:hover{color:var(--maroon);border-color:var(--maroon)}
.filter-pill.active{background:var(--maroon);border-color:var(--maroon);color:#fff}
.journal-card{background:#fff;border:1px solid #e7eaf0;transition:.25s;cursor:pointer;overflow:hidden}
.journal-card:hover{transform:translateY(-6px);box-shadow:0 22px 45px -14px rgba(56,3,18,.28);border-color:rgba(201,138,44,.5)}
.journal-cover-box{background:#f1f5f9;padding:1rem;display:flex;align-items:center;justify-content:center}
.journal-cover{position:relative;width:100%;aspect-ratio:3/4;border-radius:.4rem;overflow:hidden;box-shadow:0 8px 20px rgba(0,0,0,.25)}
.journal-cover img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.journal-card:hover .journal-cover img{transform:scale(1.05)}
.sinta-badge{position:absolute;top:8px;right:8px;background:var(--gold);color:var(--maroon-dark);
  font-size:.62rem;font-weight:800;padding:.15rem .5rem;border-radius:.35rem;border:1px solid #f5d78e;
  display:inline-flex;align-items:center;gap:.2rem}
.cat-label{color:var(--gold);font-size:.62rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase}

/* Stats */
.stats-band{background:linear-gradient(120deg,var(--maroon-dark),var(--maroon) 60%,var(--maroon-deep));border-top:1px solid var(--maroon-surface);border-bottom:1px solid var(--maroon-surface)}
.stat-val{font-family:"Playfair Display",Georgia,serif;font-weight:700;font-size:1.7rem;color:#fff}
.stat-lbl{font-size:.72rem;color:#cbd5e1}

/* Steps */
.step-card{background:#f8fafc;border:1px solid #e7eaf0;transition:.2s}
.step-card:hover{border-color:rgba(201,138,44,.55);box-shadow:0 12px 28px -12px rgba(15,23,42,.18)}
.step-num{font-family:"Playfair Display",Georgia,serif;font-weight:900;font-size:1.6rem;color:var(--gold)}
.step-icon{width:40px;height:40px;border-radius:.6rem;background:rgba(128,13,47,.1);color:var(--maroon);
  display:flex;align-items:center;justify-content:center}
.template-banner{background:linear-gradient(90deg,var(--maroon),var(--maroon-surface) 60%,var(--maroon));border-radius:1rem}

/* News */
.news-card{background:#fff;border:1px solid #e7eaf0;transition:.25s;cursor:pointer;overflow:hidden}
.news-card:hover{transform:translateY(-4px);box-shadow:0 18px 38px -14px rgba(15,23,42,.22)}
.news-img{height:176px;overflow:hidden;background:#e2e8f0;position:relative}
.news-img img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.news-card:hover .news-img img{transform:scale(1.06)}
.date-badge{position:absolute;top:12px;left:12px;background:var(--maroon);color:#fff;text-align:center;
  padding:.25rem .6rem;border-radius:.4rem;line-height:1.1;box-shadow:0 4px 10px rgba(0,0,0,.3)}
.date-badge small{font-size:.58rem;letter-spacing:.1em;color:#cbd5e1;font-weight:700}
.date-badge strong{font-size:.8rem}

/* Newsletter */
.newsletter-band{background:var(--maroon);border-top:1px solid var(--maroon-surface);border-bottom:1px solid var(--maroon-surface)}

/* Footer */
.footer-main{background:var(--maroon-dark);color:#94a3b8;font-size:.78rem}
.footer-main h6{color:#fff;font-size:.72rem;letter-spacing:.08em;font-weight:700}
.footer-main a{color:#94a3b8;text-decoration:none}
.footer-main a:hover{color:#fff}
.gold-dot{width:6px;height:6px;border-radius:50%;background:var(--gold);display:inline-block;flex-shrink:0}

/* Profile page */
.profile-hero{background:linear-gradient(100deg,var(--maroon) 0%,var(--maroon-surface) 55%,var(--maroon-dark) 100%)}
.campus-tab-btn{font-size:.75rem;font-weight:700}
.facility-card{background:#fff;border:1px solid #e7eaf0;transition:.25s;overflow:hidden}
.facility-card:hover{transform:translateY(-4px);box-shadow:0 18px 38px -14px rgba(56,3,18,.25)}
.facility-img{height:190px;overflow:hidden;background:#e2e8f0;position:relative}
.facility-img img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.facility-card:hover .facility-img img{transform:scale(1.06)}
.tag-campus{position:absolute;top:10px;left:10px;background:rgba(128,13,47,.92);color:#fff;font-size:.6rem;
  font-weight:700;padding:.2rem .55rem;border-radius:.3rem;text-transform:uppercase;letter-spacing:.05em}
.tag-cat{position:absolute;top:10px;right:10px;background:var(--gold);color:var(--maroon-dark);font-size:.6rem;
  font-weight:800;padding:.2rem .55rem;border-radius:.3rem;text-transform:uppercase}
.faculty-card{background:#fff;border:1px solid #e7eaf0;transition:.2s}
.faculty-card:hover{border-color:rgba(201,138,44,.6);box-shadow:0 14px 30px -12px rgba(15,23,42,.2)}

/* Modal */
.modal-header-maroon{background:linear-gradient(90deg,var(--maroon),var(--maroon-surface));color:#fff}
.scope-chip{background:#f1f5f9;border:1px solid #e2e8f0;font-size:.7rem;color:#475569}
.role-tab{font-size:.75rem;font-weight:700;color:#64748b}
.role-tab.active{background:#fff;color:var(--maroon);box-shadow:0 1px 4px rgba(0,0,0,.12)}

/* Back to top */
#backTop{position:fixed;right:18px;bottom:18px;z-index:1050;display:none;width:42px;height:42px;border-radius:50%;
  background:var(--maroon);color:#fff;border:none;box-shadow:0 8px 20px rgba(0,0,0,.3)}
#backTop:hover{background:var(--maroon-surface)}
#backTop.show{display:block}

.breadcrumb-bar{background:#f1f5f9;border-bottom:1px solid #e2e8f0;font-size:.75rem}
.section-eyebrow{color:var(--gold);font-size:.7rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase}