/* ============================================================
   Loka Bhakti — Full Custom Style (CLEAN v2)
   OJS 3.3.0.6 | jaf-fisib.unpak.ac.id
   Last cleaned: 2026-05-30
   ============================================================ */


/* ──────────────────────────────────────────────
   VARIABEL UTAMA
   ────────────────────────────────────────────── */
:root {
  /* Cover & Homepage */
  --cover-width:            180px;
  --cover-margin-top:        78px;
  --cover-margin-right:      24px;
  --cover-margin-bottom:     16px;
  --cover-margin-left:       16px;
  --cover-bg:               #ffffff;
  --cover-frame-border:     1px solid #c8d8ec;
  --cover-frame-padding:     5px;
  --cover-frame-radius:       0px;

  /* Index By */
  --index-logo-width:        200px;
  --index-btn-bg:           #f4f7fb;
  --index-btn-bg-hover:     #e6eef8;
  --index-btn-border:       1px solid #c8d8ec;
  --index-btn-radius:        8px;
  --index-btn-padding:       8px 12px;
  --index-btn-margin:        4px;
  --index-btn-shadow:        0 1px 4px rgba(0,0,0,0.08);
  --index-btn-shadow-hover:  0 4px 12px rgba(0,0,0,0.15);

  /* About Journal Sidebar */
  --about-hover-bg:         #e8f0fb;
  --about-hover-color:      #1a4a7a;
  --about-hover-border:     #ea580c;
  --about-transition:       0.25s ease;

  /* Current Issue */
  --issue-cover-size:        180px;

  /* Published Date */
  --published-margin-left:   0px;
  --published-margin-top:    12px;
  --published-text-align:    left;
  --published-font-size:     13px;
  --published-color:         #888;
}


/* ══════════════════════════════════════════════
   BAGIAN 1 — HEADER
   ══════════════════════════════════════════════ */

.pkp_site_name .is_img img {
  max-height: 80px !important;
  width:      auto !important;
  height:     auto !important;
  transition: 0.3s;
}

.pkp_site_name_wrapper {
  background:    #fff;
  padding:       12px 0;
  border-bottom: 1px solid #eee;
  margin:        0 !important;
}

.pkp_site_name {
  margin:     0 !important;
  padding:    0 !important;
  text-align: left;
}

.pkp_head_wrapper {
  background:    #fff !important;
  border-bottom: 1px solid #e8e8e8 !important;
  padding:       0 !important;
}

.pkp_site_nav_menu {
  padding-top: 0 !important;
}

.pkp_navigation_primary_wrapper {
  background: #fff;
  position:   sticky;
  top:        0;
  z-index:    999;
  box-shadow: 0 4px 20px rgba(0,0,0,0.06);
}

.pkp_navigation_primary {
  display:         flex;
  justify-content: center;
  gap:             10px;
}

.pkp_navigation_primary > li > a {
  font-size:      15px;
  font-weight:    700;
  letter-spacing: 0.3px;
  text-transform: uppercase;
  padding:        18px 20px !important;
  transition:     0.3s;
}

.pkp_navigation_primary > li > a:hover {
  color: #d66b18 !important;
}

.pkp_navigation_primary .current > a,
.pkp_navigation_primary .active > a {
  color:    #d66b18 !important;
  position: relative;
}

.pkp_navigation_primary .current > a::after,
.pkp_navigation_primary .active > a::after {
  content:       "";
  position:      absolute;
  bottom:        0;
  left:          20%;
  width:         60%;
  height:        3px;
  background:    #d66b18;
  border-radius: 999px;
}

.pkp_navigation_search_wrapper {
  margin-left: auto;
  align-self:  center;
}

@media (max-width: 768px) {
  .pkp_site_name {
    width:      100% !important;
    text-align: center;
  }
  .pkp_site_name .is_img img {
    width:      100% !important;
    max-height: none !important;
    object-fit: contain !important;
  }
}


/* ══════════════════════════════════════════════
   BAGIAN 2 — COVER & LAYOUT HOMEPAGE
   ══════════════════════════════════════════════ */

img[src*="homepageImage_en_US"] {
  float:         right !important;
  width:         var(--cover-width) !important;
  max-width:     var(--cover-width) !important;
  height:        auto !important;
  margin:        var(--cover-margin-top) var(--cover-margin-right) var(--cover-margin-bottom) var(--cover-margin-left) !important;
  display:       block;
  background:    var(--cover-bg);
  border:        var(--cover-frame-border) !important;
  border-radius: var(--cover-frame-radius) !important;
  padding:       var(--cover-frame-padding) !important;
  box-shadow:    0 2px 8px rgba(0,0,0,0.08);
}

#homepageAbout {
  display:    flow-root;
  text-align: justify;
}

#homepageAbout::after {
  content: "";
  display: table;
  clear:   both;
}

#homepageAbout h2 {
  margin-top: 0;
  text-align: left;
}

#homepageIssue {
  clear: both;
}

.about-journal-home {
  margin:        40px auto;
  padding:       30px;
  background:    #f8f8f8;
  border-radius: 12px;
}

.about-journal-home h2 {
  font-size:     32px;
  margin-bottom: 15px;
  color:         #222;
}

.about-journal-home p {
  font-size:   16px;
  line-height: 1.8;
  color:       #555;
}


/* ══════════════════════════════════════════════
   BAGIAN 3 — TEKS JUSTIFY
   ══════════════════════════════════════════════ */

#homepageAbout p,
#homepageAbout div,
#homepageAbout span,
.homepage_about p,
.pkp_page_index #homepageAbout p,
.pkp_page_issue .description p,
.obj_issue_summary .description p,
.issue_description p,
#homepageIssue .description p,
.pkp_page_index .description p {
  text-align:      justify !important;
  text-align-last: left !important;
  hyphens:         manual !important;
  word-break:      normal !important;
  overflow-wrap:   break-word !important;
}

.article-abstract p,
.abstract p,
#abstract p,
.pkp_page_article .abstract p,
.article_abstract p,
section.abstract p,
.article-references p,
.references p,
#references p,
.pkp_page_article .references p,
.article_references p,
section.references p,
.pkp_page_article .main_entry .references,
.pkp_page_article .main_entry .references p {
  text-align:      justify !important;
  text-align-last: left !important;
  hyphens:         manual !important;
  word-break:      normal !important;
  overflow-wrap:   break-word !important;
}


/* ══════════════════════════════════════════════
   BAGIAN 4 — SIDEBAR: ABOUT JOURNAL
   ══════════════════════════════════════════════ */

.pkp_block a[href*="editorialTeam"],
.pkp_block a[href*="PeerReview"],
.pkp_block a[href*="FocusScope"],
.pkp_block a[href*="AuthorGuidelines"],
.pkp_block a[href*="PublicationEthics"],
.pkp_block a[href*="JournalPolicy"],
.pkp_block a[href*="OnlineSubmission"],
.pkp_block a[href*="ReviewPolicy"],
.pkp_block a[href*="OpenAccess"],
.pkp_block a[href*="PublicationFrequency"],
.pkp_block a[href*="PublicationCharge"],
.pkp_block a[href*="information"] {
  display:         block !important;
  padding:         7px 12px !important;
  margin:          2px 0 !important;
  transition:
    background   var(--about-transition),
    color        var(--about-transition),
    transform    var(--about-transition),
    border-left  var(--about-transition),
    padding-left var(--about-transition),
    box-shadow   var(--about-transition);
  border-left:     3px solid transparent;
  border-radius:   6px;
  color:           inherit;
  text-decoration: none !important;
  font-size:       14px;
  line-height:     1.5;
}

.pkp_block a[href*="editorialTeam"]:hover,
.pkp_block a[href*="PeerReview"]:hover,
.pkp_block a[href*="FocusScope"]:hover,
.pkp_block a[href*="AuthorGuidelines"]:hover,
.pkp_block a[href*="PublicationEthics"]:hover,
.pkp_block a[href*="JournalPolicy"]:hover,
.pkp_block a[href*="submissions"]:hover,
.pkp_block a[href*="OnlineSubmission"]:hover,
.pkp_block a[href*="ReviewPolicy"]:hover,
.pkp_block a[href*="OpenAccess"]:hover,
.pkp_block a[href*="PublicationFrequency"]:hover,
.pkp_block a[href*="PublicationCharge"]:hover,
.pkp_block a[href*="information"]:hover {
  background:      var(--about-hover-bg) !important;
  color:           var(--about-hover-color) !important;
  border-left:     3px solid var(--about-hover-border) !important;
  padding-left:    12px !important;
  transform:       translateY(-3px);
  box-shadow:      2px 2px 8px rgba(74,144,217,0.15);
  text-decoration: none !important;
  border-radius:   6px;
}

.pkp_block a[href*="editorialTeam"]:active,
.pkp_block a[href*="PeerReview"]:active,
.pkp_block a[href*="FocusScope"]:active,
.pkp_block a[href*="AuthorGuidelines"]:active,
.pkp_block a[href*="JournalPolicy"]:active,
.pkp_block a[href*="submissions"]:active,
.pkp_block a[href*="OnlineSubmission"]:active,
.pkp_block a[href*="ReviewPolicy"]:active,
.pkp_block a[href*="OpenAccess"]:active,
.pkp_block a[href*="PublicationFrequency"]:active,
.pkp_block a[href*="PublicationCharge"]:active,
.pkp_block a[href*="information"]:active {
  transform:  translateX(2px);
  box-shadow: none;
  background: #d4e6f8 !important;
}


/* ══════════════════════════════════════════════
   BAGIAN 5 — SIDEBAR: ARTICLE TEMPLATE
   ══════════════════════════════════════════════ */

.pkp_block a:has(img[src*="template"]) {
  display:       inline-block;
  transition:    opacity 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
  border-radius: 4px;
}

.pkp_block a:has(img[src*="template"]):hover {
  opacity:    0.88;
  box-shadow: 0 4px 14px rgba(0,0,0,0.18);
  transform:  translateY(-2px);
}

.pkp_block a:has(img[src*="template"]):active {
  transform:  translateY(0);
  box-shadow: none;
}


/* ══════════════════════════════════════════════
   BAGIAN 6 — SIDEBAR: INDEX BY
   ══════════════════════════════════════════════ */

.pkp_block:has(img[src*="/images/logo/"]) .pkp_block_content {
  display:         flex !important;
  flex-wrap:       wrap !important;
  justify-content: center !important;
  align-items:     center !important;
  gap:             6px !important;
  padding:         4px !important;
}

.pkp_block a:has(img[src*="/images/logo/"]) {
  display:         inline-flex !important;
  align-items:     center;
  justify-content: center;
  background:      var(--index-btn-bg);
  border:          var(--index-btn-border);
  border-radius:   var(--index-btn-radius);
  padding:         var(--index-btn-padding);
  margin:          var(--index-btn-margin);
  box-shadow:      var(--index-btn-shadow);
  transition:      all 0.2s ease;
  text-decoration: none !important;
}

.pkp_block a:has(img[src*="/images/logo/"]):hover {
  background:   var(--index-btn-bg-hover);
  box-shadow:   var(--index-btn-shadow-hover);
  transform:    translateY(-2px);
  border-color: #a0b8d8;
}

.pkp_block a:has(img[src*="/images/logo/"]):active {
  transform:  translateY(0);
  box-shadow: var(--index-btn-shadow);
}

.pkp_block img[src*="/images/logo/"]:not(a img) {
  display:       inline-flex !important;
  background:    var(--index-btn-bg);
  border:        var(--index-btn-border);
  border-radius: var(--index-btn-radius);
  padding:       var(--index-btn-padding);
  margin:        var(--index-btn-margin);
  box-shadow:    var(--index-btn-shadow);
}

.pkp_block img[src*="/images/logo/"] {
  width:      var(--index-logo-width) !important;
  height:     auto !important;
  display:    block;
  object-fit: contain;
}


/* ══════════════════════════════════════════════
   BAGIAN 7 — SIDEBAR BLOCK
   ══════════════════════════════════════════════ */

.pkp_block {
  background:    #fff;
  border-radius: 18px;
  padding:       20px;
  box-shadow:    0 8px 25px rgba(0,0,0,0.05);
  border:        none;
  margin-bottom: 25px;
}

.pkp_block h2 {
  font-size:     18px;
  font-weight:   700;
  margin-bottom: 15px;
}


/* ══════════════════════════════════════════════
   BAGIAN 8 — CURRENT ISSUE
   DOM: .heading > a.cover + .description + .published
   Pakai grid 2 kolom biar published bisa
   ditempatkan tepat di bawah deskripsi
   ══════════════════════════════════════════════ */

.current_issue {
  margin-top: 40px !important;
}

.current_issue > h2 {
  font-size:     32px !important;
  color:         #d66b18 !important;
  margin-bottom: 20px !important;
  border-left:   5px solid #d66b18;
  padding-left:  15px;
}

.current_issue .obj_issue_toc {
  background:    #fff;
  border:        1px solid #ececec;
  border-radius: 18px;
  padding:       24px !important;
  box-shadow:    0 10px 30px rgba(0,0,0,0.05);
  margin-bottom: 0 !important;
}

/* Grid: kolom 1 = cover, kolom 2 = deskripsi
   baris 1 = cover+deskripsi, baris 2 = published */
.current_issue .heading {
  display:               grid !important;
  grid-template-columns: var(--issue-cover-size) 1fr !important;
  grid-template-rows:    auto auto !important;
  column-gap:            24px !important;
  row-gap:               0 !important;
  align-items:           start !important;
}

/* Cover: kolom 1, baris 1 saja */
.current_issue .heading > a.cover,
.current_issue .heading > .cover {
  grid-column: 1 !important;
  grid-row:    1 !important;
  display:     block !important;
  align-self:  start !important;
  width:       var(--issue-cover-size) !important;
}

.current_issue .heading > a.cover img,
.current_issue .heading > .cover img {
  width:         100% !important;
  display:       block !important;
  border-radius: 8px;
  box-shadow:    0 10px 30px rgba(0,0,0,0.12);
  transition:    0.3s ease;
}

.current_issue .heading > a.cover img:hover,
.current_issue .heading > .cover img:hover {
  transform: translateY(-4px);
}

/* Deskripsi: kolom 2, baris 1 */
.current_issue .heading > .description {
  grid-column:   2 !important;
  grid-row:      1 !important;
  align-self:    start !important;
  line-height:   1.8;
  color:         #555;
  margin:        0 !important;
  min-width:     0 !important;
}

.current_issue .heading > .description p {
  margin: 0 !important;
}

/* Published: kolom 2, baris 2 — tepat di bawah deskripsi */
.current_issue .heading > .published {
  grid-column:  2 !important;
  grid-row:     2 !important;
  align-self:   start !important;
  margin-top:   var(--published-margin-top) !important;
  margin-left:  var(--published-margin-left) !important;
  padding:      0 !important;
  font-size:    var(--published-font-size) !important;
  color:        var(--published-color) !important;
  text-align:   var(--published-text-align) !important;
}

/* Sections/Articles */
.current_issue .sections,
.pkp_page_issue .sections {
  margin-top:  16px !important;
  padding-top: 16px !important;
}

/* Hilangkan padding bawah berlebih */
.obj_issue_toc {
  margin-bottom:  0 !important;
  padding-bottom: 0 !important;
}

.current_issue_title {
  font-size:     19px !important;
  font-weight:   700 !important;
  color:         #1e293b;
  margin-bottom: 15px !important;
}

@media (max-width: 768px) {
  .current_issue .heading {
    grid-template-columns: 1fr !important;
    grid-template-rows:    auto !important;
  }
  .current_issue .heading > a.cover,
  .current_issue .heading > .cover {
    grid-column: 1 !important;
    grid-row:    1 !important;
    width:       160px !important;
    margin:      0 auto !important;
  }
  .current_issue .heading > .description {
    grid-column: 1 !important;
    grid-row:    2 !important;
  }
  .current_issue .heading > .published {
    grid-column: 1 !important;
    grid-row:    3 !important;
    text-align:  center !important;
  }
}


/* ══════════════════════════════════════════════
   BAGIAN 9 — ARTIKEL CARD
   ══════════════════════════════════════════════ */

.obj_article_summary {
  background:    #ffffff !important;
  border-left:   4px solid #e07b2a !important;
  border-radius: 0 8px 8px 0 !important;
  padding:       14px 18px !important;
  margin-bottom: 10px !important;
  box-shadow:    0 1px 6px rgba(224,123,42,0.08) !important;
  transition:    box-shadow 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
}

.obj_article_summary:hover {
  transform:    translateY(-2px) !important;
  box-shadow:   0 4px 16px rgba(224,123,42,0.16) !important;
  border-color: #ba6010 !important;
}

.obj_article_summary h3 a {
  color:           #1e3a5f !important;
  text-decoration: none !important;
  transition:      color 0.15s;
}

.obj_article_summary h3 a:hover {
  color: #e07b2a !important;
}

.obj_article_summary .authors {
  color:     #888 !important;
  font-size: 13px !important;
  margin:    4px 0 !important;
}

.obj_article_summary .pages {
  color:     #aaa !important;
  font-size: 12px !important;
}

.obj_article_summary .galleys_links a {
  display:         inline-block !important;
  background:      #fff5ec !important;
  border:          1px solid #f6a96c !important;
  border-radius:   20px !important;
  padding:         2px 12px !important;
  font-size:       12px !important;
  color:           #854f0b !important;
  text-decoration: none !important;
  margin-top:      6px !important;
  transition:      background 0.15s;
}

.obj_article_summary .galleys_links a:hover {
  background: #ffe8cc !important;
}


/* ══════════════════════════════════════════════
   BAGIAN 10 — PEER REVIEWER SECTION
   ══════════════════════════════════════════════ */

.loka-reviewer-section {
  padding:     40px 20px;
  font-family: Arial, sans-serif;
}

.loka-reviewer-container {
  max-width: 1050px;
  margin:    auto;
}

.loka-reviewer-title {
  text-align:    center;
  margin-bottom: 30px;
}

.loka-reviewer-title small {
  color:          #ea580c;
  letter-spacing: 3px;
  font-size:      12px;
  font-weight:    bold;
}

.loka-reviewer-title h2 {
  font-size: 38px;
  color:     #1e293b;
  margin:    10px 0;
}

.loka-reviewer-title p {
  color:       #64748b;
  font-size:   15px;
  line-height: 1.8;
  max-width:   700px;
  margin:      auto;
}

.loka-reviewer-grid {
  display:               grid;
  grid-template-columns: 1fr;
  gap:                   18px;
}

.loka-reviewer-card {
  border:        1px solid #fed7aa;
  border-left:   5px solid #f97316;
  border-radius: 18px;
  padding:       22px;
  display:       flex;
  align-items:   center;
  gap:           22px;
  transition:    0.3s ease;
  background:    white;
}

.loka-reviewer-card:hover {
  transform:  translateY(-4px);
  box-shadow: 0 10px 25px rgba(249,115,22,0.12);
}

.loka-reviewer-photo {
  width:         85px;
  height:        85px;
  border-radius: 50%;
  object-fit:    cover;
  border:        3px solid #fdba74;
  flex-shrink:   0;
}

.loka-reviewer-info { flex: 1; }

.loka-reviewer-name {
  font-size:     24px;
  color:         #1e293b;
  font-weight:   bold;
  margin-bottom: 6px;
}

.loka-reviewer-affiliation {
  color:         #475569;
  font-size:     14px;
  line-height:   1.7;
  margin-bottom: 12px;
}

.loka-reviewer-tags {
  display:   flex;
  flex-wrap: wrap;
  gap:       8px;
}

.loka-reviewer-tags span {
  background:    #fff7ed;
  color:         #ea580c;
  padding:       6px 12px;
  border-radius: 30px;
  font-size:     12px;
  border:        1px solid #fdba74;
}

@media (max-width: 768px) {
  .loka-reviewer-card {
    flex-direction: column;
    text-align:     center;
  }
  .loka-reviewer-name  { font-size: 22px; }
  .loka-reviewer-tags  { justify-content: center; }
}


/* ══════════════════════════════════════════════
   BAGIAN 11 — EDITORIAL TEAM SECTION
   ══════════════════════════════════════════════ */

.loka-editorial-section {
  padding:     40px 20px;
  font-family: Arial, sans-serif;
}

.loka-editorial-container {
  max-width: 1050px;
  margin:    auto;
}

.loka-editorial-title {
  text-align:    center;
  margin-bottom: 35px;
}

.loka-editorial-title small {
  color:          #ea580c;
  letter-spacing: 3px;
  font-size:      12px;
  font-weight:    bold;
}

.loka-editorial-title h2 {
  font-size: 38px;
  color:     #1e293b;
  margin:    10px 0;
}

.loka-editorial-title p {
  color:       #64748b;
  font-size:   15px;
  line-height: 1.8;
  max-width:   700px;
  margin:      auto;
}

.loka-editorial-grid {
  display:               grid;
  grid-template-columns: 1fr;
  gap:                   18px;
}

.loka-editorial-card {
  border:        1px solid #fed7aa;
  border-left:   5px solid #f97316;
  border-radius: 18px;
  padding:       22px;
  display:       flex;
  align-items:   center;
  gap:           22px;
  transition:    0.3s ease;
  background:    white;
}

.loka-editorial-card:hover {
  transform:  translateY(-4px);
  box-shadow: 0 10px 25px rgba(249,115,22,0.12);
}

.loka-editorial-photo {
  width:         85px;
  height:        85px;
  border-radius: 50%;
  object-fit:    cover;
  border:        3px solid #fdba74;
  background:    #fff7ed;
  flex-shrink:   0;
}

.loka-editorial-info { flex: 1; }

.loka-editorial-name {
  font-size:     24px;
  color:         #1e293b;
  font-weight:   bold;
  margin-bottom: 6px;
}

.loka-editorial-position {
  color:          #ea580c;
  font-size:      14px;
  font-weight:    bold;
  margin-bottom:  8px;
  letter-spacing: 0.3px;
}

.loka-editorial-affiliation {
  color:         #475569;
  font-size:     14px;
  line-height:   1.7;
  margin-bottom: 12px;
}

.loka-editorial-tags {
  display:   flex;
  flex-wrap: wrap;
  gap:       8px;
}

.loka-editorial-tags span {
  background:    #fff7ed;
  color:         #ea580c;
  padding:       6px 12px;
  border-radius: 30px;
  font-size:     12px;
  border:        1px solid #fdba74;
}

@media (max-width: 768px) {
  .loka-editorial-card {
    flex-direction: column;
    text-align:     center;
  }
  .loka-editorial-name { font-size: 22px; }
  .loka-editorial-tags { justify-content: center; }
}


/* ══════════════════════════════════════════════
   BAGIAN 12 — RUNNING TEXT (Marquee)
   ══════════════════════════════════════════════ */

.loka-marquee {
  width:      100%;
  overflow:   hidden;
  background: #111827;
  color:      white;
  padding:    10px 0;
  box-sizing: border-box;
}

.loka-marquee-inner {
  display:   flex;
  width:     max-content;
  animation: lokaRun 30s linear infinite;
}

.loka-marquee-content {
  display:        inline-block;
  white-space:    nowrap;
  padding-right:  80px;
  font-size:      14px;
  font-weight:    500;
  letter-spacing: 0.5px;
}

.loka-marquee-content span {
  color:       #fbbf24;
  font-weight: bold;
}

@keyframes lokaRun {
  from { transform: translateX(0); }
  to   { transform: translateX(-50%); }
}


/* ══════════════════════════════════════════════
   BAGIAN 13 — HERO CARD
   ══════════════════════════════════════════════ */

.lb-hero-card {
  background:    linear-gradient(135deg, #e87722 0%, #c75b12 100%);
  color:         white;
  padding:       40px 50px;
  border-radius: 18px;
  margin:        30px 0;
  box-shadow:    0 15px 40px rgba(0,0,0,0.12);
}

.lb-hero-badge {
  display:        inline-block;
  padding:        8px 14px;
  background:     rgba(255,255,255,0.15);
  border-radius:  999px;
  font-size:      12px;
  font-weight:    700;
  letter-spacing: 1px;
  margin-bottom:  20px;
}

.lb-hero-card h1 {
  font-size:   56px;
  line-height: 1;
  margin:      0 0 10px;
  color:       white;
}

.lb-hero-card h2 {
  font-size:     24px;
  font-weight:   500;
  margin-bottom: 20px;
  color:         white;
}

.lb-hero-card p {
  font-size:   15px;
  line-height: 1.8;
  max-width:   none;
  opacity:     0.95;
}

.lb-hero-buttons {
  margin-top: 30px;
  display:    flex;
  gap:        15px;
  flex-wrap:  wrap;
}

.lb-btn-primary {
  background:      white;
  color:           #c75b12 !important;
  padding:         14px 28px;
  border-radius:   10px;
  text-decoration: none !important;
  font-weight:     700;
}

.lb-btn-secondary {
  border:          2px solid white;
  color:           white !important;
  padding:         14px 28px;
  border-radius:   10px;
  text-decoration: none !important;
  font-weight:     700;
}

.lb-btn-primary:hover,
.lb-btn-secondary:hover { transform: translateY(-2px); }

.lb-hero-content {
  display:         flex;
  align-items:     center;
  justify-content: space-between;
  gap:             50px;
}

.lb-hero-left {
  flex:      1;
  max-width: 700px;
}

.lb-hero-right {
  flex:            0 0 220px;
  display:         flex;
  justify-content: center;
  align-items:     center;
}

.lb-hero-right img {
  width:         220px;
  height:        auto;
  border-radius: 12px;
  box-shadow:    0 15px 35px rgba(0,0,0,0.18);
}

.lb-metrics {
  display:    flex;
  flex-wrap:  wrap;
  gap:        10px;
  margin-top: 20px;
}

.lb-metric {
  background:    rgba(255,255,255,0.15);
  border:        1px solid rgba(255,255,255,0.18);
  border-radius: 12px;
  padding:       10px 14px;
  min-width:     95px;
}

.lb-number {
  display:     block;
  color:       #ffffff;
  font-size:   22px;
  font-weight: 700;
  line-height: 1.1;
}

.lb-label {
  display:    block;
  color:      rgba(255,255,255,0.9);
  font-size:  12px;
  margin-top: 5px;
}

@media (max-width: 768px) {
  .lb-hero-card       { padding: 30px 20px; }
  .lb-hero-content    { flex-direction: column-reverse; gap: 25px; text-align: center; }
  .lb-hero-right img  { width: 170px; }
  .lb-hero-card h1    { font-size: 42px; }
  .lb-hero-card h2    { font-size: 20px; }
  .lb-metrics         { justify-content: center; gap: 10px; }
  .lb-metric          { min-width: 100px; padding: 12px; }
  .lb-number          { font-size: 22px; }
  .lb-hero-buttons    { justify-content: center; }
}


/* ══════════════════════════════════════════════
   BAGIAN 14 — HERO V4 (Background Image)
   ══════════════════════════════════════════════ */

.lb-hero-v4 {
  position:          relative;
  overflow:          hidden;
  border-radius:     18px;
  min-height:        420px;
  margin:            30px 0;
  background-image:
    linear-gradient(
      90deg,
      rgba(214,107,24,0.96) 0%,
      rgba(214,107,24,0.90) 45%,
      rgba(214,107,24,0.45) 70%,
      rgba(214,107,24,0.05) 100%
    ),
    url("https://jaf-fisib.unpak.ac.id/public/journals/1/homepageImage_en_US.png");
  background-size:     cover;
  background-position: center;
}

.lb-hero-inner {
  position:  relative;
  z-index:   2;
  max-width: 800px;
  padding:   60px;
}

.lb-hero-v4 h1 {
  color:         #fff;
  font-size:     72px;
  line-height:   1;
  margin-bottom: 12px;
  font-weight:   800;
}

.lb-hero-v4 h2 {
  color:         #fff;
  font-size:     28px;
  margin-bottom: 20px;
}

.lb-hero-v4 p {
  color:         #fff;
  font-size:     18px;
  line-height:   1.8;
  margin-bottom: 30px;
}

@media (max-width: 768px) {
  .lb-hero-v4         { min-height: auto; }
  .lb-hero-inner      { padding: 35px 25px; }
  .lb-hero-v4 h1      { font-size: 42px; }
  .lb-hero-v4 h2      { font-size: 20px; }
  .lb-hero-v4 p       { font-size: 15px; }
}


/* ══════════════════════════════════════════════
   BAGIAN 15 — FOOTER
   ══════════════════════════════════════════════ */

.pkp_brand_footer,
.page_footer .pkp_brand_footer,
footer .pkp_brand_footer {
  display:    none !important;
  visibility: hidden !important;
  height:     0 !important;
  overflow:   hidden !important;
}

.pkp_structure_footer_wrapper {
  background:  #ffffff !important;
  border-top:  4px solid #ea580c;
  margin-top:  0 !important;
  padding-top: 0 !important;
  box-shadow:  0 -2px 20px rgba(0,0,0,0.04);
}

.pkp_structure_footer {
  background:  #ffffff !important;
  color:       #111827 !important;
  padding:     0 40px 30px !important;
  margin-top:  0 !important;
  font-family: Arial, sans-serif;
}

.pkp_footer_content {
  max-width:   1200px;
  margin:      auto;
  line-height: 1.9;
  font-size:   15px;
  color:       #374151 !important;
}

.pkp_footer_content strong,
.pkp_footer_content b {
  color:          #111827;
  font-size:      16px;
  letter-spacing: 0.3px;
}

.pkp_footer_content a {
  color:           #ea580c !important;
  text-decoration: none;
  font-weight:     600;
  transition:      all 0.3s ease;
}

.pkp_footer_content a:hover {
  color:        #c2410c !important;
  padding-left: 3px;
}

.pkp_footer_content p { margin-bottom: 12px; }

.page_index_journal .homepage_image,
.page_index_journal .current_issue,
.page_index_journal .additional_content {
  margin-bottom: 0 !important;
}

@media (max-width: 900px) {
  .jaf-footer-grid    { grid-template-columns: 1fr 1fr !important; padding: 28px 24px 20px !important; }
  .jaf-col-brand      { padding-right: 20px !important; border-right: 1px solid #f0f0f0 !important; border-bottom: none !important; }
  .jaf-col-info       { padding-left: 20px !important; padding-right: 0 !important; border-right: none !important; }
  .jaf-col-index      { padding-left: 0 !important; padding-right: 20px !important; border-right: 1px solid #f0f0f0 !important; border-top: 1px solid #f0f0f0 !important; padding-top: 24px !important; }
  .jaf-col-contact    { padding-left: 20px !important; border-top: 1px solid #f0f0f0 !important; padding-top: 24px !important; }
  .jaf-footer-bottom  { flex-direction: column !important; align-items: flex-start !important; padding: 13px 24px !important; }
}

@media (max-width: 540px) {
  .jaf-footer-grid    { grid-template-columns: 1fr !important; padding: 24px 16px !important; }
  .jaf-col-brand      { padding-right: 0 !important; border-right: none !important; border-bottom: 1px solid #f0f0f0 !important; padding-bottom: 20px !important; }
  .jaf-col-info       { padding: 20px 0 !important; border-right: none !important; border-bottom: 1px solid #f0f0f0 !important; }
  .jaf-col-index      { padding: 20px 0 !important; border-right: none !important; border-top: none !important; border-bottom: 1px solid #f0f0f0 !important; }
  .jaf-col-contact    { padding-left: 0 !important; padding-top: 20px !important; border-top: none !important; }
  .jaf-footer-bottom  { flex-direction: column !important; align-items: flex-start !important; padding: 12px 16px !important; gap: 6px !important; }
  .pkp_structure_footer { padding: 35px 20px 25px !important; }
  .pkp_footer_content   { font-size: 14px; line-height: 1.8; }
}


/* ══════════════════════════════════════════════
   BAGIAN 16 — ABOUT JOURNAL MODERN SIDEBAR
   ══════════════════════════════════════════════ */

.lb-about-menu {
  display:        flex;
  flex-direction: column;
  gap:            8px;
}

.lb-about-menu a {
  display:         block;
  padding:         10px 14px;
  background:      #e0643a;
  color:           #fff !important;
  font-weight:     600;
  text-decoration: none !important;
  border-radius:   8px;
  transition:      0.25s ease;
  box-shadow:      0 2px 6px rgba(0,0,0,0.08);
}

.lb-about-menu a:hover {
  background: #c7522d;
  transform:  translateX(6px);
  box-shadow: 0 8px 18px rgba(224,100,58,0.25);
}

.lb-about-menu a::before {
  content:      "›";
  margin-right: 10px;
  font-size:    14px;
  font-weight:  700;
}


/* ══════════════════════════════════════════════
   PANDUAN KUSTOMISASI CEPAT

   CURRENT ISSUE COVER : --issue-cover-size: 180px
   PUBLISHED MARGIN-TOP: --published-margin-top: 12px
   PUBLISHED ALIGN     : --published-text-align: left / center
   PUBLISHED WARNA     : --published-color: #888
   COVER HOMEPAGE      : --cover-width: 180px
   INDEX BY LOGO       : --index-logo-width: 200px
   MARQUEE SPEED       : ubah 30s di @keyframes lokaRun
   ══════════════════════════════════════════════ */