@import url('https://fonts.googleapis.com/css?family=Montserrat:400,700|Noto+Serif:400,400i,700,700i');
@import url('https://fonts.googleapis.com/icon?family=Material+Icons');
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.css?v=3.2.0.3');
@import url('https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css?v=3.2.0.3');
@import url('https://cdn.rawgit.com/jpswalsh/academicons/master/css/academicons.min.css?v=3.2.0.3');

html, body {
  background: url("https://jurnal.polbeng.ac.id/public/site/images/admin/bg.png") #f5f9fb fixed !important;
  text-align: justify;
}
/* == Header ==*/
.pkp_site_name {padding-top: 0 !important; padding-bottom: 0 !important}
.pkp_site_name > a {padding-top: 0; padding-bottom: 0;}
.pkp_site_name .is_img img {max-height: 200px !important;}
.pkp_site_name_wrapper {padding-left: 0; padding-right: 0; line-height: 0em;}
.pkp_navigation_user_wrapper {top: 0; right: 0; padding-right:30px;}
.pkp_structure_page {margin-top:  20px !important; margin-bottom:20 !important; padding-bottom: 20 !important; text-align: justify;}
.pkp_structure_sidebar > * {border: none !important;margin: 0;}


/* == Footer ==*/
.pkp_footer_content {
  float: left;
  width: 100%;  padding-top: 10px;
  padding-bottom:10px;
  background-color: #fff;
   border-top: 7px solid #095490;
}

.pkp_brand_footer {
  float: right;
  width: 30%;
  padding-bottom:10px;
  padding-top: 50px;
}

.pkp_structure_footer_wrapper {
 border-top:1px solid #ddd;
 font-size: 1em;
 border-bottom:10px solid #1e6292
}

/*menu*/
.ac-label {
  font-weight: 700;
  position: relative;
  padding: .5em 1em;
  margin-bottom: .5em;
  display: block;
  cursor: pointer;
  background-color: #f29b11;
  transition: background-color .15s ease-in-out;
}

.ac-input:checked + label, .ac-label:hover {
  background-color: #f29b11;
}

.ac-label:after, .ac-input:checked + .ac-label:after {
  content: "+";
  position: absolute;
  display: block;
  right: 0;
  top: 0;
  width: 2em;
  height: 100%;
  line-height: 2.25em;
  text-align: center;
  background-color: #f9bf3b;
  transition: background-color .15s ease-in-out;
}

.ac-label:hover:after, .ac-input:checked + .ac-label:after {
  background-color: #f29b11;
}

.ac-input:checked + .ac-label:after {
  content: "-";
}

.ac-input {
  display: none;
}

.ac-text, .ac-sub-text {
  opacity: 0;
  height: 0;
  margin-bottom: .5em;
  transition: opacity .5s ease-in-out;
  overflow: hidden;
}

.ac-input:checked ~ .ac-text, .ac-sub .ac-input:checked ~ .ac-sub-text {
  opacity: 1;
  height: auto;
}

.ac-sub .ac-label {
  background: none;
  font-weight: 600;
  padding: .5em 2em;
  margin-bottom: 0;
}

.ac-sub .ac-label:checked {
  background: none;
  border-bottom: 1px solid whitesmoke;
}

.ac-sub .ac-label:after, .ac-sub .ac-input:checked + .ac-label:after {
  left: 0;
  background: none;
}

.ac-sub .ac-input:checked + label, .ac-sub .ac-label:hover {
  background: none;
}

.ac-sub-text {
  padding: 0 1em 0 2em;
}



table {
  font-family: arial, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

td, th {
  border: 1px solid #dddddd;
  text-align: left;
  padding: 8px;
}

tr:nth-child(even) {
  background-color: #dddddd;
}

/**********************
/***** Artikel *******
/*********************/
/*
.article-files-inline {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    font-size: 0.9em;
    margin-top: 5px;
    align-items: center;
}

.article-stats {
    color: #555;
}

.article-doi-inline a {
    color: #1a73e8;
    text-decoration: none;
}
.article-doi-inline a:hover {
    text-decoration: underline;
}

.author-name {
    font-weight: bold;
}

*/

.w3-image{max-width:100%;height:auto}img{vertical-align:middle}a{color:inherit}
.w3-table,.w3-table-all{border-collapse:collapse;border-spacing:0;width:100%;display:table}.w3-table-all{border:1px solid #ccc}
.w3-bordered tr,.w3-table-all tr{border-bottom:1px solid #ddd}.w3-striped tbody tr:nth-child(even){background-color:#f1f1f1}
.w3-table-all tr:nth-child(odd){background-color:#fff}.w3-table-all tr:nth-child(even){background-color:#f1f1f1}
.w3-hoverable tbody tr:hover,.w3-ul.w3-hoverable li:hover{background-color:#ccc}.w3-centered tr th,.w3-centered tr td{text-align:center}
.w3-table td,.w3-table th,.w3-table-all td,.w3-table-all th{padding:8px 8px;display:table-cell;text-align:left;vertical-align:top}
.w3-table th:first-child,.w3-table td:first-child,.w3-table-all th:first-child,.w3-table-all td:first-child{padding-left:16px}
.w3-btn,.w3-button{border:none;display:inline-block;padding:8px 16px;vertical-align:middle;overflow:hidden;text-decoration:none;color:inherit;background-color:inherit;text-align:center;cursor:pointer;white-space:nowrap}
.w3-btn:hover{box-shadow:0 8px 16px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19)}
.w3-btn,.w3-button{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}   
.w3-disabled,.w3-btn:disabled,.w3-button:disabled{cursor:not-allowed;opacity:0.3}.w3-disabled *,:disabled *{pointer-events:none}
.w3-btn.w3-disabled:hover,.w3-btn:disabled:hover{box-shadow:none}
.w3-badge,.w3-tag{background-color:#000;color:#fff;display:inline-block;padding-left:8px;padding-right:8px;text-align:center}.w3-badge{border-radius:50%}
.w3-ul{list-style-type:none;padding:0;margin:0}.w3-ul li{padding:8px 16px;border-bottom:1px solid #ddd}.w3-ul li:last-child{border-bottom:none}
.w3-tooltip,.w3-display-container{position:relative}.w3-tooltip .w3-text{display:none}.w3-tooltip:hover .w3-text{display:inline-block}
.w3-ripple:active{opacity:0.5}.w3-ripple{transition:opacity 0s}
.w3-input{padding:8px;display:block;border:none;border-bottom:1px solid #ccc;width:100%}
.w3-select{padding:9px 0;width:100%;border:none;border-bottom:1px solid #ccc}
.w3-dropdown-click,.w3-dropdown-hover{position:relative;display:inline-block;cursor:pointer}
.w3-dropdown-hover:hover .w3-dropdown-content{display:block}
.w3-dropdown-hover:first-child,.w3-dropdown-click:hover{background-color:#ccc;color:#000}
.w3-dropdown-hover:hover > .w3-button:first-child,.w3-dropdown-click:hover > .w3-button:first-child{background-color:#ccc;color:#000}
.w3-dropdown-content{cursor:auto;color:#000;background-color:#fff;display:none;position:absolute;min-width:160px;margin:0;padding:0;z-index:1}
.w3-check,.w3-radio{width:24px;height:24px;position:relative;top:6px}
.w3-sidebar{height:100%;width:200px;background-color:#fff;position:fixed!important;z-index:1;overflow:auto}
.w3-bar-block .w3-dropdown-hover,.w3-bar-block .w3-dropdown-click{width:100%}
.w3-bar-block .w3-dropdown-hover .w3-dropdown-content,.w3-bar-block .w3-dropdown-click .w3-dropdown-content{min-width:100%}
.w3-bar-block .w3-dropdown-hover .w3-button,.w3-bar-block .w3-dropdown-click .w3-button{width:100%;text-align:left;padding:8px 16px}
.w3-main,#main{transition:margin-left .4s}
.w3-modal{z-index:3;display:none;padding-top:100px;position:fixed;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:rgb(0,0,0);background-color:rgba(0,0,0,0.4)}
.w3-modal-content{margin:auto;background-color:#fff;position:relative;padding:0;outline:0;width:600px}
.w3-bar{width:100%;overflow:hidden}.w3-center .w3-bar{display:inline-block;width:auto}
.w3-bar .w3-bar-item{padding:8px 16px;float:left;width:auto;border:none;display:block;outline:0}
.w3-bar .w3-dropdown-hover,.w3-bar .w3-dropdown-click{position:static;float:left}
.w3-bar .w3-button{white-space:normal}
.w3-bar-block .w3-bar-item{width:100%;display:block;padding:8px 16px;text-align:left;border:none;white-space:normal;float:none;outline:0}
.w3-bar-block.w3-center .w3-bar-item{text-align:center}.w3-block{display:block;width:100%}
.w3-responsive{display:block;overflow-x:auto}
.w3-container:after,.w3-container:before,.w3-panel:after,.w3-panel:before,.w3-row:after,.w3-row:before,.w3-row-padding:after,.w3-row-padding:before,
.w3-cell-row:before,.w3-cell-row:after,.w3-clear:after,.w3-clear:before,.w3-bar:before,.w3-bar:after{content:"";display:table;clear:both}
.w3-col,.w3-half,.w3-third,.w3-twothird,.w3-threequarter,.w3-quarter{float:left;width:100%}
.w3-col.s1{width:8.33333%}.w3-col.s2{width:16.66666%}.w3-col.s3{width:24.99999%}.w3-col.s4{width:33.33333%}
.w3-col.s5{width:41.66666%}.w3-col.s6{width:49.99999%}.w3-col.s7{width:58.33333%}.w3-col.s8{width:66.66666%}
.w3-col.s9{width:74.99999%}.w3-col.s10{width:83.33333%}.w3-col.s11{width:91.66666%}.w3-col.s12{width:99.99999%}
@media (min-width:601px){.w3-col.m1{width:8.33333%}.w3-col.m2{width:16.66666%}.w3-col.m3,.w3-quarter{width:24.99999%}.w3-col.m4,.w3-third{width:33.33333%}
.w3-col.m5{width:41.66666%}.w3-col.m6,.w3-half{width:49.99999%}.w3-col.m7{width:58.33333%}.w3-col.m8,.w3-twothird{width:66.66666%}
.w3-col.m9,.w3-threequarter{width:74.99999%}.w3-col.m10{width:83.33333%}.w3-col.m11{width:91.66666%}.w3-col.m12{width:99.99999%}}
@media (min-width:993px){.w3-col.l1{width:8.33333%}.w3-col.l2{width:16.66666%}.w3-col.l3{width:24.99999%}.w3-col.l4{width:33.33333%}
.w3-col.l5{width:41.66666%}.w3-col.l6{width:49.99999%}.w3-col.l7{width:58.33333%}.w3-col.l8{width:66.66666%}
.w3-col.l9{width:74.99999%}.w3-col.l10{width:83.33333%}.w3-col.l11{width:91.66666%}.w3-col.l12{width:99.99999%}}
.w3-rest{overflow:hidden}.w3-stretch{margin-left:-16px;margin-right:-16px}
.w3-content,.w3-auto{margin-left:auto;margin-right:auto}.w3-content{max-width:980px}.w3-auto{max-width:1140px}
.w3-cell-row{display:table;width:100%}.w3-cell{display:table-cell}
.w3-cell-top{vertical-align:top}.w3-cell-middle{vertical-align:middle}.w3-cell-bottom{vertical-align:bottom}
.w3-hide{display:none!important}.w3-show-block,.w3-show{display:block!important}.w3-show-inline-block{display:inline-block!important}
@media (max-width:1205px){.w3-auto{max-width:95%}}
@media (max-width:600px){.w3-modal-content{margin:0 10px;width:auto!important}.w3-modal{padding-top:30px}
.w3-dropdown-hover.w3-mobile .w3-dropdown-content,.w3-dropdown-click.w3-mobile .w3-dropdown-content{position:relative}  
.w3-hide-small{display:none!important}.w3-mobile{display:block;width:100%!important}.w3-bar-item.w3-mobile,.w3-dropdown-hover.w3-mobile,.w3-dropdown-click.w3-mobile{text-align:center}
.w3-dropdown-hover.w3-mobile,.w3-dropdown-hover.w3-mobile .w3-btn,.w3-dropdown-hover.w3-mobile .w3-button,.w3-dropdown-click.w3-mobile,.w3-dropdown-click.w3-mobile .w3-btn,.w3-dropdown-click.w3-mobile .w3-button{width:100%}}
@media (max-width:768px){.w3-modal-content{width:500px}.w3-modal{padding-top:50px}}
@media (min-width:993px){.w3-modal-content{width:900px}.w3-hide-large{display:none!important}.w3-sidebar.w3-collapse{display:block!important}}
@media (max-width:992px) and (min-width:601px){.w3-hide-medium{display:none!important}}
@media (max-width:992px){.w3-sidebar.w3-collapse{display:none}.w3-main{margin-left:0!important;margin-right:0!important}.w3-auto{max-width:100%}}
.w3-top,.w3-bottom{position:fixed;width:100%;z-index:1}.w3-top{top:0}.w3-bottom{bottom:0}
.w3-overlay{position:fixed;display:none;width:100%;height:100%;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,0.5);z-index:2}
.w3-display-topleft{position:absolute;left:0;top:0}.w3-display-topright{position:absolute;right:0;top:0}
.w3-display-bottomleft{position:absolute;left:0;bottom:0}.w3-display-bottomright{position:absolute;right:0;bottom:0}
.w3-display-middle{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%)}
.w3-display-left{position:absolute;top:50%;left:0%;transform:translate(0%,-50%);-ms-transform:translate(-0%,-50%)}
.w3-display-right{position:absolute;top:50%;right:0%;transform:translate(0%,-50%);-ms-transform:translate(0%,-50%)}
.w3-display-topmiddle{position:absolute;left:50%;top:0;transform:translate(-50%,0%);-ms-transform:translate(-50%,0%)}
.w3-display-bottommiddle{position:absolute;left:50%;bottom:0;transform:translate(-50%,0%);-ms-transform:translate(-50%,0%)}
.w3-display-container:hover .w3-display-hover{display:block}.w3-display-container:hover span.w3-display-hover{display:inline-block}.w3-display-hover{display:none}
.w3-display-position{position:absolute}
.w3-circle{border-radius:50%}
.w3-round-small{border-radius:2px}.w3-round,.w3-round-medium{border-radius:4px}.w3-round-large{border-radius:8px}.w3-round-xlarge{border-radius:16px}.w3-round-xxlarge{border-radius:32px}
.w3-row-padding,.w3-row-padding>.w3-half,.w3-row-padding>.w3-third,.w3-row-padding>.w3-twothird,.w3-row-padding>.w3-threequarter,.w3-row-padding>.w3-quarter,.w3-row-padding>.w3-col{padding:0 8px}
.w3-container,.w3-panel{padding:0.01em 16px}.w3-panel{margin-top:16px;margin-bottom:16px}
.w3-code,.w3-codespan{font-family:Consolas,"courier new";font-size:16px}
.w3-code{width:auto;background-color:#fff;padding:8px 12px;border-left:4px solid #4CAF50;word-wrap:break-word}
.w3-codespan{color:crimson;background-color:#f1f1f1;padding-left:4px;padding-right:4px;font-size:110%}
.w3-card,.w3-card-2{box-shadow:0 2px 5px 0 rgba(0,0,0,0.16),0 2px 10px 0 rgba(0,0,0,0.12)}
.w3-card-4,.w3-hover-shadow:hover{box-shadow:0 4px 10px 0 rgba(0,0,0,0.2),0 4px 20px 0 rgba(0,0,0,0.19)}
.w3-spin{animation:w3-spin 2s infinite linear}@keyframes w3-spin{0%{transform:rotate(0deg)}100%{transform:rotate(359deg)}}
.w3-animate-fading{animation:fading 10s infinite}@keyframes fading{0%{opacity:0}50%{opacity:1}100%{opacity:0}}
.w3-animate-opacity{animation:opac 0.8s}@keyframes opac{from{opacity:0} to{opacity:1}}
.w3-animate-top{position:relative;animation:animatetop 0.4s}@keyframes animatetop{from{top:-300px;opacity:0} to{top:0;opacity:1}}
.w3-animate-left{position:relative;animation:animateleft 0.4s}@keyframes animateleft{from{left:-300px;opacity:0} to{left:0;opacity:1}}
.w3-animate-right{position:relative;animation:animateright 0.4s}@keyframes animateright{from{right:-300px;opacity:0} to{right:0;opacity:1}}
.w3-animate-bottom{position:relative;animation:animatebottom 0.4s}@keyframes animatebottom{from{bottom:-300px;opacity:0} to{bottom:0;opacity:1}}
.w3-animate-zoom {animation:animatezoom 0.6s}@keyframes animatezoom{from{transform:scale(0)} to{transform:scale(1)}}
.w3-animate-input{transition:width 0.4s ease-in-out}.w3-animate-input:focus{width:100%!important}
.w3-opacity,.w3-hover-opacity:hover{opacity:0.60}.w3-opacity-off,.w3-hover-opacity-off:hover{opacity:1}
.w3-opacity-max{opacity:0.25}.w3-opacity-min{opacity:0.75}
.w3-greyscale-max,.w3-grayscale-max,.w3-hover-greyscale:hover,.w3-hover-grayscale:hover{filter:grayscale(100%)}
.w3-greyscale,.w3-grayscale{filter:grayscale(75%)}.w3-greyscale-min,.w3-grayscale-min{filter:grayscale(50%)}
.w3-sepia{filter:sepia(75%)}.w3-sepia-max,.w3-hover-sepia:hover{filter:sepia(100%)}.w3-sepia-min{filter:sepia(50%)}
.w3-tiny{font-size:10px!important}.w3-small{font-size:12px!important}.w3-medium{font-size:15px!important}.w3-large{font-size:18px!important}
.w3-xlarge{font-size:24px!important}.w3-xxlarge{font-size:36px!important}.w3-xxxlarge{font-size:48px!important}.w3-jumbo{font-size:64px!important}
.w3-left-align{text-align:left!important}.w3-right-align{text-align:right!important}.w3-justify{text-align:justify!important}.w3-center{text-align:center!important}
.w3-border-0{border:0!important}.w3-border{border:1px solid #ccc!important}
.w3-border-top{border-top:1px solid #ccc!important}.w3-border-bottom{border-bottom:1px solid #ccc!important}
.w3-border-left{border-left:1px solid #ccc!important}.w3-border-right{border-right:1px solid #ccc!important}
.w3-topbar{border-top:6px solid #ccc!important}.w3-bottombar{border-bottom:6px solid #ccc!important}
.w3-leftbar{border-left:6px solid #ccc!important}.w3-rightbar{border-right:6px solid #ccc!important}
.w3-section,.w3-code{margin-top:16px!important;margin-bottom:16px!important}
.w3-margin{margin:16px!important}.w3-margin-top{margin-top:16px!important}.w3-margin-bottom{margin-bottom:16px!important}
.w3-margin-left{margin-left:16px!important}.w3-margin-right{margin-right:16px!important}
.w3-padding-small{padding:4px 8px!important}.w3-padding{padding:8px 16px!important}.w3-padding-large{padding:12px 24px!important}
.w3-padding-16{padding-top:16px!important;padding-bottom:16px!important}.w3-padding-24{padding-top:24px!important;padding-bottom:24px!important}
.w3-padding-32{padding-top:32px!important;padding-bottom:32px!important}.w3-padding-48{padding-top:48px!important;padding-bottom:48px!important}
.w3-padding-64{padding-top:64px!important;padding-bottom:64px!important}
.w3-padding-top-64{padding-top:64px!important}.w3-padding-top-48{padding-top:48px!important}
.w3-padding-top-32{padding-top:32px!important}.w3-padding-top-24{padding-top:24px!important}
.w3-left{float:left!important}.w3-right{float:right!important}
.w3-button:hover{color:#000!important;background-color:#ccc!important}
.w3-transparent,.w3-hover-none:hover{background-color:transparent!important}
.w3-hover-none:hover{box-shadow:none!important}
/* Colors */
.w3-amber,.w3-hover-amber:hover{color:#000!important;background-color:#ffc107!important}
.w3-aqua,.w3-hover-aqua:hover{color:#000!important;background-color:#00ffff!important}
.w3-blue,.w3-hover-blue:hover{color:#fff!important;background-color:#2196F3!important}
.w3-light-blue,.w3-hover-light-blue:hover{color:#000!important;background-color:#87CEEB!important}
.w3-brown,.w3-hover-brown:hover{color:#fff!important;background-color:#795548!important}
.w3-cyan,.w3-hover-cyan:hover{color:#000!important;background-color:#00bcd4!important}
.w3-blue-grey,.w3-hover-blue-grey:hover,.w3-blue-gray,.w3-hover-blue-gray:hover{color:#fff!important;background-color:#607d8b!important}
.w3-green,.w3-hover-green:hover{color:#fff!important;background-color:#4CAF50!important}
.w3-light-green,.w3-hover-light-green:hover{color:#000!important;background-color:#8bc34a!important}
.w3-indigo,.w3-hover-indigo:hover{color:#fff!important;background-color:#3f51b5!important}
.w3-khaki,.w3-hover-khaki:hover{color:#000!important;background-color:#f0e68c!important}
.w3-lime,.w3-hover-lime:hover{color:#000!important;background-color:#cddc39!important}
.w3-orange,.w3-hover-orange:hover{color:#000!important;background-color:#ff9800!important}
.w3-deep-orange,.w3-hover-deep-orange:hover{color:#fff!important;background-color:#ff5722!important}
.w3-pink,.w3-hover-pink:hover{color:#fff!important;background-color:#e91e63!important}
.w3-purple,.w3-hover-purple:hover{color:#fff!important;background-color:#9c27b0!important}
.w3-deep-purple,.w3-hover-deep-purple:hover{color:#fff!important;background-color:#673ab7!important}
.w3-red,.w3-hover-red:hover{color:#fff!important;background-color:#f44336!important}
.w3-sand,.w3-hover-sand:hover{color:#000!important;background-color:#fdf5e6!important}
.w3-teal,.w3-hover-teal:hover{color:#fff!important;background-color:#009688!important}
.w3-yellow,.w3-hover-yellow:hover{color:#000!important;background-color:#ffeb3b!important}
.w3-white,.w3-hover-white:hover{color:#000!important;background-color:#fff!important}
.w3-black,.w3-hover-black:hover{color:#fff!important;background-color:#000!important}
.w3-grey,.w3-hover-grey:hover,.w3-gray,.w3-hover-gray:hover{color:#000!important;background-color:#9e9e9e!important}
.w3-light-grey,.w3-hover-light-grey:hover,.w3-light-gray,.w3-hover-light-gray:hover{color:#000!important;background-color:#f1f1f1!important}
.w3-dark-grey,.w3-hover-dark-grey:hover,.w3-dark-gray,.w3-hover-dark-gray:hover{color:#fff!important;background-color:#616161!important}
.w3-pale-red,.w3-hover-pale-red:hover{color:#000!important;background-color:#ffdddd!important}
.w3-pale-green,.w3-hover-pale-green:hover{color:#000!important;background-color:#ddffdd!important}
.w3-pale-yellow,.w3-hover-pale-yellow:hover{color:#000!important;background-color:#ffffcc!important}
.w3-pale-blue,.w3-hover-pale-blue:hover{color:#000!important;background-color:#ddffff!important}
.w3-text-amber,.w3-hover-text-amber:hover{color:#ffc107!important}
.w3-text-aqua,.w3-hover-text-aqua:hover{color:#00ffff!important}
.w3-text-blue,.w3-hover-text-blue:hover{color:#2196F3!important}
.w3-text-light-blue,.w3-hover-text-light-blue:hover{color:#87CEEB!important}
.w3-text-brown,.w3-hover-text-brown:hover{color:#795548!important}
.w3-text-cyan,.w3-hover-text-cyan:hover{color:#00bcd4!important}
.w3-text-blue-grey,.w3-hover-text-blue-grey:hover,.w3-text-blue-gray,.w3-hover-text-blue-gray:hover{color:#607d8b!important}
.w3-text-green,.w3-hover-text-green:hover{color:#4CAF50!important}
.w3-text-light-green,.w3-hover-text-light-green:hover{color:#8bc34a!important}
.w3-text-indigo,.w3-hover-text-indigo:hover{color:#3f51b5!important}
.w3-text-khaki,.w3-hover-text-khaki:hover{color:#b4aa50!important}
.w3-text-lime,.w3-hover-text-lime:hover{color:#cddc39!important}
.w3-text-orange,.w3-hover-text-orange:hover{color:#ff9800!important}
.w3-text-deep-orange,.w3-hover-text-deep-orange:hover{color:#ff5722!important}
.w3-text-pink,.w3-hover-text-pink:hover{color:#e91e63!important}
.w3-text-purple,.w3-hover-text-purple:hover{color:#9c27b0!important}
.w3-text-deep-purple,.w3-hover-text-deep-purple:hover{color:#673ab7!important}
.w3-text-red,.w3-hover-text-red:hover{color:#f44336!important}
.w3-text-sand,.w3-hover-text-sand:hover{color:#fdf5e6!important}
.w3-text-teal,.w3-hover-text-teal:hover{color:#009688!important}
.w3-text-yellow,.w3-hover-text-yellow:hover{color:#d2be0e!important}
.w3-text-white,.w3-hover-text-white:hover{color:#fff!important}
.w3-text-black,.w3-hover-text-black:hover{color:#000!important}
.w3-text-grey,.w3-hover-text-grey:hover,.w3-text-gray,.w3-hover-text-gray:hover{color:#757575!important}
.w3-text-light-grey,.w3-hover-text-light-grey:hover,.w3-text-light-gray,.w3-hover-text-light-gray:hover{color:#f1f1f1!important}
.w3-text-dark-grey,.w3-hover-text-dark-grey:hover,.w3-text-dark-gray,.w3-hover-text-dark-gray:hover{color:#3a3a3a!important}
.w3-border-amber,.w3-hover-border-amber:hover{border-color:#ffc107!important}
.w3-border-aqua,.w3-hover-border-aqua:hover{border-color:#00ffff!important}
.w3-border-blue,.w3-hover-border-blue:hover{border-color:#2196F3!important}
.w3-border-light-blue,.w3-hover-border-light-blue:hover{border-color:#87CEEB!important}
.w3-border-brown,.w3-hover-border-brown:hover{border-color:#795548!important}
.w3-border-cyan,.w3-hover-border-cyan:hover{border-color:#00bcd4!important}
.w3-border-blue-grey,.w3-hover-border-blue-grey:hover,.w3-border-blue-gray,.w3-hover-border-blue-gray:hover{border-color:#607d8b!important}
.w3-border-green,.w3-hover-border-green:hover{border-color:#4CAF50!important}
.w3-border-light-green,.w3-hover-border-light-green:hover{border-color:#8bc34a!important}
.w3-border-indigo,.w3-hover-border-indigo:hover{border-color:#3f51b5!important}
.w3-border-khaki,.w3-hover-border-khaki:hover{border-color:#f0e68c!important}
.w3-border-lime,.w3-hover-border-lime:hover{border-color:#cddc39!important}
.w3-border-orange,.w3-hover-border-orange:hover{border-color:#ff9800!important}
.w3-border-deep-orange,.w3-hover-border-deep-orange:hover{border-color:#ff5722!important}
.w3-border-pink,.w3-hover-border-pink:hover{border-color:#e91e63!important}
.w3-border-purple,.w3-hover-border-purple:hover{border-color:#9c27b0!important}
.w3-border-deep-purple,.w3-hover-border-deep-purple:hover{border-color:#673ab7!important}
.w3-border-red,.w3-hover-border-red:hover{border-color:#f44336!important}
.w3-border-sand,.w3-hover-border-sand:hover{border-color:#fdf5e6!important}
.w3-border-teal,.w3-hover-border-teal:hover{border-color:#009688!important}
.w3-border-yellow,.w3-hover-border-yellow:hover{border-color:#ffeb3b!important}
.w3-border-white,.w3-hover-border-white:hover{border-color:#fff!important}
.w3-border-black,.w3-hover-border-black:hover{border-color:#000!important}
.w3-border-grey,.w3-hover-border-grey:hover,.w3-border-gray,.w3-hover-border-gray:hover{border-color:#9e9e9e!important}
.w3-border-light-grey,.w3-hover-border-light-grey:hover,.w3-border-light-gray,.w3-hover-border-light-gray:hover{border-color:#f1f1f1!important}
.w3-border-dark-grey,.w3-hover-border-dark-grey:hover,.w3-border-dark-gray,.w3-hover-border-dark-gray:hover{border-color:#616161!important}
.w3-border-pale-red,.w3-hover-border-pale-red:hover{border-color:#ffe7e7!important}.w3-border-pale-green,.w3-hover-border-pale-green:hover{border-color:#e7ffe7!important}
.w3-border-pale-yellow,.w3-hover-border-pale-yellow:hover{border-color:#ffffcc!important}.w3-border-pale-blue,.w3-hover-border-pale-blue:hover{border-color:#e7ffff!important}





/* Aktifkan flex pada kontainer homepage
.pkp_page_index .obj_issue_toc,
.pkp_page_index .additional_content {
    display: block;
}

 Bungkus homepage menjadi flex
.pkp_page_index .page_index {
    display: flex;
    flex-direction: column;
}

Additional Content ke atas
.pkp_page_index .additional_content {
    order: 1;
}

Current Issue ke bawah 
.pkp_page_index .obj_issue_toc {
    order: 2;
}

*/



/* =================================================================================================================================================== */
/* =================================================================================================================================================== */





/* ==========================================================
   ABOUT THE JOURNAL MODERN - JURNAL ISI
   Warna utama: #095490 | Biru terang: #1a8fe3 | Aksen: #ffc233
   Dipakai bersama about-journal-html.html
   Tempel di Journal style sheet (paling bawah)
   ========================================================== */


/* ----------------------------------------------------------
   1. PEMBUNGKUS
   ---------------------------------------------------------- */
.ab-wrap{margin:0;padding:0;}


/* ----------------------------------------------------------
   2. HERO (judul jurnal)
   ---------------------------------------------------------- */
.ab-hero{position:relative;overflow:hidden;margin:0 0 22px;padding:30px 30px 28px;border-radius:24px;
  border-left:8px solid #ffc233;color:#fff;
  background:
    radial-gradient(circle at 100% 0%,rgba(56,189,248,.55) 0%,rgba(56,189,248,0) 50%),
    linear-gradient(115deg,#073b6e 0%,#095490 45%,#1a8fe3 100%);
  box-shadow:0 16px 36px rgba(9,84,144,.35);animation:abUp .55s ease both;}
/* Lingkaran dekoratif */
.ab-hero::before,.ab-hero::after{content:"";position:absolute;border-radius:50%;
  background:rgba(255,255,255,.08);pointer-events:none;}
.ab-hero::before{width:220px;height:220px;right:-60px;bottom:-90px;}
.ab-hero::after{width:110px;height:110px;right:130px;top:-45px;}
.ab-kicker{display:inline-block;margin:0 0 12px;padding:4px 14px;border-radius:999px;
  background:#ffc233;color:#073b6e;font-size:12px;font-weight:800;letter-spacing:1px;text-transform:uppercase;}
.ab-hero .ab-title{position:relative;margin:0 0 6px !important;padding:0 !important;border:0 !important;
  color:#fff !important;font-size:26px;font-weight:800;line-height:1.3;}
.ab-hero .ab-sub{position:relative;margin:0 0 18px !important;color:rgba(255,255,255,.9);font-size:16px;}
.ab-badges{position:relative;display:flex;flex-wrap:wrap;gap:8px;}
.ab-badges span{padding:5px 14px;border-radius:999px;background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.35);color:#fff;font-size:13px;font-weight:600;
  transition:background .3s ease,color .3s ease,transform .3s ease;}
.ab-badges span:hover{background:#ffc233;color:#073b6e;transform:translateY(-2px);}


/* ----------------------------------------------------------
   3. KARTU INFORMASI (Initials, ISSN, Frequency, dll)
   ---------------------------------------------------------- */
.ab-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:0 0 22px;}
.ab-item{position:relative;display:flex;align-items:flex-start;gap:14px;padding:16px 18px;
  background:#fff;border:1px solid #e3ebf4;border-left:5px solid #095490;border-radius:16px;
  box-shadow:0 3px 10px rgba(9,84,144,.08);
  transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease,background .3s ease;
  animation:abUp .55s ease both;}
.ab-item.ab-wide{grid-column:1 / -1;}
.ab-item:nth-child(1){animation-delay:.05s;}.ab-item:nth-child(2){animation-delay:.1s;}
.ab-item:nth-child(3){animation-delay:.15s;}.ab-item:nth-child(4){animation-delay:.2s;}
.ab-item:nth-child(5){animation-delay:.25s;}.ab-item:nth-child(6){animation-delay:.3s;}
.ab-item:nth-child(n+7){animation-delay:.35s;}
.ab-item:hover{transform:translateY(-4px);background:linear-gradient(135deg,#fff 0%,#eef5fc 100%);
  border-color:rgba(26,143,227,.45);border-left-color:#095490;
  box-shadow:0 14px 28px rgba(9,84,144,.22);}

/* Ikon (memakai <em> + &nbsp; agar tidak dihapus editor OJS) */
.ab-ico{position:relative;flex:0 0 46px;height:46px;border-radius:14px;background:#e3effa;color:#095490;
  transition:transform .3s ease,background .3s ease,color .3s ease;}
.ab-ico em.fa{position:absolute;left:0;top:0;right:0;bottom:0;font-style:normal;font-size:0;}
.ab-ico em.fa::before{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  font-size:19px;line-height:1;}
.ab-item:hover .ab-ico{background:linear-gradient(135deg,#095490 0%,#1a8fe3 100%);color:#fff;
  transform:rotate(-8deg) scale(1.1);}

/* Teks */
.ab-txt{flex:1;min-width:0;}
.ab-label{display:block;margin:0 0 3px;color:#5b6b7c;font-size:11.5px;font-weight:700;
  letter-spacing:.9px;text-transform:uppercase;}
.ab-value{display:block;color:#0b2540;font-size:16px;font-weight:700;line-height:1.4;}


/* ----------------------------------------------------------
   4. KARTU AKREDITASI (disorot biru penuh)
   ---------------------------------------------------------- */
.ab-item.ab-hl{border-color:transparent;border-left-color:#ffc233;
  background:linear-gradient(135deg,#095490 0%,#1a8fe3 100%);box-shadow:0 10px 24px rgba(9,84,144,.35);}
.ab-item.ab-hl .ab-label{color:#ffd66b;}
.ab-item.ab-hl .ab-value{color:#fff;}
.ab-item.ab-hl .ab-ico{background:rgba(255,255,255,.2);color:#fff;}
.ab-item.ab-hl:hover{background:linear-gradient(135deg,#0b66ad 0%,#38a8f2 100%);
  border-color:transparent;border-left-color:#ffc233;box-shadow:0 16px 32px rgba(9,84,144,.45);}
.ab-item.ab-hl:hover .ab-ico{background:#ffc233;color:#073b6e;}


/* ----------------------------------------------------------
   5. LABEL / CHIP (bulan terbit, indexing, topik)
   ---------------------------------------------------------- */
.ab-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px;}
.ab-chip{display:inline-block;padding:4px 13px;border-radius:999px;background:#eef5fc;
  border:1px solid #dbe8f5;color:#095490;font-size:12.5px;font-weight:600;line-height:1.5;
  transition:background .25s ease,color .25s ease,border-color .25s ease,transform .25s ease,box-shadow .25s ease;}
.ab-chip:hover{background:linear-gradient(135deg,#095490 0%,#1a8fe3 100%);border-color:transparent;
  color:#fff;transform:translateY(-2px);box-shadow:0 6px 14px rgba(9,84,144,.3);}


/* ----------------------------------------------------------
   6. KARTU DESKRIPSI (Aims and Scope)
   ---------------------------------------------------------- */
.ab-about{position:relative;overflow:hidden;padding:26px 26px 22px;border-radius:22px;
  background:
    radial-gradient(circle at 100% 0%,rgba(26,143,227,.12) 0%,rgba(26,143,227,0) 45%),
    linear-gradient(180deg,#fff 0%,#f5faff 100%);
  border:1px solid rgba(9,84,144,.18);box-shadow:0 10px 30px rgba(9,84,144,.12);
  animation:abUp .55s ease .4s both;transition:box-shadow .35s ease,border-color .35s ease;}
.ab-about::before{content:"";position:absolute;left:0;top:0;right:0;height:5px;
  background:linear-gradient(90deg,#095490 0%,#1a8fe3 65%,#ffc233 100%);}
.ab-about:hover{border-color:rgba(26,143,227,.5);box-shadow:0 0 0 4px rgba(26,143,227,.1),0 20px 44px rgba(9,84,144,.2);}
.ab-about .ab-h{display:flex;align-items:center;gap:10px;margin:6px 0 14px !important;padding:0 !important;
  border:0 !important;color:#0b2540 !important;font-size:20px;font-weight:800;}
.ab-about .ab-h::before{content:"";flex:0 0 12px;height:12px;border-radius:50%;background:#095490;
  box-shadow:0 0 0 4px rgba(9,84,144,.15);}
.ab-about p{margin:0 0 16px;color:#3d4f63;font-size:15px;line-height:1.85;text-align:justify;}
.ab-tags{display:flex;flex-wrap:wrap;gap:8px;padding-top:4px;}


/* ----------------------------------------------------------
   7. ANIMASI MUNCUL
   ---------------------------------------------------------- */
@keyframes abUp{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:translateY(0);}}


/* ----------------------------------------------------------
   8. TAMPILAN HP (layar kecil)
   ---------------------------------------------------------- */
@media (max-width:700px){
  .ab-grid{grid-template-columns:minmax(0,1fr);}
  .ab-hero{padding:22px 20px;}
  .ab-hero .ab-title{font-size:21px;}
  .ab-about{padding:22px 18px 18px;}
  .ab-about p{text-align:left;}
}


/* ----------------------------------------------------------
   9. AKSESIBILITAS (matikan animasi jika "reduce motion")
   ---------------------------------------------------------- */
@media (prefers-reduced-motion:reduce){
  .ab-wrap *{transition:none !important;animation:none !important;}
}


/* ----------------------------------------------------------
   10. HILANGKAN JUDUL "About the Journal" & SEJAJARKAN DENGAN SIDEBAR
   - Judul bawaan OJS di bagian paling atas disembunyikan
   - Banner naik sehingga tepi atasnya sejajar dengan kotak sidebar
   ---------------------------------------------------------- */
.page_about > h1,
.page_about > .page_title,
.page_about h1.page_title{display:none !important;}
.page_about{padding-top:0 !important;margin-top:0 !important;}
.page_about .ab-wrap{margin-top:0 !important;padding-top:0 !important;}
.page_about .ab-hero{margin-top:0 !important;}
/* Jika masih turun/naik beberapa px dibanding sidebar, ubah angka ini, misalnya -6px atau 6px */
.page_about .ab-wrap{position:relative;top:0;}

/* Pastikan teks di dalam banner selalu putih (tidak ditimpa CSS tema) */
.ab-hero .ab-sub,
.ab-hero .ab-badges span{color:#fff !important;}
.ab-hero .ab-kicker{color:#073b6e !important;}


/* ----------------------------------------------------------
   11. DESAIN HALAMAN ABOUT (bawaan OJS / PKP)
   Mempercantik breadcrumb dan semua isi halaman About yang
   ditambahkan di luar banner (judul, paragraf, daftar, link,
   kutipan, tabel, garis, gambar).
   ---------------------------------------------------------- */

/* 11a. Breadcrumb (Home / About) berbentuk label bulat */
.cmp_breadcrumbs{margin:0 0 18px !important;}
.cmp_breadcrumbs ol{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0 !important;
  padding:0 !important;list-style:none !important;}
.cmp_breadcrumbs li{display:inline-flex;align-items:center;margin:0 !important;padding:0 !important;font-size:13px;}
.cmp_breadcrumbs li a{display:inline-block;padding:4px 13px;border-radius:999px;background:#eef5fc;
  border:1px solid #dbe8f5;color:#095490 !important;font-weight:600;text-decoration:none !important;
  transition:background .25s ease,color .25s ease,transform .25s ease,box-shadow .25s ease;}
.cmp_breadcrumbs li a:hover{background:linear-gradient(135deg,#095490 0%,#1a8fe3 100%);
  border-color:transparent;color:#fff !important;transform:translateY(-1px);
  box-shadow:0 6px 14px rgba(9,84,144,.3);}
.cmp_breadcrumbs .separator{margin:0 0 0 6px;color:#9fb3c8;}
.cmp_breadcrumbs li.current span,
.cmp_breadcrumbs li [aria-current]{display:inline-block;padding:4px 13px;border-radius:999px;
  background:linear-gradient(135deg,#095490 0%,#1a8fe3 100%);color:#fff !important;font-weight:600;}

/* 11b. Judul isi halaman */
.page_about > h2{position:relative;margin:30px 0 14px !important;padding:2px 0 2px 16px !important;
  border:0 !important;color:#0b2540 !important;font-size:22px;font-weight:800;line-height:1.3;}
.page_about > h2::before{content:"";position:absolute;left:0;top:2px;bottom:2px;width:5px;border-radius:5px;
  background:linear-gradient(180deg,#1a8fe3 0%,#095490 60%,#ffc233 100%);}
.page_about > h3{display:flex;align-items:center;gap:10px;margin:24px 0 10px !important;
  padding:0 !important;border:0 !important;color:#095490 !important;font-size:18px;font-weight:700;}
.page_about > h3::before{content:"";flex:0 0 10px;height:10px;border-radius:50%;background:#095490;
  box-shadow:0 0 0 4px rgba(9,84,144,.15);}

/* 11c. Paragraf */
.page_about > p{margin:0 0 14px;color:#3d4f63;font-size:15px;line-height:1.85;text-align:justify;}
.page_about > p strong,.page_about > p b{color:#095490;font-weight:700;
  background:linear-gradient(transparent 62%,rgba(255,194,51,.45) 62%);}

/* 11d. Link: garis bawah kuning yang berubah jadi sorotan saat hover */
.page_about > p a,.page_about > ul a,.page_about > ol a,.page_about > table a{color:#095490 !important;
  font-weight:600;text-decoration:none !important;
  background:linear-gradient(rgba(255,194,51,.55),rgba(255,194,51,.55)) no-repeat 0 100%/100% 2px;
  transition:background-size .3s ease,color .3s ease;}
.page_about > p a:hover,.page_about > ul a:hover,.page_about > ol a:hover,.page_about > table a:hover{
  color:#073b6e !important;background-size:100% 100%;}

/* 11e. Daftar berpoin & bernomor */
.page_about > ul{list-style:none !important;margin:0 0 16px !important;padding:0 !important;}
.page_about > ul > li{position:relative;margin:0 0 8px !important;padding:0 0 0 28px !important;
  color:#3d4f63;font-size:15px;line-height:1.7;}
.page_about > ul > li::before{content:"";position:absolute;left:6px;top:.62em;width:9px;height:9px;
  border-radius:50%;background:linear-gradient(135deg,#095490 0%,#1a8fe3 100%);
  box-shadow:0 0 0 3px rgba(9,84,144,.15);}
.page_about > ol{list-style:none !important;counter-reset:abn;margin:0 0 16px !important;padding:0 !important;}
.page_about > ol > li{position:relative;counter-increment:abn;margin:0 0 10px !important;
  padding:0 0 0 38px !important;color:#3d4f63;font-size:15px;line-height:1.7;}
.page_about > ol > li::before{content:counter(abn);position:absolute;left:0;top:0;width:26px;height:26px;
  border-radius:50%;background:linear-gradient(135deg,#095490 0%,#1a8fe3 100%);color:#fff;
  font-size:12.5px;font-weight:700;line-height:26px;text-align:center;box-shadow:0 4px 10px rgba(9,84,144,.3);}

/* 11f. Kutipan */
.page_about > blockquote{position:relative;margin:20px 0 !important;padding:18px 22px 18px 58px !important;
  border:1px solid #dbe8f5 !important;border-left:5px solid #ffc233 !important;border-radius:16px;
  background:linear-gradient(135deg,#f5faff 0%,#eaf3fc 100%);color:#26405a;font-style:italic;
  box-shadow:0 4px 14px rgba(9,84,144,.08);}
.page_about > blockquote::before{content:"\201C";position:absolute;left:16px;top:6px;color:#095490;
  font-family:Georgia,serif;font-size:56px;line-height:1;font-style:normal;opacity:.35;}

/* 11g. Tabel */
.page_about > table{width:100%;margin:0 0 20px;border-collapse:separate;border-spacing:0;
  border:1px solid #dbe8f5;border-radius:14px;box-shadow:0 4px 14px rgba(9,84,144,.08);}
.page_about > table th{padding:12px 14px;border:0;color:#fff;font-size:13.5px;font-weight:700;text-align:left;
  background:linear-gradient(135deg,#095490 0%,#1a8fe3 100%);}
.page_about > table th:first-child{border-top-left-radius:13px;}
.page_about > table th:last-child{border-top-right-radius:13px;}
.page_about > table td{padding:11px 14px;border-top:1px solid #e3ebf4;color:#3d4f63;font-size:14.5px;
  transition:background .25s ease;}
.page_about > table tr:nth-child(even) td{background:#f5faff;}
.page_about > table tr:hover td{background:#e3effa;}

/* 11h. Garis pemisah & gambar */
.page_about > hr{height:3px;margin:28px 0;border:0;border-radius:3px;
  background:linear-gradient(90deg,#095490 0%,#1a8fe3 60%,rgba(255,194,51,.9) 100%);}
.page_about > img,.page_about > p > img{max-width:100%;height:auto;border-radius:16px;
  box-shadow:0 10px 24px rgba(9,84,144,.25);}

/* 11i. Tampilan HP & aksesibilitas */
@media (max-width:700px){
  .page_about > p{text-align:left;}
  .page_about > table{display:block;overflow-x:auto;}
}
@media (prefers-reduced-motion:reduce){
  .cmp_breadcrumbs *,.page_about a,.page_about td{transition:none !important;}
}





/* =================================================================================================================================================== */
/* =================================================================================================================================================== */



/* ==========================================================
   CURRENT ISSUE MODERN - JURNAL ISI
   Warna utama: #095490 | Warna aksen: #ffc233
   Tempel di Journal style sheet (di bawah CSS menu)
   ========================================================== */


/* ----------------------------------------------------------
   1. JUDUL "CURRENT ISSUE"
   ---------------------------------------------------------- */
.current_issue > h2,
.page_index_journal .current_issue > h2{position:relative;display:block;margin:0 0 22px !important;
  padding:0 0 14px !important;border:0 !important;color:#095490 !important;font-size:20px;font-weight:800;
  letter-spacing:1.5px;text-transform:uppercase;}
/* Garis gradasi di bawah judul */
.current_issue > h2::after{content:"";position:absolute;left:0;bottom:0;width:70px;height:4px;
  border-radius:4px;background:linear-gradient(90deg,#095490 0%,#0e72c4 60%,#ffc233 100%);}


/* ----------------------------------------------------------
   2. JUDUL EDISI (Vol. 11 No. 3 ...) & TANGGAL TERBIT
   ---------------------------------------------------------- */
.current_issue_title,
.obj_issue_toc .heading .current_issue_title{display:inline-block;margin:0 0 14px;padding:10px 18px;
  border-left:5px solid #095490;border-radius:12px;color:#14263a;font-size:17px;font-weight:700;
  background:linear-gradient(90deg,#e8f1fa 0%,#fff 100%);box-shadow:0 2px 8px rgba(9,84,144,.08);}
.obj_issue_toc .heading .published{display:inline-flex;align-items:center;gap:8px;margin:0 0 6px;
  padding:6px 14px;border-radius:999px;background:#f1f7fd;border:1px solid #dbe8f5;
  color:#14263a;font-size:13px;}
.obj_issue_toc .heading .published .label{color:#095490;font-size:11.5px;font-weight:800;
  letter-spacing:.8px;text-transform:uppercase;}


/* ----------------------------------------------------------
   3. JUDUL BAGIAN ("Articles")
   ---------------------------------------------------------- */
.obj_issue_toc .sections .section > h2,
.obj_issue_toc .section > h2{display:flex;align-items:center;gap:10px;margin:26px 0 16px !important;
  padding:0 !important;border:0 !important;color:#5b6b7c !important;font-size:14px;font-weight:700;
  letter-spacing:1.2px;text-transform:uppercase;}
.obj_issue_toc .section > h2::before{content:"";flex:0 0 10px;height:10px;border-radius:50%;
  background:#095490;box-shadow:0 0 0 4px rgba(9,84,144,.15);}
.obj_issue_toc .section > h2::after{content:"";flex:1;height:1px;
  background:linear-gradient(90deg,#cfe0f1 0%,rgba(207,224,241,0) 100%);}


/* ----------------------------------------------------------
   4. DAFTAR & KARTU ARTIKEL
   ---------------------------------------------------------- */
.cmp_article_list{list-style:none !important;margin:0 !important;padding:0 !important;}
.cmp_article_list > li{margin:0 0 16px !important;padding:0 !important;list-style:none !important;}
.obj_article_summary{position:relative;display:block;margin:0 !important;padding:18px 20px !important;
  background:#fff !important;border:1px solid #e3ebf4 !important;border-left:5px solid #095490 !important;
  border-radius:16px !important;box-shadow:0 3px 10px rgba(9,84,144,.08) !important;
  transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;
  animation:mmFadeUp .5s ease both;}
.obj_article_summary:hover{transform:translateY(-4px);border-left-color:#ffc233 !important;
  box-shadow:0 14px 28px rgba(9,84,144,.2) !important;}
/* Muncul bertahap saat halaman dibuka */
.cmp_article_list > li:nth-child(2) .obj_article_summary{animation-delay:.08s;}
.cmp_article_list > li:nth-child(3) .obj_article_summary{animation-delay:.16s;}
.cmp_article_list > li:nth-child(4) .obj_article_summary{animation-delay:.24s;}
.cmp_article_list > li:nth-child(n+5) .obj_article_summary{animation-delay:.32s;}
@keyframes mmFadeUp{from{opacity:0;transform:translateY(14px);}to{opacity:1;transform:translateY(0);}}


/* ----------------------------------------------------------
   5. JUDUL ARTIKEL, PENULIS & HALAMAN
   ---------------------------------------------------------- */
.obj_article_summary .title{margin:0 0 8px !important;font-size:16px;font-weight:700;line-height:1.45;
  text-align:left !important;}
.obj_article_summary .title a{color:#095490 !important;text-decoration:none !important;
  background:linear-gradient(#ffc233,#ffc233) no-repeat 0 100%/0 2px;
  transition:background-size .3s ease,color .3s ease;}
.obj_article_summary .title a:hover{color:#0e72c4 !important;background-size:100% 2px;}
.obj_article_summary .meta{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;}
.obj_article_summary .authors{flex:1;color:#44566a;font-size:13.5px;line-height:1.55;text-align:left !important;}
/* Nomor halaman berbentuk label */
.obj_article_summary .pages{flex:0 0 auto;white-space:nowrap;padding:3px 12px;border-radius:999px;
  background:#eef5fc;border:1px solid #dbe8f5;color:#095490;font-size:12.5px;font-weight:600;}


/* ----------------------------------------------------------
   6. TOMBOL PDF
   ---------------------------------------------------------- */
.obj_article_summary .galleys_links{list-style:none !important;display:flex;flex-wrap:wrap;gap:8px;
  margin:14px 0 0 !important;padding:0 !important;}
.obj_article_summary .galleys_links li{margin:0 !important;padding:0 !important;}
.obj_article_summary .obj_galley_link{display:inline-flex;align-items:center;gap:6px;margin:0 !important;
  padding:7px 16px !important;border:0 !important;border-radius:10px !important;color:#fff !important;
  font-size:12.5px;font-weight:700;letter-spacing:.3px;text-decoration:none !important;
  background:linear-gradient(135deg,#095490 0%,#0e72c4 100%) !important;
  box-shadow:0 4px 10px rgba(9,84,144,.3);
  transition:transform .25s ease,box-shadow .25s ease,background .25s ease;}
.obj_article_summary .obj_galley_link:hover,
.obj_article_summary .obj_galley_link:focus{transform:translateY(-2px);
  background:linear-gradient(135deg,#0b66ad 0%,#1488e6 100%) !important;
  box-shadow:0 8px 18px rgba(9,84,144,.4);}


/* ----------------------------------------------------------
   7. TAMPILAN HP (layar kecil)
   ---------------------------------------------------------- */
@media (max-width:600px){
  .obj_article_summary .meta{flex-direction:column;gap:8px;}
  .obj_article_summary{padding:16px !important;}
}


/* ----------------------------------------------------------
   8. AKSESIBILITAS (matikan animasi jika "reduce motion")
   ---------------------------------------------------------- */
@media (prefers-reduced-motion:reduce){
  .obj_article_summary,.obj_article_summary *{transition:none !important;animation:none !important;}
}


/* ----------------------------------------------------------
   9. EFEK HOVER TAMBAHAN (saat mouse diarahkan ke artikel)
   ---------------------------------------------------------- */
/* Kartu: latar sedikit bergradasi biru muda */
.obj_article_summary{overflow:hidden;}
.obj_article_summary:hover{background:linear-gradient(135deg,#fff 0%,#eef5fc 100%) !important;}

/* Kilau cahaya yang menyapu dari kiri ke kanan */
.obj_article_summary::before{content:"";position:absolute;top:0;left:-70%;width:45%;height:100%;
  background:linear-gradient(120deg,transparent,rgba(255,255,255,.75),transparent);
  transform:skewX(-20deg);transition:left .8s ease;pointer-events:none;z-index:1;}
.obj_article_summary:hover::before{left:130%;}

/* Garis gradasi di bawah kartu yang memanjang dari kiri */
.obj_article_summary::after{content:"";position:absolute;left:0;bottom:0;width:0;height:4px;
  background:linear-gradient(90deg,#095490 0%,#0e72c4 60%,#ffc233 100%);
  transition:width .5s ease;pointer-events:none;z-index:1;}
.obj_article_summary:hover::after{width:100%;}

/* Judul: garis bawah kuning memanjang & warna berubah saat kartu di-hover */
.obj_article_summary:hover .title a{color:#0e72c4 !important;background-size:100% 2px;}

/* Penulis lebih tegas, nomor halaman terisi biru */
.obj_article_summary .authors{transition:color .3s ease;}
.obj_article_summary:hover .authors{color:#14263a;}
.obj_article_summary .pages{transition:background .3s ease,color .3s ease,border-color .3s ease,transform .3s ease;}
.obj_article_summary:hover .pages{background:#095490;border-color:#095490;color:#fff;transform:scale(1.06);}

/* Tombol PDF berdenyut lembut saat kartu di-hover */
.obj_article_summary:hover .obj_galley_link{animation:mmPulse 1.6s ease-out infinite;}
@keyframes mmPulse{0%{box-shadow:0 4px 10px rgba(9,84,144,.3),0 0 0 0 rgba(14,114,196,.55);}
  100%{box-shadow:0 4px 10px rgba(9,84,144,.3),0 0 0 12px rgba(14,114,196,0);}}

/* Judul edisi & tanggal terbit juga ikut hidup saat di-hover */
.current_issue_title,.obj_issue_toc .heading .published{transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease,background .3s ease;}
.current_issue_title:hover{transform:translateX(5px);border-left-color:#ffc233;box-shadow:0 8px 20px rgba(9,84,144,.2);}
.obj_issue_toc .heading .published:hover{transform:translateY(-2px);background:#e3effa;box-shadow:0 6px 14px rgba(9,84,144,.15);}

/* Matikan animasi jika "reduce motion" */
@media (prefers-reduced-motion:reduce){
  .obj_article_summary::before,.obj_article_summary::after,.obj_article_summary .pages,
  .current_issue_title,.obj_issue_toc .heading .published{transition:none !important;}
  .obj_article_summary:hover .obj_galley_link{animation:none !important;}
}


/* ----------------------------------------------------------
   10. WARNA BERBEDA TIAP ARTIKEL
   Setiap kartu memakai warna sendiri, berulang tiap 6 artikel.
   --ac = warna utama | --ac2 = warna lebih terang
   --abg = warna latar muda | --rgb = warna utama (angka RGB, untuk bayangan)
   ---------------------------------------------------------- */
.cmp_article_list > li{--ac:#095490;--ac2:#0e72c4;--abg:#eef5fc;--rgb:9,84,144;}
.cmp_article_list > li:nth-child(6n+1){--ac:#095490;--ac2:#0e72c4;--abg:#eef5fc;--rgb:9,84,144;}    /* biru   */
.cmp_article_list > li:nth-child(6n+2){--ac:#7c3aed;--ac2:#a06bff;--abg:#f4effe;--rgb:124,58,237;}  /* ungu   */
.cmp_article_list > li:nth-child(6n+3){--ac:#0d9488;--ac2:#14c2b3;--abg:#e8f8f6;--rgb:13,148,136;}  /* tosca  */
.cmp_article_list > li:nth-child(6n+4){--ac:#ea580c;--ac2:#fb8a3c;--abg:#fff2e9;--rgb:234,88,12;}   /* oranye */
.cmp_article_list > li:nth-child(6n+5){--ac:#e11d48;--ac2:#fb5a7a;--abg:#ffeff2;--rgb:225,29,72;}   /* merah  */
.cmp_article_list > li:nth-child(6n+6){--ac:#16a34a;--ac2:#3fd16e;--abg:#ebf9f0;--rgb:22,163,74;}   /* hijau  */

/* Kartu: garis kiri & bayangan mengikuti warna masing-masing */
.obj_article_summary{border-left-color:var(--ac) !important;
  box-shadow:0 3px 10px rgba(var(--rgb),.12) !important;}
.obj_article_summary:hover{border-left-color:var(--ac2) !important;
  background:linear-gradient(135deg,#fff 0%,var(--abg) 100%) !important;
  box-shadow:0 14px 28px rgba(var(--rgb),.28) !important;}
.obj_article_summary::after{background:linear-gradient(90deg,var(--ac) 0%,var(--ac2) 100%);}

/* Judul artikel */
.obj_article_summary .title a{color:var(--ac) !important;
  background-image:linear-gradient(var(--ac2),var(--ac2));}
.obj_article_summary .title a:hover,
.obj_article_summary:hover .title a{color:var(--ac2) !important;}

/* Label nomor halaman */
.obj_article_summary .pages{background:var(--abg);border-color:rgba(var(--rgb),.25);color:var(--ac);}
.obj_article_summary:hover .pages{background:var(--ac);border-color:var(--ac);color:#fff;}

/* Tombol PDF */
.obj_article_summary .obj_galley_link{background:linear-gradient(135deg,var(--ac) 0%,var(--ac2) 100%) !important;
  box-shadow:0 4px 10px rgba(var(--rgb),.35);}
.obj_article_summary .obj_galley_link:hover,
.obj_article_summary .obj_galley_link:focus{background:linear-gradient(135deg,var(--ac2) 0%,var(--ac) 100%) !important;
  box-shadow:0 8px 18px rgba(var(--rgb),.45);}
@keyframes mmPulse{0%{box-shadow:0 4px 10px rgba(var(--rgb),.35),0 0 0 0 rgba(var(--rgb),.5);}
  100%{box-shadow:0 4px 10px rgba(var(--rgb),.35),0 0 0 12px rgba(var(--rgb),0);}}


/* ----------------------------------------------------------
   11. PENYESUAIAN HOVER KARTU
   - Garis hover (garis bawah & garis bawah judul) dihapus
   - Hover kartu: latar muda, border penuh warna artikel, glow
   - Tombol PDF tidak diubah
   ---------------------------------------------------------- */
/* Hapus garis gradasi di bawah kartu */
.obj_article_summary::after{display:none !important;}

/* Hapus garis bawah pada judul artikel */
.obj_article_summary .title a,
.obj_article_summary .title a:hover,
.obj_article_summary:hover .title a{background:none !important;}
.obj_article_summary:hover .title a{color:var(--ac) !important;}

/* Kartu saat hover: latar muda + border mengelilingi + glow warna artikel */
.obj_article_summary:hover{background:var(--abg) !important;
  border-color:rgba(var(--rgb),.45) !important;border-left-color:var(--ac) !important;
  box-shadow:0 14px 30px rgba(var(--rgb),.25) !important;}

/* Label nomor halaman tetap lembut (tidak terisi penuh) */
.obj_article_summary:hover .pages{background:rgba(var(--rgb),.12);
  border-color:rgba(var(--rgb),.25);color:var(--ac);transform:none;}


/* ----------------------------------------------------------
   12. BAGIAN ATAS EDISI (judul, cover, deskripsi, tanggal terbit)
   Susunan: cover kiri | deskripsi + tanggal terbit kanan
   ---------------------------------------------------------- */
/* Judul edisi (Vol. 11 No. 3 (2026): August) dengan bar gradasi di kiri */
.page_issue > h1,
.page_issue .page_title{position:relative;display:block;margin:0 0 24px !important;
  padding:2px 0 2px 20px !important;border:0 !important;color:#0b2540 !important;
  font-size:28px;font-weight:800;line-height:1.25;}
.page_issue > h1::before,
.page_issue .page_title::before{content:"";position:absolute;left:0;top:2px;bottom:2px;width:6px;
  border-radius:6px;background:linear-gradient(180deg,#1a8fe3 0%,#095490 60%,#ffc233 100%);}

/* Kartu pembungkus bagian atas */
.obj_issue_toc .heading{position:relative;display:grid !important;
  grid-template-columns:230px minmax(0,1fr);grid-template-areas:"cover desc" "cover pub";
  grid-template-rows:auto 1fr;column-gap:30px;align-items:start;
  margin:0 0 34px !important;padding:24px !important;overflow:hidden;
  background:
    radial-gradient(circle at 100% 0%,rgba(26,143,227,.13) 0%,rgba(26,143,227,0) 45%),
    linear-gradient(180deg,#ffffff 0%,#f5faff 100%);
  border:1px solid rgba(9,84,144,.18);border-radius:24px;
  box-shadow:0 10px 30px rgba(9,84,144,.12);
  transition:box-shadow .35s ease,border-color .35s ease;animation:mmFadeUp .5s ease both;}
.obj_issue_toc .heading:hover{border-color:rgba(26,143,227,.55);
  box-shadow:0 0 0 4px rgba(26,143,227,.1),0 20px 44px rgba(9,84,144,.22);}
.obj_issue_toc .heading > *:not(.cover):not(.description):not(.published){grid-column:2;}

/* Cover jurnal: bingkai gradasi biru-kuning */
.obj_issue_toc .heading .cover{grid-area:cover;align-self:start;display:block;float:none !important;
  width:100%;max-width:230px;margin:0 !important;padding:4px;border-radius:20px;
  background:linear-gradient(135deg,#095490 0%,#1a8fe3 60%,#ffc233 100%);
  box-shadow:0 16px 30px rgba(9,84,144,.32);
  transition:transform .4s ease,box-shadow .4s ease;}
.obj_issue_toc .heading .cover img{display:block;width:100%;height:auto;max-width:100%;margin:0;
  border-radius:16px;}
.obj_issue_toc .heading:hover .cover{transform:translateY(-4px) rotate(-1deg) scale(1.03);
  box-shadow:0 24px 40px rgba(9,84,144,.45);}

/* Deskripsi: teks tebal diberi sorotan kuning tipis */
.obj_issue_toc .heading .description{grid-area:desc;min-width:0;margin:0 !important;padding:0 !important;
  color:#3d4f63;font-size:15px;line-height:1.85;text-align:justify;}
.obj_issue_toc .heading .description p{margin:0 0 10px;}
.obj_issue_toc .heading .description strong,
.obj_issue_toc .heading .description b{color:#095490;font-weight:700;
  background:linear-gradient(transparent 62%,rgba(255,194,51,.45) 62%);}

/* Tanggal terbit: label biru bergradasi dengan ikon kalender */
.obj_issue_toc .heading .published{grid-area:pub;justify-self:start;align-self:start;margin:16px 0 0 !important;
  padding:8px 18px !important;border:0 !important;border-radius:999px;color:#fff !important;font-size:13.5px;
  background:linear-gradient(135deg,#095490 0%,#1a8fe3 100%) !important;
  box-shadow:0 8px 18px rgba(9,84,144,.35);}
.obj_issue_toc .heading .published::before{content:"\f073";font-family:FontAwesome;font-weight:normal;
  margin-right:2px;color:#fff;}
.obj_issue_toc .heading .published .label{color:#ffc233 !important;}
.obj_issue_toc .heading .published .value{color:#fff;font-weight:600;}
.obj_issue_toc .heading .published:hover{transform:translateY(-2px);
  background:linear-gradient(135deg,#0b66ad 0%,#38a8f2 100%) !important;box-shadow:0 12px 24px rgba(9,84,144,.45);}

/* Tampilan HP */
@media (max-width:700px){
  .page_issue > h1,.page_issue .page_title{font-size:22px;}
  .obj_issue_toc .heading{grid-template-columns:minmax(0,1fr);grid-template-areas:"cover" "desc" "pub";
    row-gap:18px;padding:18px !important;}
  .obj_issue_toc .heading .cover{max-width:220px;margin:0 auto !important;}
  .obj_issue_toc .heading .description{text-align:left;}
}

/* Matikan animasi jika "reduce motion" */
@media (prefers-reduced-motion:reduce){
  .obj_issue_toc .heading,.obj_issue_toc .heading *{transition:none !important;animation:none !important;}
}


/* ----------------------------------------------------------
   13. DOI DI BAWAH NAMA PENULIS (dengan latar warna)
   ---------------------------------------------------------- */
.obj_article_summary .authors .doi-under-authors{display:inline-block;margin-top:10px;
  padding:6px 14px;border-radius:10px;
  background:var(--abg,#eef5fc);
  border:1px solid rgba(var(--rgb,9,84,144),.25);
  border-left:4px solid var(--ac,#095490);
  color:#44566a;font-size:13px;line-height:1.5;word-break:break-all;
  transition:background .3s ease,border-color .3s ease,box-shadow .3s ease;}
.obj_article_summary .authors .doi-under-authors a{color:var(--ac,#095490);
  font-weight:600;text-decoration:none;transition:color .3s ease;}
.obj_article_summary .authors .doi-under-authors a:hover{color:var(--ac2,#0e72c4);
  text-decoration:underline;}

/* Saat kartu di-hover, latar DOI sedikit lebih pekat */
.obj_article_summary:hover .authors .doi-under-authors{
  background:rgba(var(--rgb,9,84,144),.14);
  border-color:rgba(var(--rgb,9,84,144),.4);
  box-shadow:0 4px 10px rgba(var(--rgb,9,84,144),.15);}




/* =================================================================================================================================================== */
/* =================================================================================================================================================== */





/* ==========================================================
   ARCHIVES MODERN V2 - JURNAL ISI
   Warna utama: #095490 | Biru terang: #1a8fe3 | Aksen: #ffc233
   Tempel di Journal style sheet (paling bawah, setelah CSS lain)
   ========================================================== */


/* ----------------------------------------------------------
   1. JUDUL HALAMAN "Archives"
   ---------------------------------------------------------- */
.page_issue_archive > h1,
.page_issue_archive .page_title{position:relative;margin:0 0 28px !important;padding:0 0 14px !important;
  border:0 !important;color:#0b2540 !important;font-size:26px;font-weight:800;}
.page_issue_archive > h1::after,
.page_issue_archive .page_title::after{content:"";position:absolute;left:0;bottom:0;width:70px;height:4px;
  border-radius:4px;background:linear-gradient(90deg,#095490 0%,#1a8fe3 65%,#ffc233 100%);}


/* ----------------------------------------------------------
   2. KARTU EDISI
   Susunan: cover kiri (200px) | judul + deskripsi kanan
   ---------------------------------------------------------- */
.issues_archive{list-style:none !important;margin:0 !important;padding:0 !important;}
.issues_archive > li{list-style:none !important;margin:0 0 30px !important;padding:0 !important;}
.issues_archive .obj_issue_summary{position:relative;display:grid !important;
  grid-template-columns:200px minmax(0,1fr) !important;
  grid-template-areas:"cover title" "cover desc" !important;
  grid-template-rows:auto 1fr !important;
  column-gap:30px !important;row-gap:0 !important;align-items:start !important;
  margin:0 !important;padding:24px !important;overflow:hidden;
  background:
    radial-gradient(circle at 100% 0%,rgba(26,143,227,.12) 0%,rgba(26,143,227,0) 45%),
    linear-gradient(180deg,#ffffff 0%,#f5faff 100%) !important;
  border:1px solid rgba(9,84,144,.18) !important;border-radius:24px !important;
  box-shadow:0 10px 30px rgba(9,84,144,.12) !important;
  transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease;
  animation:mmArcUp .55s ease both;}
.issues_archive .obj_issue_summary:hover{transform:translateY(-5px);
  border-color:rgba(26,143,227,.65) !important;
  box-shadow:0 0 0 4px rgba(26,143,227,.12),0 24px 50px rgba(9,84,144,.26) !important;}
/* elemen lain yang ikut di dalam kartu selalu di kolom kanan */
.issues_archive .obj_issue_summary > *:not(.cover):not(h2):not(.description){grid-column:2 !important;}
.issues_archive > li:nth-child(2) .obj_issue_summary{animation-delay:.1s;}
.issues_archive > li:nth-child(3) .obj_issue_summary{animation-delay:.2s;}
.issues_archive > li:nth-child(n+4) .obj_issue_summary{animation-delay:.3s;}
@keyframes mmArcUp{from{opacity:0;transform:translateY(18px);}to{opacity:1;transform:translateY(0);}}


/* ----------------------------------------------------------
   3. COVER JURNAL + TOMBOL "View Issue"
   ---------------------------------------------------------- */
.issues_archive .obj_issue_summary .cover{grid-area:cover !important;align-self:start !important;
  position:relative;display:block !important;float:none !important;
  width:100% !important;max-width:200px !important;height:auto !important;min-height:0 !important;
  margin:0 !important;padding:0 !important;overflow:hidden;border-radius:18px;
  box-shadow:0 16px 30px rgba(9,84,144,.32);
  transition:transform .4s ease,box-shadow .4s ease;}
.issues_archive .obj_issue_summary .cover img{display:block !important;width:100% !important;
  height:auto !important;max-width:100% !important;max-height:none !important;margin:0 !important;
  transition:transform .5s ease;}
/* Lapisan gelap tipis di bawah cover agar tombol terbaca */
.issues_archive .obj_issue_summary .cover::before{content:"";position:absolute;left:0;right:0;bottom:0;
  height:45%;background:linear-gradient(180deg,rgba(7,59,110,0) 0%,rgba(7,59,110,.75) 100%);
  pointer-events:none;z-index:1;}
/* Tombol melayang "View Issue ›" */
.issues_archive .obj_issue_summary .cover::after{content:"View Issue \203A";position:absolute;
  left:12px;right:12px;bottom:12px;z-index:2;padding:10px 8px;border-radius:999px;
  text-align:center;white-space:nowrap;color:#fff;font-size:14px;font-weight:700;letter-spacing:.3px;
  background:linear-gradient(135deg,#095490 0%,#1a8fe3 100%);
  box-shadow:0 6px 16px rgba(7,59,110,.45);
  transition:background .3s ease,color .3s ease,transform .3s ease,letter-spacing .3s ease;}


/* ----------------------------------------------------------
   4. BANNER JUDUL EDISI (gradasi biru modern + aksen kuning)
   ---------------------------------------------------------- */
.issues_archive .obj_issue_summary h2{grid-area:title !important;margin:0 0 16px !important;
  padding:16px 24px !important;border:0 !important;border-left:6px solid #ffc233 !important;
  border-radius:16px !important;
  background:
    radial-gradient(circle at 100% 0%,rgba(56,189,248,.55) 0%,rgba(56,189,248,0) 55%),
    linear-gradient(110deg,#073b6e 0%,#095490 45%,#1a8fe3 100%) !important;
  box-shadow:0 12px 26px rgba(9,84,144,.35) !important;
  transition:transform .3s ease,box-shadow .3s ease;}
.issues_archive .obj_issue_summary h2 .title,
.issues_archive .obj_issue_summary h2 a{display:block;color:#fff !important;font-size:22px;
  font-weight:800;line-height:1.3;text-decoration:none !important;}
/* "Vol. 11 No. 2 (2026)" tampil sebagai label bulat */
.issues_archive .obj_issue_summary h2 .series,
.issues_archive .obj_issue_summary h2 div{display:inline-block;margin-top:8px !important;
  padding:3px 14px;border-radius:999px;background:rgba(255,255,255,.18);
  border:1px solid rgba(255,255,255,.3);color:#fff !important;font-size:13px;font-weight:500;}


/* ----------------------------------------------------------
   5. DESKRIPSI EDISI & BENDERA
   ---------------------------------------------------------- */
.issues_archive .obj_issue_summary .description{grid-area:desc !important;min-width:0;
  margin:0 !important;padding:0 !important;color:#3d4f63;font-size:15px;line-height:1.8;text-align:justify;}
.issues_archive .obj_issue_summary .description p{margin:0 0 10px;}
.issues_archive .obj_issue_summary .description strong,
.issues_archive .obj_issue_summary .description b{color:#095490;font-weight:700;}
.issues_archive .obj_issue_summary .description img{width:34px !important;height:auto !important;
  margin-top:6px;border-radius:5px;box-shadow:0 3px 8px rgba(9,84,144,.25);}


/* ----------------------------------------------------------
   6. EFEK HOVER (saat mouse diarahkan ke kartu)
   ---------------------------------------------------------- */
.issues_archive .obj_issue_summary:hover .cover{transform:scale(1.04);
  box-shadow:0 22px 38px rgba(9,84,144,.45);}
.issues_archive .obj_issue_summary:hover .cover img{transform:scale(1.07);}
/* Tombol View Issue berubah kuning */
.issues_archive .obj_issue_summary:hover .cover::after{background:#ffc233;color:#073b6e;
  letter-spacing:1px;transform:translateY(-3px);}
/* Banner bergeser & bersinar */
.issues_archive .obj_issue_summary:hover h2{transform:translateX(6px);
  box-shadow:0 16px 30px rgba(9,84,144,.45) !important;}


/* ----------------------------------------------------------
   7. TAMPILAN HP (layar kecil)
   ---------------------------------------------------------- */
@media (max-width:700px){
  .issues_archive .obj_issue_summary{grid-template-columns:minmax(0,1fr) !important;
    grid-template-areas:"cover" "title" "desc" !important;row-gap:18px !important;padding:18px !important;}
  .issues_archive .obj_issue_summary .cover{max-width:220px !important;margin:0 auto !important;}
  .issues_archive .obj_issue_summary .description{text-align:left;}
}


/* ----------------------------------------------------------
   8. AKSESIBILITAS (matikan animasi jika "reduce motion")
   ---------------------------------------------------------- */
@media (prefers-reduced-motion:reduce){
  .issues_archive .obj_issue_summary,.issues_archive .obj_issue_summary *{transition:none !important;animation:none !important;}
}





/* =================================================================================================================================================== */
/* =================================================================================================================================================== */




/* ==========================================================
   MENU SIDEBAR MODERN (GAYA KARTU) - JURNAL ISI
   Warna utama: #095490
   ========================================================== */


/* ----------------------------------------------------------
   1. KOTAK UTAMA & JUDUL (HEADER)
   ---------------------------------------------------------- */
.mm-box{box-sizing:border-box;margin:0;background:#fff;border:1px solid rgba(9,84,144,.18);border-radius:18px;
  padding-bottom:16px;overflow:hidden;box-shadow:0 8px 24px rgba(9,84,144,.12);}
.mm-box .mm-head{text-align:center;padding:13px 18px;margin-bottom:16px;color:#fff;font-size:14px;font-weight:700;
  letter-spacing:.2px;background:linear-gradient(90deg,#095490 0%,#0e72c4 100%);}


/* ----------------------------------------------------------
   2. DAFTAR MENU
   ---------------------------------------------------------- */
.mm-box .mm-list{list-style:none;margin:0 !important;padding:0 7px !important;}  /* 7px = margin kiri-kanan antara kartu dan latar kotak */
.mm-box .mm-list li{list-style:none;margin:0 0 8px !important;padding:0 !important;
  /* warna aksen tiap item (ubah di sini / per item di bagian 7) */
  --c:#095490;--bg:#e3effa;}
.mm-box .mm-list li:last-child{margin-bottom:0;}


/* ----------------------------------------------------------
   3. KARTU ITEM (garis aksen kiri, ikon, teks, panah)
   ---------------------------------------------------------- */
.mm-box .mm-list a{display:flex;align-items:center;gap:12px;padding:10px 12px;
  background:#fff;border:1px solid #e3ebf4;border-left:4px solid var(--c);border-radius:14px;
  color:#14263a !important;font-size:13.5px;font-weight:600;line-height:1.3;
  text-decoration:none !important;box-shadow:0 2px 6px rgba(9,84,144,.06);
  transition:transform .25s ease,box-shadow .25s ease,background .25s ease,border-color .25s ease;}
.mm-box .mm-txt{flex:1;}


/* ----------------------------------------------------------
   4. IKON & PANAH
   (memakai <em> + &nbsp; agar tidak dihapus editor OJS;
    font-size:0 menyembunyikan &nbsp;, ukuran diatur di ::before)
   ---------------------------------------------------------- */
.mm-box em.fa{font-style:normal;font-size:0;}
.mm-box .mm-ico{flex:0 0 34px;height:34px;border-radius:10px;background:var(--bg);color:var(--c);
  transition:transform .3s ease,background .3s ease,color .3s ease;}
.mm-box .mm-ico em.fa{position:relative;display:block;width:100%;height:100%;}
.mm-box .mm-ico em.fa::before{position:absolute;left:50%;top:50%;
  transform:translate(-50%,-50%);font-size:15px;line-height:1;}
.mm-box .mm-arrow{color:#b9c6d4;transition:transform .25s ease,color .25s ease;}
.mm-box .mm-arrow::before{font-size:18px;}


/* ----------------------------------------------------------
   5. EFEK HOVER & FOKUS
   ---------------------------------------------------------- */
.mm-box .mm-list a:hover,.mm-box .mm-list a:focus{transform:translateX(4px);
  background:linear-gradient(90deg,#f1f7fd 0%,#fff 100%);border-color:#cfe0f1;border-left-color:var(--c);
  box-shadow:0 8px 20px rgba(9,84,144,.2);}
/* Ikon terisi warna penuh, miring sedikit, dan membesar */
.mm-box .mm-list a:hover .mm-ico,.mm-box .mm-list a:focus .mm-ico{background:var(--c);color:#fff;
  transform:rotate(-8deg) scale(1.1);}
/* Panah bergeser dan berwarna */
.mm-box .mm-list a:hover .mm-arrow,.mm-box .mm-list a:focus .mm-arrow{color:var(--c);transform:translateX(4px);}
.mm-box .mm-list a:active{transform:translateX(4px) scale(.98);}


/* ----------------------------------------------------------
   6. TOMBOL SOROT (CTA) - "Register New Reviewer"
   ---------------------------------------------------------- */
.mm-box .mm-cta a{background:linear-gradient(135deg,#095490 0%,#0e72c4 100%);
  border-color:transparent;color:#fff !important;box-shadow:0 8px 18px rgba(9,84,144,.35);}
.mm-box .mm-cta .mm-ico{background:rgba(255,255,255,.2);color:#fff;}
.mm-box .mm-cta .mm-arrow{color:#fff;}
.mm-box .mm-cta a:hover,.mm-box .mm-cta a:focus{background:linear-gradient(135deg,#0b66ad 0%,#1488e6 100%);
  box-shadow:0 12px 26px rgba(9,84,144,.45);}
.mm-box .mm-cta a:hover .mm-ico,.mm-box .mm-cta a:focus .mm-ico{background:#fff;color:#095490;}
.mm-box .mm-cta a:hover .mm-arrow,.mm-box .mm-cta a:focus .mm-arrow{color:#fff;}


/* ----------------------------------------------------------
   7. (OPSIONAL) WARNA BERBEDA TIAP ITEM
   Hapus tanda komentar di bawah jika ingin aksen warna-warni
   ---------------------------------------------------------- */
/*
.mm-box .mm-list li:nth-child(4n+1){--c:#7c3aed;--bg:#ede7fd;}
.mm-box .mm-list li:nth-child(4n+2){--c:#e11d48;--bg:#fde4ea;}
.mm-box .mm-list li:nth-child(4n+3){--c:#ea580c;--bg:#feeadc;}
.mm-box .mm-list li:nth-child(4n+4){--c:#059669;--bg:#d9f4ea;}
*/


/* ----------------------------------------------------------
   8. KOTAK TEMPLATE (gambar Word + tombol download)
   Dipakai bersama template-modern-html.html
   ---------------------------------------------------------- */
.mm-tpl{text-align:center;}
.mm-tpl .mm-tpl-link{display:block;padding:0 7px;text-decoration:none !important;}
/* Bingkai gambar */
.mm-tpl .mm-tpl-img{display:flex;align-items:center;justify-content:center;width:150px;height:150px;
  margin:0 auto 14px;border-radius:24px;background:linear-gradient(135deg,#f1f7fd 0%,#e3effa 100%);
  border:1px solid #e3ebf4;box-shadow:0 2px 6px rgba(9,84,144,.06);
  transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;}
.mm-tpl .mm-tpl-img img{width:110px;height:110px;max-width:100%;transition:transform .3s ease;}
/* Tombol download */
.mm-tpl .mm-tpl-btn{display:block;margin:0 13px;padding:10px 14px;border-radius:14px;
  background:linear-gradient(135deg,#095490 0%,#0e72c4 100%);color:#fff;font-size:13.5px;font-weight:600;
  box-shadow:0 8px 18px rgba(9,84,144,.35);transition:transform .25s ease,box-shadow .25s ease,background .25s ease;}
/* Efek hover */
.mm-tpl .mm-tpl-link:hover .mm-tpl-img,.mm-tpl .mm-tpl-link:focus .mm-tpl-img{
  transform:translateY(-4px);border-color:#cfe0f1;box-shadow:0 12px 24px rgba(9,84,144,.22);}
.mm-tpl .mm-tpl-link:hover .mm-tpl-img img,.mm-tpl .mm-tpl-link:focus .mm-tpl-img img{transform:scale(1.1) rotate(-4deg);}
.mm-tpl .mm-tpl-link:hover .mm-tpl-btn,.mm-tpl .mm-tpl-link:focus .mm-tpl-btn{
  background:linear-gradient(135deg,#0b66ad 0%,#1488e6 100%);transform:translateY(-2px);
  box-shadow:0 12px 26px rgba(9,84,144,.45);}


/* ----------------------------------------------------------
   9. KOTAK LOGO TOOLS (iThenticate, Mendeley, Turnitin, dll)
   Dipakai bersama tools-modern-html.html
   ---------------------------------------------------------- */
.mm-logos .mm-logo-list{display:flex;flex-direction:column;gap:10px;padding:0 7px;}
.mm-logos .mm-logo{display:flex;align-items:center;justify-content:center;padding:8px;
  background:#fff;border:1px solid #e3ebf4;border-bottom:3px solid #095490;border-radius:14px;
  text-decoration:none !important;box-shadow:0 2px 6px rgba(9,84,144,.06);
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease,background .25s ease;}
.mm-logos .mm-logo img{display:block;width:100%;max-width:200px;height:80px;object-fit:contain;
  transition:transform .3s ease;}
/* Efek hover: kartu naik, bayangan biru, logo membesar */
.mm-logos .mm-logo:hover,.mm-logos .mm-logo:focus{transform:translateY(-4px);
  background:linear-gradient(180deg,#fff 0%,#f1f7fd 100%);border-color:#cfe0f1;border-bottom-color:#ffc233;
  box-shadow:0 12px 24px rgba(9,84,144,.22);}
.mm-logos .mm-logo:hover img,.mm-logos .mm-logo:focus img{transform:scale(1.07);}


/* ----------------------------------------------------------
   10. KOTAK SERTIFIKAT AKREDITASI (gambar + overlay hover)
   Dipakai bersama cert-modern-html.html
   ---------------------------------------------------------- */
.mm-cert .mm-cert-link{position:relative;display:block;overflow:hidden;margin:0 7px;
  border:1px solid #e3ebf4;border-radius:14px;box-shadow:0 2px 6px rgba(9,84,144,.08);
  text-decoration:none !important;transition:transform .3s ease,box-shadow .3s ease;}
.mm-cert .mm-cert-link img{display:block;width:100%;height:auto;margin:0;transition:transform .4s ease;}
/* Lapisan gelap biru + tulisan di bagian bawah (muncul saat hover) */
.mm-cert .mm-cert-overlay{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;
  justify-content:center;gap:8px;padding:28px 12px 12px;color:#fff;font-size:13.5px;font-weight:600;
  background:linear-gradient(180deg,rgba(9,84,144,0) 0%,rgba(9,84,144,.92) 100%);
  opacity:0;transform:translateY(12px);transition:opacity .3s ease,transform .3s ease;}
.mm-cert em.fa{font-style:normal;font-size:0;}
.mm-cert em.fa::before{font-size:15px;}
/* Efek hover */
.mm-cert .mm-cert-link:hover,.mm-cert .mm-cert-link:focus{transform:translateY(-3px);
  box-shadow:0 12px 26px rgba(9,84,144,.3);}
.mm-cert .mm-cert-link:hover img,.mm-cert .mm-cert-link:focus img{transform:scale(1.06);}
.mm-cert .mm-cert-link:hover .mm-cert-overlay,.mm-cert .mm-cert-link:focus .mm-cert-overlay{
  opacity:1;transform:translateY(0);}


/* ----------------------------------------------------------
   11. AKSESIBILITAS (matikan animasi jika "reduce motion")
   ---------------------------------------------------------- */
@media (prefers-reduced-motion:reduce){.mm-box .mm-list a,.mm-box .mm-list a *,.mm-tpl .mm-tpl-link *,.mm-logos .mm-logo,.mm-logos .mm-logo *,.mm-cert .mm-cert-link,.mm-cert .mm-cert-link *{transition:none !important;}}


/* ----------------------------------------------------------
   12. KOTAK SINTA 3 (gambar saja, tanpa tulisan)
   Dipakai bersama sinta-modern-html.html
   ---------------------------------------------------------- */
.mm-sinta .mm-sinta-link{position:relative;display:block;overflow:hidden;margin:0 7px;padding:10px;
  background:#fff;border:1px solid #e3ebf4;border-bottom:3px solid #095490;border-radius:14px;
  box-shadow:0 2px 6px rgba(9,84,144,.08);text-decoration:none !important;
  transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;}
.mm-sinta .mm-sinta-link img{display:block;width:100%;height:auto;margin:0;transition:transform .4s ease;}
/* Efek hover */
.mm-sinta .mm-sinta-link:hover,.mm-sinta .mm-sinta-link:focus{transform:translateY(-3px);
  border-bottom-color:#ffc233;box-shadow:0 12px 26px rgba(9,84,144,.3);}
.mm-sinta .mm-sinta-link:hover img,.mm-sinta .mm-sinta-link:focus img{transform:scale(1.05);}
/* Matikan animasi jika "reduce motion" */
@media (prefers-reduced-motion:reduce){.mm-sinta .mm-sinta-link,.mm-sinta .mm-sinta-link *{transition:none !important;}}



/* ==========================================================
   BAGIAN 13-20: INFO JURNAL (notice, statistik waktu,
   kontributor internasional) & KOTAK TOOLS LEBAR
   Dipakai bersama info-modern-html.html dan tools-grid-html.html
   ========================================================== */

/* ----------------------------------------------------------
   13. PEMBUNGKUS & IKON (dipakai bersama)
   Ikon memakai <em> + &nbsp; agar tidak dihapus editor OJS
   ---------------------------------------------------------- */
.rg-wrap{margin:0;padding:0;}
.rg-wrap .rg-ico{position:relative;display:block;flex:0 0 46px;width:46px;height:46px;border-radius:14px;background:#e3effa;color:#095490;
  transition:transform .3s ease,background .3s ease,color .3s ease;}
.rg-wrap .rg-ico em.fa{position:absolute;left:0;top:0;right:0;bottom:0;font-style:normal;font-size:0;}
.rg-wrap .rg-ico em.fa::before{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  font-size:19px;line-height:1;}


/* ----------------------------------------------------------
   14. PEMBERITAHUAN (Registration and login ...)
   ---------------------------------------------------------- */
.rg-notice{display:flex;align-items:center;gap:16px;margin:0 0 22px;padding:18px 22px;border-radius:18px;
  background:linear-gradient(135deg,#eef5fc 0%,#fff 100%);border:1px solid #dbe8f5;
  border-left:6px solid #ffc233;box-shadow:0 6px 18px rgba(9,84,144,.1);
  transition:transform .3s ease,box-shadow .3s ease;animation:rgUp .55s ease both;}
.rg-notice:hover{transform:translateY(-3px);box-shadow:0 14px 28px rgba(9,84,144,.2);}
.rg-notice .rg-ico{background:linear-gradient(135deg,#095490 0%,#1a8fe3 100%);color:#fff;
  box-shadow:0 8px 16px rgba(9,84,144,.35);}
.rg-notice:hover .rg-ico{transform:rotate(-8deg) scale(1.08);}
.rg-notice p{margin:0 !important;text-align:left !important;color:#0b2540;font-size:15.5px;font-weight:700;line-height:1.6;}


/* ----------------------------------------------------------
   15. KARTU STATISTIK WAKTU (7 days, 40 days, dst.)
   ---------------------------------------------------------- */
.rg-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:0 0 22px;}
.rg-stat{position:relative;overflow:hidden;padding:22px 18px 18px;background:#fff;border:1px solid #e3ebf4;
  border-radius:18px;box-shadow:0 4px 14px rgba(9,84,144,.08);
  transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;animation:rgUp .55s ease both;}
.rg-stat:nth-child(1){animation-delay:.05s;}.rg-stat:nth-child(2){animation-delay:.12s;}
.rg-stat:nth-child(3){animation-delay:.19s;}.rg-stat:nth-child(4){animation-delay:.26s;}
/* Garis gradasi di atas kartu */
.rg-stat::before{content:"";position:absolute;left:0;top:0;right:0;height:4px;
  background:linear-gradient(90deg,#095490 0%,#1a8fe3 65%,#ffc233 100%);transition:height .3s ease;}
.rg-stat .rg-step{position:absolute;right:16px;top:16px;color:#c3d3e4;font-size:13px;font-weight:800;letter-spacing:1px;}
.rg-stat .rg-ico{margin:0 0 14px;}
.rg-stat,.rg-stat .rg-val,.rg-stat .rg-label{text-align:left !important;}
.rg-stat .rg-label{text-justify:auto;}
.rg-stat .rg-val{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px;margin:0 0 6px;}
.rg-stat .rg-num{color:#095490;font-size:28px;font-weight:800;line-height:1.1;}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  .rg-stat .rg-num{background:linear-gradient(135deg,#073b6e 0%,#1a8fe3 100%);
    -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;}
}
.rg-stat .rg-unit{padding:2px 10px;border-radius:999px;background:#fff3cf;color:#7a5200;
  font-size:12px;font-weight:700;}
.rg-stat .rg-label{color:#5b6b7c;font-size:13.5px;font-weight:600;line-height:1.4;}
/* Hover */
.rg-stat:hover{transform:translateY(-6px);border-color:rgba(26,143,227,.45);
  box-shadow:0 18px 34px rgba(9,84,144,.25);}
.rg-stat:hover::before{height:6px;}
.rg-stat:hover .rg-ico{background:linear-gradient(135deg,#095490 0%,#1a8fe3 100%);color:#fff;
  transform:rotate(-8deg) scale(1.1);}


/* ----------------------------------------------------------
   16. KONTRIBUTOR INTERNASIONAL (bendera negara)
   ---------------------------------------------------------- */
.rg-contrib{position:relative;overflow:hidden;padding:26px 24px 22px;border-radius:22px;
  background:
    radial-gradient(circle at 100% 0%,rgba(26,143,227,.12) 0%,rgba(26,143,227,0) 45%),
    linear-gradient(180deg,#fff 0%,#f5faff 100%);
  border:1px solid rgba(9,84,144,.18);box-shadow:0 10px 30px rgba(9,84,144,.12);
  animation:rgUp .55s ease .3s both;}
.rg-contrib::before{content:"";position:absolute;left:0;top:0;right:0;height:5px;
  background:linear-gradient(90deg,#095490 0%,#1a8fe3 65%,#ffc233 100%);}
.rg-head{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin:4px 0 18px;}
.rg-head .rg-title{flex:1;min-width:200px;color:#0b2540;font-size:17px;font-weight:800;line-height:1.35;}
.rg-head .rg-ico{background:linear-gradient(135deg,#095490 0%,#1a8fe3 100%);color:#fff;
  box-shadow:0 8px 16px rgba(9,84,144,.3);}
.rg-head .rg-count{padding:5px 14px;border-radius:999px;background:#ffc233;color:#073b6e;
  font-size:12.5px;font-weight:800;letter-spacing:.3px;}

.rg-flags{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:12px;}
.rg-flag{display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 6px 12px;
  background:#fff;border:1px solid #e3ebf4;border-radius:16px;text-align:center;
  box-shadow:0 2px 8px rgba(9,84,144,.06);
  transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease,background .3s ease;}
.rg-flag img{display:block;width:54px !important;height:54px !important;margin:0 !important;
  object-fit:contain;transition:transform .3s ease;}
.rg-flag span{text-align:center !important;color:#3d4f63;font-size:11.5px;font-weight:600;line-height:1.3;transition:color .3s ease;}
.rg-flag:hover{transform:translateY(-5px);background:linear-gradient(180deg,#fff 0%,#eef5fc 100%);
  border-color:rgba(26,143,227,.5);box-shadow:0 14px 26px rgba(9,84,144,.22);}
.rg-flag:hover img{transform:scale(1.18) rotate(-4deg);}
.rg-flag:hover span{color:#095490;}


/* ----------------------------------------------------------
   17. ANIMASI MUNCUL
   ---------------------------------------------------------- */
@keyframes rgUp{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:translateY(0);}}


/* ----------------------------------------------------------
   18. TAMPILAN TABLET & HP
   ---------------------------------------------------------- */
@media (max-width:900px){.rg-stats{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:480px){
  .rg-stats{grid-template-columns:minmax(0,1fr);}
  .rg-notice{padding:16px;}
  .rg-contrib{padding:22px 16px 18px;}
}


/* ----------------------------------------------------------
   19. AKSESIBILITAS (matikan animasi jika "reduce motion")
   ---------------------------------------------------------- */
@media (prefers-reduced-motion:reduce){
  .rg-wrap,.rg-wrap *{transition:none !important;animation:none !important;}
}


/* ----------------------------------------------------------
   20. KOTAK TOOLS LEBAR (gaya sama dengan kotak SINTA 3)
   Dipakai bersama tools-grid-html.html
   Memakai gaya .mm-logos (bagian 9), disusun sebagai grid
   ---------------------------------------------------------- */
.mm-logos-grid .mm-logo-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));
  gap:12px;padding:0 14px;}
.mm-logos-grid .mm-logo{padding:10px;}
.mm-logos-grid .mm-logo img{height:80px;}
@media (max-width:480px){.mm-logos-grid .mm-logo-list{grid-template-columns:repeat(2,minmax(0,1fr));}}






/* =================================================================================================================================================== */
/* =================================================================================================================================================== */





/* ==========================================================
   CONTACT MODERN V2 - JURNAL
   Warna utama: #095490 | Biru terang: #1a8fe3 | Aksen: #ffc233
   Tempel di Journal style sheet (paling bawah)
   ========================================================== */


/* ----------------------------------------------------------
   1. JUDUL HALAMAN
   ---------------------------------------------------------- */
.page_contact > h1,
.page_contact .page_title{position:relative;margin:0 0 28px !important;padding:0 0 14px !important;
  border:0 !important;color:#0b2540 !important;font-size:26px;font-weight:800;}
.page_contact > h1::after,
.page_contact .page_title::after{content:"";position:absolute;left:0;bottom:0;width:70px;height:4px;
  border-radius:4px;background:linear-gradient(90deg,#095490 0%,#1a8fe3 65%,#ffc233 100%);}


/* ----------------------------------------------------------
   2. PEMBUNGKUS
   Alamat selebar penuh di atas, dua kartu kontak sama lebar di bawah.
   float & width bawaan tema OJS ditimpa agar kartu tidak menyempit.
   ---------------------------------------------------------- */
.page_contact .contact_section{display:grid !important;grid-template-columns:repeat(2,minmax(0,1fr));
  gap:20px;width:100% !important;float:none !important;margin:0 0 20px !important;padding:0 !important;}
.page_contact .contact_section > *:not(.contact){grid-column:1 / -1;}


/* ----------------------------------------------------------
   3. KARTU ALAMAT (banner biru)
   ---------------------------------------------------------- */
.page_contact .contact_section .address{position:relative;overflow:hidden;display:flex;
  align-items:flex-start;gap:16px;margin:0 !important;padding:24px 26px;
  border-radius:22px;border-left:8px solid #ffc233;color:#fff;font-size:15px;line-height:1.8;
  text-align:left;
  background:
    radial-gradient(circle at 100% 0%,rgba(56,189,248,.55) 0%,rgba(56,189,248,0) 50%),
    linear-gradient(115deg,#073b6e 0%,#095490 45%,#1a8fe3 100%);
  box-shadow:0 16px 36px rgba(9,84,144,.35);
  transition:transform .3s ease,box-shadow .3s ease;animation:ctUp .55s ease both;}
.page_contact .contact_section .address::before{content:"\f3c5";
  font-family:"Font Awesome 5 Free";font-weight:900;flex:0 0 46px;width:46px;height:46px;
  border-radius:14px;background:rgba(255,255,255,.18);color:#ffc233;
  font-size:20px;line-height:46px;text-align:center;}
.page_contact .contact_section .address::after{content:"";position:absolute;right:-60px;bottom:-90px;
  width:220px;height:220px;border-radius:50%;background:rgba(255,255,255,.08);pointer-events:none;}
.page_contact .contact_section .address:hover{transform:translateY(-3px);
  box-shadow:0 22px 44px rgba(9,84,144,.45);}
.page_contact .contact_section .address,
.page_contact .contact_section .address p{color:#fff !important;margin:0;}
.page_contact .contact_section .address a{color:#ffc233 !important;font-weight:600;}


/* ----------------------------------------------------------
   4. KARTU KONTAK (Principal & Support)
   ---------------------------------------------------------- */
.page_contact .contact_section .contact,
.page_contact .contact.primary,
.page_contact .contact.support{position:relative;overflow:hidden;float:none !important;
  width:100% !important;max-width:100% !important;min-width:0;box-sizing:border-box;
  margin:0 !important;padding:26px 24px 22px;border-radius:22px;text-align:left;
  background:
    radial-gradient(circle at 100% 0%,rgba(26,143,227,.12) 0%,rgba(26,143,227,0) 45%),
    linear-gradient(180deg,#fff 0%,#f5faff 100%);
  border:1px solid rgba(9,84,144,.18);box-shadow:0 10px 30px rgba(9,84,144,.12);
  transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;
  animation:ctUp .55s ease .15s both;}
.page_contact .contact.support{animation-delay:.3s;}
.page_contact .contact::before{content:"";position:absolute;left:0;top:0;right:0;height:5px;
  background:linear-gradient(90deg,#095490 0%,#1a8fe3 65%,#ffc233 100%);}
.page_contact .contact:hover{transform:translateY(-5px);border-color:rgba(26,143,227,.5);
  box-shadow:0 0 0 4px rgba(26,143,227,.1),0 20px 44px rgba(9,84,144,.22);}

/* Judul kartu + ikon */
.page_contact .contact h2{display:flex;flex-wrap:nowrap;align-items:center;gap:12px;
  margin:6px 0 18px !important;padding:0 !important;border:0 !important;
  color:#0b2540 !important;font-size:18px;font-weight:800;line-height:1.3;}
.page_contact .contact h2::before{content:"\f508";font-family:"Font Awesome 5 Free";font-weight:900;
  flex:0 0 44px;width:44px;height:44px;border-radius:14px;background:#e3effa;color:#095490;
  font-size:18px;line-height:44px;text-align:center;
  transition:transform .3s ease,background .3s ease,color .3s ease;}
.page_contact .contact.support h2::before{content:"\f590";}   /* ikon headset */
.page_contact .contact:hover h2::before{background:linear-gradient(135deg,#095490 0%,#1a8fe3 100%);
  color:#fff;transform:rotate(-8deg) scale(1.1);}

/* Nama & afiliasi */
.page_contact .contact .name{margin:0 0 4px;color:#0b2540;font-size:17px;font-weight:700;line-height:1.4;}
.page_contact .contact .affiliation{margin:0 0 16px;color:#5b6b7c;font-size:14.5px;line-height:1.5;}

/* Telepon: label kecil + nilai */
.page_contact .contact .phone{display:flex;flex-wrap:wrap;align-items:center;gap:8px;
  margin:0 0 10px;padding:10px 14px;border-radius:12px;background:#eef5fc;border:1px solid #dbe8f5;}
.page_contact .contact .phone .label{padding:2px 10px;border-radius:999px;background:#095490;color:#fff;
  font-size:11px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;}
.page_contact .contact .phone .value{color:#0b2540;font-size:14.5px;font-weight:600;}

/* Email: tombol bulat */
.page_contact .contact .email{margin:14px 0 0;}
.page_contact .contact .email a{display:inline-flex;align-items:center;gap:8px;max-width:100%;
  padding:9px 18px;border-radius:999px;color:#fff !important;font-size:13.5px;font-weight:600;
  line-height:1.4;text-decoration:none !important;word-break:normal;overflow-wrap:anywhere;
  background:linear-gradient(135deg,#095490 0%,#0e72c4 100%);
  box-shadow:0 6px 14px rgba(9,84,144,.3);
  transition:transform .25s ease,box-shadow .25s ease,background .25s ease;}
.page_contact .contact .email a::before{content:"\f0e0";font-family:"Font Awesome 5 Free";font-weight:900;}
.page_contact .contact .email a:hover,
.page_contact .contact .email a:focus{transform:translateY(-2px);
  background:linear-gradient(135deg,#0b66ad 0%,#1488e6 100%);box-shadow:0 10px 22px rgba(9,84,144,.42);}


/* ----------------------------------------------------------
   5. ANIMASI MUNCUL
   ---------------------------------------------------------- */
@keyframes ctUp{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:translateY(0);}}


/* ----------------------------------------------------------
   6. TAMPILAN HP (satu kolom)
   ---------------------------------------------------------- */
@media (max-width:700px){
  .page_contact .contact_section{grid-template-columns:minmax(0,1fr);}
  .page_contact .contact_section .address{padding:20px 18px;}
}


/* ----------------------------------------------------------
   7. AKSESIBILITAS (matikan animasi jika "reduce motion")
   ---------------------------------------------------------- */
@media (prefers-reduced-motion:reduce){
  .page_contact .contact_section *,.page_contact .contact{transition:none !important;animation:none !important;}
}




/* =================================================================================================================================================== */
/* =================================================================================================================================================== */





/* ==========================================================
   FOCUS AND SCOPE MODERN - JURNAL
   Warna utama: #095490 | Biru terang: #1a8fe3 | Aksen: #ffc233
   Dipakai bersama HTML class fs-wrap
   ========================================================== */

.fs-wrap{margin:0;padding:0;text-align:left;}

/* 1. KARTU PENGANTAR */
.fs-intro{position:relative;overflow:hidden;margin:0 0 26px;padding:26px 26px 22px;border-radius:22px;
  background:
    radial-gradient(circle at 100% 0%,rgba(26,143,227,.12) 0%,rgba(26,143,227,0) 45%),
    linear-gradient(180deg,#fff 0%,#f5faff 100%);
  border:1px solid rgba(9,84,144,.18);box-shadow:0 10px 30px rgba(9,84,144,.12);
  animation:fsUp .55s ease both;transition:box-shadow .35s ease,border-color .35s ease;}
.fs-intro::before{content:"";position:absolute;left:0;top:0;right:0;height:5px;
  background:linear-gradient(90deg,#095490 0%,#1a8fe3 65%,#ffc233 100%);}
.fs-intro:hover{border-color:rgba(26,143,227,.5);box-shadow:0 0 0 4px rgba(26,143,227,.1),0 20px 44px rgba(9,84,144,.2);}
.fs-intro p{margin:0 0 12px;color:#3d4f63;font-size:15px;line-height:1.85;text-align:justify;}
.fs-intro p:last-child{margin-bottom:0;}
.fs-intro strong{color:#095490;font-weight:700;background:linear-gradient(transparent 62%,rgba(255,194,51,.45) 62%);}

/* 2. SUB-JUDUL */
.fs-wrap .fs-sub{position:relative;margin:0 0 18px !important;padding:2px 0 2px 16px !important;border:0 !important;
  color:#0b2540 !important;font-size:18px;font-weight:800;line-height:1.3;}
.fs-wrap .fs-sub::before{content:"";position:absolute;left:0;top:2px;bottom:2px;width:5px;border-radius:5px;
  background:linear-gradient(180deg,#1a8fe3 0%,#095490 60%,#ffc233 100%);}

/* 3. DAFTAR SCOPE (kartu bernomor otomatis) */
.fs-list{list-style:none !important;counter-reset:fs;margin:0 !important;padding:0 !important;
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;}
.fs-list > li{position:relative;counter-increment:fs;display:flex;align-items:center;gap:14px;
  margin:0 !important;padding:14px 18px !important;list-style:none !important;
  background:#fff;border:1px solid #e3ebf4;border-left:5px solid #095490;border-radius:16px;
  color:#14263a;font-size:15px;font-weight:600;line-height:1.4;
  box-shadow:0 3px 10px rgba(9,84,144,.08);
  transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease,background .3s ease;
  animation:fsUp .5s ease both;}
.fs-list > li::before{content:counter(fs);flex:0 0 40px;width:40px;height:40px;border-radius:12px;
  background:#e3effa;color:#095490;font-size:15px;font-weight:800;line-height:40px;text-align:center;
  transition:transform .3s ease,background .3s ease,color .3s ease;}
.fs-list > li:hover{transform:translateY(-4px);background:linear-gradient(135deg,#fff 0%,#eef5fc 100%);
  border-color:rgba(26,143,227,.45);border-left-color:#ffc233;box-shadow:0 14px 28px rgba(9,84,144,.22);}
.fs-list > li:hover::before{background:linear-gradient(135deg,#095490 0%,#1a8fe3 100%);color:#fff;
  transform:rotate(-8deg) scale(1.1);}

/* Muncul bertahap */
.fs-list > li:nth-child(1){animation-delay:.05s;}.fs-list > li:nth-child(2){animation-delay:.1s;}
.fs-list > li:nth-child(3){animation-delay:.15s;}.fs-list > li:nth-child(4){animation-delay:.2s;}
.fs-list > li:nth-child(5){animation-delay:.25s;}.fs-list > li:nth-child(6){animation-delay:.3s;}
.fs-list > li:nth-child(n+7){animation-delay:.35s;}

@keyframes fsUp{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:translateY(0);}}

/* 4. HP */
@media (max-width:700px){
  .fs-list{grid-template-columns:minmax(0,1fr);}
  .fs-intro{padding:22px 18px 18px;}
  .fs-intro p{text-align:left;}
}

/* 5. AKSESIBILITAS */
@media (prefers-reduced-motion:reduce){
  .fs-wrap *{transition:none !important;animation:none !important;}
}



/* =================================================================================================================================================== */
/* =================================================================================================================================================== */





/* ==========================================================
   HISTORY TIMELINE MODERN - JURNAL
   Warna utama: #095490 | Biru terang: #1a8fe3 | Aksen: #ffc233
   Dipakai bersama HTML class hs-wrap
   ========================================================== */

.hs-wrap{position:relative;margin:0;padding:0;text-align:left;}

/* 1. KARTU PEMBUKA (ringkasan) */
.hs-top{position:relative;overflow:hidden;margin:0 0 30px;padding:26px 28px;border-radius:24px;
  border-left:8px solid #ffc233;color:#fff;
  background:
    radial-gradient(circle at 100% 0%,rgba(56,189,248,.55) 0%,rgba(56,189,248,0) 50%),
    linear-gradient(115deg,#073b6e 0%,#095490 45%,#1a8fe3 100%);
  box-shadow:0 16px 36px rgba(9,84,144,.35);animation:hsUp .55s ease both;}
.hs-top::after{content:"";position:absolute;right:-60px;bottom:-90px;width:220px;height:220px;
  border-radius:50%;background:rgba(255,255,255,.08);pointer-events:none;}
.hs-top .hs-kicker{display:inline-block;margin:0 0 12px;padding:4px 14px;border-radius:999px;
  background:#ffc233;color:#073b6e;font-size:12px;font-weight:800;letter-spacing:1px;text-transform:uppercase;}
.hs-top p{position:relative;margin:0 !important;color:#fff !important;font-size:15.5px;line-height:1.8;text-align:justify;}
.hs-top strong{color:#ffc233;}

/* 2. TIMELINE */
.hs-timeline{position:relative;list-style:none !important;margin:0 !important;padding:0 0 0 34px !important;}
/* Garis vertikal */
.hs-timeline::before{content:"";position:absolute;left:11px;top:6px;bottom:6px;width:4px;border-radius:4px;
  background:linear-gradient(180deg,#095490 0%,#1a8fe3 70%,#ffc233 100%);}
.hs-item{position:relative;list-style:none !important;margin:0 0 22px !important;padding:0 !important;
  animation:hsUp .55s ease both;}
.hs-item:nth-child(1){animation-delay:.05s;}.hs-item:nth-child(2){animation-delay:.12s;}
.hs-item:nth-child(3){animation-delay:.19s;}.hs-item:nth-child(4){animation-delay:.26s;}
.hs-item:nth-child(5){animation-delay:.33s;}
/* Titik di garis */
.hs-item::before{content:"";position:absolute;left:-34px;top:20px;width:26px;height:26px;border-radius:50%;
  background:#fff;border:5px solid #095490;box-shadow:0 0 0 5px rgba(9,84,144,.15);
  transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease;}
.hs-item:hover::before{transform:scale(1.2);border-color:#ffc233;box-shadow:0 0 0 7px rgba(255,194,51,.3);}
.hs-item.hs-now::before{border-color:#ffc233;background:#095490;}

/* Kartu isi */
.hs-card{position:relative;overflow:hidden;padding:20px 22px 18px;background:#fff;
  border:1px solid #e3ebf4;border-left:5px solid #095490;border-radius:18px;
  box-shadow:0 4px 14px rgba(9,84,144,.08);
  transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease,background .3s ease;}
.hs-item:hover .hs-card{transform:translateX(6px);background:linear-gradient(135deg,#fff 0%,#eef5fc 100%);
  border-color:rgba(26,143,227,.45);border-left-color:#ffc233;box-shadow:0 14px 28px rgba(9,84,144,.2);}
.hs-item.hs-now .hs-card{border-left-color:#ffc233;
  background:linear-gradient(135deg,#fff 0%,#fff9e8 100%);}

/* Label tahun */
.hs-year{display:inline-block;margin:0 0 10px;padding:4px 16px;border-radius:999px;color:#fff;
  font-size:13px;font-weight:800;letter-spacing:.8px;
  background:linear-gradient(135deg,#095490 0%,#1a8fe3 100%);box-shadow:0 4px 10px rgba(9,84,144,.28);}
.hs-item.hs-now .hs-year{background:#ffc233;color:#073b6e;box-shadow:0 4px 10px rgba(255,194,51,.4);}

.hs-card p{margin:0 0 10px !important;color:#3d4f63;font-size:15px;line-height:1.85;text-align:justify;}
.hs-card p:last-of-type{margin-bottom:0 !important;}
.hs-card strong{color:#095490;font-weight:700;background:linear-gradient(transparent 62%,rgba(255,194,51,.45) 62%);}

/* Chip poin penting */
.hs-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;}
.hs-chip{display:inline-block;padding:4px 13px;border-radius:999px;background:#eef5fc;border:1px solid #dbe8f5;
  color:#095490;font-size:12.5px;font-weight:600;line-height:1.5;
  transition:background .25s ease,color .25s ease,transform .25s ease;}
.hs-chip:hover{background:linear-gradient(135deg,#095490 0%,#1a8fe3 100%);color:#fff;transform:translateY(-2px);}
.hs-chip.hs-gold{background:#fff3cf;border-color:#f6dc8c;color:#7a5200;}

@keyframes hsUp{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:translateY(0);}}

/* 3. HP */
@media (max-width:700px){
  .hs-top{padding:22px 18px;}
  .hs-top p,.hs-card p{text-align:left;}
  .hs-timeline{padding-left:30px !important;}
  .hs-item::before{left:-30px;width:22px;height:22px;border-width:4px;}
  .hs-card{padding:16px 16px 14px;}
}

/* 4. AKSESIBILITAS */
@media (prefers-reduced-motion:reduce){
  .hs-wrap *{transition:none !important;animation:none !important;}
}



/* =================================================================================================================================================== */
/* =================================================================================================================================================== */


/* ==========================================================
   REVIEWER GUIDELINES MODERN - JURNAL ISI
   Warna utama: #095490 | Biru terang: #1a8fe3 | Aksen: #ffc233
   Dipakai bersama HTML class rv-wrap
   Ikon memakai <em class="fa ..">&nbsp;</em> agar tidak dihapus editor OJS
   ========================================================== */

.rv-wrap{margin:0;padding:0;text-align:left;}
.rv-wrap p{text-align:justify;}

/* 1. HERO */
.rv-hero{position:relative;overflow:hidden;margin:0 0 22px;padding:30px 30px 28px;border-radius:24px;
  border-left:8px solid #ffc233;color:#fff;
  background:
    radial-gradient(circle at 100% 0%,rgba(56,189,248,.55) 0%,rgba(56,189,248,0) 50%),
    linear-gradient(115deg,#073b6e 0%,#095490 45%,#1a8fe3 100%);
  box-shadow:0 16px 36px rgba(9,84,144,.35);animation:rvUp .55s ease both;}
.rv-hero::before,.rv-hero::after{content:"";position:absolute;border-radius:50%;background:rgba(255,255,255,.08);pointer-events:none;}
.rv-hero::before{width:220px;height:220px;right:-60px;bottom:-90px;}
.rv-hero::after{width:110px;height:110px;right:130px;top:-45px;}
.rv-kicker{display:inline-block;margin:0 0 12px;padding:4px 14px;border-radius:999px;background:#ffc233;
  color:#073b6e;font-size:12px;font-weight:800;letter-spacing:1px;text-transform:uppercase;}
.rv-wrap .rv-title{position:relative;margin:0 0 6px !important;padding:0 !important;border:0 !important;
  color:#fff !important;font-size:26px;font-weight:800;line-height:1.3;}
.rv-wrap .rv-sub{position:relative;margin:0 0 18px !important;color:rgba(255,255,255,.9) !important;font-size:16px;}
.rv-badges{position:relative;display:flex;flex-wrap:wrap;gap:8px;}
.rv-badges span{padding:5px 14px;border-radius:999px;background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.35);color:#fff !important;font-size:13px;font-weight:600;
  transition:background .3s ease,color .3s ease,transform .3s ease;}
.rv-badges span:hover{background:#ffc233;color:#073b6e !important;transform:translateY(-2px);}

/* 2. KARTU BAGIAN */
.rv-sec{position:relative;overflow:hidden;margin:0 0 22px;padding:26px 26px 22px;border-radius:22px;
  background:
    radial-gradient(circle at 100% 0%,rgba(26,143,227,.12) 0%,rgba(26,143,227,0) 45%),
    linear-gradient(180deg,#fff 0%,#f5faff 100%);
  border:1px solid rgba(9,84,144,.18);box-shadow:0 10px 30px rgba(9,84,144,.12);
  animation:rvUp .55s ease both;transition:box-shadow .35s ease,border-color .35s ease;}
.rv-sec::before{content:"";position:absolute;left:0;top:0;right:0;height:5px;
  background:linear-gradient(90deg,#095490 0%,#1a8fe3 65%,#ffc233 100%);}
.rv-sec:hover{border-color:rgba(26,143,227,.5);box-shadow:0 0 0 4px rgba(26,143,227,.1),0 20px 44px rgba(9,84,144,.2);}
.rv-sec p{margin:0 0 14px;color:#3d4f63;font-size:15px;line-height:1.85;}
.rv-sec p:last-child{margin-bottom:0;}
.rv-sec strong{color:#095490;font-weight:700;}
.rv-sec em{font-style:italic;}

/* Judul bagian + ikon */
.rv-wrap .rv-h{display:flex;align-items:center;gap:14px;margin:4px 0 16px !important;padding:0 !important;
  border:0 !important;color:#0b2540 !important;font-size:19px;font-weight:800;line-height:1.3;text-transform:uppercase;letter-spacing:.4px;}
.rv-ico{position:relative;display:block;flex:0 0 46px;width:46px;height:46px;border-radius:14px;
  background:linear-gradient(135deg,#095490 0%,#1a8fe3 100%);color:#fff;box-shadow:0 8px 16px rgba(9,84,144,.3);
  transition:transform .3s ease;}
.rv-ico em.fa{position:absolute;left:0;top:0;right:0;bottom:0;font-style:normal;font-size:0;}
.rv-ico em.fa::before{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:19px;line-height:1;}
.rv-sec:hover .rv-ico{transform:rotate(-8deg) scale(1.08);}
.rv-wrap .rv-h2{position:relative;margin:22px 0 14px !important;padding:2px 0 2px 16px !important;border:0 !important;
  color:#095490 !important;font-size:16px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;}
.rv-wrap .rv-h2::before{content:"";position:absolute;left:0;top:2px;bottom:2px;width:5px;border-radius:5px;
  background:linear-gradient(180deg,#1a8fe3 0%,#095490 60%,#ffc233 100%);}

/* 3. KARTU KECIL (grid) */
.rv-grid{display:grid;gap:14px;margin:6px 0 0;}
.rv-grid.c2{grid-template-columns:repeat(2,minmax(0,1fr));}
.rv-grid.c3{grid-template-columns:repeat(3,minmax(0,1fr));}
.rv-card{position:relative;padding:16px 18px;background:#fff;border:1px solid #e3ebf4;border-left:5px solid var(--ac,#095490);
  border-radius:16px;box-shadow:0 3px 10px rgba(9,84,144,.08);color:#3d4f63;font-size:14.5px;line-height:1.7;text-align:justify;
  transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease,background .3s ease;}
.rv-card:hover{transform:translateY(-4px);background:linear-gradient(135deg,#fff 0%,var(--abg,#eef5fc) 100%);
  border-color:rgba(var(--rgb,9,84,144),.4);border-left-color:var(--ac,#095490);
  box-shadow:0 14px 28px rgba(var(--rgb,9,84,144),.2);}
.rv-card b,.rv-card strong{display:block;margin:0 0 6px;color:var(--ac,#095490);font-size:15px;font-weight:800;}
.rv-card.num{padding-top:20px;}
.rv-card .rv-n{position:absolute;right:14px;top:10px;color:#c3d3e4;font-size:13px;font-weight:800;letter-spacing:1px;}

/* Variasi warna */
.rv-grid > .rv-card:nth-child(6n+1){--ac:#095490;--abg:#eef5fc;--rgb:9,84,144;}
.rv-grid > .rv-card:nth-child(6n+2){--ac:#7c3aed;--abg:#f4effe;--rgb:124,58,237;}
.rv-grid > .rv-card:nth-child(6n+3){--ac:#0d9488;--abg:#e8f8f6;--rgb:13,148,136;}
.rv-grid > .rv-card:nth-child(6n+4){--ac:#ea580c;--abg:#fff2e9;--rgb:234,88,12;}
.rv-grid > .rv-card:nth-child(6n+5){--ac:#e11d48;--abg:#ffeff2;--rgb:225,29,72;}
.rv-grid > .rv-card:nth-child(6n+6){--ac:#16a34a;--abg:#ebf9f0;--rgb:22,163,74;}
.rv-grid.warn > .rv-card{--ac:#ea580c;--abg:#fff2e9;--rgb:234,88,12;}

/* 4. DAFTAR CENTANG */
.rv-check{list-style:none !important;margin:6px 0 0 !important;padding:0 !important;}
.rv-check > li{position:relative;list-style:none !important;margin:0 0 10px !important;padding:12px 16px 12px 52px !important;
  background:#fff;border:1px solid #e3ebf4;border-radius:14px;color:#3d4f63;font-size:14.5px;line-height:1.7;
  box-shadow:0 2px 8px rgba(9,84,144,.06);text-align:justify;
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease,background .25s ease;}
.rv-check > li::before{content:"\f00c";font-family:"Font Awesome 5 Free";font-weight:900;position:absolute;left:14px;top:12px;
  width:26px;height:26px;border-radius:50%;background:linear-gradient(135deg,#095490 0%,#1a8fe3 100%);color:#fff;
  font-size:12px;line-height:26px;text-align:center;box-shadow:0 4px 10px rgba(9,84,144,.3);}
.rv-check > li:hover{transform:translateX(5px);background:#f5faff;border-color:rgba(26,143,227,.45);box-shadow:0 8px 18px rgba(9,84,144,.15);}

/* 5. LANGKAH PROSEDUR */
.rv-steps{list-style:none !important;counter-reset:rvs;margin:6px 0 0 !important;padding:0 !important;}
.rv-steps > li{position:relative;counter-increment:rvs;list-style:none !important;margin:0 0 14px !important;
  padding:16px 18px 16px 70px !important;background:#fff;border:1px solid #e3ebf4;border-radius:16px;
  box-shadow:0 3px 10px rgba(9,84,144,.08);color:#3d4f63;font-size:14.5px;line-height:1.8;text-align:justify;
  transition:transform .3s ease,box-shadow .3s ease;}
.rv-steps > li::before{content:counter(rvs);position:absolute;left:16px;top:16px;width:40px;height:40px;border-radius:12px;
  background:linear-gradient(135deg,#095490 0%,#1a8fe3 100%);color:#fff;font-size:17px;font-weight:800;line-height:40px;
  text-align:center;box-shadow:0 6px 14px rgba(9,84,144,.3);}
.rv-steps > li:hover{transform:translateY(-3px);box-shadow:0 14px 26px rgba(9,84,144,.2);}

/* 6. REKOMENDASI (a - f) */
.rv-rec{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:10px 0 18px;}
.rv-rec .rv-opt{position:relative;display:flex;align-items:center;gap:12px;padding:14px 16px;background:#fff;
  border:1px solid #e3ebf4;border-bottom:4px solid var(--ac);border-radius:16px;color:#14263a;font-size:14px;font-weight:600;line-height:1.4;
  box-shadow:0 3px 10px rgba(9,84,144,.08);transition:transform .3s ease,box-shadow .3s ease,background .3s ease;}
.rv-rec .rv-opt i{flex:0 0 34px;width:34px;height:34px;border-radius:50%;background:var(--ac);color:#fff;font-style:normal;
  font-size:14px;font-weight:800;line-height:34px;text-align:center;text-transform:uppercase;}
.rv-rec .rv-opt:hover{transform:translateY(-4px);background:var(--abg);box-shadow:0 14px 26px rgba(var(--rgb),.25);}
.rv-rec .rv-opt:nth-child(1){--ac:#16a34a;--abg:#ebf9f0;--rgb:22,163,74;}
.rv-rec .rv-opt:nth-child(2){--ac:#0d9488;--abg:#e8f8f6;--rgb:13,148,136;}
.rv-rec .rv-opt:nth-child(3){--ac:#095490;--abg:#eef5fc;--rgb:9,84,144;}
.rv-rec .rv-opt:nth-child(4){--ac:#7c3aed;--abg:#f4effe;--rgb:124,58,237;}
.rv-rec .rv-opt:nth-child(5){--ac:#ea580c;--abg:#fff2e9;--rgb:234,88,12;}
.rv-rec .rv-opt:nth-child(6){--ac:#e11d48;--abg:#ffeff2;--rgb:225,29,72;}

/* 7. CATATAN */
.rv-note{margin:16px 0 0;padding:14px 18px;border-radius:14px;background:#fff9e8;border:1px solid #f6dc8c;
  border-left:5px solid #ffc233;color:#5c4300 !important;font-size:14.5px;line-height:1.75;}

@keyframes rvUp{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:translateY(0);}}

/* 8. TABLET & HP */
@media (max-width:900px){.rv-grid.c3,.rv-rec{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:700px){
  .rv-grid.c2,.rv-grid.c3,.rv-rec{grid-template-columns:minmax(0,1fr);}
  .rv-hero{padding:22px 20px;}
  .rv-wrap .rv-title{font-size:21px;}
  .rv-sec{padding:22px 16px 18px;}
  .rv-wrap p,.rv-card,.rv-check > li,.rv-steps > li{text-align:left;}
  .rv-steps > li{padding-left:64px !important;}
}

/* 9. AKSESIBILITAS */
@media (prefers-reduced-motion:reduce){
  .rv-wrap *{transition:none !important;animation:none !important;}
}




/* =================================================================================================================================================== */
/* =================================================================================================================================================== */




/* ==========================================================
   PEER REVIEWERS LIST MODERN - JURNAL
   Warna utama: #095490 | Biru terang: #1a8fe3 | Aksen: #ffc233
   Dipakai bersama HTML class pr-wrap
   ========================================================== */

.pr-wrap{position:relative;overflow:hidden;margin:0;padding:26px 24px 20px;border-radius:24px;text-align:left;
  background:
    radial-gradient(circle at 100% 0%,rgba(26,143,227,.12) 0%,rgba(26,143,227,0) 45%),
    linear-gradient(180deg,#fff 0%,#f5faff 100%);
  border:1px solid rgba(9,84,144,.18);box-shadow:0 10px 30px rgba(9,84,144,.12);animation:prUp .55s ease both;}
.pr-wrap::before{content:"";position:absolute;left:0;top:0;right:0;height:5px;
  background:linear-gradient(90deg,#095490 0%,#1a8fe3 65%,#ffc233 100%);}

/* 1. HEADER */
.pr-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;
  margin:6px 0 18px;padding:0 0 16px;border-bottom:1px solid #e3ebf4;}
.pr-wrap .pr-title{margin:0 !important;padding:0 !important;border:0 !important;color:#0b2540 !important;
  font-size:22px;font-weight:800;line-height:1.3;}
.pr-count{padding:7px 18px;border-radius:999px;background:#ffc233;color:#073b6e;font-size:13px;font-weight:800;
  letter-spacing:.3px;box-shadow:0 6px 14px rgba(255,194,51,.4);}

/* 2. KARTU REVIEWER */
.pr-list{display:flex;flex-direction:column;gap:10px;}
.pr-item{position:relative;display:flex;align-items:center;gap:16px;padding:14px 18px;
  background:#fff;border:1px solid #e3ebf4;border-left:5px solid #095490;border-radius:16px;
  box-shadow:0 2px 8px rgba(9,84,144,.06);
  transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease,background .3s ease;}
.pr-item:hover{transform:translateY(-3px);background:linear-gradient(135deg,#fff 0%,#eef5fc 100%);
  border-color:rgba(26,143,227,.45);border-left-color:#ffc233;box-shadow:0 14px 28px rgba(9,84,144,.2);}

/* Avatar inisial */
.pr-av{flex:0 0 48px;width:48px;height:48px;border-radius:50%;color:#fff;font-size:15px;font-weight:800;
  line-height:48px;text-align:center;letter-spacing:.5px;
  background:linear-gradient(135deg,#095490 0%,#1a8fe3 100%);box-shadow:0 8px 16px rgba(9,84,144,.3);
  transition:transform .3s ease,border-radius .3s ease;}
.pr-item:hover .pr-av{transform:rotate(-8deg) scale(1.1);border-radius:16px;}

/* Nama & afiliasi */
.pr-info{flex:1;min-width:0;}
.pr-name{margin:0 0 3px;color:#0b2540;font-size:15.5px;font-weight:700;line-height:1.4;text-align:left;
  transition:color .3s ease;}
.pr-item:hover .pr-name{color:#095490;}
.pr-aff{display:flex;align-items:center;gap:8px;color:#5b6b7c;font-size:13.5px;line-height:1.5;text-align:left;}
.pr-flag{flex:0 0 auto;width:20px !important;height:14px !important;margin:0 !important;border-radius:3px;
  object-fit:cover;box-shadow:0 1px 4px rgba(0,0,0,.25);}

/* Tombol Scopus */
.pr-links{display:flex;flex:0 0 auto;gap:8px;}
.pr-btn{display:inline-block;padding:7px 18px;border-radius:999px;background:#eef5fc;border:1px solid #cfe0f1;
  color:#095490 !important;font-size:12.5px;font-weight:700;text-decoration:none !important;
  transition:background .25s ease,color .25s ease,transform .25s ease,box-shadow .25s ease;}
.pr-btn:hover,.pr-btn:focus{background:linear-gradient(135deg,#095490 0%,#1a8fe3 100%);border-color:transparent;
  color:#fff !important;transform:translateY(-2px);box-shadow:0 8px 16px rgba(9,84,144,.35);}

@keyframes prUp{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:translateY(0);}}

/* 3. HP */
@media (max-width:600px){
  .pr-wrap{padding:22px 14px 16px;}
  .pr-item{flex-wrap:wrap;gap:12px;padding:12px 14px;}
  .pr-info{flex:1 1 calc(100% - 64px);}
  .pr-links{margin-left:64px;}
}

/* 4. AKSESIBILITAS */
@media (prefers-reduced-motion:reduce){
  .pr-wrap,.pr-wrap *{transition:none !important;animation:none !important;}
}




/* =================================================================================================================================================== */
/* =================================================================================================================================================== */


/* ==========================================================
   PLAGIARISM & RETRACTION POLICY MODERN - JURNAL
   Warna utama: #095490 | Biru terang: #1a8fe3 | Aksen: #ffc233
   Dipakai bersama HTML class pl-wrap
   Ikon memakai <em class="fa ..">&nbsp;</em> agar tidak dihapus editor OJS
   ========================================================== */

.pl-wrap{margin:0;padding:0;text-align:left;}
.pl-wrap p{text-align:justify;}

/* 1. HERO */
.pl-hero{position:relative;overflow:hidden;margin:0 0 22px;padding:30px 30px 28px;border-radius:24px;
  border-left:8px solid #ffc233;color:#fff;
  background:
    radial-gradient(circle at 100% 0%,rgba(56,189,248,.55) 0%,rgba(56,189,248,0) 50%),
    linear-gradient(115deg,#073b6e 0%,#095490 45%,#1a8fe3 100%);
  box-shadow:0 16px 36px rgba(9,84,144,.35);animation:plUp .55s ease both;}
.pl-hero::before,.pl-hero::after{content:"";position:absolute;border-radius:50%;background:rgba(255,255,255,.08);pointer-events:none;}
.pl-hero::before{width:220px;height:220px;right:-60px;bottom:-90px;}
.pl-hero::after{width:110px;height:110px;right:130px;top:-45px;}
.pl-kicker{display:inline-block;margin:0 0 12px;padding:4px 14px;border-radius:999px;background:#ffc233;
  color:#073b6e;font-size:12px;font-weight:800;letter-spacing:1px;text-transform:uppercase;}
.pl-wrap .pl-title{position:relative;margin:0 0 6px !important;padding:0 !important;border:0 !important;
  color:#fff !important;font-size:26px;font-weight:800;line-height:1.3;}
.pl-wrap .pl-sub{position:relative;margin:0 0 18px !important;color:rgba(255,255,255,.9) !important;font-size:16px;}
.pl-badges{position:relative;display:flex;flex-wrap:wrap;gap:8px;}
.pl-badges span{padding:5px 14px;border-radius:999px;background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.35);color:#fff !important;font-size:13px;font-weight:600;
  transition:background .3s ease,color .3s ease,transform .3s ease;}
.pl-badges span:hover{background:#ffc233;color:#073b6e !important;transform:translateY(-2px);}

/* 2. KARTU PERINGATAN TURNITIN (angka 20%) */
.pl-alert{display:flex;align-items:center;gap:22px;margin:0 0 22px;padding:22px 24px;border-radius:20px;
  background:linear-gradient(135deg,#fff9e8 0%,#fff 100%);border:1px solid #f6dc8c;border-left:6px solid #ffc233;
  box-shadow:0 8px 22px rgba(255,194,51,.22);animation:plUp .55s ease .1s both;
  transition:transform .3s ease,box-shadow .3s ease;}
.pl-alert:hover{transform:translateY(-3px);box-shadow:0 16px 30px rgba(255,194,51,.35);}

/* Kotak angka 20% (isi di tengah, ukuran lega) */
.pl-alert .pl-big{display:flex;flex-direction:column;align-items:center;justify-content:center;
  flex:0 0 120px;width:120px;height:120px;padding:10px;box-sizing:border-box;border-radius:26px;
  text-align:center;color:#fff;
  background:
    radial-gradient(circle at 100% 0%,rgba(56,189,248,.5) 0%,rgba(56,189,248,0) 55%),
    linear-gradient(135deg,#073b6e 0%,#095490 50%,#1a8fe3 100%);
  box-shadow:0 10px 22px rgba(9,84,144,.35);
  transition:transform .3s ease;}
.pl-alert:hover .pl-big{transform:rotate(-4deg) scale(1.05);}
.pl-big b{display:block;margin:0;padding:0;font-size:38px;font-weight:800;line-height:1;letter-spacing:-1px;}
.pl-big small{display:block;margin:8px 0 0;padding:4px 10px;border-radius:999px;
  background:#ffc233;color:#073b6e;font-size:10px;font-weight:800;line-height:1.2;
  letter-spacing:.6px;text-transform:uppercase;white-space:nowrap;}

.pl-alert p{margin:0 !important;color:#3d4f63;font-size:15px;line-height:1.85;}
.pl-alert a{color:#095490 !important;font-weight:700;text-decoration:none !important;
  background:linear-gradient(rgba(255,194,51,.55),rgba(255,194,51,.55)) no-repeat 0 100%/100% 2px;}
.pl-alert a:hover{background-size:100% 100%;}

/* 3. KARTU BAGIAN */
.pl-sec{position:relative;overflow:hidden;margin:0 0 22px;padding:26px 26px 22px;border-radius:22px;
  background:
    radial-gradient(circle at 100% 0%,rgba(26,143,227,.12) 0%,rgba(26,143,227,0) 45%),
    linear-gradient(180deg,#fff 0%,#f5faff 100%);
  border:1px solid rgba(9,84,144,.18);box-shadow:0 10px 30px rgba(9,84,144,.12);
  animation:plUp .55s ease both;transition:box-shadow .35s ease,border-color .35s ease;}
.pl-sec::before{content:"";position:absolute;left:0;top:0;right:0;height:5px;
  background:linear-gradient(90deg,#095490 0%,#1a8fe3 65%,#ffc233 100%);}
.pl-sec:hover{border-color:rgba(26,143,227,.5);box-shadow:0 0 0 4px rgba(26,143,227,.1),0 20px 44px rgba(9,84,144,.2);}
.pl-sec p{margin:0 0 14px;color:#3d4f63;font-size:15px;line-height:1.85;}
.pl-sec p:last-child{margin-bottom:0;}
.pl-sec strong{color:#095490;font-weight:700;}

/* Judul bagian + ikon */
.pl-wrap .pl-h{display:flex;align-items:center;gap:14px;margin:4px 0 16px !important;padding:0 !important;
  border:0 !important;color:#0b2540 !important;font-size:19px;font-weight:800;line-height:1.3;text-transform:uppercase;letter-spacing:.4px;}
.pl-ico{position:relative;display:block;flex:0 0 46px;width:46px;height:46px;border-radius:14px;
  background:linear-gradient(135deg,#095490 0%,#1a8fe3 100%);color:#fff;box-shadow:0 8px 16px rgba(9,84,144,.3);
  transition:transform .3s ease;}
.pl-ico em.fa{position:absolute;left:0;top:0;right:0;bottom:0;font-style:normal;font-size:0;}
.pl-ico em.fa::before{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:19px;line-height:1;}
.pl-sec:hover .pl-ico{transform:rotate(-8deg) scale(1.08);}
.pl-ico.gold{background:linear-gradient(135deg,#f0a800 0%,#ffc233 100%);color:#073b6e;box-shadow:0 8px 16px rgba(255,194,51,.4);}
.pl-wrap .pl-h2{position:relative;margin:22px 0 14px !important;padding:2px 0 2px 16px !important;border:0 !important;
  color:#095490 !important;font-size:16px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;}
.pl-wrap .pl-h2::before{content:"";position:absolute;left:0;top:2px;bottom:2px;width:5px;border-radius:5px;
  background:linear-gradient(180deg,#1a8fe3 0%,#095490 60%,#ffc233 100%);}

/* 4. DAFTAR CENTANG */
.pl-check{list-style:none !important;margin:6px 0 0 !important;padding:0 !important;}
.pl-check > li{position:relative;list-style:none !important;margin:0 0 10px !important;padding:12px 16px 12px 52px !important;
  background:#fff;border:1px solid #e3ebf4;border-radius:14px;color:#3d4f63;font-size:14.5px;line-height:1.7;
  box-shadow:0 2px 8px rgba(9,84,144,.06);text-align:justify;
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease,background .25s ease;}
.pl-check > li::before{content:"\f00c";font-family:"Font Awesome 5 Free";font-weight:900;position:absolute;left:14px;top:12px;
  width:26px;height:26px;border-radius:50%;background:linear-gradient(135deg,#095490 0%,#1a8fe3 100%);color:#fff;
  font-size:12px;line-height:26px;text-align:center;box-shadow:0 4px 10px rgba(9,84,144,.3);}
.pl-check > li:hover{transform:translateX(5px);background:#f5faff;border-color:rgba(26,143,227,.45);box-shadow:0 8px 18px rgba(9,84,144,.15);}
.pl-check strong{color:#095490;}

/* 5. KARTU TINGKAT PLAGIARISME */
.pl-levels{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:6px 0 18px;}
.pl-level{position:relative;overflow:hidden;padding:22px 22px 18px;background:#fff;border:1px solid #e3ebf4;
  border-top:6px solid var(--ac);border-radius:18px;box-shadow:0 4px 14px rgba(9,84,144,.08);
  transition:transform .3s ease,box-shadow .3s ease,background .3s ease;}
.pl-level:hover{transform:translateY(-5px);background:linear-gradient(180deg,#fff 0%,var(--abg) 100%);
  box-shadow:0 16px 30px rgba(var(--rgb),.25);}
.pl-level.minor{--ac:#f0a800;--abg:#fff9e8;--rgb:240,168,0;}
.pl-level.major{--ac:#d6334f;--abg:#fff0f3;--rgb:214,51,79;}
.pl-wrap .pl-level h4{margin:0 0 10px !important;padding:0 !important;border:0 !important;color:var(--ac) !important;
  font-size:17px;font-weight:800;}
.pl-level .pl-tag{display:inline-block;margin:0 0 12px;padding:3px 12px;border-radius:999px;background:var(--ac);color:#fff;
  font-size:11px;font-weight:800;letter-spacing:.8px;text-transform:uppercase;}
.pl-level.minor .pl-tag{color:#4a3300;}
.pl-level p{margin:0 0 10px !important;color:#3d4f63;font-size:14.5px;line-height:1.75;}
.pl-level p strong{color:#0b2540;}

/* 6. KARTU PELANGGARAN (grid) */
.pl-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:6px 0 0;list-style:none !important;padding:0 !important;}
.pl-grid > li{position:relative;list-style:none !important;margin:0 !important;padding:16px 18px 16px 62px !important;
  background:#fff;border:1px solid #e3ebf4;border-left:5px solid var(--ac,#095490);border-radius:16px;
  box-shadow:0 3px 10px rgba(9,84,144,.08);color:#3d4f63;font-size:14.5px;line-height:1.7;text-align:justify;
  transition:transform .3s ease,box-shadow .3s ease,background .3s ease,border-color .3s ease;}
.pl-grid > li::before{content:"\f071";font-family:"Font Awesome 5 Free";font-weight:900;position:absolute;left:14px;top:14px;
  width:36px;height:36px;border-radius:12px;background:var(--abg,#e3effa);color:var(--ac,#095490);
  font-size:15px;line-height:36px;text-align:center;transition:transform .3s ease,background .3s ease,color .3s ease;}
.pl-grid > li:hover{transform:translateY(-4px);background:linear-gradient(135deg,#fff 0%,var(--abg,#eef5fc) 100%);
  border-left-color:#ffc233;box-shadow:0 14px 28px rgba(var(--rgb,9,84,144),.2);}
.pl-grid > li:hover::before{background:var(--ac,#095490);color:#fff;transform:rotate(-8deg) scale(1.1);}
.pl-grid.warn > li{--ac:#d6334f;--abg:#fff0f3;--rgb:214,51,79;}
.pl-grid.info > li{--ac:#095490;--abg:#e3effa;--rgb:9,84,144;}
.pl-grid.info > li::before{content:"\f05a";}

/* 7. CHIP RETRACTION NOTICE */
.pl-chips{list-style:none !important;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:6px 0 0 !important;padding:0 !important;}
.pl-chips > li{position:relative;list-style:none !important;margin:0 !important;padding:11px 16px 11px 46px !important;
  background:#eef5fc;border:1px solid #dbe8f5;border-radius:999px;color:#095490;font-size:14px;font-weight:600;line-height:1.5;
  transition:background .25s ease,color .25s ease,transform .25s ease,box-shadow .25s ease;}
.pl-chips > li::before{content:"\f00c";font-family:"Font Awesome 5 Free";font-weight:900;position:absolute;left:14px;top:50%;
  transform:translateY(-50%);width:22px;height:22px;border-radius:50%;background:#095490;color:#fff;font-size:10px;line-height:22px;text-align:center;}
.pl-chips > li:hover{background:linear-gradient(135deg,#095490 0%,#1a8fe3 100%);color:#fff;transform:translateY(-2px);
  box-shadow:0 8px 16px rgba(9,84,144,.3);}
.pl-chips > li:hover::before{background:#ffc233;color:#073b6e;}

/* 8. CATATAN & PENUTUP */
.pl-note{margin:16px 0 0;padding:14px 18px;border-radius:14px;background:#fff9e8;border:1px solid #f6dc8c;
  border-left:5px solid #ffc233;color:#5c4300 !important;font-size:14.5px;line-height:1.75;}
.pl-note strong{color:#5c4300;}
.pl-foot{position:relative;overflow:hidden;margin:0;padding:22px 26px;border-radius:20px;border-left:8px solid #ffc233;color:#fff;
  background:linear-gradient(115deg,#073b6e 0%,#095490 45%,#1a8fe3 100%);box-shadow:0 14px 30px rgba(9,84,144,.3);}
.pl-foot p{position:relative;margin:0 !important;color:#fff !important;font-size:15px;line-height:1.8;}
.pl-foot strong{color:#ffc233;}

@keyframes plUp{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:translateY(0);}}

/* 9. TABLET & HP */
@media (max-width:700px){
  .pl-levels,.pl-grid,.pl-chips{grid-template-columns:minmax(0,1fr);}
  .pl-hero{padding:22px 20px;}
  .pl-wrap .pl-title{font-size:21px;}
  .pl-sec{padding:22px 16px 18px;}
  .pl-alert{flex-direction:column;align-items:flex-start;gap:14px;}
  .pl-alert .pl-big{flex:0 0 auto;width:110px;height:110px;}
  .pl-wrap p,.pl-check > li,.pl-grid > li{text-align:left;}
}

/* 10. AKSESIBILITAS */
@media (prefers-reduced-motion:reduce){
  .pl-wrap *{transition:none !important;animation:none !important;}
}





/* =================================================================================================================================================== */
/* =================================================================================================================================================== */




/* ==========================================================
   AUTHOR FEES MODERN - JURNAL
   Warna utama: #095490 | Biru terang: #1a8fe3 | Aksen: #ffc233
   Dipakai bersama HTML class af-wrap
   Ikon memakai <em class="fa ..">&nbsp;</em> agar tidak dihapus editor OJS
   ========================================================== */

.af-wrap{margin:0;padding:0;text-align:left;}
.af-wrap p{text-align:justify;}

/* 1. BANNER */
.af-hero{position:relative;overflow:hidden;margin:0 0 22px;padding:26px 28px;border-radius:24px;
  border-left:8px solid #ffc233;color:#fff;
  background:
    radial-gradient(circle at 100% 0%,rgba(56,189,248,.55) 0%,rgba(56,189,248,0) 50%),
    linear-gradient(115deg,#073b6e 0%,#095490 45%,#1a8fe3 100%);
  box-shadow:0 16px 36px rgba(9,84,144,.35);animation:afUp .55s ease both;}
.af-hero::before,.af-hero::after{content:"";position:absolute;border-radius:50%;background:rgba(255,255,255,.08);pointer-events:none;}
.af-hero::before{width:200px;height:200px;right:-50px;bottom:-80px;}
.af-hero::after{width:100px;height:100px;right:120px;top:-40px;}
.af-kicker{display:inline-block;margin:0 0 12px;padding:4px 14px;border-radius:999px;background:#ffc233;
  color:#073b6e;font-size:12px;font-weight:800;letter-spacing:1px;text-transform:uppercase;}
.af-wrap .af-title{position:relative;margin:0 0 6px !important;padding:0 !important;border:0 !important;
  color:#fff !important;font-size:26px;font-weight:800;line-height:1.3;}
.af-wrap .af-sub{position:relative;margin:0 !important;color:rgba(255,255,255,.92) !important;font-size:16px;}

/* 2. KARTU BIAYA */
.af-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin:0 0 22px;}
.af-card{position:relative;overflow:hidden;display:flex;flex-direction:column;padding:28px 26px 24px;border-radius:24px;
  background:
    radial-gradient(circle at 100% 0%,rgba(26,143,227,.12) 0%,rgba(26,143,227,0) 45%),
    linear-gradient(180deg,#fff 0%,#f5faff 100%);
  border:1px solid rgba(9,84,144,.18);box-shadow:0 10px 30px rgba(9,84,144,.12);
  animation:afUp .55s ease .1s both;
  transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease;}
.af-card + .af-card{animation-delay:.22s;}
.af-card::before{content:"";position:absolute;left:0;top:0;right:0;height:6px;
  background:linear-gradient(90deg,#095490 0%,#1a8fe3 65%,#ffc233 100%);}
.af-card:hover{transform:translateY(-6px);border-color:rgba(26,143,227,.5);
  box-shadow:0 0 0 4px rgba(26,143,227,.1),0 22px 44px rgba(9,84,144,.22);}

/* Ikon */
.af-ico{position:relative;display:block;flex:0 0 54px;width:54px;height:54px;margin:0 0 16px;border-radius:16px;
  background:#e3effa;color:#095490;transition:transform .3s ease,background .3s ease,color .3s ease;}
.af-ico em.fa{position:absolute;left:0;top:0;right:0;bottom:0;font-style:normal;font-size:0;}
.af-ico em.fa::before{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:22px;line-height:1;}
.af-card:hover .af-ico{background:linear-gradient(135deg,#095490 0%,#1a8fe3 100%);color:#fff;transform:rotate(-8deg) scale(1.1);}

/* Label & harga */
.af-label{display:block;margin:0 0 8px;color:#5b6b7c;font-size:12px;font-weight:800;letter-spacing:1px;text-transform:uppercase;}
.af-price{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px;margin:0 0 6px;}
.af-num{font-size:44px;font-weight:800;line-height:1;color:#095490;}
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  .af-num{background:linear-gradient(135deg,#073b6e 0%,#1a8fe3 100%);
    -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;}
}
.af-cur{padding:3px 12px;border-radius:999px;background:#fff3cf;color:#7a5200;font-size:13px;font-weight:800;letter-spacing:.5px;}
.af-tag{display:inline-block;align-self:flex-start;margin:0 0 14px;padding:4px 14px;border-radius:999px;
  background:#e3f8ea;border:1px solid #bfe9cd;color:#157a3b;font-size:12px;font-weight:800;letter-spacing:.5px;text-transform:uppercase;}
.af-tag.paid{background:#eef5fc;border-color:#cfe0f1;color:#095490;}

.af-wrap .af-card h3{margin:0 0 10px !important;padding:0 !important;border:0 !important;
  color:#0b2540 !important;font-size:19px;font-weight:800;line-height:1.3;}
.af-card p{margin:0 !important;color:#3d4f63;font-size:14.5px;line-height:1.8;}

/* Kartu biaya publikasi disorot */
.af-card.hl{border-color:transparent;border-left:6px solid #ffc233;
  background:
    radial-gradient(circle at 100% 0%,rgba(56,189,248,.5) 0%,rgba(56,189,248,0) 50%),
    linear-gradient(135deg,#073b6e 0%,#095490 50%,#1a8fe3 100%);
  box-shadow:0 14px 32px rgba(9,84,144,.35);}
.af-card.hl::before{background:#ffc233;}
.af-card.hl .af-ico{background:rgba(255,255,255,.2);color:#fff;}
.af-card.hl:hover .af-ico{background:#ffc233;color:#073b6e;}
.af-card.hl .af-label{color:#ffd66b;}
.af-card.hl .af-num{background:none;-webkit-text-fill-color:#fff;color:#fff;}
.af-card.hl .af-cur{background:#ffc233;color:#073b6e;}
.af-card.hl .af-tag.paid{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.35);color:#fff;}
.af-wrap .af-card.hl h3{color:#fff !important;}
.af-card.hl p{color:rgba(255,255,255,.92);}
.af-card.hl:hover{box-shadow:0 22px 44px rgba(9,84,144,.5);}

/* 3. DAFTAR YANG TERCAKUP */
.af-cover{position:relative;overflow:hidden;margin:0;padding:24px 26px 22px;border-radius:22px;
  background:linear-gradient(180deg,#fff 0%,#f5faff 100%);border:1px solid rgba(9,84,144,.18);
  box-shadow:0 10px 30px rgba(9,84,144,.12);animation:afUp .55s ease .35s both;}
.af-cover::before{content:"";position:absolute;left:0;top:0;right:0;height:5px;
  background:linear-gradient(90deg,#095490 0%,#1a8fe3 65%,#ffc233 100%);}
.af-wrap .af-h{position:relative;margin:4px 0 16px !important;padding:2px 0 2px 16px !important;border:0 !important;
  color:#0b2540 !important;font-size:17px;font-weight:800;line-height:1.3;}
.af-wrap .af-h::before{content:"";position:absolute;left:0;top:2px;bottom:2px;width:5px;border-radius:5px;
  background:linear-gradient(180deg,#1a8fe3 0%,#095490 60%,#ffc233 100%);}
.af-chips{display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0;list-style:none !important;}
.af-chips > li{list-style:none !important;margin:0 !important;padding:8px 16px !important;border-radius:999px;
  background:#eef5fc;border:1px solid #dbe8f5;color:#095490;font-size:13.5px;font-weight:600;line-height:1.5;
  transition:background .25s ease,color .25s ease,transform .25s ease,box-shadow .25s ease;}
.af-chips > li:hover{background:linear-gradient(135deg,#095490 0%,#1a8fe3 100%);border-color:transparent;color:#fff;
  transform:translateY(-2px);box-shadow:0 8px 16px rgba(9,84,144,.3);}

@keyframes afUp{from{opacity:0;transform:translateY(16px);}to{opacity:1;transform:translateY(0);}}

/* 4. TABLET & HP */
@media (max-width:700px){
  .af-grid{grid-template-columns:minmax(0,1fr);}
  .af-hero{padding:22px 20px;}
  .af-wrap .af-title{font-size:21px;}
  .af-card{padding:24px 20px 20px;}
  .af-num{font-size:38px;}
  .af-wrap p{text-align:left;}
}

/* 5. AKSESIBILITAS */
@media (prefers-reduced-motion:reduce){
  .af-wrap *{transition:none !important;animation:none !important;}
}






/* =================================================================================================================================================== */
/* =================================================================================================================================================== */









/* =================================================================================================================================================== */
/* =================================================================================================================================================== */
















/* =================================================================================================================================================== */
/* =================================================================================================================================================== */



















/* =================================================================================================================================================== */
/* =================================================================================================================================================== */
