/* =====================================================================
   Repository Universitas Muhammadiyah Jember (Unmuh Jember)
   Override desain Medilab + EPrints. Dimuat TERAKHIR dari default.xml.
   Warna identitas: navy #081d51 (header) bergradasi, aksen biru langit #3a9ad6.
   ===================================================================== */

:root {
  --ust-teal: #1a367c;
  --ust-teal-light: #2c4fa6;
  --ust-teal-dark: #0e2358;
  --ust-teal-deep: #0b1a40;
  --ust-ink: #161c2c;
  --ust-muted: #5e636f;
  --ust-tint: #ebeef5;
  --ust-line: #d8ddea;
  --ust-gradient: linear-gradient(135deg, #1a367c 0%, #2c4fa6 100%);
  --ust-gradient-dark: linear-gradient(135deg, #0b1a40 0%, #0f255d 45%, #14317b 100%);
  --ust-shadow-sm: 0 4px 14px rgba(10,25,62, 0.08);
  --ust-shadow: 0 14px 40px rgba(10,25,62, 0.14);
  --ust-shadow-lg: 0 24px 60px rgba(8,20,52, 0.22);
  --ust-radius: 20px;
  --ust-ease: cubic-bezier(0.22, 0.61, 0.36, 1);

  /* Variabel tema Medilab */
  --default-font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  --heading-font: "Poppins", "Inter", system-ui, sans-serif;
  --nav-font: "Poppins", "Inter", system-ui, sans-serif;
  --default-color: #414651;
  --accent-color: #1a367c;
  --heading-color: #151e35;
  --nav-color: #151e35;
  --nav-hover-color: #2c4fa6;
  --nav-dropdown-color: #151e35;
  --nav-dropdown-hover-color: #2c4fa6;
}

/* =====================================================================
   v20 - LAPISAN DASAR MANDIRI (pengganti main.css / bootstrap / bootstrap-icons)
   Template tetap rapi di HP walau file vendor di server tidak ada / beda versi.
   Nilai disamakan dengan Bootstrap 5 + Medilab, jadi aman bila vendor juga termuat.
   ===================================================================== */
:root {
  --background-color: #ffffff; --surface-color: #ffffff; --contrast-color: #ffffff;
  --nav-mobile-background-color: #ffffff; --nav-dropdown-background-color: #ffffff;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
html, body { max-width: 100%; overflow-x: hidden; }
@supports (overflow: clip) { html, body { overflow-x: clip; } }
body { margin: 0; color: var(--default-color); background: #fff; font-family: var(--default-font); font-size: 16px; line-height: 1.5; }
h1, h2, h3, h4, h5, h6 { color: var(--heading-color); font-family: var(--heading-font); margin-top: 0; margin-bottom: .5rem; line-height: 1.2; }
p { margin-top: 0; margin-bottom: 1rem; }
img, svg { vertical-align: middle; }
img { max-width: 100%; }
a { color: var(--accent-color); }
button, input, textarea, select { font: inherit; }

/* ---- Grid & utilitas (subset Bootstrap 5) ---- */
.container { --bs-gutter-x: 1.5rem; width: 100%; padding-right: calc(var(--bs-gutter-x) * .5); padding-left: calc(var(--bs-gutter-x) * .5); margin-right: auto; margin-left: auto; }
@media (min-width: 576px)  { .container { max-width: 540px; } }
@media (min-width: 768px)  { .container { max-width: 720px; } }
@media (min-width: 992px)  { .container { max-width: 960px; } }
@media (min-width: 1200px) { .container { max-width: 1140px; } }
@media (min-width: 1400px) { .container { max-width: 1320px; } }
.row { --bs-gutter-x: 1.5rem; --bs-gutter-y: 0; display: flex; flex-wrap: wrap; margin-top: calc(-1 * var(--bs-gutter-y)); margin-right: calc(-.5 * var(--bs-gutter-x)); margin-left: calc(-.5 * var(--bs-gutter-x)); }
.row > * { flex-shrink: 0; width: 100%; max-width: 100%; padding-right: calc(var(--bs-gutter-x) * .5); padding-left: calc(var(--bs-gutter-x) * .5); margin-top: var(--bs-gutter-y); }
.g-4 { --bs-gutter-x: 1.5rem; --bs-gutter-y: 1.5rem; }
.gy-4 { --bs-gutter-y: 1.5rem; }
.gy-5 { --bs-gutter-y: 3rem; }
.col-6 { flex: 0 0 auto; width: 50%; }
@media (min-width: 768px) {
  .col-md-3 { flex: 0 0 auto; width: 25%; } .col-md-4 { flex: 0 0 auto; width: 33.33333%; }
  .col-md-6 { flex: 0 0 auto; width: 50%; } .col-md-12 { flex: 0 0 auto; width: 100%; }
}
@media (min-width: 992px) {
  .col-lg-2 { flex: 0 0 auto; width: 16.66667%; } .col-lg-3 { flex: 0 0 auto; width: 25%; }
  .col-lg-4 { flex: 0 0 auto; width: 33.33333%; } .col-lg-6 { flex: 0 0 auto; width: 50%; }
  .col-lg-8 { flex: 0 0 auto; width: 66.66667%; }
  .gx-lg-5 { --bs-gutter-x: 3rem; }
}
.d-none { display: none !important; }
.d-flex { display: flex !important; }
@media (min-width: 576px)  { .d-sm-flex { display: flex !important; } }
@media (min-width: 768px)  { .d-md-flex { display: flex !important; } }
@media (min-width: 1200px) { .d-xl-none { display: none !important; } }
.align-items-center { align-items: center !important; }
.justify-content-between { justify-content: space-between !important; }
.justify-content-center { justify-content: center !important; }
.position-relative { position: relative !important; }
.sticky-top { position: sticky; top: 0; z-index: 1020; }
.me-auto { margin-right: auto !important; }
.mt-4 { margin-top: 1.5rem !important; }
.mt-5 { margin-top: 3rem !important; }
.text-center { text-align: center !important; }
.img-fluid { max-width: 100%; height: auto; }

/* ---- Section & hero (Medilab) ---- */
section, .section { color: var(--default-color); background-color: var(--background-color); padding: 60px 0; scroll-margin-top: 100px; overflow: clip; }
.hero { width: 100%; position: relative; display: flex; align-items: center; justify-content: center; overflow: hidden; }
.hero > img, .hero > #hp img { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: cover; z-index: 1; }
.hero .container, .ust-cta .container { position: relative; }

/* ---- Header (Medilab) ---- */
.header { color: var(--default-color); background: #fff; transition: all 0.5s; z-index: 997; }
.header .topbar { color: #fff; font-size: 14px; }
.header .topbar .container { height: 100%; }
.header .branding { position: relative; }
.header .logo { line-height: 1; text-decoration: none; }
.header .logo img { max-height: 36px; }
.header .cta-btn, .header .cta-btn:focus { color: #fff; border-radius: 50px; margin: 0 0 0 30px; transition: 0.3s; text-decoration: none; }
@media (max-width: 1199px) {
  .header .cta-btn { order: 2; margin: 0 15px 0 0; padding: 8px 16px; }
  .header .navmenu { order: 3; }
}

/* ---- Menu desktop ---- */
.navmenu ul { list-style: none; margin: 0; padding: 0; }
@media (min-width: 1200px) {
  .navmenu { padding: 0; }
  .navmenu ul { display: flex; align-items: center; }
  .navmenu li { position: relative; }
  .navmenu > ul > li { white-space: nowrap; padding: 15px 14px; }
  .navmenu a, .navmenu a:focus { color: var(--nav-color); padding: 0 2px; font-family: var(--nav-font); display: flex; align-items: center; white-space: nowrap; transition: 0.3s; position: relative; text-decoration: none; }
  .navmenu .dropdown ul { margin: 0; padding: 10px 0; background: var(--nav-dropdown-background-color); display: block; position: absolute; visibility: hidden; left: 14px; top: 130%; opacity: 0; transition: 0.3s; border-radius: 4px; z-index: 99; box-shadow: 0 0 30px rgba(0,0,0,0.1); }
  .navmenu .dropdown ul li { min-width: 200px; }
  .navmenu .dropdown ul a { padding: 10px 20px; font-size: 15px; color: var(--nav-dropdown-color); }
  .navmenu .dropdown:hover > ul { opacity: 1; top: 100%; visibility: visible; }
}

/* ---- Menu HP/tablet: tersembunyi, muncul sebagai panel putih saat tombol ditekan ---- */
@media (max-width: 1199px) {
  .mobile-nav-toggle { font-size: 28px; line-height: 0; margin-right: 0; cursor: pointer; transition: color 0.3s; }
  .navmenu { padding: 0; z-index: 9997; }
  .navmenu ul { display: none; position: absolute; inset: 72px 16px 16px 16px; padding: 10px 0; margin: 0; border-radius: 16px; background-color: var(--nav-mobile-background-color); overflow-y: auto; transition: 0.3s; z-index: 9998; box-shadow: 0 0 30px rgba(0,0,0,0.1); }
  .navmenu a, .navmenu a:focus { color: var(--nav-dropdown-color); padding: 10px 20px; font-family: var(--nav-font); font-size: 16px; font-weight: 500; display: flex; align-items: center; white-space: nowrap; transition: 0.3s; text-decoration: none; }
  .navmenu .toggle-dropdown { width: 30px; height: 30px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: #ebeef5; transition: 0.3s; flex-shrink: 0; }
  .navmenu a.active .toggle-dropdown { background: #1a367c; color: #fff; transform: rotate(180deg); }
  .navmenu .dropdown ul { position: static; display: none; z-index: 99; padding: 10px 0; margin: 10px 20px; background-color: #f6f7fb; border: 1px solid #e4e7ee; box-shadow: none; inset: auto; }
  .navmenu .dropdown > .dropdown-active { display: block; }
  .mobile-nav-active { overflow: hidden; }
  .mobile-nav-active .mobile-nav-toggle { color: #fff; position: absolute; font-size: 32px; top: 18px; right: 18px; margin-right: 0; z-index: 9999; }
  .mobile-nav-active .navmenu { position: fixed; overflow: hidden; inset: 0; transition: 0.3s; }
  .mobile-nav-active .navmenu > ul { display: block; }
}

/* ---- Ikon hamburger, X, dan panah dropdown: SVG bawaan (tidak butuh bootstrap-icons) ---- */
.mobile-nav-toggle, .toggle-dropdown { font-style: normal; }
.mobile-nav-toggle::before, .toggle-dropdown::before {
  content: "" !important; display: inline-block; width: 1em; height: 1em; background-color: currentColor;
  -webkit-mask: var(--ust-mask) center / contain no-repeat; mask: var(--ust-mask) center / contain no-repeat;
}
.mobile-nav-toggle { --ust-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M4 7h16M4 12h16M4 17h16'/%3E%3C/svg%3E"); }
.mobile-nav-toggle.bi-x, .mobile-nav-active .mobile-nav-toggle { --ust-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E"); }
.toggle-dropdown { font-size: 12px; --ust-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); }

/* ---- Footer (Medilab) ---- */
.footer { font-size: 14px; position: relative; padding-bottom: 10px; }
.footer .footer-links ul { list-style: none; padding: 0; margin: 0; }
.footer .social-links { gap: 10px; }
.footer .social-links a { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(255,255,255,0.3); font-size: 16px; transition: 0.3s; }
.footer .copyright { padding: 25px 0; }
/* ===================== AKHIR LAPISAN DASAR v20 ===================== */

.light-background { --background-color: var(--ust-tint); --surface-color: #ffffff; }

body { -webkit-font-smoothing: antialiased; }
a { text-decoration: none; }
.custom-container { background: #ffffff; }

/* ---------- Ikon SVG ---------- */
.ust-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
.ic {
  width: 1em; height: 1em;
  display: inline-block; flex-shrink: 0; vertical-align: -0.125em;
  fill: none; stroke: currentColor; stroke-width: 2;
  stroke-linecap: round; stroke-linejoin: round;
}

/* ---------- Kicker & judul section ---------- */
.ust-kicker {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--heading-font); font-weight: 600;
  font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase;
  color: #e1e7f7; margin-bottom: 12px;
}
.ust-kicker::before { content: ""; width: 26px; height: 2px; border-radius: 2px; background: currentColor; }
.ust-kicker.dark { color: var(--ust-teal); }

.ust-section-head { text-align: center; max-width: 640px; margin: 0 auto 44px; }
.ust-section-head h2 {
  font-size: clamp(26px, 4vw, 36px); font-weight: 700; margin: 0 0 10px;
}
.ust-section-sub { color: var(--ust-muted); font-size: 16px; }

/* ---------- Tombol umum ---------- */
.ust-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  padding: 13px 26px; border-radius: 999px; border: 0;
  font-family: var(--heading-font); font-weight: 600; font-size: 15px;
  cursor: pointer; position: relative; overflow: hidden;
  transition: transform 0.3s var(--ust-ease), box-shadow 0.3s var(--ust-ease), background 0.3s, color 0.3s;
}
.ust-btn .ic { font-size: 18px; transition: transform 0.3s var(--ust-ease); }
.ust-btn:hover { transform: translateY(-3px); }
.ust-btn:hover .ic:last-child { transform: translateX(4px); }
.ust-btn::after { /* kilau saat hover */
  content: ""; position: absolute; top: 0; left: -120%; width: 60%; height: 100%;
  background: linear-gradient(120deg, transparent, rgba(255,255,255,0.45), transparent);
  transform: skewX(-20deg); transition: left 0.7s var(--ust-ease);
}
.ust-btn:hover::after { left: 140%; }
.ust-btn-primary { background: var(--ust-gradient); color: #fff; box-shadow: 0 10px 24px rgba(26,54,124, 0.3); }
.ust-btn-primary:hover { color: #fff; box-shadow: 0 16px 32px rgba(26,54,124, 0.38); }
.ust-btn-light { background: #fff; color: var(--ust-teal-dark); box-shadow: 0 12px 30px rgba(4,10,26, 0.25); }
.ust-btn-light:hover { color: var(--ust-teal); }
.ust-btn-ghost { background: rgba(255,255,255,0.08); color: #fff; border: 1.5px solid rgba(255,255,255,0.55); }
.ust-btn-ghost:hover { background: #fff; color: var(--ust-teal-dark); }
.ust-btn-soft { background: var(--ust-tint); color: var(--ust-teal-dark); }
.ust-btn-soft:hover { background: #dce1ee; color: var(--ust-teal-dark); }
.ust-btn-soft:hover .ic { transform: rotate(-120deg); }

/* =====================================================================
   HEADER
   ===================================================================== */
.header { box-shadow: 0 1px 0 rgba(11,27,69, 0.06); }
.header .topbar { background: var(--ust-gradient-dark); height: 42px; }
.ust-topbar-link {
  display: inline-flex; align-items: center; gap: 8px;
  color: #fff; font-size: 13.5px; font-weight: 500;
  padding: 5px 12px; border-radius: 999px; transition: background 0.3s;
}
.ust-topbar-link .ic { font-size: 16px; }
.ust-topbar-link:hover { color: #fff; background: rgba(255,255,255,0.15); }
.ust-topbar-social { gap: 6px; }
.ust-topbar-social a {
  width: 30px; height: 30px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  color: rgba(255,255,255,0.85); transition: all 0.3s var(--ust-ease);
}
.ust-topbar-social a .ic { font-size: 15px; }
.ust-topbar-social a:hover { background: #fff; color: var(--ust-teal); transform: translateY(-2px); }

/* tanpa backdrop-filter: filter membuat overlay menu mobile (position:fixed) terkunci di header */
.header .branding { min-height: 92px; padding: 14px 0; background: #ffffff; }
.header .logo img { max-height: 62px; width: auto; margin-right: 8px; transition: transform 0.3s var(--ust-ease); }
.header .logo:hover img { transform: scale(1.03); }
.scrolled .header { box-shadow: 0 8px 30px rgba(8,20,52, 0.1); }

.header .cta-btn, .header .cta-btn:focus {
  display: inline-flex; align-items: center; gap: 8px;
  background: var(--ust-gradient); color: #fff;
  font-family: var(--heading-font); font-weight: 600; font-size: 14px;
  padding: 11px 22px; box-shadow: 0 8px 20px rgba(26,54,124, 0.28);
}
.header .cta-btn .ic { font-size: 17px; }
.header .cta-btn:hover, .cta-btn:hover {
  background: var(--ust-gradient-dark) !important; color: #fff;
  transform: translateY(-2px); box-shadow: 0 12px 26px rgba(14,34,86, 0.35);
}

@media (min-width: 1200px) {
  .navmenu a, .navmenu a:focus { font-weight: 500; font-size: 15px; }
  .navmenu .dropdown ul { border-radius: 14px; padding: 10px; box-shadow: var(--ust-shadow); border: 1px solid var(--ust-line); }
  .navmenu .dropdown ul a { border-radius: 10px; padding: 10px 14px; transition: all 0.25s; }
  .navmenu .dropdown ul a:hover { background: var(--ust-tint); padding-left: 18px; }
}

@media (max-width: 1199px) {
  .header .branding { min-height: 80px; padding: 10px 0; }
  .header .logo img { max-height: 52px; }
  .mobile-nav-toggle { color: var(--ust-teal-dark); }
  .mobile-nav-active .mobile-nav-toggle { color: #fff; }
  .navmenu ul { inset: 72px 16px 16px 16px; border-radius: 16px; }
  .mobile-nav-active .navmenu { background: rgba(6,14,34, 0.75); backdrop-filter: blur(4px); }
  .navmenu a, .navmenu a:focus { font-size: 16px; }
}
@media (max-width: 575px) {
  .header .topbar { height: 38px; }
  .header .branding { min-height: 72px; }
  .header .logo img { max-height: 44px; max-width: 200px; object-fit: contain; }
}

/* =====================================================================
   HERO
   ===================================================================== */
.hero { position: relative; padding: 90px 0 100px; }
.awal { display: block; }
#hp { display: none; }
@media screen and (max-width: 768px) {
  .awal { display: none; }
  #hp { display: block; }
}

.hero .hero-overlay {
  position: absolute; inset: 0; z-index: 2; font-size: 0;
  background:
    radial-gradient(circle at 15% 20%, rgba(44,79,166, 0.55), transparent 50%),
    radial-gradient(circle at 85% 90%, rgba(44,79,166, 0.35), transparent 45%),
    linear-gradient(135deg, rgba(11,26,64, 0.92) 0%, rgba(15,38,95, 0.82) 50%, rgba(21,52,129, 0.7) 100%);
}
.net-canvas {
  position: absolute; inset: 0; width: 100%; height: 100%;
  z-index: 2; pointer-events: none; display: block;
}
.hero .container { z-index: 3; }

.hero .welcome h2, .hero .welkom {
  color: #fff; font-size: clamp(30px, 5vw, 50px); font-weight: 800;
  line-height: 1.15; letter-spacing: -0.01em; margin: 0 0 14px; max-width: 820px;
  text-shadow: 0 2px 18px rgba(0, 0, 0, 0.18);
}
.hero .responsive-text { color: rgba(255,255,255,0.88); font-size: 18px; max-width: 640px; }

/* ---------- Pencarian dasar ---------- */
.ust-search {
  display: flex; flex-wrap: wrap; align-items: center; gap: 12px;
  margin-top: 30px; max-width: 760px;
}
.ust-search-form {
  position: relative; flex: 1 1 420px; max-width: 580px;
  display: flex; align-items: center;
  background: #fff; border-radius: 999px; padding: 6px;
  box-shadow: 0 16px 40px rgba(6,14,34, 0.25);
  transition: box-shadow 0.3s, transform 0.3s var(--ust-ease);
}
.ust-search-form:focus-within { box-shadow: 0 0 0 4px rgba(189,205,244, 0.45), 0 18px 44px rgba(6,14,34, 0.3); transform: translateY(-2px); }
.ust-search-ic { position: absolute; left: 22px; font-size: 19px; color: var(--ust-teal); pointer-events: none; }
.ust-search-form input[type="search"] {
  flex: 1; min-width: 0; border: 0; outline: none; background: transparent;
  padding: 12px 12px 12px 48px; font-size: 16px; color: var(--ust-ink);
}
.ust-search-form input::placeholder { color: #8d909d; }
.ust-search-btn {
  display: inline-flex; align-items: center; gap: 8px;
  border: 0; border-radius: 999px; padding: 12px 22px;
  background: var(--ust-gradient); color: #fff;
  font-family: var(--heading-font); font-weight: 600; font-size: 15px;
  cursor: pointer; transition: filter 0.3s, transform 0.3s var(--ust-ease);
}
.ust-search-btn .ic { font-size: 17px; transition: transform 0.3s var(--ust-ease); }
.ust-search-btn:hover { filter: brightness(1.08); }
.ust-search-btn:hover .ic { transform: translateX(3px); }

.ust-adv-btn {
  display: inline-flex; align-items: center; gap: 9px;
  padding: 14px 20px; border-radius: 999px;
  background: rgba(255,255,255,0.12); border: 1.5px solid rgba(255,255,255,0.45);
  color: #fff; font-family: var(--heading-font); font-weight: 600; font-size: 14.5px;
  backdrop-filter: blur(6px); transition: all 0.3s var(--ust-ease);
}
.ust-adv-btn .ic { font-size: 18px; transition: transform 0.4s var(--ust-ease); }
.ust-adv-btn:hover { background: #fff; color: var(--ust-teal-dark); transform: translateY(-2px); }
.ust-adv-btn:hover .ic { transform: rotate(90deg); }

/* ---------- Kartu Unggah Mandiri ---------- */
.hero .content { margin-top: 44px; }
.ust-upload-card {
  position: relative; overflow: hidden; width: 100%;
  padding: 32px 30px; border-radius: var(--ust-radius); color: #fff;
  background: linear-gradient(150deg, rgba(9,21,53, 0.92), rgba(17,41,103, 0.88));
  border: 1px solid rgba(255,255,255,0.18);
  box-shadow: var(--ust-shadow-lg);
  transition: transform 0.4s var(--ust-ease), box-shadow 0.4s;
}
.ust-upload-card::before, .ust-upload-card::after {
  content: ""; position: absolute; border-radius: 50%; pointer-events: none;
  background: radial-gradient(circle, rgba(189,205,244,0.28), transparent 70%);
}
.ust-upload-card::before { width: 260px; height: 260px; right: -90px; top: -90px; transition: transform 0.6s var(--ust-ease); }
.ust-upload-card::after { width: 180px; height: 180px; left: -60px; bottom: -80px; }
.ust-upload-card:hover { transform: translateY(-6px); }
.ust-upload-card:hover::before { transform: scale(1.25); }
.ust-upload-icon {
  width: 58px; height: 58px; border-radius: 16px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,0.14); border: 1px solid rgba(255,255,255,0.25);
  font-size: 28px; margin-bottom: 20px;
  animation: ust-float 4s ease-in-out infinite;
}
.ust-upload-card h3 { color: #fff; font-size: 28px; font-weight: 700; margin: 0 0 10px; }
.ust-upload-text { color: rgba(255,255,255,0.85); font-size: 15px; line-height: 1.65; margin-bottom: 26px; position: relative; z-index: 1; }
.ust-upload-actions { display: flex; flex-wrap: wrap; gap: 10px; position: relative; z-index: 1; }
.ust-pill {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 10px 16px; border-radius: 999px; background: #fff; color: var(--ust-teal-dark);
  font-family: var(--heading-font); font-weight: 600; font-size: 14px;
  transition: all 0.3s var(--ust-ease);
}
.ust-pill .ic { font-size: 17px; }
.ust-pill .ust-pill-arrow { font-size: 15px; transition: transform 0.3s var(--ust-ease); }
.ust-pill:hover { background: #e1e7f7; color: var(--ust-teal-deep); transform: translateY(-2px); box-shadow: 0 10px 20px rgba(0,0,0,0.18); }
.ust-pill:hover .ust-pill-arrow { transform: translateX(4px); }

/* ---------- Kartu jelajah ---------- */
.ust-browse-card {
  position: relative; overflow: hidden; width: 100%;
  display: flex; flex-direction: column; gap: 18px;
  padding: 28px 24px; border-radius: var(--ust-radius);
  background: rgba(255,255,255,0.95); color: var(--default-color);
  border: 1px solid rgba(255,255,255,0.7);
  box-shadow: var(--ust-shadow);
  transition: transform 0.4s var(--ust-ease), box-shadow 0.4s;
}
.ust-browse-card::before { /* garis gradasi atas */
  content: ""; position: absolute; left: 0; top: 0; height: 4px; width: 0;
  background: var(--ust-gradient); transition: width 0.5s var(--ust-ease);
}
.ust-browse-card::after { /* lingkaran dekorasi */
  content: ""; position: absolute; width: 140px; height: 140px; right: -50px; bottom: -60px;
  border-radius: 50%; background: var(--ust-tint); transition: transform 0.5s var(--ust-ease); z-index: 0;
}
.ust-browse-card:hover { transform: translateY(-8px); box-shadow: var(--ust-shadow-lg); color: var(--default-color); }
.ust-browse-card:hover::before { width: 100%; }
.ust-browse-card:hover::after { transform: scale(1.6); }
.ust-browse-icon {
  position: relative; z-index: 1;
  width: 56px; height: 56px; border-radius: 16px;
  display: flex; align-items: center; justify-content: center;
  background: var(--ust-gradient); color: #fff; font-size: 26px;
  box-shadow: 0 10px 22px rgba(26,54,124, 0.3);
  transition: transform 0.4s var(--ust-ease);
}
.ust-browse-card:hover .ust-browse-icon { transform: rotate(-8deg) scale(1.08); }
.ust-browse-body { position: relative; z-index: 1; display: flex; flex-direction: column; flex: 1; }
.ust-browse-card h4 { font-size: 19px; font-weight: 700; margin: 0 0 8px; line-height: 1.3; color: var(--heading-color); }
.ust-browse-desc { font-size: 14.5px; line-height: 1.6; color: var(--ust-muted); flex: 1; }
.ust-browse-link {
  display: inline-flex; align-items: center; gap: 6px; margin-top: 16px;
  font-family: var(--heading-font); font-weight: 600; font-size: 14px; color: var(--ust-teal);
}
.ust-browse-link .ic { transition: transform 0.3s var(--ust-ease); }
.ust-browse-card:hover .ust-browse-link .ic { transform: translateX(5px); }

@media (min-width: 992px) and (max-width: 1199px) {
  .ust-browse-card { padding: 24px 18px; }
  .ust-browse-card h4 { font-size: 17px; }
}
@media (max-width: 767px) {
  .hero { padding: 56px 0 64px; min-height: auto; }
  .hero .responsive-text { font-size: 15px; }
  .ust-search { margin-top: 24px; }
  .ust-search-form { flex-basis: 100%; max-width: none; }
  .ust-search-btn span { display: none; }
  .ust-search-btn { padding: 12px 16px; }
  .ust-adv-btn { padding: 10px 16px; font-size: 13.5px; }
  .hero .content { margin-top: 32px; }
  .ust-upload-card { padding: 26px 22px; }
  .ust-upload-card h3 { font-size: 24px; }
  .ust-browse-card { flex-direction: row; align-items: flex-start; gap: 16px; padding: 20px; }
  .ust-browse-icon { width: 50px; height: 50px; font-size: 23px; }
  .ust-browse-link { margin-top: 10px; }
}

/* =====================================================================
   STATISTIK
   ===================================================================== */
.ust-stats {
  position: relative; background-color: #fff;
  background-image: radial-gradient(rgba(26,54,124, 0.12) 1px, transparent 1px);
  background-size: 22px 22px; padding: 80px 0;
}
.ust-stat {
  position: relative; overflow: hidden; height: 100%;
  text-align: center; padding: 36px 26px 30px;
  background: #fff; border-radius: 24px; border: 1px solid var(--ust-line);
  box-shadow: var(--ust-shadow-sm);
  transition: transform 0.4s var(--ust-ease), box-shadow 0.4s, border-color 0.4s;
}
.ust-stat:hover { transform: translateY(-8px); box-shadow: var(--ust-shadow); border-color: transparent; }
.ust-stat::before {
  content: ""; position: absolute; inset: 0; border-radius: inherit; padding: 1.5px;
  background: var(--ust-gradient); opacity: 0; transition: opacity 0.4s;
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
}
.ust-stat:hover::before { opacity: 1; }
.ust-stat-icon {
  position: relative; width: 72px; height: 72px; margin: 0 auto 20px;
  border-radius: 50%; display: flex; align-items: center; justify-content: center;
  background: var(--ust-gradient); color: #fff; font-size: 30px;
  box-shadow: 0 12px 26px rgba(26,54,124, 0.3);
}
.ust-stat-icon::after {
  content: ""; position: absolute; inset: -8px; border-radius: 50%;
  border: 2px dashed rgba(44,79,166, 0.45);
  animation: ust-spin 14s linear infinite;
}
.ust-stat:hover .ust-stat-icon::after { animation-duration: 4s; }
.ust-stat-num {
  font-family: var(--heading-font); font-weight: 800; line-height: 1;
  font-size: clamp(38px, 5vw, 50px); font-variant-numeric: tabular-nums;
  background: linear-gradient(135deg, #0d1f4d, #2c4fa6);
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
}
.ust-stat-label { font-family: var(--heading-font); font-weight: 700; font-size: 18px; color: var(--heading-color); margin-top: 8px; }
.ust-stat-desc { font-size: 14px; color: var(--ust-muted); margin-top: 4px; }
.ust-stat-bg {
  position: absolute; right: -18px; bottom: -18px; width: 120px; height: 120px;
  fill: none; stroke: var(--ust-teal); stroke-width: 1.2; opacity: 0.06;
  transition: transform 0.6s var(--ust-ease), opacity 0.4s;
}
.ust-stat:hover .ust-stat-bg { transform: rotate(-12deg) scale(1.15); opacity: 0.1; }

/* =====================================================================
   FAQ + VIDEO
   ===================================================================== */
.about { padding: 90px 0; }
.ust-video-thumb {
  position: relative; display: block; border-radius: 24px; overflow: hidden;
  box-shadow: var(--ust-shadow-lg); cursor: pointer;
}
.ust-video-thumb img { display: block; width: 100%; transition: transform 0.8s var(--ust-ease); }
.ust-video-shade {
  position: absolute; inset: 0; font-size: 0;
  background: linear-gradient(180deg, transparent 40%, rgba(7,17,43, 0.65));
  transition: background 0.4s;
}
.ust-video-thumb:hover img { transform: scale(1.06); }
.ust-video-thumb:hover .ust-video-shade { background: linear-gradient(180deg, rgba(8,20,52, 0.15), rgba(7,17,43, 0.7)); }
.ust-video-thumb .pulsating-play-btn {
  position: absolute; left: calc(50% - 47px); top: calc(50% - 47px); font-size: 0;
  background: radial-gradient(#2c4fa6 50%, rgba(44,79,166, 0.3) 52%);
}
.ust-video-label {
  position: absolute; left: 22px; bottom: 20px;
  display: inline-flex; align-items: center; gap: 8px;
  color: #fff; font-family: var(--heading-font); font-weight: 600; font-size: 15px;
  padding: 8px 16px; border-radius: 999px;
  background: rgba(255,255,255,0.16); backdrop-filter: blur(6px);
}

.about .content h3 { font-size: clamp(26px, 3.5vw, 34px); font-weight: 700; margin: 0 0 8px; }
.ust-faq-intro { color: var(--ust-muted); margin-bottom: 8px; }
.about .content ul.ust-faq { list-style: none; padding: 0; margin: 0 0 28px; }
.about .content ul.ust-faq li {
  display: flex; gap: 18px; align-items: flex-start;
  margin-top: 18px; padding: 20px; border-radius: 18px;
  background: #fff; border: 1px solid var(--ust-line);
  color: var(--ust-muted); line-height: 1.65; font-size: 15px;
  transition: transform 0.35s var(--ust-ease), box-shadow 0.35s, border-color 0.35s;
}
.about .content ul.ust-faq li:hover { transform: translateX(6px); box-shadow: var(--ust-shadow); border-color: transparent; }
.ust-faq-icon {
  width: 48px; height: 48px; border-radius: 14px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: var(--ust-tint); color: var(--ust-teal); font-size: 22px;
  transition: all 0.35s var(--ust-ease);
}
.about .content ul.ust-faq li:hover .ust-faq-icon { background: var(--ust-gradient); color: #fff; transform: rotate(-6deg); }
.about .content ul.ust-faq h5 { font-size: 17px; font-weight: 700; margin: 2px 0 6px; color: var(--heading-color); }

/* =====================================================================
   CALL TO ACTION
   ===================================================================== */
.ust-cta {
  position: relative; overflow: hidden; padding: 100px 0;
  background:
    radial-gradient(circle at 10% 20%, rgba(28,69,172, 0.35), transparent 45%),
    radial-gradient(circle at 90% 80%, rgba(44,79,166, 0.45), transparent 50%),
    linear-gradient(135deg, #0b1a40 0%, #102865 50%, #2c4fa6 100%);
  color: #fff;
}
.ust-cta .container { z-index: 3; }
.ust-cta-inner { max-width: 760px; margin: 0 auto; text-align: center; }
.ust-cta h2 { color: #fff; font-size: clamp(28px, 4.5vw, 44px); font-weight: 800; line-height: 1.2; margin: 0 0 16px; }
.ust-cta-text { color: rgba(255,255,255,0.85); font-size: 17px; line-height: 1.7; margin: 0 auto 34px; max-width: 620px; }
.ust-cta-actions { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; }
.ust-cta .ust-kicker { justify-content: center; }
@media (max-width: 575px) {
  .ust-cta { padding: 72px 0; }
  .ust-cta-text { font-size: 15.5px; }
  .ust-cta-actions .ust-btn { width: 100%; }
}

/* =====================================================================
   TUGAS AKHIR TERBARU
   ===================================================================== */
.services {
  padding: 90px 0;
  background:
    radial-gradient(circle at 0% 0%, rgba(44,79,166, 0.10), transparent 40%),
    radial-gradient(circle at 100% 100%, rgba(26,54,124, 0.10), transparent 40%),
    var(--ust-tint);
}
#fplatest.ust-latest-grid { display: block; padding: 0 !important; margin: 0 !important; background: transparent; }
/* Grid hanya untuk kartu buatan ust.js dan skeleton saat memuat */
#fplatest.ust-latest-grid.is-cards,
#fplatest.ust-latest-grid:has(> .ust-skel) {
  display: grid; gap: 22px;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr));
}

/* ---- Cadangan: merapikan output asli EPrints bila JS belum/tidak aktif ---- */
#fplatest:not(.is-cards) .ep_latest_tool_feeds { display: flex; justify-content: center; margin: 0 0 18px !important; }
#fplatest:not(.is-cards) .ep_latest_tool_feeds a {
  display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600;
  padding: 6px 14px; border-radius: 999px; background: #fff; border: 1px solid var(--ust-line);
}
#fplatest:not(.is-cards) .ep_latest_tool_feeds img { width: 14px; height: 14px; }
#fplatest:not(.is-cards) table { width: 100%; border-collapse: separate; border-spacing: 0 14px; margin: -14px 0 0 !important; }
#fplatest:not(.is-cards) tr { transition: transform 0.35s var(--ust-ease); }
#fplatest:not(.is-cards) tr:hover { transform: translateY(-3px); }
#fplatest:not(.is-cards) td {
  background: #fff; padding: 18px 16px; vertical-align: middle;
  border: 0 !important; border-top: 1px solid var(--ust-line) !important; border-bottom: 1px solid var(--ust-line) !important;
  font-size: 14.5px; line-height: 1.6; color: var(--default-color);
}
#fplatest:not(.is-cards) td:first-child {
  border-left: 1px solid var(--ust-line) !important; border-radius: 18px 0 0 18px;
  width: 64px; text-align: center; font: 700 15px var(--heading-font); color: var(--ust-teal);
}
#fplatest:not(.is-cards) td:last-child { border-right: 1px solid var(--ust-line) !important; border-radius: 0 18px 18px 0; white-space: nowrap; }
#fplatest:not(.is-cards) td:only-child { border-radius: 18px; }
#fplatest:not(.is-cards) td em { font-style: normal; font-weight: 600; font-family: var(--heading-font); color: var(--heading-color); }
#fplatest:not(.is-cards) td img { max-height: 46px; width: auto; border-radius: 6px; margin: 0 3px; }
#fplatest:not(.is-cards) .ep_search_result:not(tr) {
  display: flex; align-items: center; gap: 16px; margin-bottom: 14px; padding: 18px 20px;
  background: #fff; border: 1px solid var(--ust-line) !important; border-radius: 18px;
}
@media (max-width: 767px) {
  #fplatest:not(.is-cards) tr, #fplatest:not(.is-cards) td { display: block; }
  #fplatest:not(.is-cards) tr { background: #fff; border: 1px solid var(--ust-line); border-radius: 18px; margin-bottom: 14px; overflow: hidden; }
  #fplatest:not(.is-cards) td, #fplatest:not(.is-cards) td:first-child, #fplatest:not(.is-cards) td:last-child {
    border: 0 !important; border-radius: 0; width: auto; text-align: left; white-space: normal; padding: 10px 16px;
  }
}

/* Kartu tugas akhir (dibangun ust.js dari output latest_tool) */
.ust-ta-card {
  position: relative; display: flex; gap: 20px; align-items: stretch;
  padding: 24px; border-radius: 22px; background: #fff;
  border: 1px solid var(--ust-line); box-shadow: var(--ust-shadow-sm);
  overflow: hidden; color: var(--default-color);
  transition: transform 0.4s var(--ust-ease), box-shadow 0.4s, border-color 0.4s;
}
.ust-ta-card::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px;
  background: var(--ust-gradient); transform: scaleY(0); transform-origin: top;
  transition: transform 0.45s var(--ust-ease);
}
.ust-ta-card:hover { transform: translateY(-6px); box-shadow: var(--ust-shadow); border-color: transparent; }
.ust-ta-card:hover::before { transform: scaleY(1); }

.ust-ta-doc {
  position: relative; flex-shrink: 0; width: 64px; height: 80px; border-radius: 12px;
  display: flex; align-items: center; justify-content: center;
  background: linear-gradient(160deg, #e4e9f4, #cbd3e9); color: var(--ust-teal);
  font-size: 30px; transition: transform 0.4s var(--ust-ease);
}
.ust-ta-doc::after { /* lipatan sudut kertas */
  content: ""; position: absolute; right: 0; top: 0; width: 18px; height: 18px;
  background: linear-gradient(225deg, var(--ust-tint) 50%, #aeb9d5 50%); border-radius: 0 12px 0 6px;
}
.ust-ta-num {
  position: absolute; left: -6px; bottom: -6px; min-width: 26px; height: 26px; padding: 0 6px;
  border-radius: 999px; background: var(--ust-gradient); color: #fff;
  font: 700 12px/26px var(--heading-font); text-align: center; box-shadow: 0 4px 10px rgba(26,54,124,.35);
}
.ust-ta-card:hover .ust-ta-doc { transform: rotate(-5deg) scale(1.05); }

.ust-ta-body { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.ust-ta-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 10px; }
.ust-chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 4px 10px; border-radius: 999px; font-size: 12.5px; font-weight: 600;
  background: var(--ust-tint); color: var(--ust-teal-dark);
}
.ust-chip .ic { font-size: 14px; }
.ust-chip.is-type { background: #fff7e6; color: #9a5b00; }
.ust-ta-title {
  font-family: var(--heading-font); font-weight: 600; font-size: 16.5px; line-height: 1.45;
  color: var(--heading-color);
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
  transition: color 0.3s;
}
.ust-ta-card:hover .ust-ta-title { color: var(--ust-teal); }
.ust-ta-author {
  display: flex; align-items: center; gap: 8px; margin-top: 10px;
  font-size: 14px; color: var(--ust-muted); text-transform: capitalize;
}
.ust-ta-author .ic { font-size: 16px; color: var(--ust-teal); }
.ust-ta-inst { font-size: 13px; color: #8d909d; margin-top: 4px; }
.ust-ta-foot {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  margin-top: 16px; padding-top: 14px; border-top: 1px dashed var(--ust-line);
}
.ust-ta-files { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; color: var(--ust-muted); }
.ust-ta-files .ic { font-size: 15px; }
.ust-ta-more {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--heading-font); font-weight: 600; font-size: 13.5px; color: var(--ust-teal);
}
.ust-ta-more .ic { transition: transform 0.3s var(--ust-ease); }
.ust-ta-card:hover .ust-ta-more .ic { transform: translateX(5px); }
/* seluruh kartu bisa diklik */
.ust-ta-link { position: absolute; inset: 0; z-index: 1; font-size: 0; }

.ust-latest-empty {
  grid-column: 1 / -1; text-align: center; padding: 40px 20px; border-radius: 22px;
  background: #fff; border: 1px dashed var(--ust-line); color: var(--ust-muted);
}
.ust-latest-rss { text-align: center; margin-top: 18px; }
.ust-latest-rss a {
  display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600;
  padding: 6px 12px; border-radius: 999px; background: #fff; border: 1px solid var(--ust-line);
  transition: all 0.3s;
}

/* Skeleton saat memuat */
.ust-skel {
  display: flex; gap: 20px; padding: 24px; border-radius: 22px; background: #fff;
  border: 1px solid var(--ust-line);
}
.ust-skel-ic, .ust-skel-lines span {
  display: block; font-size: 0; border-radius: 10px;
  background: linear-gradient(90deg, #eef0f6 25%, #dde2ee 50%, #eef0f6 75%);
  background-size: 200% 100%; animation: ust-shimmer 1.4s linear infinite;
}
.ust-skel-ic { width: 64px; height: 80px; flex-shrink: 0; }
.ust-skel-lines { flex: 1; display: flex; flex-direction: column; gap: 12px; padding-top: 4px; }
.ust-skel-lines span { height: 14px; }
.ust-skel-lines span:nth-child(1) { width: 40%; }
.ust-skel-lines span:nth-child(2) { width: 95%; height: 18px; }
.ust-skel-lines span:nth-child(3) { width: 60%; }
@keyframes ust-shimmer { to { background-position: -200% 0; } }

@media (max-width: 575px) {
  .ust-ta-card { padding: 18px; gap: 14px; }
  .ust-ta-doc { width: 50px; height: 64px; font-size: 24px; }
  .ust-ta-title { font-size: 15.5px; }
}

/* =====================================================================
   MODAL (Advance Search & Video)
   ===================================================================== */
.ust-modal {
  position: fixed; inset: 0; z-index: 10050;
  display: flex; align-items: center; justify-content: center; padding: 20px;
  visibility: hidden; opacity: 0; transition: opacity 0.3s, visibility 0.3s;
}
.ust-modal.is-open { visibility: visible; opacity: 1; }
.ust-modal-backdrop { position: absolute; inset: 0; font-size: 0; background: rgba(4,10,26, 0.6); backdrop-filter: blur(5px); }
.ust-modal-dialog {
  position: relative; width: 100%; max-height: calc(100vh - 40px); overflow-y: auto;
  background: #fff; border-radius: 24px; box-shadow: 0 30px 80px rgba(3,7,17, 0.4);
  transform: translateY(24px) scale(0.96); transition: transform 0.4s var(--ust-ease);
}
.ust-modal.is-open .ust-modal-dialog { transform: none; }
.ust-modal-x {
  position: absolute; top: 14px; right: 14px; z-index: 2;
  width: 40px; height: 40px; border-radius: 50%; border: 0;
  display: flex; align-items: center; justify-content: center;
  background: var(--ust-tint); color: var(--ust-teal-dark); font-size: 20px;
  cursor: pointer; transition: all 0.3s var(--ust-ease);
}
.ust-modal-x:hover { background: var(--ust-teal); color: #fff; transform: rotate(90deg); }
body.ust-modal-lock { overflow: hidden; }

.ust-adv-dialog { max-width: 560px; padding: 30px; }
.ust-adv-head { display: flex; gap: 16px; align-items: center; margin-bottom: 24px; padding-right: 40px; }
.ust-adv-badge {
  width: 52px; height: 52px; border-radius: 16px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: var(--ust-gradient); color: #fff; font-size: 24px;
  box-shadow: 0 10px 22px rgba(26,54,124, 0.3);
}
.ust-adv-head h3 { font-size: 22px; font-weight: 700; margin: 0 0 2px; }
.ust-adv-sub { color: var(--ust-muted); font-size: 14px; }
.ust-field { display: block; margin-bottom: 18px; }
.ust-field-label {
  display: block; font-family: var(--heading-font); font-weight: 600; font-size: 13.5px;
  color: var(--heading-color); margin-bottom: 8px;
}
.ust-field-box {
  position: relative; display: flex; align-items: center; flex: 1;
  border: 1.5px solid var(--ust-line); border-radius: 14px; background: #f8f9fc;
  transition: border-color 0.25s, box-shadow 0.25s, background 0.25s;
}
.ust-field-box .ic { position: absolute; left: 14px; font-size: 18px; color: #7e8595; pointer-events: none; transition: color 0.25s; }
.ust-field-box input {
  width: 100%; border: 0; outline: none; background: transparent;
  padding: 13px 14px 13px 44px; font-size: 15px; color: var(--ust-ink);
  -moz-appearance: textfield;
}
.ust-field-box input::-webkit-outer-spin-button,
.ust-field-box input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.ust-field-box:hover { border-color: #bac2d7; }
.ust-field-box:focus-within { border-color: var(--ust-teal-light); background: #fff; box-shadow: 0 0 0 4px rgba(44,79,166, 0.15); }
.ust-field-box:focus-within .ic { color: var(--ust-teal); }
.ust-year-row { display: flex; align-items: center; gap: 10px; }
.ust-year-sep { color: var(--ust-muted); font-size: 13px; font-weight: 600; }
.ust-adv-error {
  font-size: 13.5px; color: #b42318; background: #fef3f2; border-radius: 10px;
  padding: 0 14px; max-height: 0; overflow: hidden; opacity: 0;
  transition: all 0.3s;
}
.ust-adv-error.is-show { max-height: 80px; opacity: 1; padding: 10px 14px; margin-bottom: 16px; }
.ust-adv-actions { display: flex; gap: 10px; justify-content: flex-end; margin-top: 8px; }
@media (max-width: 575px) {
  .ust-modal { padding: 12px; align-items: flex-end; }
  .ust-adv-dialog { padding: 24px 20px; border-radius: 22px; }
  .ust-adv-actions .ust-btn { flex: 1; padding: 12px 14px; white-space: nowrap; font-size: 14px; }
  .ust-adv-actions .ust-btn-soft { flex: 0 0 auto; }
  .ust-adv-head { gap: 12px; }
  .ust-adv-badge { width: 46px; height: 46px; font-size: 21px; }
  .ust-adv-head h3 { font-size: 19px; }
  .ust-year-sep { display: none; }
}

.ust-video-dialog { max-width: 960px; padding: 0; background: #000; overflow: visible; }
.ust-video-dialog .ust-modal-x { top: -52px; right: 0; background: rgba(255,255,255,0.15); color: #fff; }
.ust-video-dialog .ust-modal-x:hover { background: #fff; color: var(--ust-teal); }
.ust-video-frame { position: relative; padding-top: 56.25%; border-radius: 18px; overflow: hidden; font-size: 0; }
.ust-video-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* =====================================================================
   FOOTER
   ===================================================================== */
#footer, .footer { background: var(--ust-gradient-dark); color: rgba(255,255,255,0.85); border-top: 0; }
.footer .footer-top { padding-top: 64px; }
.footer h4, .footer .h4footer { color: #fff; font-size: 17px; }
.footer h4::after { content: ""; display: block; width: 32px; height: 3px; border-radius: 3px; background: #8fa6e0; margin-top: 10px; }
.ust-contact { list-style: none; padding: 0; margin: 16px 0 0; }
.ust-contact li { display: flex; gap: 12px; align-items: flex-start; margin-bottom: 12px; font-size: 14.5px; line-height: 1.6; }
.ust-contact .ic { font-size: 18px; margin-top: 2px; color: #8fa6e0; }
.footer .footer-links ul a { color: rgba(255,255,255,0.8); transition: all 0.3s var(--ust-ease); }
.footer .footer-links ul a:hover { color: #fff; transform: translateX(5px); }
.footer .social-links a {
  color: #fff; border: 1px solid rgba(255,255,255,0.4);
  transition: all 0.3s var(--ust-ease);
}
.footer .social-links a .ic { font-size: 17px; }
.footer .social-links a:hover { background: #fff; color: var(--ust-teal); border-color: #fff; transform: translateY(-4px); }
.footer .copyright { border-top: 1px solid rgba(255,255,255,0.15); font-size: 14px; color: rgba(255,255,255,0.7); margin-top: 32px; }
.footer .footer-links { margin-bottom: 10px; }
.footer-contact p { margin-left: 0 !important; }

/* =====================================================================
   WIDGET CUSTOMER SERVICE
   ===================================================================== */
.ust-cs { position: fixed; right: 22px; bottom: 22px; z-index: 10040; font-family: var(--default-font); transition: opacity 0.3s, transform 0.3s; }
/* sembunyikan saat menu mobile / popup sedang terbuka */
.mobile-nav-active .ust-cs, .ust-modal-lock .ust-cs { opacity: 0; transform: scale(0.8); pointer-events: none; }
.ust-cs-fab {
  position: relative; width: 62px; height: 62px; border-radius: 50%; border: 0;
  background: var(--ust-gradient); color: #fff; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 14px 30px rgba(15,38,95, 0.45);
  transition: transform 0.35s var(--ust-ease);
  animation: ust-bob 3.2s ease-in-out infinite;
}
.ust-cs-fab::before, .ust-cs-fab::after { /* gelombang denyut */
  content: ""; position: absolute; inset: 0; border-radius: 50%;
  border: 2px solid rgba(44,79,166, 0.6); animation: ust-ripple 2.4s ease-out infinite;
}
.ust-cs-fab::after { animation-delay: 1.2s; }
.ust-cs-fab .ic { position: absolute; font-size: 28px; transition: transform 0.4s var(--ust-ease), opacity 0.3s; }
.ust-cs-fab .ust-cs-open { animation: ust-wiggle 4s ease-in-out infinite; }
.ust-cs-fab .ust-cs-close { opacity: 0; transform: rotate(-90deg) scale(0.6); }
.ust-cs-fab:hover { transform: scale(1.08); }
.ust-cs.is-open .ust-cs-fab { animation: none; }
.ust-cs.is-open .ust-cs-fab::before, .ust-cs.is-open .ust-cs-fab::after { animation: none; opacity: 0; }
.ust-cs.is-open .ust-cs-open { opacity: 0; transform: rotate(90deg) scale(0.6); animation: none; }
.ust-cs.is-open .ust-cs-close { opacity: 1; transform: none; }

.ust-cs-hint {
  position: absolute; right: 76px; bottom: 14px; white-space: nowrap;
  background: #fff; color: var(--ust-teal-dark); font-size: 13.5px; font-weight: 600;
  padding: 9px 14px; border-radius: 14px 14px 4px 14px; box-shadow: var(--ust-shadow);
  opacity: 0; transform: translateX(10px); pointer-events: none;
  animation: ust-hint 9s ease-in-out 2s infinite;
}
.ust-cs.is-open .ust-cs-hint { display: none; }

.ust-cs-panel {
  position: absolute; right: 0; bottom: 78px; width: 340px; max-width: calc(100vw - 32px);
  background: #fff; border-radius: 22px; overflow: hidden;
  box-shadow: 0 24px 60px rgba(6,14,34, 0.3);
  transform-origin: bottom right; transform: translateY(14px) scale(0.92);
  opacity: 0; visibility: hidden;
  transition: transform 0.35s var(--ust-ease), opacity 0.3s, visibility 0.3s;
}
.ust-cs.is-open .ust-cs-panel { opacity: 1; visibility: visible; transform: none; }
.ust-cs-view { display: none; }
.ust-cs-view.is-active { display: block; animation: ust-fade-in 0.35s var(--ust-ease); }
.ust-cs-head {
  display: flex; align-items: center; gap: 12px; padding: 18px 20px;
  background: var(--ust-gradient-dark); color: #fff;
}
.ust-cs-head.is-wa { background: linear-gradient(135deg, #075e54, #128c7e); }
.ust-cs-avatar {
  width: 44px; height: 44px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,0.18); font-size: 22px;
}
.ust-cs-title { font-family: var(--heading-font); font-weight: 700; font-size: 16px; }
.ust-cs-sub { font-size: 12.5px; opacity: 0.85; }
.ust-cs-back {
  width: 34px; height: 34px; border-radius: 50%; border: 0; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,0.18); color: #fff; font-size: 18px; cursor: pointer;
  transition: background 0.3s, transform 0.3s;
}
.ust-cs-back:hover { background: rgba(255,255,255,0.32); transform: translateX(-2px); }
.ust-cs-list { padding: 10px; max-height: 60vh; overflow-y: auto; }
.ust-cs-item {
  width: 100%; display: flex; align-items: center; gap: 14px; text-align: left;
  padding: 11px 12px; border: 0; border-radius: 14px; background: transparent;
  color: var(--ust-ink); cursor: pointer; transition: background 0.25s, transform 0.25s var(--ust-ease);
  opacity: 0; transform: translateY(8px);
}
.ust-cs.is-open .ust-cs-item { animation: ust-item-in 0.4s var(--ust-ease) forwards; }
.ust-cs.is-open .ust-cs-item:nth-child(2) { animation-delay: 0.05s; }
.ust-cs.is-open .ust-cs-item:nth-child(3) { animation-delay: 0.1s; }
.ust-cs.is-open .ust-cs-item:nth-child(4) { animation-delay: 0.15s; }
.ust-cs.is-open .ust-cs-item:nth-child(5) { animation-delay: 0.2s; }
.ust-cs-item:hover { background: var(--ust-tint); color: var(--ust-ink); transform: translateX(4px); }
.ust-cs-ico {
  width: 42px; height: 42px; border-radius: 12px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center; color: #fff; font-size: 21px;
  transition: transform 0.3s var(--ust-ease);
}
.ust-cs-item:hover .ust-cs-ico { transform: scale(1.1) rotate(-6deg); }
.is-wa .ust-cs-ico { background: #25d366; }
.is-ig .ust-cs-ico { background: linear-gradient(45deg, #f9ce34, #ee2a7b 50%, #6228d7); }
.is-yt .ust-cs-ico { background: #ff0000; }
.is-x .ust-cs-ico { background: #111; }
.is-in .ust-cs-ico { background: #0a66c2; }
.ust-cs-txt { display: flex; flex-direction: column; min-width: 0; }
.ust-cs-txt b { font-family: var(--heading-font); font-size: 14.5px; font-weight: 600; }
.ust-cs-txt small { font-size: 12.5px; color: var(--ust-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.ust-cs-chat {
  padding: 18px 16px; min-height: 170px;
  background-color: #efeae2;
  background-image: radial-gradient(rgba(0,0,0,0.04) 1px, transparent 1px); background-size: 14px 14px;
}
.ust-cs-bubble {
  max-width: 85%; background: #fff; color: #21242a; font-size: 14px; line-height: 1.5;
  padding: 10px 14px; border-radius: 4px 14px 14px 14px; box-shadow: 0 1px 2px rgba(0,0,0,0.1);
}
.ust-cs-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.ust-cs-chips button {
  border: 1px solid #bec5d7; background: #fff; color: #075e54;
  font-size: 12.5px; font-weight: 500; padding: 6px 12px; border-radius: 999px; cursor: pointer;
  transition: all 0.25s;
}
.ust-cs-chips button:hover { background: #075e54; color: #fff; border-color: #075e54; }
.ust-cs-compose { display: flex; align-items: flex-end; gap: 8px; padding: 12px; border-top: 1px solid #eee; }
.ust-cs-compose textarea {
  flex: 1; resize: none; border: 1.5px solid #e3e5eb; border-radius: 16px;
  padding: 10px 14px; font-size: 14px; outline: none; max-height: 120px; font-family: inherit;
  transition: border-color 0.25s;
}
.ust-cs-compose textarea:focus { border-color: #25d366; }
.ust-cs-send {
  width: 44px; height: 44px; border-radius: 50%; border: 0; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: #25d366; color: #fff; font-size: 19px; cursor: pointer;
  transition: transform 0.3s var(--ust-ease), background 0.3s;
}
.ust-cs-send:hover { background: #1ebe5b; transform: scale(1.08) rotate(-12deg); }
.ust-cs-compose.is-error textarea { border-color: #e5484d; animation: ust-shake 0.4s; }

@media (max-width: 575px) {
  .ust-cs { right: 16px; bottom: 16px; }
  .ust-cs-fab { width: 56px; height: 56px; }
  .ust-cs-fab .ic { font-size: 25px; }
  .ust-cs-panel { bottom: 70px; width: calc(100vw - 32px); }
  .ust-cs-hint { display: none; }
}

/* =====================================================================
   ANIMASI SCROLL (mirip motion effects Elementor)
   ===================================================================== */
/* fade-down  = turun dari atas ke posisi
   fade-right = masuk dari kiri ke kanan
   fade-left  = masuk dari kanan ke kiri
   fade-up    = naik dari bawah                                   */
.ust-js [data-aos] {
  opacity: 0;
  transition: opacity 1s var(--ust-ease), transform 1.1s var(--ust-ease);
  will-change: opacity, transform;
}
.ust-js [data-aos="fade-up"]    { transform: translate3d(0, 70px, 0); }
.ust-js [data-aos="fade-down"]  { transform: translate3d(0, -70px, 0); }
.ust-js [data-aos="fade-left"]  { transform: translate3d(90px, 0, 0); }
.ust-js [data-aos="fade-right"] { transform: translate3d(-90px, 0, 0); }
.ust-js [data-aos="zoom-in"]    { transform: scale(0.82); }
.ust-js [data-aos="zoom-out"]   { transform: scale(1.12); }
.ust-js [data-aos].aos-animate  { opacity: 1; transform: none; }
.ust-noanim [data-aos] { opacity: 1 !important; transform: none !important; }
@media (max-width: 767px) {
  /* jarak geser lebih kecil di HP agar tidak memicu scroll ke samping */
  /* di HP geser samping diganti gerak vertikal: posisi awal di luar layar
     membuat Chrome Android memperlebar halaman (menu ikut melebar) */
  .ust-js [data-aos="fade-left"]  { transform: translate3d(0, 45px, 0); }
  .ust-js [data-aos="fade-right"] { transform: translate3d(0, -45px, 0); }
  .ust-js [data-aos="fade-up"]    { transform: translate3d(0, 45px, 0); }
  .ust-js [data-aos="fade-down"]  { transform: translate3d(0, -45px, 0); }
}
section, .section, .footer { overflow-x: clip; }

@keyframes ust-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@keyframes ust-spin { to { transform: rotate(360deg); } }
@keyframes ust-ripple { 0% { transform: scale(1); opacity: 0.8; } 100% { transform: scale(1.7); opacity: 0; } }
@keyframes ust-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-5px); } }
@keyframes ust-wiggle { 0%, 82%, 100% { transform: rotate(0); } 86% { transform: rotate(-14deg); } 90% { transform: rotate(12deg); } 94% { transform: rotate(-8deg); } 97% { transform: rotate(4deg); } }
@keyframes ust-hint { 0%, 8% { opacity: 0; transform: translateX(10px); } 14%, 46% { opacity: 1; transform: none; } 54%, 100% { opacity: 0; transform: translateX(10px); } }
@keyframes ust-fade-in { from { opacity: 0; transform: translateX(12px); } to { opacity: 1; transform: none; } }
@keyframes ust-item-in { to { opacity: 1; transform: none; } }
@keyframes ust-shake { 0%, 100% { transform: translateX(0); } 25% { transform: translateX(-5px); } 75% { transform: translateX(5px); } }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
  .ust-js [data-aos] { opacity: 1; transform: none; }
}

/* =====================================================================
   Layout halaman EPrints (abstrak, view, hasil pencarian, latest)
   ===================================================================== */
p { margin-left: 150px; }
@media (max-width: 768px) { p { margin-left: 10px; } }
.container p, .ust-modal p, .ust-cs p { margin-left: 0 !important; }
.ep_field_para { margin-left: 0 !important; }
.ep_summary_content_main p { margin-left: 0 !important; }

#fplatest .ep_latest_tool_feeds { margin-top: 0; margin-left: 0; }
#fplatest .ep_latest_tool_list { margin-top: 0; margin-left: 0; margin-bottom: 0; }
.ep_latest_tool_feeds { margin-top: 100px; margin-left: 100px; }
.ep_latest_tool_list { margin-left: 100px; margin-bottom: 200px; }

.ep_summary_content { margin: 100px; }
.ep_search_export, .ep_search_results { margin-left: 150px; margin-right: 100px; }
.ep_view_menu { margin-top: 80px; margin-left: 150px; margin-bottom: 200px; }
.ep_export_bar, .ep_view_jump_to, .ep_view_blurb, .group_thesis { margin-left: 150px; }

@media (max-width: 768px) {
  .ep_latest_tool_feeds, .ep_latest_tool_list { margin-left: 10px; }
  .ep_summary_content { margin: 10px; }
  .ep_search_export, .ep_search_results { margin-left: 10px; margin-right: 10px; }
  .ep_view_menu { margin: 10px; }
  .ep_export_bar, .ep_view_jump_to, .ep_view_blurb, .group_thesis { margin-left: 10px; }
}

.ep_summary_content a, .ep_view_menu a, .ep_search_results a { color: var(--ust-teal); transition: color 0.25s; }
.ep_summary_content a:hover, .ep_view_menu a:hover, .ep_search_results a:hover { color: var(--ust-teal-light); }
.ep_form_action_button, .ep_form_internal_button {
  background: var(--ust-gradient) !important; color: #fff !important; border: 0 !important;
  border-radius: 8px; padding: 6px 14px; cursor: pointer; transition: filter 0.25s, transform 0.25s;
}
.ep_form_action_button:hover, .ep_form_internal_button:hover { filter: brightness(1.08); transform: translateY(-1px); }

/* =====================================================================
   WARNA LINK KONSISTEN (tidak berubah setelah diklik / :visited)
   Catatan: :visited TIDAK boleh ditulis di dalam :is()/:where() karena
   browser (aturan privasi) mengabaikannya. Maka :link, :visited, :active
   dan :focus ditulis terpisah dan diberi !important agar mengalahkan
   CSS bawaan EPrints/Bootstrap yang dimuat sesudahnya.
   ===================================================================== */
html a:link, html a:visited, html a:active, html a:focus { color: #1a367c; }
html a:link:hover, html a:visited:hover, html a:focus-visible { color: #2c4fa6; }
.ust-topbar-link:link, .ust-topbar-link:visited, .ust-topbar-link:active, .ust-topbar-link:focus { color: #fff !important; }
.ust-topbar-link:link:hover, .ust-topbar-link:visited:hover, .ust-topbar-link:focus-visible { color: #fff !important; }
.ust-topbar-social a:link, .ust-topbar-social a:visited, .ust-topbar-social a:active, .ust-topbar-social a:focus { color: rgba(255,255,255,0.85) !important; }
.ust-topbar-social a:link:hover, .ust-topbar-social a:visited:hover, .ust-topbar-social a:focus-visible { color: #1a367c !important; }
.navmenu a:link, .navmenu a:visited, .navmenu a:active, .navmenu a:focus { color: #151e35 !important; }
.navmenu a:link:hover, .navmenu a:visited:hover, .navmenu a:focus-visible { color: #2c4fa6 !important; }
.navmenu a.active:link, .navmenu a.active:visited, .navmenu a.active:active, .navmenu a.active:focus { color: #2c4fa6 !important; }
.navmenu a.active:link:hover, .navmenu a.active:visited:hover, .navmenu a.active:focus-visible { color: #2c4fa6 !important; }
.navmenu .dropdown ul a:link, .navmenu .dropdown ul a:visited, .navmenu .dropdown ul a:active, .navmenu .dropdown ul a:focus { color: #151e35 !important; }
.navmenu .dropdown ul a:link:hover, .navmenu .dropdown ul a:visited:hover, .navmenu .dropdown ul a:focus-visible { color: #2c4fa6 !important; }
.header .logo:link, .header .logo:visited, .header .logo:active, .header .logo:focus { color: #151e35 !important; }
.header .logo:link:hover, .header .logo:visited:hover, .header .logo:focus-visible { color: #151e35 !important; }
.header .cta-btn:link, .header .cta-btn:visited, .header .cta-btn:active, .header .cta-btn:focus { color: #fff !important; }
.header .cta-btn:link:hover, .header .cta-btn:visited:hover, .header .cta-btn:focus-visible { color: #fff !important; }
.ust-adv-btn:link, .ust-adv-btn:visited, .ust-adv-btn:active, .ust-adv-btn:focus { color: #fff !important; }
.ust-adv-btn:link:hover, .ust-adv-btn:visited:hover, .ust-adv-btn:focus-visible { color: #0e2358 !important; }
.ust-pill:link, .ust-pill:visited, .ust-pill:active, .ust-pill:focus { color: #0e2358 !important; }
.ust-pill:link:hover, .ust-pill:visited:hover, .ust-pill:focus-visible { color: #0b1a40 !important; }
.ust-browse-card:link, .ust-browse-card:visited, .ust-browse-card:active, .ust-browse-card:focus { color: #414651 !important; }
.ust-browse-card:link:hover, .ust-browse-card:visited:hover, .ust-browse-card:focus-visible { color: #414651 !important; }
.ust-btn-primary:link, .ust-btn-primary:visited, .ust-btn-primary:active, .ust-btn-primary:focus { color: #fff !important; }
.ust-btn-primary:link:hover, .ust-btn-primary:visited:hover, .ust-btn-primary:focus-visible { color: #fff !important; }
.ust-btn-light:link, .ust-btn-light:visited, .ust-btn-light:active, .ust-btn-light:focus { color: #0e2358 !important; }
.ust-btn-light:link:hover, .ust-btn-light:visited:hover, .ust-btn-light:focus-visible { color: #1a367c !important; }
.ust-btn-ghost:link, .ust-btn-ghost:visited, .ust-btn-ghost:active, .ust-btn-ghost:focus { color: #fff !important; }
.ust-btn-ghost:link:hover, .ust-btn-ghost:visited:hover, .ust-btn-ghost:focus-visible { color: #0e2358 !important; }
.ust-video-thumb:link, .ust-video-thumb:visited, .ust-video-thumb:active, .ust-video-thumb:focus { color: #fff !important; }
.ust-video-thumb:link:hover, .ust-video-thumb:visited:hover, .ust-video-thumb:focus-visible { color: #fff !important; }
.ust-video-alt:link, .ust-video-alt:visited, .ust-video-alt:active, .ust-video-alt:focus { color: rgba(255,255,255,0.85) !important; }
.ust-video-alt:link:hover, .ust-video-alt:visited:hover, .ust-video-alt:focus-visible { color: #fff !important; }
.ust-ta-link:link, .ust-ta-link:visited, .ust-ta-link:active, .ust-ta-link:focus { color: #1a367c !important; }
.ust-ta-link:link:hover, .ust-ta-link:visited:hover, .ust-ta-link:focus-visible { color: #1a367c !important; }
.ust-latest-rss a:link, .ust-latest-rss a:visited, .ust-latest-rss a:active, .ust-latest-rss a:focus { color: #1a367c !important; }
.ust-latest-rss a:link:hover, .ust-latest-rss a:visited:hover, .ust-latest-rss a:focus-visible { color: #fff !important; }
.footer a:link, .footer a:visited, .footer a:active, .footer a:focus { color: rgba(255,255,255,0.85) !important; }
.footer a:link:hover, .footer a:visited:hover, .footer a:focus-visible { color: #fff !important; }
.footer .footer-links ul a:link, .footer .footer-links ul a:visited, .footer .footer-links ul a:active, .footer .footer-links ul a:focus { color: rgba(255,255,255,0.82) !important; }
.footer .footer-links ul a:link:hover, .footer .footer-links ul a:visited:hover, .footer .footer-links ul a:focus-visible { color: #fff !important; }
.footer .social-links a:link, .footer .social-links a:visited, .footer .social-links a:active, .footer .social-links a:focus { color: #fff !important; }
.footer .social-links a:link:hover, .footer .social-links a:visited:hover, .footer .social-links a:focus-visible { color: #1a367c !important; }
.ust-cs-item:link, .ust-cs-item:visited, .ust-cs-item:active, .ust-cs-item:focus { color: #161c2c !important; }
.ust-cs-item:link:hover, .ust-cs-item:visited:hover, .ust-cs-item:focus-visible { color: #161c2c !important; }
.ep_summary_content a:link, .ep_summary_content a:visited, .ep_summary_content a:active, .ep_summary_content a:focus { color: #1a367c !important; }
.ep_summary_content a:link:hover, .ep_summary_content a:visited:hover, .ep_summary_content a:focus-visible { color: #2c4fa6 !important; }
.ep_view_menu a:link, .ep_view_menu a:visited, .ep_view_menu a:active, .ep_view_menu a:focus { color: #1a367c !important; }
.ep_view_menu a:link:hover, .ep_view_menu a:visited:hover, .ep_view_menu a:focus-visible { color: #2c4fa6 !important; }
.ep_search_results a:link, .ep_search_results a:visited, .ep_search_results a:active, .ep_search_results a:focus { color: #1a367c !important; }
.ep_search_results a:link:hover, .ep_search_results a:visited:hover, .ep_search_results a:focus-visible { color: #2c4fa6 !important; }
.ep_view_page a:link, .ep_view_page a:visited, .ep_view_page a:active, .ep_view_page a:focus { color: #1a367c !important; }
.ep_view_page a:link:hover, .ep_view_page a:visited:hover, .ep_view_page a:focus-visible { color: #2c4fa6 !important; }
.ust-latest-rss a:link:hover, .ust-latest-rss a:visited:hover { background: #1a367c; border-color: #1a367c; }
.ust-video-alt:link, .ust-video-alt:visited {
  display: block; text-align: center; font-size: 14px;
  position: absolute; left: 0; right: 0; top: 100%; margin-top: 14px;
}
.ust-video-alt:hover { text-decoration: underline; }
/* garis bawah animasi untuk link teks di halaman EPrints */
.ep_summary_content a, .ep_view_menu a, .ep_search_results a, .ep_view_page a {
  text-decoration: none;
  background-image: linear-gradient(currentColor, currentColor);
  background-size: 0 1px; background-position: 0 100%; background-repeat: no-repeat;
  transition: color 0.25s, background-size 0.3s var(--ust-ease);
}
.ep_summary_content a:hover, .ep_view_menu a:hover, .ep_search_results a:hover, .ep_view_page a:hover { background-size: 100% 1px; }


/* Video popup: indikator memuat + tautan cadangan */
.ust-video-frame { background: #0e121c; }
.ust-video-frame::before {
  content: ""; position: absolute; left: 50%; top: 50%; width: 44px; height: 44px; margin: -22px 0 0 -22px;
  border-radius: 50%; border: 3px solid rgba(255,255,255,0.2); border-top-color: #8fa6e0;
  animation: ust-spin 0.9s linear infinite;
}

/* Ikon pada tautan footer */
.footer .footer-links ul a { display: inline-flex; align-items: center; gap: 12px; line-height: 1.3; }
.ust-flink-ic {
  width: 32px; height: 32px; border-radius: 10px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,0.10); border: 1px solid rgba(255,255,255,0.14);
  color: #8fa6e0; font-size: 16px;
  transition: background 0.3s, color 0.3s, transform 0.35s var(--ust-ease);
}
.footer .footer-links ul a:hover .ust-flink-ic { background: #fff; color: var(--ust-teal); transform: rotate(-8deg) scale(1.08); }
.footer .footer-links ul li { padding: 7px 0; }

/* =====================================================================
   TEMPLATE INTERNAL / ADMIN (default_internal.xml) — body.ust-internal
   Tanpa Bootstrap: pakai kontainer & utilitas sendiri.
   ===================================================================== */
.ust-internal { background: #f3f4f8; }
.ust-wrap { width: 100%; max-width: 1240px; margin: 0 auto; padding: 0 20px; }

/* ---- Header internal (tanpa sticky-top Bootstrap) ---- */
.ust-int-header { position: sticky; top: 0; z-index: 997; }
.ust-branding-inner { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.ust-int-header .logo { display: flex; align-items: center; margin-right: auto; }
.ust-int-header .branding { min-height: 80px; }
.ust-int-header .logo img { max-height: 54px; }
.ust-int-cta { margin-left: 18px !important; }

/* ---- Judul halaman ---- */
.ust-int-hero {
  background:
    radial-gradient(circle at 10% 0%, rgba(28,69,172, 0.35), transparent 45%),
    linear-gradient(135deg, #0b1a40 0%, #102865 55%, #2c4fa6 100%);
  color: #fff; padding: 34px 0 78px;
}
.ust-crumb { display: flex; align-items: center; gap: 8px; font-size: 13.5px; margin-bottom: 10px; flex-wrap: wrap; }
.ust-crumb a:link, .ust-crumb a:visited { display: inline-flex; align-items: center; gap: 6px; color: rgba(255,255,255,0.8) !important; }
.ust-crumb a:hover { color: #fff !important; }
.ust-crumb-sep { opacity: 0.6; font-size: 14px; }
.ust-crumb-cur { color: #fff; font-weight: 500; }
.ust-int-title, .ust-internal h1.ep_tm_pagetitle {
  color: #fff !important; font-family: var(--heading-font); font-weight: 700;
  font-size: clamp(24px, 3.4vw, 34px); margin: 0; line-height: 1.25; text-align: left;
}

/* ---- Panel konten ---- */
.ust-int-main { margin-top: -54px; padding-bottom: 60px; position: relative; z-index: 2; }
.ust-panel {
  background: #fff; border-radius: 22px; border: 1px solid var(--ust-line);
  box-shadow: 0 18px 50px rgba(10,25,62, 0.10);
  padding: 32px; min-height: 260px; overflow-x: auto;
  width: auto !important; margin: 0 !important;
}

/* Netralkan aturan halaman publik yang tidak cocok untuk halaman admin */
.ust-internal p { margin-left: 0 !important; }
.ust-internal .ust-panel section { padding: 0; background: none; overflow: visible; }
.ust-internal .ep_summary_content,
.ust-internal .ep_search_export, .ust-internal .ep_search_results,
.ust-internal .ep_view_menu, .ust-internal .ep_export_bar, .ust-internal .ep_view_jump_to,
.ust-internal .ep_view_blurb, .ust-internal .ep_latest_tool_feeds, .ust-internal .ep_latest_tool_list {
  margin-left: 0 !important; margin-right: 0 !important;
}
.ust-internal .ep_summary_content { margin: 0 !important; }

/* Sentuhan rapi untuk komponen bawaan EPrints (tanpa mengubah perilaku) */
.ust-panel { font-size: 15px; line-height: 1.6; color: var(--default-color); }
.ust-panel h2, .ust-panel h3 { font-family: var(--heading-font); color: var(--heading-color); }
.ust-panel input[type="text"], .ust-panel input[type="password"], .ust-panel input[type="email"],
.ust-panel input[type="search"], .ust-panel input[type="url"], .ust-panel input[type="number"],
.ust-panel select, .ust-panel textarea {
  border: 1.5px solid var(--ust-line); border-radius: 10px; padding: 7px 11px;
  background: #fbfcfe; font: inherit; color: var(--ust-ink); max-width: 100%;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.ust-panel input:focus, .ust-panel select:focus, .ust-panel textarea:focus {
  outline: none; border-color: var(--ust-teal-light); box-shadow: 0 0 0 4px rgba(44,79,166, 0.15); background: #fff;
}
.ust-panel .ep_form_action_button, .ust-panel .ep_form_internal_button,
.ust-panel input[type="submit"], .ust-panel button[type="submit"] {
  background: var(--ust-gradient) !important; color: #fff !important; border: 0 !important;
  border-radius: 10px !important; padding: 8px 16px !important; font-weight: 600; cursor: pointer;
  box-shadow: 0 6px 14px rgba(26,54,124, 0.22); transition: filter 0.2s, transform 0.2s;
}
.ust-panel .ep_form_action_button:hover, .ust-panel .ep_form_internal_button:hover,
.ust-panel input[type="submit"]:hover, .ust-panel button[type="submit"]:hover { filter: brightness(1.08); transform: translateY(-1px); }

/* Tab EPrints (Manage deposits, Admin, View item) */
.ust-panel .ep_tab_bar { border-bottom: 2px solid var(--ust-line) !important; padding: 0 !important; margin-bottom: 0 !important; }
.ust-panel .ep_tab_bar li { margin: 0 4px -2px 0 !important; }
.ust-panel .ep_tab_bar li a:link, .ust-panel .ep_tab_bar li a:visited {
  display: inline-block; padding: 9px 16px !important; border-radius: 10px 10px 0 0;
  border: 0 !important; background: transparent !important; color: #5e636f !important; font-weight: 600;
  border-bottom: 2px solid transparent !important;
}
.ust-panel .ep_tab_bar li a:hover { color: var(--ust-teal) !important; background: var(--ust-tint) !important; }
.ust-panel .ep_tab_bar li.ep_tab_selected a:link, .ust-panel .ep_tab_bar li.ep_tab_selected a:visited {
  color: #1a367c !important; border-bottom-color: #1a367c !important; background: var(--ust-tint) !important;
}
.ust-panel .ep_tab_panel { border: 1px solid var(--ust-line) !important; border-top: 0 !important; border-radius: 0 0 14px 14px; padding: 20px !important; }

/* Pesan sistem */
.ust-internal .ep_msg_message, .ust-internal .ep_msg_warning, .ust-internal .ep_msg_error {
  border-radius: 14px !important; border-width: 1px !important; margin: 12px 0 !important;
}

/* Tabel daftar (Manage deposits / review) */
.ust-panel table.ep_columns { border-collapse: separate !important; border-spacing: 0; width: 100%; border: 1px solid var(--ust-line) !important; border-radius: 14px; overflow: hidden; }
.ust-panel table.ep_columns th.ep_columns_title { background: var(--ust-tint) !important; color: var(--heading-color) !important; font-weight: 600; padding: 10px !important; border: 0 !important; }
.ust-panel table.ep_columns td.ep_columns_cell { padding: 10px !important; border-top: 1px solid var(--ust-line) !important; border-left: 0 !important; border-right: 0 !important; }
.ust-panel table.ep_columns tr:hover td.ep_columns_cell { background: #f6f7fb; }

/* Link di area admin */
.ust-panel a:link, .ust-panel a:visited { color: #1a367c; }
.ust-panel a:link:hover, .ust-panel a:visited:hover { color: #2c4fa6; }

/* ---- Footer internal ---- */
.ust-int-footer { background: #0f1627; color: rgba(255,255,255,0.65); font-size: 13.5px; }
.ust-int-footer-inner { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; min-height: 60px; padding-top: 14px; padding-bottom: 14px; }
.ust-int-footer-links { display: inline-flex; gap: 18px; flex-wrap: wrap; }
.ust-int-footer a:link, .ust-int-footer a:visited { color: rgba(255,255,255,0.8) !important; }
.ust-int-footer a:hover { color: #8fa6e0 !important; }

@media (max-width: 1199px) {
  .ust-int-header .navmenu { order: 3; }
  .ust-int-cta { order: 2; margin: 0 12px 0 0 !important; }
}
@media (max-width: 767px) {
  .ust-int-cta span { display: none; }
  .ust-int-cta { padding: 10px 12px !important; }
  .ust-int-hero { padding: 24px 0 70px; }
  .ust-panel { padding: 20px 16px; border-radius: 18px; }
  .ust-wrap { padding: 0 14px; }
}
@media (min-width: 1200px) { .ust-internal .mobile-nav-toggle { display: none; } }
.ust-internal .navmenu .dropdown ul { min-width: 240px; }

/* ---- Perbaikan tata letak internal ---- */
body.ust-internal { margin: 0; }
.ust-internal .ust-wrap, .ust-internal .ust-panel,
.ust-amenu, .ust-amenu *, .ust-int-header, .ust-int-header *,
.ust-int-hero, .ust-int-hero *, .ust-int-footer, .ust-int-footer * { box-sizing: border-box; }
.ust-panel .ep_tab_bar { display: flex !important; flex-wrap: wrap; list-style: none !important; padding: 0 !important; margin: 18px 0 0 !important; }
.ust-panel .ep_tab_bar li { display: block !important; list-style: none !important; }
@media (max-width: 767px) {
  .ust-int-header .branding { min-height: 68px; }
  .ust-int-header .logo img { max-height: 42px; max-width: 190px; object-fit: contain; }
}
.ust-int-main { min-height: calc(100vh - 380px); }

/* =====================================================================
   MENU ADMIN di pita judul (di atas breadcrumb)
   ===================================================================== */
.ust-int-hero { padding: 26px 0 80px; }
.ust-amenu {
  display: flex; align-items: center; gap: 12px;
  margin-bottom: 22px; padding: 8px;
  background: rgba(255, 255, 255, 0.10); border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 18px; backdrop-filter: blur(6px);
  box-shadow: 0 10px 30px rgba(6,14,34, 0.18);
}
.ust-amenu-head { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.ust-amenu-label {
  display: inline-flex; align-items: center; gap: 10px; padding: 4px 14px 4px 4px;
  font-family: var(--heading-font); font-weight: 600; font-size: 14px; color: #fff;
  border-right: 1px solid rgba(255, 255, 255, 0.2); white-space: nowrap;
}
.ust-amenu-badge {
  width: 36px; height: 36px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center;
  background: #fff; color: var(--ust-teal); font-size: 18px; box-shadow: 0 6px 14px rgba(0,0,0,0.15);
}
.ust-amenu-toggle { display: none; }

.ust-keytools { flex: 1; min-width: 0; }
.ust-keytools:has(.ust-keytools-new li) .ust-keytools-legacy { display: none; }
.ust-keytools-new:empty, .ust-keytools-legacy:empty { display: none; }
.ust-keytools-legacy, .ust-keytools-legacy * { color: #e4e9f5; }

.ust-amenu .ep_tm_key_tools {
  display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
  list-style: none !important; margin: 0 !important; padding: 0 !important;
  border: 0 !important; background: none !important; width: auto !important; float: none !important;
}
.ust-amenu .ep_tm_key_tools li {
  display: flex !important; margin: 0 !important; padding: 0 !important;
  border: 0 !important; background: none !important; list-style: none !important; float: none !important;
}
.ust-amenu .ep_tm_key_tools li::before, .ust-amenu .ep_tm_key_tools li::after { display: none !important; content: none !important; }
.ust-amenu .ep_tm_key_tools a:link, .ust-amenu .ep_tm_key_tools a:visited {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 9px 14px; border-radius: 12px;
  color: #fff !important; font-size: 14px; font-weight: 500; white-space: nowrap;
  text-decoration: none !important; background: transparent !important;
  transition: background 0.25s, color 0.25s, transform 0.25s var(--ust-ease), box-shadow 0.25s;
}
.ust-amenu .ep_tm_key_tools a:hover, .ust-amenu .ep_tm_key_tools a:focus-visible {
  background: rgba(255, 255, 255, 0.16) !important; color: #fff !important; transform: translateY(-2px);
}
.ust-amenu .ep_tm_key_tools a.is-current:link, .ust-amenu .ep_tm_key_tools a.is-current:visited {
  background: #fff !important; color: #0e2358 !important; font-weight: 600;
  box-shadow: 0 8px 18px rgba(6,14,34, 0.18);
}

/* Ikon otomatis sesuai tujuan tautan (mask SVG, ikut warna teks) */
.ust-amenu .ep_tm_key_tools a::before {
  content: ""; width: 17px; height: 17px; flex-shrink: 0; background: currentColor;
  -webkit-mask: var(--ust-ki) center / contain no-repeat; mask: var(--ust-ki) center / contain no-repeat;
  --ust-ki: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2'%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3C/svg%3E");
}
.ust-amenu .ep_tm_key_tools a[href*="screen=Items"]::before { --ust-ki: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M22 12h-6l-2 3h-4l-2-3H2'/%3E%3Cpath d='M5.5 5.1 2 12v6a2 2 0 0 0 2 2h16a2 2 0 0 0 2-2v-6l-3.5-6.9A2 2 0 0 0 16.8 4H7.2a2 2 0 0 0-1.7 1.1z'/%3E%3C/svg%3E"); }
.ust-amenu .ep_tm_key_tools a[href*="screen=Review"]::before { --ust-ki: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 11l3 3L22 4'/%3E%3Cpath d='M21 12v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11'/%3E%3C/svg%3E"); }
.ust-amenu .ep_tm_key_tools a[href*="screen=Listing"]::before,
.ust-amenu .ep_tm_key_tools a[href*="screen=Staff"]::before { --ust-ki: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cellipse cx='12' cy='5' rx='8' ry='3'/%3E%3Cpath d='M4 5v14c0 1.7 3.6 3 8 3s8-1.3 8-3V5'/%3E%3Cpath d='M4 12c0 1.7 3.6 3 8 3s8-1.3 8-3'/%3E%3C/svg%3E"); }
.ust-amenu .ep_tm_key_tools a[href*="screen=Admin"]::before { --ust-ki: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 22s8-4 8-10V5l-8-3-8 3v7c0 6 8 10 8 10z'/%3E%3Cpath d='m9 12 2 2 4-4'/%3E%3C/svg%3E"); }
.ust-amenu .ep_tm_key_tools a[href*="screen=User"]::before,
.ust-amenu .ep_tm_key_tools a[href*="screen=Workarea"]::before { --ust-ki: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21v-1a6 6 0 0 1 6-6h4a6 6 0 0 1 6 6v1'/%3E%3C/svg%3E"); }
.ust-amenu .ep_tm_key_tools a[href*="SavedSearch"]::before { --ust-ki: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7.5'/%3E%3Cpath d='M21 21l-4.6-4.6'/%3E%3C/svg%3E"); }
.ust-amenu .ep_tm_key_tools a[href*="login"]::before { --ust-ki: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 3h4a2 2 0 0 1 2 2v14a2 2 0 0 1-2 2h-4'/%3E%3Cpath d='m10 17 5-5-5-5'/%3E%3Cpath d='M15 12H3'/%3E%3C/svg%3E"); }
.ust-amenu .ep_tm_key_tools a[href*="logout"]::before { --ust-ki: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/%3E%3Cpath d='m16 17 5-5-5-5'/%3E%3Cpath d='M21 12H9'/%3E%3C/svg%3E"); }
.ust-amenu .ep_tm_key_tools a[href*="logout"]:link,
.ust-amenu .ep_tm_key_tools a[href*="logout"]:visited { color: #ffd2cc !important; }
.ust-amenu .ep_tm_key_tools a[href*="logout"]:hover { background: rgba(255, 110, 90, 0.25) !important; color: #fff !important; }

.ust-amenu .ust-adminbar-site:link, .ust-amenu .ust-adminbar-site:visited {
  display: inline-flex; align-items: center; gap: 8px; flex-shrink: 0;
  padding: 9px 16px; border-radius: 12px; background: rgba(6,14,34, 0.28);
  color: #fff !important; font-weight: 600; font-size: 14px; white-space: nowrap;
  transition: background 0.25s, color 0.25s, transform 0.25s var(--ust-ease);
}
.ust-amenu .ust-adminbar-site:hover { background: #fff; color: var(--ust-teal-dark) !important; transform: translateY(-2px); }

/* Tablet: daftar menu turun ke baris sendiri */
@media (max-width: 1199px) {
  .ust-amenu { flex-wrap: wrap; }
  .ust-keytools { order: 3; flex-basis: 100%; padding-top: 8px; border-top: 1px solid rgba(255,255,255,0.15); }
  .ust-amenu .ust-adminbar-site { margin-left: auto; }
}
/* HP: tombol "Menu Admin" membuka grid 2 kolom */
@media (max-width: 767px) {
  .ust-amenu { padding: 8px; gap: 8px; border-radius: 16px; }
  .ust-amenu-head { flex: 1; justify-content: space-between; }
  .ust-amenu-label { border-right: 0; padding-right: 0; font-size: 13.5px; }
  .ust-amenu-toggle {
    display: inline-flex; align-items: center; gap: 6px; border: 0; cursor: pointer;
    padding: 9px 12px; border-radius: 12px; background: #fff; color: var(--ust-teal-dark);
    font-family: var(--heading-font); font-weight: 600; font-size: 13px;
  }
  .ust-amenu-toggle .ic { transform: rotate(90deg); transition: transform 0.3s var(--ust-ease); }
  .ust-amenu.is-open .ust-amenu-toggle .ic { transform: rotate(-90deg); }
  .ust-amenu .ust-adminbar-site { order: 2; padding: 9px 11px; }
  .ust-amenu .ust-adminbar-site span { display: none; }
  .ust-keytools { display: none; }
  .ust-amenu.is-open .ust-keytools { display: block; animation: ust-fade-in 0.3s var(--ust-ease); }
  .ust-amenu .ep_tm_key_tools { display: grid !important; grid-template-columns: 1fr 1fr; gap: 6px; }
  .ust-amenu .ep_tm_key_tools a:link, .ust-amenu .ep_tm_key_tools a:visited {
    width: 100%; padding: 11px 12px; font-size: 13.5px; background: rgba(255,255,255,0.08) !important;
    white-space: normal; line-height: 1.25;
  }
  .ust-int-hero { padding: 16px 0 72px; }
}

/* =====================================================================
   Kunci posisi & lebar panel (mengalahkan lebar/margin bawaan EPrints
   pada .ep_tm_page_content) agar jarak kiri = kanan
   ===================================================================== */
.ust-internal .ust-wrap {
  width: 100% !important; max-width: 1240px !important;
  margin-left: auto !important; margin-right: auto !important;
  padding-left: 24px !important; padding-right: 24px !important; float: none !important;
}
.ust-internal .ust-panel.ep_tm_page_content {
  display: block !important; float: none !important; position: relative !important;
  width: 100% !important; max-width: none !important; min-width: 0 !important;
  margin: 0 !important; left: auto !important; right: auto !important;
  padding: 36px !important; text-align: left;
}
/* elemen kotak EPrints di dalam panel: lebar penuh & rata kiri-kanan */
.ust-internal .ust-panel > *, .ust-internal .ust-panel .ep_block {
  max-width: 100%; margin-left: 0 !important; margin-right: 0 !important;
}
.ust-internal .ust-panel table.ep_columns { width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; }
@media (max-width: 767px) {
  .ust-internal .ust-wrap { padding-left: 14px !important; padding-right: 14px !important; }
  .ust-internal .ust-panel.ep_tm_page_content { padding: 20px 16px !important; }
}
/* rapatkan menu agar muat satu baris di desktop */
.ust-amenu .ep_tm_key_tools { gap: 2px; }
.ust-amenu .ep_tm_key_tools a:link, .ust-amenu .ep_tm_key_tools a:visited { padding: 9px 11px; font-size: 13.5px; }
@media (min-width: 1200px) and (max-width: 1399px) { .ust-amenu-label > span:last-child { display: none; } .ust-amenu-label { padding-right: 8px; } }
.ust-amenu-toggle, .ust-amenu-toggle span { white-space: nowrap; }
@media (max-width: 767px) {
  .ust-amenu-head { flex: 1 1 0; min-width: 0; }
  .ust-amenu-label { min-width: 0; overflow: hidden; }
  .ust-amenu-label > span:last-child { overflow: hidden; text-overflow: ellipsis; }
}
@media (max-width: 420px) { .ust-amenu-label > span:last-child { display: none; } }

/* =====================================================================
   IKON MENU UTAMA & SUBMENU BROWSE
   ===================================================================== */
/* main.css memakai justify-content: space-between; ganti agar ikon + teks rapat kiri */
.navmenu a, .navmenu a:focus { justify-content: flex-start !important; gap: 0 !important; }
.navmenu .ust-nav-ic {
  font-size: 18px; margin-right: 9px; flex-shrink: 0; color: #1a367c;
  transition: transform 0.3s var(--ust-ease), color 0.3s;
}
.navmenu a .toggle-dropdown { margin-left: 6px !important; }
.navmenu a:hover .ust-nav-ic, .navmenu li:hover > a .ust-nav-ic, .navmenu a.active .ust-nav-ic { color: #2c4fa6; transform: translateY(-2px); }

/* Submenu: ikon kotak + teks, semua rata kiri dengan jarak seragam */
.navmenu .dropdown ul { text-align: left; }
.navmenu .dropdown ul li { width: 100%; }
.navmenu .dropdown ul a, .navmenu .dropdown ul a:focus {
  display: flex !important; align-items: center !important; justify-content: flex-start !important;
  width: 100%; text-align: left; gap: 0 !important;
}
.ust-sub-ic {
  width: 34px; height: 34px; border-radius: 10px; flex-shrink: 0; margin-right: 12px;
  display: inline-flex; align-items: center; justify-content: center;
  background: #ebeef5; color: #1a367c; font-size: 17px;
  transition: background 0.3s, color 0.3s, transform 0.35s var(--ust-ease);
}
.ust-sub-ic .ic { width: 1em; height: 1em; margin: 0; }
.navmenu .dropdown ul a > span:last-child { flex: 1; min-width: 0; }
.navmenu .dropdown ul a:hover .ust-sub-ic { background: linear-gradient(135deg, #1a367c, #2c4fa6); color: #fff; transform: rotate(-8deg); }

@media (min-width: 1200px) {
  .navmenu > ul > li { padding: 15px 12px; }
  .navmenu .dropdown ul { min-width: 300px; padding: 8px !important; left: 0 !important; }
  .navmenu .dropdown ul li { padding: 0 !important; }
  .navmenu .dropdown ul a { padding: 8px 12px !important; white-space: nowrap; border-radius: 10px; }
}
@media (max-width: 1199px) {
  .navmenu ul > li > a { padding: 12px 20px !important; }
  .navmenu a .toggle-dropdown { margin-left: auto !important; }
  .navmenu .ust-nav-ic { font-size: 20px; margin-right: 12px; }
  .navmenu .dropdown ul { margin: 6px 16px 10px !important; padding: 6px !important; border-radius: 12px; }
  .navmenu .dropdown ul a { padding: 8px 10px !important; white-space: normal; font-size: 15px !important; }
}

/* =====================================================================
   Tabel daftar item EPrints di halaman admin (Manage deposits/records)
   Dipertegas agar tidak kalah dari CSS bawaan EPrints 3.4.7
   ===================================================================== */
.ust-internal .ust-panel table.ep_columns {
  border-collapse: separate !important; border-spacing: 0 !important; width: 100% !important;
  border: 1px solid #d8ddea !important; border-radius: 14px !important; overflow: hidden; background: #fff;
}
.ust-internal .ust-panel table.ep_columns th,
.ust-internal .ust-panel table.ep_columns th.ep_columns_title {
  background: #ebeef5 !important; color: #151e35 !important; font-weight: 600 !important;
  padding: 12px 10px !important; border: 0 !important; border-bottom: 1px solid #d8ddea !important; text-align: left;
}
.ust-internal .ust-panel table.ep_columns th a:link, .ust-internal .ust-panel table.ep_columns th a:visited { color: #151e35 !important; text-decoration: none !important; }
.ust-internal .ust-panel table.ep_columns th a:hover { color: #1a367c !important; }
.ust-internal .ust-panel table.ep_columns td,
.ust-internal .ust-panel table.ep_columns td.ep_columns_cell {
  padding: 12px 10px !important; vertical-align: middle;
  border: 0 !important; border-top: 1px solid #e4e7ee !important;
}
.ust-internal .ust-panel table.ep_columns tr:first-child td { border-top: 0 !important; }
.ust-internal .ust-panel table.ep_columns td img { vertical-align: middle; transition: transform 0.2s; }
.ust-internal .ust-panel table.ep_columns td a:hover img { transform: scale(1.12); }
.ust-internal .ust-panel table.ep_columns td a:link, .ust-internal .ust-panel table.ep_columns td a:visited { color: #1a367c !important; }

/* =====================================================================
   HERO: kartu jelajah ringkas + kartu kecil, tinggi sejajar Unggah Mandiri
   ===================================================================== */
.hero .content > [class*="col-"] { display: flex; }
.ust-upload-card { width: 100%; display: flex; flex-direction: column; }
.ust-upload-actions { margin-top: auto; }
.ust-browse-stack { width: 100%; display: flex; flex-direction: column; gap: 16px; }
.ust-browse-grid { flex: 1; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.ust-browse-grid .ust-browse-card { height: 100%; padding: 22px 20px; gap: 12px; }
.ust-browse-grid .ust-browse-icon { width: 48px; height: 48px; border-radius: 14px; font-size: 22px; }
.ust-browse-grid .ust-browse-card h4 { font-size: 17.5px; margin-bottom: 4px; }
.ust-browse-grid .ust-browse-desc { font-size: 14px; line-height: 1.5; }
.ust-browse-grid .ust-browse-link { margin-top: 10px; font-size: 13.5px; }

.ust-mini-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.ust-mini-card:link, .ust-mini-card:visited {
  position: relative; overflow: hidden;
  display: flex; align-items: center; gap: 12px;
  padding: 12px 14px; border-radius: 16px;
  background: rgba(255, 255, 255, 0.95); border: 1px solid rgba(255, 255, 255, 0.7);
  box-shadow: 0 10px 26px rgba(7,17,43, 0.16);
  color: #151e35 !important;
  transition: transform 0.35s var(--ust-ease), box-shadow 0.35s, background 0.35s;
}
.ust-mini-card::before {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px;
  background: linear-gradient(180deg, #1a367c, #2c4fa6); transform: scaleY(0); transform-origin: top;
  transition: transform 0.4s var(--ust-ease);
}
.ust-mini-card:hover { transform: translateY(-4px); box-shadow: 0 16px 34px rgba(7,17,43, 0.24); color: #151e35 !important; }
.ust-mini-card:hover::before { transform: scaleY(1); }
.ust-mini-icon {
  width: 40px; height: 40px; border-radius: 12px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  background: #ebeef5; color: #1a367c; font-size: 19px;
  transition: background 0.3s, color 0.3s, transform 0.35s var(--ust-ease);
}
.ust-mini-card:hover .ust-mini-icon { background: linear-gradient(135deg, #1a367c, #2c4fa6); color: #fff; transform: rotate(-8deg); }
.ust-mini-title { flex: 1; min-width: 0; font-family: var(--heading-font); font-weight: 600; font-size: 14.5px; line-height: 1.3; }
.ust-mini-arrow { color: #1a367c; font-size: 16px; display: inline-flex; transition: transform 0.3s var(--ust-ease); }
.ust-mini-card:hover .ust-mini-arrow { transform: translateX(4px); }

@media (min-width: 992px) and (max-width: 1199px) {
  .ust-browse-grid .ust-browse-card { padding: 18px 16px; }
  .ust-browse-grid .ust-browse-card h4 { font-size: 16px; }
  .ust-mini-title { font-size: 13.5px; }
  .ust-mini-card:link, .ust-mini-card:visited { padding: 10px 12px; gap: 10px; }
}
@media (max-width: 767px) {
  .ust-browse-grid { grid-template-columns: 1fr; gap: 12px; }
  .ust-browse-grid .ust-browse-card { flex-direction: row; align-items: flex-start; }
  .ust-mini-grid { grid-template-columns: 1fr; gap: 10px; }
  .ust-browse-stack { gap: 12px; }
}

/* =====================================================================
   HEADER ANTI-GETAR
   Tinggi header TIDAK berubah saat scroll (perubahan tinggi = konten
   melompat = posisi scroll bolak-balik melewati batas = getar).
   Topbar hilang secara alami dengan sticky top negatif, logo mengecil
   dengan transform (tidak memengaruhi tata letak).
   ===================================================================== */
#header.header, #header.sticky-top { position: sticky; top: -42px; z-index: 997; transition: box-shadow 0.3s; }
.scrolled .header .topbar { height: 42px !important; visibility: visible !important; overflow: visible !important; }
.header .branding, .scrolled .header .branding { transition: none; }
.header .logo img { transform-origin: left center; transition: transform 0.35s var(--ust-ease); will-change: transform; }
.scrolled .header .logo img { transform: scale(0.88); }
@media (max-width: 575px) {
  #header.header, #header.sticky-top { top: -38px; }
  .scrolled .header .topbar { height: 38px !important; }
}
/* Header halaman admin tidak punya topbar */
.ust-internal #header.header { top: 0; }

/* =====================================================================
   HALAMAN PANDUAN UNGGAH MANDIRI (information.xpage)
   ===================================================================== */
.ust-info-hero {
  position: relative; overflow: hidden; color: #fff; padding: 90px 0 100px;
  background:
    radial-gradient(circle at 12% 18%, rgba(28,69,172, 0.35), transparent 45%),
    radial-gradient(circle at 88% 85%, rgba(44,79,166, 0.45), transparent 50%),
    linear-gradient(135deg, #0b1a40 0%, #102760 55%, #2c4fa6 100%);
}
.ust-info-hero .container { z-index: 3; }
.ust-info-hero-inner { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 48px; align-items: center; }
.ust-info-hero h1 { color: #fff; font-family: var(--heading-font); font-weight: 800; font-size: clamp(30px, 4.6vw, 48px); line-height: 1.15; margin: 0 0 16px; }
.ust-info-lead { color: rgba(255,255,255,0.88); font-size: 17px; line-height: 1.7; max-width: 600px; }
.ust-info-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }

.ust-info-mini {
  background: rgba(255,255,255,0.1); border: 1px solid rgba(255,255,255,0.22);
  border-radius: 24px; padding: 26px; backdrop-filter: blur(8px);
  box-shadow: 0 20px 50px rgba(4,10,26, 0.25);
}
.ust-mini-flow-title { font-family: var(--heading-font); font-weight: 600; font-size: 13px; letter-spacing: 0.12em; text-transform: uppercase; color: #bdcdf4; margin-bottom: 14px; }
.ust-mini-flow { list-style: none; margin: 0; padding: 0; counter-reset: mf; }
.ust-mini-flow li {
  position: relative; display: flex; align-items: center; gap: 14px; padding: 10px 0;
  font-weight: 500; color: #fff; counter-increment: mf;
}
.ust-mini-flow li:not(:last-child)::after { /* garis penghubung */
  content: ""; position: absolute; left: 21px; top: 50px; height: calc(100% - 38px); width: 2px;
  background: repeating-linear-gradient(to bottom, rgba(255,255,255,0.5) 0 4px, transparent 4px 8px);
}
.ust-mf-ic {
  width: 44px; height: 44px; border-radius: 14px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  background: #fff; color: #1a367c; font-size: 21px; box-shadow: 0 6px 16px rgba(0,0,0,0.15);
  transition: transform 0.3s var(--ust-ease);
}
.ust-mini-flow li:hover .ust-mf-ic { transform: scale(1.08) rotate(-6deg); }

/* ---------- Timeline ---------- */
.ust-info-flow { padding: 90px 0; background: #f3f5f9; }
.ust-timeline { position: relative; max-width: 1040px; margin: 0 auto; padding: 10px 0; }
.ust-timeline::before { /* garis tengah */
  content: ""; position: absolute; left: 50%; top: 30px; bottom: 30px; width: 3px; margin-left: -1.5px;
  background: linear-gradient(180deg, #1a367c, #2c4fa6); border-radius: 3px; opacity: 0.35;
}
.ust-tl-terminal {
  position: relative; z-index: 2; width: max-content; margin: 0 auto 34px;
  display: flex; align-items: center; gap: 10px;
  padding: 12px 24px 12px 12px; border-radius: 999px;
  background: linear-gradient(135deg, #1a367c, #2c4fa6); color: #fff;
  font-family: var(--heading-font); font-weight: 700; font-size: 16px;
  box-shadow: 0 12px 28px rgba(26,54,124, 0.35);
}
.ust-tl-terminal.is-end { margin: 34px auto 0; background: linear-gradient(135deg, #0b1a40, #1a367c); }
.ust-tl-terminal-ic {
  width: 38px; height: 38px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center;
  background: rgba(255,255,255,0.2); font-size: 20px;
}

.ust-tl-step { position: relative; width: 50%; padding: 0 48px 0 0; margin-bottom: 34px; }
.ust-tl-step.is-right { margin-left: 50%; padding: 0 0 0 48px; }
.ust-tl-num {
  position: absolute; top: 22px; right: -24px; z-index: 2;
  width: 48px; height: 48px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: #fff; color: #1a367c; border: 3px solid #2c4fa6;
  font-family: var(--heading-font); font-weight: 800; font-size: 18px;
  box-shadow: 0 0 0 6px #f3f5f9, 0 8px 20px rgba(26,54,124, 0.25);
  transition: background 0.3s, color 0.3s, transform 0.4s var(--ust-ease);
}
.ust-tl-step.is-right .ust-tl-num { right: auto; left: -24px; }
.ust-tl-step:hover .ust-tl-num { background: #1a367c; color: #fff; transform: scale(1.1); }

.ust-tl-card {
  position: relative; background: #fff; border-radius: 22px; padding: 26px;
  border: 1px solid #d8ddea; box-shadow: 0 10px 30px rgba(10,25,62, 0.08);
  transition: transform 0.4s var(--ust-ease), box-shadow 0.4s;
}
.ust-tl-card::after { /* panah ke garis tengah */
  content: ""; position: absolute; top: 36px; right: -9px; width: 16px; height: 16px;
  background: #fff; border-right: 1px solid #d8ddea; border-top: 1px solid #d8ddea; transform: rotate(45deg);
}
.ust-tl-step.is-right .ust-tl-card::after { right: auto; left: -9px; transform: rotate(-135deg); }
.ust-tl-step:hover .ust-tl-card { transform: translateY(-5px); box-shadow: 0 18px 44px rgba(10,25,62, 0.14); }

.ust-tl-head { display: flex; align-items: center; gap: 16px; margin-bottom: 14px; }
.ust-tl-ic {
  width: 56px; height: 56px; border-radius: 16px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  background: linear-gradient(135deg, #1a367c, #2c4fa6); color: #fff; font-size: 26px;
  box-shadow: 0 10px 22px rgba(26,54,124, 0.3);
  transition: transform 0.4s var(--ust-ease);
}
.ust-tl-ic.is-wait { background: linear-gradient(135deg, #b7791f, #e0a43a); box-shadow: 0 10px 22px rgba(183, 121, 31, 0.3); }
.ust-tl-ic.is-done { background: linear-gradient(135deg, #15803d, #22a35a); box-shadow: 0 10px 22px rgba(21, 128, 61, 0.3); }
.ust-tl-step:hover .ust-tl-ic { transform: rotate(-8deg) scale(1.06); }
.ust-tl-label { font-size: 12px; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: #2c4fa6; }
.ust-tl-head h3 { font-family: var(--heading-font); font-weight: 700; font-size: 19px; line-height: 1.3; margin: 2px 0 0; color: #151e35; }
.ust-tl-text { color: #5e636f; font-size: 15px; line-height: 1.7; margin-bottom: 14px; }
.ust-tl-text:last-child { margin-bottom: 0; }

.ust-url-chip:link, .ust-url-chip:visited {
  display: inline-flex; align-items: center; gap: 10px; padding: 10px 16px; border-radius: 12px;
  background: #ebeef5; border: 1px dashed #a6b1cc; color: #0e2358 !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 14.5px; font-weight: 600;
  transition: background 0.25s, transform 0.25s;
}
.ust-url-chip:hover { background: #d8deee; transform: translateY(-2px); }
.ust-btn-sm { padding: 10px 18px; font-size: 14px; }
.ust-btn-sm .ic { font-size: 16px; }

.ust-branch {
  display: flex; gap: 12px; align-items: flex-start; margin-top: 16px;
  padding: 14px 16px; border-radius: 14px; border: 1px solid; font-size: 14.5px; line-height: 1.6;
}
.ust-branch-ic { font-size: 22px; flex-shrink: 0; display: inline-flex; margin-top: 1px; }
.ust-branch-title { font-family: var(--heading-font); font-weight: 700; font-size: 15px; margin-bottom: 2px; }
.ust-branch.is-warn { background: #fff8eb; border-color: #f5d9a8; color: #7a4a00; }
.ust-branch.is-ok { background: #ecfbf1; border-color: #b7e6c8; color: #14532d; }
.ust-branch.is-bad { background: #fff1f1; border-color: #f6c4c4; color: #8a1c1c; }
.ust-decision { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.ust-decision .ust-branch { margin-top: 0; }
.ust-loop {
  display: flex; gap: 12px; align-items: flex-start; margin-top: 12px;
  padding: 14px 16px; border-radius: 14px; background: #f3f5f9; border: 1px dashed #a6b1cc;
  color: #414651; font-size: 14.5px; line-height: 1.6;
}
.ust-loop-ic { color: #1a367c; font-size: 22px; display: inline-flex; animation: ust-spin 6s linear infinite; }
.ust-place { display: flex; gap: 10px; align-items: center; padding: 12px 16px; border-radius: 12px; background: #ecfbf1; color: #14532d; font-size: 14.5px; font-weight: 500; }
.ust-place .ic { font-size: 20px; flex-shrink: 0; }

/* ---------- Bantuan ---------- */
.ust-info-help { padding: 90px 0; background: #fff; }
.ust-help-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; }
.ust-help-card {
  position: relative; padding: 28px; border-radius: 22px; background: #fff; border: 1px solid #d8ddea;
  box-shadow: 0 8px 24px rgba(10,25,62, 0.06); display: flex; flex-direction: column;
  transition: transform 0.4s var(--ust-ease), box-shadow 0.4s;
}
.ust-help-card:hover { transform: translateY(-6px); box-shadow: 0 18px 44px rgba(10,25,62, 0.14); }
.ust-help-ic {
  width: 56px; height: 56px; border-radius: 16px; display: inline-flex; align-items: center; justify-content: center;
  font-size: 26px; color: #fff; margin-bottom: 18px; transition: transform 0.4s var(--ust-ease);
}
.ust-help-card:hover .ust-help-ic { transform: rotate(-8deg) scale(1.06); }
.ust-help-ic.is-warn { background: linear-gradient(135deg, #b7791f, #e0a43a); }
.ust-help-ic.is-bad { background: linear-gradient(135deg, #b42318, #e5484d); }
.ust-help-ic.is-wa { background: linear-gradient(135deg, #128c7e, #25d366); }
.ust-help-card h3 { font-family: var(--heading-font); font-weight: 700; font-size: 19px; color: #151e35; margin: 0 0 8px; }
.ust-help-text { color: #5e636f; font-size: 15px; line-height: 1.7; flex: 1; }
.ust-help-link:link, .ust-help-link:visited {
  display: inline-flex; align-items: center; gap: 8px; margin-top: 16px; align-self: flex-start;
  padding: 9px 16px; border-radius: 999px; background: #ecfbf1; color: #128c7e !important;
  font-family: var(--heading-font); font-weight: 600; font-size: 14px; transition: all 0.3s var(--ust-ease);
}
.ust-help-link:hover { background: #25d366; color: #fff !important; }
.ust-help-link .ic { transition: transform 0.3s var(--ust-ease); }
.ust-help-link:hover .ic { transform: translateX(4px); }

/* ---------- Responsif ---------- */
@media (max-width: 991px) {
  .ust-info-hero-inner { grid-template-columns: 1fr; gap: 32px; }
  .ust-help-grid { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
  .ust-info-hero { padding: 60px 0 70px; }
  .ust-info-lead { font-size: 15.5px; }
  .ust-info-actions .ust-btn { flex: 1 1 auto; }
  .ust-info-flow, .ust-info-help { padding: 64px 0; }
  /* timeline pindah ke kiri */
  .ust-timeline::before { left: 24px; margin-left: 0; }
  .ust-tl-terminal, .ust-tl-terminal.is-end { margin-left: 0; margin-right: 0; }
  .ust-tl-step, .ust-tl-step.is-right { width: 100%; margin-left: 0; padding: 0 0 0 64px; }
  .ust-tl-num, .ust-tl-step.is-right .ust-tl-num { left: 0; right: auto; top: 18px; }
  .ust-tl-card::after, .ust-tl-step.is-right .ust-tl-card::after { right: auto; left: -9px; transform: rotate(-135deg); top: 32px; }
  .ust-tl-card { padding: 20px; }
  .ust-tl-head { gap: 12px; }
  .ust-tl-ic { width: 48px; height: 48px; font-size: 22px; border-radius: 14px; }
  .ust-tl-head h3 { font-size: 17px; }
  .ust-decision { grid-template-columns: 1fr; }
  .ust-url-chip:link, .ust-url-chip:visited { font-size: 13px; word-break: break-all; }
}

/* =====================================================================
   PERBAIKAN BENTROK DENGAN TEMA BAWAAN EPRINTS (template.css dsb.)
   - template.css: @media (max-width:570px) { footer { height: 54px; } }
     -> footer terpotong di HP, isinya meluber ke latar abu-abu.
   - z_eprints_services_template.css: body { background-color: #eaeaea; }
   ===================================================================== */
html body { background-color: #ffffff; }
html body.ust-internal { background-color: #f3f4f8; }
footer#footer, footer.footer, footer.ust-int-footer {
  height: auto !important; min-height: 0 !important; max-height: none !important;
  overflow-x: clip; overflow-y: visible; clear: both;
}
@media only screen and (max-width: 600px) {
  footer#footer, footer.footer, footer.ust-int-footer { height: auto !important; }
  footer#footer img, footer.footer img { display: inline-block; }
  .footer .footer-top { padding-top: 48px; }
  .footer .footer-about { margin-bottom: 8px; }
  .footer .copyright { margin-top: 20px; padding: 18px 70px 22px 0; text-align: left !important; font-size: 13px; }
}

/* =====================================================================
   HP: Login Repository rata kiri + tombol Unggah Mandiri di dalam menu
   ===================================================================== */
@media (max-width: 767px) {
  .header .topbar .container { justify-content: flex-start !important; }
  .header .topbar .contact-info { width: 100%; justify-content: flex-start; }
  .ust-topbar-link { padding-left: 0 !important; padding-right: 0 !important; }
  .ust-topbar-link:hover { background: transparent; opacity: 0.85; }
}
/* gambar latar hero yang belum diunggah tidak menampilkan teks alt */
.hero img.awal[alt=""], #hp img[alt=""] { color: transparent; }

.ust-nav-cta-item { display: none !important; }
@media (max-width: 1199px) {
  .navmenu ul > li.ust-nav-cta-item { display: block !important; padding: 14px 20px 6px !important; margin-top: 6px; border-top: 1px solid #e4e7ee; }
  .navmenu a.ust-nav-cta:link, .navmenu a.ust-nav-cta:visited, .navmenu a.ust-nav-cta:focus {
    display: flex !important; align-items: center; justify-content: center !important; gap: 10px !important;
    width: 100%; padding: 14px 20px !important; border-radius: 14px;
    background: linear-gradient(135deg, #1a367c, #2c4fa6) !important; color: #ffffff !important;
    font-family: var(--heading-font); font-weight: 600; font-size: 16px !important;
    box-shadow: 0 10px 22px rgba(26,54,124, 0.3); transition: transform 0.25s, filter 0.25s;
  }
  .navmenu a.ust-nav-cta:hover, .navmenu a.ust-nav-cta:active { color: #ffffff !important; filter: brightness(1.08); transform: translateY(-2px); }
  .navmenu a.ust-nav-cta .ic { font-size: 20px; width: 1em; height: 1em; background: none !important; border-radius: 0 !important; margin: 0 !important; color: #fff; }
  .navmenu a.ust-nav-cta::before { display: none !important; }
  /* tombol di header disembunyikan agar tidak dobel saat sudah ada di menu */
  .header .cta-btn { display: none !important; }
}

/* =====================================================================
   TAB EPRINTS (Admin: Editorial/System/Config Tools, Profil: Details/
   User History, dll) - semua tab SATU BARIS
   EPrints memberi tiap <li> inline style width (mis. 33%/50%) + border
   bawah sendiri, sehingga tab turun ke baris kedua. Ditimpa di sini.
   ===================================================================== */
.ust-internal .ust-panel .ep_tab_bar,
.ust-internal .ust-panel div.ep_tab_bar > ul {
  display: flex !important; flex-wrap: nowrap !important; align-items: flex-end; gap: 6px;
  list-style: none !important; margin: 18px 0 0 !important; padding: 0 !important;
  width: 100% !important; border: 0 !important; border-bottom: 2px solid #d8ddea !important;
  overflow-x: auto; overflow-y: hidden; scrollbar-width: none; -webkit-overflow-scrolling: touch;
}
.ust-internal .ust-panel div.ep_tab_bar { border-bottom: 0 !important; }
.ust-internal .ust-panel .ep_tab_bar::-webkit-scrollbar,
.ust-internal .ust-panel div.ep_tab_bar > ul::-webkit-scrollbar { display: none; }
.ust-internal .ust-panel .ep_tab_bar li {
  display: block !important; float: none !important; flex: 0 0 auto !important;
  width: auto !important; min-width: 0 !important; max-width: none !important;
  margin: 0 0 -2px 0 !important; padding: 0 !important;
  border: 0 !important; background: none !important; list-style: none !important;
}
.ust-internal .ust-panel .ep_tab_bar li a:link, .ust-internal .ust-panel .ep_tab_bar li a:visited {
  display: block !important; white-space: nowrap; width: auto !important;
  padding: 11px 18px !important; border: 0 !important; border-bottom: 2px solid transparent !important;
  border-radius: 12px 12px 0 0; background: transparent !important;
  color: #5e636f !important; font-weight: 600; font-size: 15px; text-decoration: none !important;
  transition: background 0.25s, color 0.25s, border-color 0.25s;
}
.ust-internal .ust-panel .ep_tab_bar li a:hover { background: #ebeef5 !important; color: #1a367c !important; }
.ust-internal .ust-panel .ep_tab_bar li.ep_tab_selected a:link,
.ust-internal .ust-panel .ep_tab_bar li.ep_tab_selected a:visited {
  background: #ebeef5 !important; color: #1a367c !important; border-bottom-color: #1a367c !important;
}
.ust-internal .ust-panel .ep_tab_panel {
  border: 1px solid #d8ddea !important; border-top: 0 !important;
  border-radius: 0 0 16px 16px !important; padding: 22px !important; margin-top: 0 !important; box-shadow: none !important;
}
@media (max-width: 767px) {
  .ust-internal .ust-panel .ep_tab_bar li a:link, .ust-internal .ust-panel .ep_tab_bar li a:visited { padding: 10px 14px !important; font-size: 14px; }
  .ust-internal .ust-panel .ep_tab_panel { padding: 16px !important; }
}

/* =====================================================================
   HALAMAN ABSTRAK / DETAIL (cfg/citations/eprint/summary_page.xml)
   ===================================================================== */
.ep_summary_content, .ep_summary_content_main { margin: 0 !important; padding: 0 !important; width: auto !important; }
.ep_summary_content:has(.ust-abs) { margin: 0 !important; }
.ust-abs { background: #f3f5f9; padding-bottom: 70px; }
.ust-abs-search {
  position: relative; padding: 34px 0 72px;
  background:
    radial-gradient(circle at 12% 0%, rgba(28,69,172, 0.35), transparent 45%),
    linear-gradient(135deg, #0b1a40 0%, #102760 55%, #2c4fa6 100%);
}
.ust-abs-search .ust-search { margin-top: 0; max-width: 820px; }
.ust-abs-body { position: relative; margin-top: -46px; }
.ust-abs-head, .ust-abs-body > .ust-abs-h2, .ust-docs, .ust-abs-abstract, .ust-meta, .ust-abs-actions, .ust-abs-empty, .ust-abs-note {
  max-width: 100%;
}
.ust-abs-head {
  background: #fff; border-radius: 22px; padding: 30px 32px; border: 1px solid #d8ddea;
  box-shadow: 0 18px 50px rgba(10,25,62, 0.10); margin-bottom: 26px;
}
.ust-abs-title {
  font-family: var(--heading-font); font-weight: 700; color: #151e35;
  font-size: clamp(20px, 2.4vw, 27px); line-height: 1.4; margin: 4px 0 14px;
  text-transform: none; letter-spacing: -0.005em;
}
.ust-abs-cite {
  color: #5e636f; font-size: 15px; line-height: 1.7;
  padding: 14px 16px; border-radius: 14px; background: #f6f7fb; border-left: 4px solid #2c4fa6;
}
.ust-abs-cite p { margin: 0 !important; }
.ust-abs-h2 {
  display: flex; align-items: center; gap: 10px;
  font-family: var(--heading-font); font-weight: 700; color: #151e35;
  font-size: 19px; margin: 34px 0 14px;
}
.ust-abs-h2 .ic { width: 34px; height: 34px; padding: 7px; border-radius: 10px; background: #ebeef5; color: #1a367c; }
.ust-abs-note { margin: 14px 0; color: #5e636f; }

/* Berkas */
.ust-docs { display: grid; gap: 14px; }
.ust-doc.ep_summary_page_document {
  display: grid !important; grid-template-columns: auto minmax(0, 1fr); gap: 18px; align-items: start;
  padding: 20px 22px; margin: 0 !important; border-radius: 18px; background: #fff; border: 1px solid #d8ddea;
  box-shadow: 0 8px 22px rgba(10,25,62, 0.06); text-align: left;
  transition: transform 0.35s var(--ust-ease), box-shadow 0.35s;
}
.ust-doc:hover { transform: translateY(-3px); box-shadow: 0 16px 36px rgba(10,25,62, 0.12); }
.ust-doc-ic {
  position: relative; width: 56px; height: 66px; border-radius: 12px; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center; overflow: hidden;
  background: #ebeef5; color: #1a367c; font-size: 28px;
}
.ust-doc-ic img { max-width: 56px; max-height: 66px; width: auto !important; height: auto; display: block; }
.ust-doc-ic.is-pdf { background: linear-gradient(160deg, #fff1f1, #fde0e0); color: #c62828; }
.ust-doc-ic.is-pdf b { position: absolute; bottom: 5px; font: 800 10px/1 var(--heading-font); letter-spacing: 0.06em; }
.ust-doc-ic.is-pdf .ic { margin-top: -10px; }
.ust-doc-body { min-width: 0; }
.ust-doc-cite { color: #414651; font-size: 14.5px; line-height: 1.6; word-break: break-word; }
.ust-doc-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin-top: 12px; }
.ust-doc-actions > a:not(.ust-btn):not(.ust-doc-raw) { font-weight: 600; }
.ust-doc-locked { display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; border-radius: 999px; background: #fff8eb; color: #7a4a00; font-size: 13.5px; font-weight: 600; }
/* Tautan PDF asli: terlihat & terbaca robot, tapi tidak bisa diklik */
a.ust-doc-raw:link, a.ust-doc-raw:visited {
  pointer-events: none; cursor: default; user-select: none; -webkit-user-select: none;
  color: #8d909d !important; text-decoration: none !important; font-size: 13.5px;
  display: inline-flex; align-items: center; gap: 6px;
}
a.ust-doc-raw::before {
  content: ""; width: 14px; height: 14px; background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Crect x='4' y='11' width='16' height='10' rx='2'/%3E%3Cpath d='M8 11V7a4 4 0 0 1 8 0v4'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Crect x='4' y='11' width='16' height='10' rx='2'/%3E%3Cpath d='M8 11V7a4 4 0 0 1 8 0v4'/%3E%3C/svg%3E") center / contain no-repeat;
}
.ust-doc-versions { grid-column: 1 / -1; margin: 0; padding-left: 18px; }
.ust-doc-versions:empty { display: none; }
.ust-abs-empty {
  display: flex; flex-wrap: wrap; align-items: center; gap: 12px; padding: 18px 20px; border-radius: 16px;
  background: #fff; border: 1px dashed #bec5d7; color: #5e636f;
}
.ust-abs-empty > .ic { font-size: 22px; color: #1a367c; }

/* Abstrak */
.ust-abs-abstract {
  background: #fff; border-radius: 18px; padding: 24px 26px; border: 1px solid #d8ddea;
  color: #414651; font-size: 15.5px; line-height: 1.85; text-align: justify;
}
.ust-abs-abstract p { margin: 0 0 1em !important; }

/* Metadata */
table.ust-meta {
  width: 100%; border-collapse: separate; border-spacing: 0; background: #fff;
  border: 1px solid #d8ddea; border-radius: 18px; overflow: hidden;
}
table.ust-meta th, table.ust-meta td { padding: 12px 18px; vertical-align: top; border-top: 1px solid #e8ebf2; font-size: 14.5px; line-height: 1.6; text-align: left; }
table.ust-meta tr:first-child th, table.ust-meta tr:first-child td { border-top: 0; }
table.ust-meta th { width: 220px; background: #f6f7fb; color: #151e35; font-weight: 600; }
table.ust-meta td { color: #414651; word-break: break-word; }
table.ust-meta tr:hover td { background: #fbfcfe; }

/* Tabel compound EPrints (dari skrip lama) */
.ep_compound { border: 1px solid #d8ddea; border-collapse: collapse; width: 100%; border-radius: 10px; }
.ep_compound > .ep_compound_header_row, .ep_compound > .ep_compound_data_row { display: flex; }
.ep_compound > .ep_compound_header_row > .ep_compound_header_cell,
.ep_compound > .ep_compound_data_row > .ep_compound_data_row_cell {
  flex: 1; padding: 8px; border: 1px solid #e4e7ee; text-align: center;
  display: flex; align-items: center; justify-content: center; box-sizing: border-box;
}
.ep_compound_header_cell { font-weight: 600; background: #f6f7fb; }

/* Aksi staf */
.ust-abs-actions { margin-top: 30px; padding: 20px 22px; border-radius: 18px; background: #fff; border: 1px dashed #bec5d7; }
.ust-abs-actions-title { font-family: var(--heading-font); font-weight: 600; color: #151e35; margin-bottom: 10px; }
.ust-abs-actions .ep_summary_page_actions { display: grid; grid-template-columns: auto 1fr; gap: 8px 12px; align-items: center; margin: 0; }
.ust-abs-actions .ep_summary_page_actions dd { margin: 0; }

@media (max-width: 767px) {
  .ust-abs-search { padding: 22px 0 60px; }
  .ust-abs-head { padding: 22px 18px; border-radius: 18px; }
  .ust-abs-cite { font-size: 14px; }
  .ust-doc.ep_summary_page_document { padding: 16px; gap: 14px; }
  .ust-doc-ic { width: 46px; height: 56px; font-size: 22px; }
  .ust-abs-abstract { padding: 18px; font-size: 15px; text-align: left; }
  table.ust-meta, table.ust-meta tbody, table.ust-meta tr, table.ust-meta th, table.ust-meta td { display: block; width: 100%; }
  table.ust-meta th { border-top: 1px solid #e8ebf2; padding-bottom: 2px; }
  table.ust-meta td { border-top: 0; padding-top: 2px; }
}

/* =====================================================================
   VIEWER PDF READ-ONLY (baca.xpage)
   ===================================================================== */
.ust-reader { background: #e9ebef; min-height: 80vh; padding-bottom: 40px; }
.ust-reader-bar {
  position: sticky; top: 96px; z-index: 50;
  display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
  padding: 10px 20px; background: #0f1627; color: #e4e9f5; box-shadow: 0 6px 20px rgba(0,0,0,0.18);
}
.ust-reader-left { display: flex; align-items: center; gap: 14px; min-width: 0; flex: 1; }
.ust-reader-title { display: flex; align-items: center; gap: 8px; min-width: 0; font-weight: 600; font-size: 14.5px; }
.ust-reader-title span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ust-reader-tools { display: flex; align-items: center; gap: 6px; }
.ust-reader-btn, a.ust-reader-btn:link, a.ust-reader-btn:visited {
  display: inline-flex; align-items: center; gap: 6px; height: 36px; min-width: 36px; padding: 0 12px;
  border: 0; border-radius: 10px; background: rgba(255,255,255,0.10); color: #fff !important;
  font: 600 14px var(--default-font); cursor: pointer; transition: background 0.2s;
}
.ust-reader-btn:hover { background: rgba(143,166,224, 0.25); }
.ust-reader-btn b { font-size: 18px; line-height: 1; }
.ust-reader-page, .ust-reader-zoom { font-size: 13.5px; font-variant-numeric: tabular-nums; padding: 0 6px; color: #d0d7e8; }
.ust-reader-notice { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 16px; background: #fff8eb; color: #7a4a00; font-size: 13.5px; }
.ust-reader-view {
  display: flex; flex-direction: column; align-items: center; gap: 18px; padding: 24px 12px;
  -webkit-user-select: none; user-select: none; -webkit-touch-callout: none;
}
.ust-reader-page-box {
  position: relative; max-width: 100%; background: #fff; box-shadow: 0 6px 24px rgba(6,14,34, 0.18); border-radius: 4px; overflow: hidden;
}
.ust-reader-page-box canvas { display: block; max-width: 100%; height: auto !important; pointer-events: none; }
.ust-reader-page-no { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #b8bcc6; font: 700 28px var(--heading-font); }
.ust-reader-loading { display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 80px 20px; color: #5e636f; text-align: center; }
.ust-reader-spin { width: 44px; height: 44px; border-radius: 50%; border: 4px solid #d0d6e4; border-top-color: #1a367c; animation: ust-spin 0.9s linear infinite; font-size: 0; }
.ust-reader-error { max-width: 460px; padding: 16px 20px; border-radius: 14px; background: #fff1f1; color: #8a1c1c; border: 1px solid #f6c4c4; }
.ust-reader:fullscreen { overflow: auto; padding-bottom: 0; }
.ust-reader:fullscreen .ust-reader-bar { top: 0; }
@media (max-width: 1199px) { .ust-reader-bar { top: 72px; } }
@media (max-width: 575px) {
  .ust-reader-bar { padding: 8px 12px; top: 72px; }
  .ust-reader-hide-sm { display: none !important; }
  .ust-reader-title { font-size: 13px; }
  .ust-reader-view { padding: 14px 6px; gap: 10px; }
}
/* Tidak bisa dicetak */
@media print { .ust-reader-view, .ust-reader-page-box { display: none !important; } }

/* Tombol di halaman abstrak tidak ikut gaya link konten EPrints */
.ust-abs a.ust-btn, .ust-abs a.ust-adv-btn, .ust-abs a.ust-doc-raw { background-size: auto !important; }
.ust-abs a.ust-btn-primary:link, .ust-abs a.ust-btn-primary:visited {
  color: #ffffff !important; background: linear-gradient(135deg, #1a367c, #2c4fa6) !important;
}
.ust-abs a.ust-btn-primary:hover { color: #ffffff !important; }
.ust-abs a.ust-btn-soft:link, .ust-abs a.ust-btn-soft:visited { color: #0e2358 !important; background: #ebeef5 !important; }
.ust-abs a.ust-adv-btn:link, .ust-abs a.ust-adv-btn:visited { color: #ffffff !important; background: rgba(255, 255, 255, 0.12) !important; }
.ust-abs a.ust-adv-btn:hover { color: #0e2358 !important; background: #ffffff !important; }
.ust-abs a.ust-doc-raw:link, .ust-abs a.ust-doc-raw:visited { background-image: none !important; color: #8d909d !important; }
.ust-abs .ust-doc-actions a:not(.ust-btn):not(.ust-doc-raw):link,
.ust-abs .ust-doc-actions a:not(.ust-btn):not(.ust-doc-raw):visited { color: #1a367c !important; }

/* PDF: tautan di dalam citation dokumen juga tidak bisa diklik (tetap terbaca robot) */
.ust-doc-cite.is-locked a { pointer-events: none !important; cursor: default; color: inherit !important; text-decoration: none !important; background-image: none !important; }

/* Halaman abstrak: tombol Baca PDF (form) & tombol Download PDF tersembunyi */
.ust-doc-form { display: inline-flex; margin: 0; }
.ust-doc-form button.ust-btn { border: 0; cursor: pointer; }
.ust-abs a.ust-doc-dl-hidden, .ust-abs a.ust-doc-dl-hidden:link, .ust-abs a.ust-doc-dl-hidden:visited {
  position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important;
  overflow: hidden !important; clip: rect(0 0 0 0) !important; clip-path: inset(50%) !important;
  white-space: nowrap !important; border: 0 !important; pointer-events: none !important; opacity: 0 !important;
}
.ust-doc-body { position: relative; }


/* =====================================================================
   HASIL PENCARIAN (cgi/search) & HALAMAN LATEST (cgi/latest_tool)
   Kartu dibangun ust.js (.ust-res-card = .ust-ta-card). Bagian "cadangan"
   merapikan baris asli .ep_search_result bila JS belum aktif.
   ===================================================================== */

/* Latar halaman */
body:not(.ust-internal) main.custom-container:has(.ep_search_results, .ep_latest_tool_list) {
  background: linear-gradient(180deg, #f3f5fa 0%, #ebeef5 100%);
  padding-bottom: 70px;
}

/* Lebar konten: ganti margin kiri 100/150px bawaan template lama */
body:not(.ust-internal) #ep_messages,
body:not(.ust-internal) .ep_search_controls,
body:not(.ust-internal) .ep_search_controls_bottom,
body:not(.ust-internal) .ep_search_export,
body:not(.ust-internal) .ep_search_results,
body:not(.ust-internal) .ep_latest_tool_feeds,
body:not(.ust-internal) .ep_latest_tool_list:not(#fplatest .ep_latest_tool_list) {
  max-width: 1240px; margin-left: auto !important; margin-right: auto !important;
  padding-left: 20px; padding-right: 20px; box-sizing: border-box;
}
body:not(.ust-internal) .ep_search_export .ep_export_bar { margin-left: 0 !important; }

/* ---- Bar "Displaying results ..." (atas & bawah) ---- */
.ep_search_controls, .ep_search_controls_bottom { margin-top: 36px !important; margin-bottom: 20px !important; }
.ep_search_controls > div, .ep_search_controls_bottom > div {
  background: #fff; border: 1px solid var(--ust-line); border-radius: 18px;
  box-shadow: var(--ust-shadow-sm); padding: 18px 22px;
  text-align: center; font-size: 14.5px; line-height: 2; color: #9ea3b0;
}
.ep_search_number {
  display: inline-block; min-width: 26px; padding: 0 8px; margin: 0 2px; border-radius: 999px;
  background: var(--ust-tint); color: var(--ust-teal-dark); font-weight: 700; line-height: 24px;
}
.ep_search_controls > div > br, .ep_search_controls_bottom > div > br { content: ""; display: block; margin: 4px 0; }
.ep_search_control a {
  display: inline-flex; align-items: center; gap: 6px; padding: 3px 14px; margin: 0 2px;
  border-radius: 999px; border: 1px solid var(--ust-line); background: #fff;
  font-size: 13.5px; font-weight: 600; line-height: 1.8; text-decoration: none !important;
  background-image: none !important; transition: all .25s var(--ust-ease);
}
.ep_search_control a:link, .ep_search_control a:visited { color: #1a367c !important; }
.ep_search_control a:hover { background: var(--ust-gradient) !important; color: #fff !important; border-color: transparent; transform: translateY(-1px); }

.ep_search_reorder { margin-top: 12px; padding-top: 12px; border-top: 1px dashed var(--ust-line); }
.ep_search_reorder form { display: inline-flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px; margin: 0; }
.ep_search_reorder label { display: inline-flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px; margin: 0; color: var(--ust-ink); font-weight: 500; font-size: 14px; }

/* Select & tombol (Reorder, Export) */
.ep_search_reorder select, .ep_export_bar select {
  -webkit-appearance: none; appearance: none; height: 40px; padding: 0 38px 0 14px;
  border: 1px solid var(--ust-line); border-radius: 12px; background-color: #f7f8fb;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23008080' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 12px center; background-size: 16px;
  font-size: 14px; color: var(--ust-ink); max-width: 100%; cursor: pointer; transition: border-color .2s, box-shadow .2s;
}
.ep_search_reorder select:focus, .ep_export_bar select:focus { outline: 0; border-color: var(--ust-teal); box-shadow: 0 0 0 4px rgba(26,54,124,.12); }
.ep_search_reorder .ep_form_action_button, .ep_export_bar .ep_form_action_button {
  height: 40px; min-width: 0 !important; width: auto !important; padding: 0 22px !important;
  border-radius: 12px !important; font-weight: 600; font-size: 14px;
  box-shadow: 0 8px 18px rgba(26,54,124,.25);
}

/* ---- Bar Export + feed + Batch Edit ---- */
.ep_search_export { margin-bottom: 26px !important; }
.ep_search_export form > div {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px;
  background: #fff; border: 1px solid var(--ust-line); border-radius: 18px;
  box-shadow: var(--ust-shadow-sm); padding: 14px 18px;
}
.ep_export_bar {
  display: flex !important; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 12px; flex: 1 1 auto; width: auto !important; padding: 0 !important; border: 0 !important; background: none !important;
}
.ep_export_bar > div { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0 !important; padding: 0 !important; }
.ep_export_bar label { margin: 0; font-size: 14px; font-weight: 500; color: var(--ust-ink); }
.ep_search_feed a, .ep_search_tool a, .ep_latest_tool_feeds a {
  display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; border-radius: 999px;
  border: 1px solid var(--ust-line); background: #fff; font-size: 13px; font-weight: 600;
  text-decoration: none !important; background-image: none !important; transition: all .25s var(--ust-ease);
}
.ep_search_feed a:link, .ep_search_feed a:visited, .ep_search_tool a:link, .ep_search_tool a:visited,
.ep_latest_tool_feeds a:link, .ep_latest_tool_feeds a:visited { color: #0e2358 !important; }
.ep_search_feed a:hover, .ep_search_tool a:hover, .ep_latest_tool_feeds a:hover { border-color: #2c4fa6; color: #1a367c !important; transform: translateY(-1px); box-shadow: var(--ust-shadow-sm); }
.ep_search_feed img, .ep_search_tool img, .ep_latest_tool_feeds img { width: 14px; height: 14px; }
.ep_search_export [role="toolbar"]:not(.ep_export_bar) { display: flex; gap: 8px; margin: 0 !important; }

/* Halaman Latest: tombol RSS */
body:not(.ust-internal) .ep_latest_tool_feeds:not(#fplatest .ep_latest_tool_feeds) {
  display: flex; justify-content: flex-end; margin-top: 36px !important; margin-bottom: 18px !important;
}
.ep_latest_tool_feeds .ep_search_feed { display: inline-flex; }
.ep_latest_tool_feeds .ep_search_feed a + a { display: none; } /* ikon & teks jadi satu tombol */
.ep_latest_tool_feeds .ep_search_feed a:first-child::after { content: "RSS 2.0"; }

/* ---- Grid kartu (setelah dibangun ust.js) ---- */
.ust-res-grid {
  display: grid !important; gap: 22px; margin: 0 !important;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr));
}
.ust-res-grid .ust-ta-card { margin: 0; }
.ust-res-card a, .ust-res-card a:link, .ust-res-card a:visited { background-image: none !important; }
body:not(.ust-internal) .ep_latest_tool_list.ust-res-grid { margin-bottom: 0 !important; }

/* ---- Cadangan tanpa JS: baris asli dibuat seperti kartu ---- */
.ep_search_results .ep_search_result:not(tr),
.ep_latest_tool_list:not(#fplatest .ep_latest_tool_list) .ep_search_result:not(tr) {
  position: relative; display: grid !important; grid-template-columns: 44px 1fr auto; gap: 16px; align-items: center;
  margin: 0 0 16px; padding: 20px 22px; background: #fff;
  border: 1px solid var(--ust-line) !important; border-radius: 22px; box-shadow: var(--ust-shadow-sm);
  font-size: 14.5px; line-height: 1.6; color: var(--ust-muted);
  transition: transform .35s var(--ust-ease), box-shadow .35s;
}
.ep_search_results .ep_search_result:not(tr):hover,
.ep_latest_tool_list .ep_search_result:not(tr):hover { transform: translateY(-4px); box-shadow: var(--ust-shadow); }
.ep_search_results .ep_search_result:not(tr) > div:first-child,
.ep_latest_tool_list .ep_search_result:not(tr) > div:first-child {
  width: 40px; height: 40px; border-radius: 12px; background: var(--ust-gradient); color: #fff;
  display: flex; align-items: center; justify-content: center; font: 700 14px var(--heading-font);
}
.ep_search_result .person_name { color: var(--ust-ink); font-weight: 600; text-transform: capitalize; }
.ep_search_result em { font-style: normal; font-family: var(--heading-font); font-weight: 600; font-size: 15.5px; }
.ep_search_result_docs { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.ep_search_result_docs img.ep_doc_icon { width: 34px !important; height: auto; border-radius: 6px; box-shadow: 0 2px 6px rgba(0,0,0,.08); }
.ep_search_result_docs span a { font-size: 12.5px; font-weight: 600; white-space: nowrap; }
@media (max-width: 640px) {
  .ep_search_results .ep_search_result:not(tr),
  .ep_latest_tool_list .ep_search_result:not(tr) { grid-template-columns: 40px 1fr; }
  .ep_search_result_docs { grid-column: 1 / -1; justify-content: flex-start; }
  .ep_search_export form > div, .ep_export_bar { flex-direction: column; align-items: stretch; }
  .ep_search_controls > div, .ep_search_controls_bottom > div { padding: 16px; }
  .ep_search_reorder select, .ep_export_bar select { width: 100%; }
}

/* =====================================================================
   UNMUH JEMBER: HEADER NAVY BERGRADASI, LOGO, AKSEN BIRU LANGIT
   ===================================================================== */
:root {
  --umj-navy-900: #081433;
  --umj-navy-800: #0b1a40;
  --umj-navy-700: #11265c;
  --umj-navy-600: #1a367c;
  --umj-navy-500: #2c4fa6;
  --umj-copper: #4887af;
  --umj-copper-light: #63a1c7;
  --umj-header-grad: linear-gradient(100deg, #071a4a 0%, #081d51 40%, #0b2562 75%, #11307a 100%);
  --umj-copper-grad: linear-gradient(135deg, #3fa3df 0%, #2a74ad 100%);
}

/* Topbar & branding satu warna navy, dipisah garis tipis */
.header .topbar { background: linear-gradient(100deg, #05143b 0%, #081d51 60%, #0a2258 100%); border-bottom: 1px solid rgba(255,255,255,0.07); }
.header .branding, .ust-internal .header .branding, .ust-int-header .branding { background: var(--umj-header-grad); }
.header { box-shadow: 0 1px 0 rgba(255,255,255,0.04); }
.scrolled .header { box-shadow: 0 10px 30px rgba(6,16,41,0.35); }
.ust-topbar-sep { width: 1px; height: 16px; background: rgba(255,255,255,0.22); margin: 0 6px; font-size: 0; }
.ust-topbar-social a:hover { background: #fff; color: var(--umj-navy-600); }

/* Logo: emblem (opsional) + wordmark teks */
.umj-logo { gap: 14px; text-decoration: none; }
.header .umj-logo img { max-height: 56px; margin-right: 0; }
.umj-wordmark { display: flex; flex-direction: column; line-height: 1.15; padding-left: 14px; border-left: 1px solid rgba(255,255,255,0.28); }
.umj-logo img[style*="none"] + .umj-wordmark { padding-left: 0; border-left: 0; }
.umj-wm-top { font-family: var(--heading-font); font-weight: 700; font-size: 12px; letter-spacing: 0.32em; text-transform: uppercase; color: #95c0da; }
.umj-wm-name { font-family: var(--heading-font); font-weight: 600; font-size: 15px; letter-spacing: 0.06em; text-transform: uppercase; color: #fff; max-width: 250px; }
.header .logo:link, .header .logo:visited, .header .logo:active, .header .logo:focus,
.header .logo:link:hover, .header .logo:visited:hover { color: #fff !important; }

/* Menu desktop: teks putih di atas navy; dropdown tetap panel putih */
@media (min-width: 1200px) {
  .header .navmenu > ul > li > a:link, .header .navmenu > ul > li > a:visited,
  .header .navmenu > ul > li > a:active, .header .navmenu > ul > li > a:focus { color: rgba(255,255,255,0.86) !important; }
  .header .navmenu > ul > li > a:link:hover, .header .navmenu > ul > li > a:visited:hover,
  .header .navmenu > ul > li:hover > a:link, .header .navmenu > ul > li:hover > a:visited,
  .header .navmenu > ul > li > a.active:link, .header .navmenu > ul > li > a.active:visited { color: #fff !important; }
  .header .navmenu > ul > li > a .ust-nav-ic { color: #95c0da; }
  .header .navmenu > ul > li > a:hover .ust-nav-ic, .header .navmenu > ul > li:hover > a .ust-nav-ic,
  .header .navmenu > ul > li > a.active .ust-nav-ic { color: #add3eb; }
  .header .navmenu > ul > li > a { position: relative; }
  .header .navmenu > ul > li > a::before {
    content: ""; position: absolute; left: 12px; right: 12px; bottom: 8px; height: 2px; border-radius: 2px;
    background: linear-gradient(90deg, #63a1c7, #a1cae3); transform: scaleX(0); transform-origin: left; transition: transform 0.3s var(--ust-ease);
  }
  .header .navmenu > ul > li > a:hover::before, .header .navmenu > ul > li > a.active::before { transform: scaleX(1); }
  .header .navmenu > ul > li { padding: 15px 8px; }
  .navmenu a, .navmenu a:focus { font-size: 14.5px; }
}
@media (min-width: 1200px) and (max-width: 1399px) {
  .header .navmenu > ul > li { padding: 15px 4px; }
  .header .navmenu > ul > li > a .ust-nav-ic { display: none; }
  .umj-wm-name { font-size: 13.5px; max-width: 220px; }
}
.mobile-nav-toggle, .ust-internal .mobile-nav-toggle { color: #fff !important; }
.mobile-nav-active .navmenu { background: rgba(6,16,41,0.78); }

/* Tombol Unggah Mandiri: aksen biru langit lembut */
.header .cta-btn, .header .cta-btn:focus { background: var(--umj-copper-grad); box-shadow: 0 8px 22px rgba(56,119,159,0.32); white-space: nowrap; border: 1px solid rgba(255,255,255,0.14); }
.header .cta-btn:hover, .cta-btn:hover { background: linear-gradient(135deg, #38779f 0%, #2d6385 100%) !important; box-shadow: 0 12px 26px rgba(45,99,133,0.4); }

/* Hero: dasar navy (tetap rapi walau gambar latar belum diunggah) */
.hero { background: linear-gradient(135deg, #0b1a40 0%, #142d6d 60%, #1f4092 100%); }
.hero .hero-overlay {
  background:
    radial-gradient(circle at 15% 20%, rgba(44,79,166,0.45), transparent 50%),
    radial-gradient(circle at 88% 88%, rgba(72,135,175,0.16), transparent 42%),
    linear-gradient(135deg, rgba(8,20,51,0.9) 0%, rgba(14,32,79,0.8) 50%, rgba(28,58,133,0.66) 100%);
}

/* Widget CS: warna merek tambahan */
.is-fb .ust-cs-ico { background: #1877f2; }
.is-mail .ust-cs-ico { background: var(--umj-navy-600); }

/* Footer: tautan kontak (WA & email) */
.ust-contact a { color: rgba(255,255,255,0.88); }
.ust-contact a:hover { color: #fff; text-decoration: underline; }
.ust-contact a:link, .ust-contact a:visited { color: rgba(255,255,255,0.88) !important; }
.footer h4::after { background: linear-gradient(90deg, #63a1c7, #a1cae3); }

@media (max-width: 1199px) {
  .header .umj-logo img { max-height: 46px; }
  .umj-wm-name { font-size: 13px; max-width: 210px; }
}
@media (max-width: 575px) {
  .umj-wordmark { padding-left: 10px; }
  .umj-wm-top { font-size: 10px; letter-spacing: 0.26em; }
  .umj-wm-name { font-size: 11.5px; max-width: 170px; letter-spacing: 0.04em; }
  .header .umj-logo img { max-height: 38px; }
  .umj-logo { gap: 10px; }
  .ust-topbar-link { padding: 5px 8px; font-size: 12.5px; }
  .ust-topbar-sep { margin: 0 2px; }
}

/* Thumbnail video (rasio tetap walau gambar belum termuat) */
.ust-video-thumb img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; background: linear-gradient(135deg, #0b1a40, #1f4092); }
.header .contact-info { gap: 2px; }
@media (max-width: 420px) {
  .ust-topbar-link .ic { display: none; }
  .ust-topbar-link { padding: 5px 6px; font-size: 12px; }
}


/* Logo Unmuh Jember (header.png putih transparan, rasio lebar) */
.header .umj-logo img { max-height: 72px; width: auto; }
.umj-logo .umj-wordmark { padding-left: 12px; }
@media (max-width: 1399px) { .header .umj-logo img { max-height: 62px; } }
@media (max-width: 575px) { .header .umj-logo img { max-height: 44px; max-width: 150px; } .umj-logo .umj-wordmark { display: none; } }
.is-tt .ust-cs-ico { background: #111; }


/* v20: kolom pencarian tidak melebar keluar layar di HP */
.ust-search-form { min-width: 0; }
.ust-search-form input[type="search"] { width: 0 !important; min-width: 0 !important; flex: 1 1 auto; }
.ust-search-btn { flex-shrink: 0; }

/* Penanda akhir file: pastikan teks ini ADA di server (cek upload tidak terpotong) */
/* END OF FILE css.css v20-umj */
